/* /Layout/MainLayout.razor.rz.scp.css */
*[b-7wpq0kx59r], *[b-7wpq0kx59r]::before, *[b-7wpq0kx59r]::after { box-sizing: border-box; }

.page[b-7wpq0kx59r] {
    position: relative;
    display: flex;
    flex-direction: column;
    background: #f1f5f9;
    min-height: 100vh;
}

main[b-7wpq0kx59r] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

/* ── Top Bar ── */
.top-bar[b-7wpq0kx59r] {
    background: #ffffff;
    height: 62px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px;
    position: sticky;
    top: 0;
    z-index: 100;
    border-bottom: 1px solid #e2e8f0;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}

.top-bar-left[b-7wpq0kx59r] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.dashboard-label[b-7wpq0kx59r] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #0f172a;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.7px;
    text-transform: uppercase;
    padding: 6px 14px;
    background: linear-gradient(135deg, rgba(1, 89, 116, 0.08), rgba(157, 96, 35, 0.08));
    border-radius: 999px;
    border: 1px solid rgba(1, 89, 116, 0.15);
}

.dashboard-label[b-7wpq0kx59r]::before {
    content: '';
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #16a34a;
    box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.2);
}

.top-bar-right[b-7wpq0kx59r] {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* ── Profile Badge ── */
.profile-wrapper[b-7wpq0kx59r] {
    position: relative;
    display: flex;
    align-items: center;
}

.profile-badge[b-7wpq0kx59r] {
    display: flex;
    align-items: center;
    gap: 10px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 999px;
    padding: 4px 14px 4px 4px;
    cursor: pointer;
    color: white;
    transition: all 0.2s cubic-bezier(0.2, 0.8, 0.3, 1);
    font-size: 0.875rem;
    font-family: inherit;
    outline: none;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.25);
}

.profile-badge:hover[b-7wpq0kx59r] {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(1, 89, 116, 0.35);
}

.profile-badge:focus-visible[b-7wpq0kx59r] {
    outline: 2px solid #015974;
    outline-offset: 2px;
}

.avatar[b-7wpq0kx59r] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.22);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.78rem;
    font-weight: 700;
    color: white;
    flex-shrink: 0;
    letter-spacing: 0.05em;
    border: 1px solid rgba(255, 255, 255, 0.35);
}

.display-name[b-7wpq0kx59r] {
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
    letter-spacing: 0.2px;
}

.chevron[b-7wpq0kx59r] {
    font-size: 0.75rem;
    line-height: 1;
    transition: transform 0.2s ease;
    display: flex;
    align-items: center;
    opacity: 0.9;
}

.chevron.open[b-7wpq0kx59r] { transform: rotate(180deg); }

/* ── Profile Dropdown ── */
.profile-dropdown[b-7wpq0kx59r] {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    background: #ffffff;
    border-radius: 14px;
    box-shadow: 0 20px 44px rgba(1, 89, 116, 0.18), 0 6px 14px rgba(15, 23, 42, 0.08);
    min-width: 240px;
    overflow: hidden;
    z-index: 200;
    border: 1px solid #e2e8f0;
    animation: dropdownIn-b-7wpq0kx59r 0.18s cubic-bezier(0.2, 0.9, 0.3, 1.1);
}

@keyframes dropdownIn-b-7wpq0kx59r {
    from { opacity: 0; transform: translateY(-8px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

.dropdown-header[b-7wpq0kx59r] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 18px;
    background: linear-gradient(135deg, rgba(1, 89, 116, 0.04), rgba(157, 96, 35, 0.04));
}

.dropdown-avatar[b-7wpq0kx59r] {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: linear-gradient(135deg, #015974, #9D6023);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem;
    font-weight: 700;
    color: white;
    flex-shrink: 0;
    box-shadow: 0 4px 10px rgba(1, 89, 116, 0.3);
}

.dropdown-user-info[b-7wpq0kx59r] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.dropdown-name[b-7wpq0kx59r] {
    font-size: 0.9rem;
    font-weight: 700;
    color: #0f172a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dropdown-role[b-7wpq0kx59r] {
    font-size: 0.72rem;
    color: #64748b;
    margin-top: 2px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.dropdown-divider[b-7wpq0kx59r] {
    height: 1px;
    background: #e2e8f0;
}

.dropdown-item[b-7wpq0kx59r] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 18px;
    color: #374151;
    text-decoration: none;
    font-size: 0.88rem;
    font-weight: 500;
    transition: background 0.15s ease, color 0.15s ease;
    cursor: pointer;
}

.dropdown-item:hover[b-7wpq0kx59r] {
    background: #f1f5f9;
    text-decoration: none;
    color: #015974;
}

.item-icon[b-7wpq0kx59r] {
    width: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #94a3b8;
}

.dropdown-item:hover .item-icon[b-7wpq0kx59r] { color: #015974; }

.dropdown-item.logout[b-7wpq0kx59r] { color: #dc2626; }
.dropdown-item.logout .item-icon[b-7wpq0kx59r] { color: #dc2626; }
.dropdown-item.logout:hover[b-7wpq0kx59r] { background: #fef2f2; color: #b91c1c; }
.dropdown-item.logout:hover .item-icon[b-7wpq0kx59r] { color: #b91c1c; }

.dropdown-backdrop[b-7wpq0kx59r] {
    position: fixed;
    inset: 0;
    z-index: 150;
}

/* ── Content ── */
[b-7wpq0kx59r] .content {
    padding: 24px;
    max-width: 100%;
}

/* ── Page Layout ── */
@media (min-width: 992px) {
    .page[b-7wpq0kx59r] {
        flex-direction: row;
    }

    .sidebar[b-7wpq0kx59r] {
        width: 280px;
        height: 100vh;
        position: sticky;
        top: 0;
        flex-shrink: 0;
        display: flex;
        flex-direction: column;
        background: #015974;
        box-shadow: 4px 0 20px rgba(1, 89, 116, 0.18);
        z-index: 50;
    }
}

/* Mobile + tablet: sidebar wraps in column, NavMenu handles its own collapse.
   No position/z-index here — would create stacking context and trap the
   fixed nav overlay below the top-bar. */
@media (max-width: 991.98px) {
    .sidebar[b-7wpq0kx59r] {
        width: 100%;
    }

    /* Top-bar must not stack above the open nav overlay */
    .top-bar[b-7wpq0kx59r] {
        z-index: 90;
    }
}

/* ── Tablet ── */
@media (max-width: 991.98px) {
    [b-7wpq0kx59r] .content { padding: 16px; }
}

/* ── Phone ── */
@media (max-width: 640px) {
    .display-name[b-7wpq0kx59r] { display: none; }
    .top-bar[b-7wpq0kx59r] { padding: 0 14px; height: 58px; }
    .dashboard-label[b-7wpq0kx59r] { font-size: 0.7rem; padding: 5px 10px; }
    .profile-badge[b-7wpq0kx59r] { padding: 3px 10px 3px 3px; }
    .avatar[b-7wpq0kx59r] { width: 28px; height: 28px; font-size: 0.7rem; }
    .profile-dropdown[b-7wpq0kx59r] { min-width: 220px; right: 0; }
    [b-7wpq0kx59r] .content { padding: 12px 10px; }
}

@media (max-width: 380px) {
    .dashboard-label[b-7wpq0kx59r] { display: none; }
    [b-7wpq0kx59r] .content { padding: 10px 8px; }
}
/* /Layout/NavMenu.razor.rz.scp.css */
/* =============================================================
   NavMenu — Premium sidebar shell
   Aligns with portal-theme design system.
   ============================================================= */

/* ── Top branded row (logo + mobile toggle) ── */
.navbar-glass[b-8e7xbbcp65] {
    background: #ffffff;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    padding: 0;
    flex-shrink: 0;
}

.logo-container[b-8e7xbbcp65] {
    padding: 0;
}

.navbar-content[b-8e7xbbcp65] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px;
    min-height: 72px;
}

.navbar-brand[b-8e7xbbcp65] {
    display: flex;
    align-items: center;
    text-decoration: none;
    padding: 0;
    margin: 0;
}

.navbar-logo[b-8e7xbbcp65] {
    height: 40px;
    width: auto;
    max-width: 180px;
    object-fit: contain;
}

.navbar-toggler[b-8e7xbbcp65] {
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border: 1px solid rgba(1, 89, 116, 0.3);
    border-radius: 8px;
    padding: 8px 12px;
    color: #fff;
    cursor: pointer;
    display: none;
    box-shadow: 0 2px 6px rgba(1, 89, 116, 0.25);
}

.navbar-toggler-icon[b-8e7xbbcp65] {
    display: inline-block;
    width: 24px;
    height: 18px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.5' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* ── Sidebar body ── */
.nav-scrollable[b-8e7xbbcp65] {
    background: linear-gradient(180deg, #015974 0%, #06445a 55%, #7d4c1c 100%);
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 18px 0 28px;
    position: relative;
}

.nav-scrollable[b-8e7xbbcp65]::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 1px;
    background: rgba(255, 255, 255, 0.08);
    pointer-events: none;
}

[b-8e7xbbcp65] nav.flex-column {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 0 12px;
}

/* ── Nav items ── */
[b-8e7xbbcp65] .nav-item {
    padding: 0 !important;
    margin: 0;
    font-size: 0.88rem;
}

[b-8e7xbbcp65] .nav-item a,
[b-8e7xbbcp65] .nav-item .nav-link,
[b-8e7xbbcp65] .nav-item button.nav-link {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 11px 14px;
    border-radius: 10px;
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.88rem;
    font-weight: 500;
    text-decoration: none;
    border: 1px solid transparent;
    background: transparent;
    cursor: pointer;
    transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease;
    letter-spacing: 0.2px;
    text-align: left;
    outline: none;
}

[b-8e7xbbcp65] .nav-item a:hover,
[b-8e7xbbcp65] .nav-item .nav-link:hover,
[b-8e7xbbcp65] .nav-item button.nav-link:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.12);
}

[b-8e7xbbcp65] .nav-item a.active,
[b-8e7xbbcp65] .nav-item .nav-link.active {
    background: rgba(255, 255, 255, 0.22) !important;
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.35);
    box-shadow: inset 3px 0 0 #fff, 0 4px 12px rgba(0, 0, 0, 0.18);
    font-weight: 600;
}

[b-8e7xbbcp65] .nav-icon {
    width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, 0.7);
    margin: 0;
    font-size: 0.95rem;
    flex-shrink: 0;
    transition: color 0.18s;
}

[b-8e7xbbcp65] .nav-item a:hover .nav-icon,
[b-8e7xbbcp65] .nav-item .nav-link:hover .nav-icon,
[b-8e7xbbcp65] .nav-item a.active .nav-icon,
[b-8e7xbbcp65] .nav-item .nav-link.active .nav-icon {
    color: #ffffff;
}

/* ── Dropdown toggle (parent) ── */
[b-8e7xbbcp65] .nav-item .dropdown-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

[b-8e7xbbcp65] .nav-item .dropdown-toggle::after {
    content: '';
    width: 8px;
    height: 8px;
    border-right: 1.5px solid rgba(255, 255, 255, 0.6);
    border-bottom: 1.5px solid rgba(255, 255, 255, 0.6);
    transform: rotate(-45deg);
    transition: transform 0.22s ease;
    margin-right: 4px;
    display: inline-block;
    border-top: 0;
    border-left: 0;
    vertical-align: initial;
}

[b-8e7xbbcp65] .nav-item .dropdown-toggle[aria-expanded="true"]::after,
[b-8e7xbbcp65] .nav-item .dropdown:has(.dropdown-menu.show) .dropdown-toggle::after {
    transform: rotate(45deg);
}

/* Dropdown submenu */
[b-8e7xbbcp65] .nav-item .dropdown-menu {
    display: none;
    position: static;
    margin: 4px 0 8px 8px;
    padding: 4px 0 4px 10px;
    background: transparent;
    border: none;
    border-left: 1px solid rgba(255, 255, 255, 0.18);
    box-shadow: none;
    min-width: 0;
    width: 100%;
    border-radius: 0;
}

[b-8e7xbbcp65] .nav-item .dropdown-menu.show {
    display: flex;
    flex-direction: column;
    gap: 2px;
    animation: navFade-b-8e7xbbcp65 0.18s ease;
}

@keyframes navFade-b-8e7xbbcp65 {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

[b-8e7xbbcp65] .dropdown-menu .dropdown-item,
[b-8e7xbbcp65] .dropdown-menu .nav-link.dropdown-item {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 12px;
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.84rem;
    font-weight: 500;
    text-decoration: none;
    border: 1px solid transparent;
    background: transparent;
    transition: background 0.15s ease, color 0.15s ease;
}

[b-8e7xbbcp65] .dropdown-menu .dropdown-item:hover,
[b-8e7xbbcp65] .dropdown-menu .nav-link.dropdown-item:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
}

[b-8e7xbbcp65] .dropdown-menu .dropdown-item.active,
[b-8e7xbbcp65] .dropdown-menu .nav-link.dropdown-item.active {
    background: rgba(255, 255, 255, 0.18) !important;
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.25);
    font-weight: 600;
}

[b-8e7xbbcp65] .dropdown-menu .nav-icon {
    width: 14px;
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.6);
}

[b-8e7xbbcp65] .dropdown-menu .dropdown-item:hover .nav-icon,
[b-8e7xbbcp65] .dropdown-menu .dropdown-item.active .nav-icon {
    color: #ffffff;
}

/* ── Mobile / collapse ── */
.nav-scrollable.collapse[b-8e7xbbcp65] {
    display: none;
}

@media (max-width: 991.98px) {
    .top-row.navbar-glass[b-8e7xbbcp65] {
        position: sticky;
        top: 0;
        z-index: 210;
    }

    .navbar-toggler[b-8e7xbbcp65] {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        position: relative;
        z-index: 220;
    }

    .nav-scrollable[b-8e7xbbcp65] {
        position: fixed;
        top: 64px;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 200;
        padding: 14px 0 22px;
    }

    .nav-scrollable.collapse[b-8e7xbbcp65] {
        display: none;
    }

    .navbar-logo[b-8e7xbbcp65] {
        height: 36px;
    }

    .navbar-content[b-8e7xbbcp65] {
        min-height: 64px;
        padding: 12px 16px;
    }
}

@media (max-width: 480px) {
    .navbar-logo[b-8e7xbbcp65] { height: 30px; }
    .navbar-content[b-8e7xbbcp65] { min-height: 58px; padding: 10px 12px; }
    .nav-scrollable[b-8e7xbbcp65] { top: 58px; }
}

@media (min-width: 992px) {
    .nav-scrollable[b-8e7xbbcp65],
    .nav-scrollable.collapse[b-8e7xbbcp65] {
        display: block;
    }
}
/* /Pages/AdminDashboard/AccessRequests.razor.rz.scp.css */
.container[b-4hffuy6g35] { max-width: 1200px; margin: auto; padding: 20px; }
    .header-section[b-4hffuy6g35] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; flex-wrap: wrap; gap: 10px; }
    .header-section h2[b-4hffuy6g35] { margin: 0; color: #fff; }
    .header-actions[b-4hffuy6g35] { display: flex; gap: 10px; align-items: center; }
    .search-input[b-4hffuy6g35] { padding: 8px 14px; border: 1px solid #ddd; border-radius: 6px; font-size: 14px; width: 250px; }

    .tabs-container[b-4hffuy6g35] { display: flex; gap: 5px; margin-bottom: 20px; flex-wrap: wrap; }
    .tab-btn[b-4hffuy6g35] { padding: 8px 20px; border: 1px solid #ddd; background: #f8f9fa; border-radius: 6px; cursor: pointer; font-size: 14px; transition: all 0.2s; }
    .tab-btn.active[b-4hffuy6g35] { background: linear-gradient(135deg, #015974, #9D6023); color: white; border-color: #015974; }
    .tab-btn:hover:not(.active)[b-4hffuy6g35] { background: #e9ecef; }

    .table-section[b-4hffuy6g35] { background: white; border-radius: 10px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.08); }
    table[b-4hffuy6g35] { width: 100%; border-collapse: collapse; }
    thead th[b-4hffuy6g35] { background: #f8f9fa; padding: 12px 15px; text-align: left; font-weight: 600; color: #555; border-bottom: 2px solid #dee2e6; font-size: 13px; }
    tbody td[b-4hffuy6g35] { padding: 12px 15px; border-bottom: 1px solid #f0f0f0; font-size: 14px; }
    tbody tr:hover[b-4hffuy6g35] { background: #f8f9fa; }
    .table-footer[b-4hffuy6g35] { padding: 10px 15px; color: #888; font-size: 13px; border-top: 1px solid #eee; }

    .message-cell[b-4hffuy6g35] { max-width: 200px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

    .status-badge[b-4hffuy6g35] { padding: 4px 12px; border-radius: 20px; font-size: 12px; font-weight: 600; }
    .status-pending[b-4hffuy6g35] { background: #fff3cd; color: #856404; }
    .status-approved[b-4hffuy6g35] { background: #d4edda; color: #155724; }
    .status-rejected[b-4hffuy6g35] { background: #f8d7da; color: #721c24; }

    .action-btn[b-4hffuy6g35] { padding: 5px 12px; border: none; border-radius: 5px; cursor: pointer; font-size: 13px; margin-right: 5px; transition: opacity 0.2s; }
    .action-btn:disabled[b-4hffuy6g35] { opacity: 0.6; cursor: not-allowed; }
    .approve-btn[b-4hffuy6g35] { background: #28a745; color: white; }
    .approve-btn:hover:not(:disabled)[b-4hffuy6g35] { background: #218838; }
    .reject-btn[b-4hffuy6g35] { background: #dc3545; color: white; }
    .reject-btn:hover:not(:disabled)[b-4hffuy6g35] { background: #c82333; }
    .view-btn[b-4hffuy6g35] { background: #17a2b8; color: white; }
    .view-btn:hover[b-4hffuy6g35] { background: #138496; }
    .cancel-btn[b-4hffuy6g35] { background: #6c757d; color: white; }
    .cancel-btn:hover[b-4hffuy6g35] { background: #5a6268; }

    .pagination-section[b-4hffuy6g35] { display: flex; justify-content: space-between; align-items: center; padding: 12px 15px; flex-wrap: wrap; gap: 10px; }
    .page-info[b-4hffuy6g35] { font-size: 13px; color: #888; }
    .pagination-buttons[b-4hffuy6g35] { display: flex; gap: 4px; }
    .page-btn[b-4hffuy6g35] { padding: 5px 10px; border: 1px solid #ddd; background: white; border-radius: 4px; cursor: pointer; font-size: 13px; }
    .page-btn.active[b-4hffuy6g35] { background: linear-gradient(135deg, #015974, #9D6023); border-color: transparent; color: white; border-color: #015974; }
    .page-btn:disabled[b-4hffuy6g35] { opacity: 0.5; cursor: not-allowed; }

    .modal-overlay[b-4hffuy6g35] { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); display: flex; justify-content: center; align-items: center; z-index: 1000; }
    .modal-content[b-4hffuy6g35] { background: white; border-radius: 12px; padding: 30px; max-width: 500px; width: 90%; max-height: 80vh; overflow-y: auto; }
    .modal-content h4[b-4hffuy6g35] { margin-top: 0; color: #2c3e50; }
    .modal-actions[b-4hffuy6g35] { display: flex; gap: 10px; margin-top: 20px; justify-content: flex-end; }

    .request-detail[b-4hffuy6g35] { background: #f8f9fa; padding: 15px; border-radius: 8px; margin: 15px 0; }
    .request-detail p[b-4hffuy6g35] { margin: 5px 0; font-size: 14px; }

    .form-group[b-4hffuy6g35] { margin: 15px 0; }
    .form-group label[b-4hffuy6g35] { display: block; margin-bottom: 5px; font-weight: 600; font-size: 14px; color: #555; }
    .form-control[b-4hffuy6g35] { width: 100%; padding: 8px 12px; border: 1px solid #ddd; border-radius: 6px; font-size: 14px; resize: vertical; }

    .info-text[b-4hffuy6g35] { color: #0c5460; background: #d1ecf1; padding: 10px 15px; border-radius: 6px; font-size: 13px; }

    .alert-popup[b-4hffuy6g35] { position: fixed; top: 20px; right: 20px; padding: 15px 25px; border-radius: 8px; color: white; font-weight: 500; z-index: 2000; animation: slideIn-b-4hffuy6g35 0.3s ease; }
    .alert-popup.success[b-4hffuy6g35] { background: #28a745; }
    .alert-popup.error[b-4hffuy6g35] { background: #dc3545; }

    .spinner-btn[b-4hffuy6g35] { display: inline-block; width: 14px; height: 14px; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; border-radius: 50%; animation: spin-b-4hffuy6g35 0.6s linear infinite; vertical-align: middle; margin-right: 6px; }

    @keyframes spin-b-4hffuy6g35 { to { transform: rotate(360deg); } }
    @keyframes slideIn-b-4hffuy6g35 { from { transform: translateX(100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
/* /Pages/AdminDashboard/Address.razor.rz.scp.css */
.container[b-knigi016l5] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1800px;
    width: 100%;
    box-sizing: border-box;
    margin: 0 auto;
    border-radius: 20px;
}

.header-section[b-knigi016l5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

.header-section h2[b-knigi016l5] {
    margin: 0;
    color: #fff;
    font-size: 1.8em;
    font-weight: 600;
}

.add-btn[b-knigi016l5] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.add-btn:hover[b-knigi016l5] {
    background: #f0f9fc;
}

.table-section[b-knigi016l5] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    overflow-x: auto;
    max-width: 100%;
}

table[b-knigi016l5] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

th[b-knigi016l5],
td[b-knigi016l5] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-knigi016l5] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-knigi016l5] {
    color: #34495e;
}

.action-btn[b-knigi016l5] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-knigi016l5] {
    background-color: #28a745;
    color: white;
}

.edit-btn:hover[b-knigi016l5] {
    background-color: #218838;
}

.delete-btn[b-knigi016l5] {
    background-color: #dc3545;
    color: white;
}

.delete-btn:hover[b-knigi016l5] {
    background-color: #c82333;
}

.table-footer[b-knigi016l5] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

.modal[b-knigi016l5] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-knigi016l5] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 800px;
    /* Increased width for horizontal layout */
    max-width: 90%;
    max-height: 80vh;
    /* Limit vertical height */
    overflow-y: auto;
    /* Scroll if content exceeds height */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

.modal-content h3[b-knigi016l5] {
    margin-top: 0;
    color: #015974;
    border-bottom: 2px solid #e9ecef;
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-size: 1.6em;
    font-weight: 600;
}

.form-grid[b-knigi016l5] {
    display: grid;
    grid-template-columns: 1fr;
    /* Single column by default, adjust as needed */
    gap: 20px;
}

.form-module[b-knigi016l5] {
    margin-bottom: 20px;
}

.form-row[b-knigi016l5] {
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
}

.form-group[b-knigi016l5] {
    flex: 1;
    margin-bottom: 0;
}

.form-group label[b-knigi016l5] {
    display: block;
    margin-bottom: 8px;
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.form-group input[b-knigi016l5],
.form-group select[b-knigi016l5] {
    width: 100%;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    box-sizing: border-box;
    font-size: 1em;
    transition: border-color 0.3s ease;
}

.form-group input:focus[b-knigi016l5],
.form-group select:focus[b-knigi016l5] {
    border-color: #015974;
    outline: none;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.checkbox-group[b-knigi016l5] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-knigi016l5] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

.checkbox-label input[type="checkbox"][b-knigi016l5] {
    margin-right: 12px;
    margin-bottom: 0;
    vertical-align: middle;
    height: 20px;
    width: 20px;
}

.checkbox-label span[b-knigi016l5] {
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.button-group[b-knigi016l5] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-knigi016l5] {
    padding: 12px 12px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.save-btn.primary[b-knigi016l5] {
    background-color: #015974;
    color: white;
}

.save-btn:hover[b-knigi016l5] {
    background-color: #dfe3e8;
}

.save-btn.primary:hover[b-knigi016l5] {
    background-color: #024d62;
}

.close-btn[b-knigi016l5] {
    padding: 12px 25px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.close-btn:hover[b-knigi016l5] {
    background-color: #dfe3e8;
}
/* /Pages/AdminDashboard/AdminInvoiceDetail.razor.rz.scp.css */
/* Admin-specific invoice overrides on top of shared inv-* classes */

.inv-status-chip[b-xnr2pa7w5e] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 0.72rem;
    font-weight: 600;
}

.chip-success[b-xnr2pa7w5e] { background: #d1fae5; color: #065f46; }
.chip-muted[b-xnr2pa7w5e]   { background: #f3f4f6; color: #6b7280; }

.inv-open-btn[b-xnr2pa7w5e] {
    padding: 3px 10px;
    border: 1px solid #015974;
    background: transparent;
    color: #015974;
    border-radius: 4px;
    font-size: 0.78rem;
    cursor: pointer;
    white-space: nowrap;
}

.inv-open-btn:hover[b-xnr2pa7w5e] { background: #015974; color: #fff; }

.inv-btn-danger[b-xnr2pa7w5e] {
    padding: 9px 18px;
    border: none;
    background: #dc2626;
    color: #fff;
    border-radius: 8px;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 600;
    transition: opacity 0.15s;
}

.inv-btn-danger:hover:not(:disabled)[b-xnr2pa7w5e] { opacity: 0.88; }
.inv-btn-danger:disabled[b-xnr2pa7w5e] { opacity: 0.55; cursor: not-allowed; }

.inv-alert-success[b-xnr2pa7w5e] { background: #f0fdf4; border: 1px solid #bbf7d0; color: #166534; }
.inv-alert-info[b-xnr2pa7w5e]    { background: #eff6ff; border: 1px solid #bfdbfe; color: #1e40af; }

.inv-modal-backdrop[b-xnr2pa7w5e] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
}

.inv-modal-card[b-xnr2pa7w5e] {
    background: #fff;
    padding: 28px;
    border-radius: 10px;
    max-width: 480px;
    width: 90%;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
}

.inv-modal-card h4[b-xnr2pa7w5e] { margin: 0 0 8px; font-size: 1.1rem; }
.inv-modal-card p[b-xnr2pa7w5e]  { color: #6b7280; margin: 0 0 14px; font-size: 0.875rem; }

.inv-textarea[b-xnr2pa7w5e] {
    width: 100%;
    padding: 10px 12px;
    border: 1.5px solid #d1d5db;
    border-radius: 6px;
    font-size: 0.875rem;
    font-family: inherit;
    resize: vertical;
    box-sizing: border-box;
}

.inv-textarea:focus[b-xnr2pa7w5e] { outline: none; border-color: #015974; box-shadow: 0 0 0 3px rgba(1,89,116,0.1); }

.inv-modal-actions[b-xnr2pa7w5e] {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 16px;
}
/* /Pages/AdminDashboard/AdminProfile.razor.rz.scp.css */
.profile-container[b-4paa3647g1] {
    max-width: 1400px;
    margin: 0 auto;
    background-color: #f8f9fa;
    padding: 20px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.page-title[b-4paa3647g1] {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 20px;
    color: #fff;
}

.section[b-4paa3647g1] {
    background: white;
    border: 1px solid #e0e0e0;
    margin-bottom: 20px;
    border-radius: 2px;
}

.section-header[b-4paa3647g1] {
    padding: 14px 20px;
    border-bottom: 1px solid #e2e8f0;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
}

.section-header h3[b-4paa3647g1] {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    border-left: 3px solid rgba(255,255,255,0.4);
    padding-left: 10px;
    line-height: 1;
}

.section-body[b-4paa3647g1] { padding: 20px; }

.form-row[b-4paa3647g1] { display: flex; margin-bottom: 15px; align-items: center; }

.form-label[b-4paa3647g1] {
    width: 200px;
    min-width: 200px;
    font-size: 13px;
    color: #666;
    margin-right: 20px;
    text-align: left;
}

.form-label.required[b-4paa3647g1]::after { content: " *"; color: red; }

.form-input-container[b-4paa3647g1] { flex-grow: 1; display: flex; gap: 10px; }

.form-control[b-4paa3647g1] {
    width: 100%;
    padding: 8px 12px;
    font-size: 13px;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.form-control:focus[b-4paa3647g1] {
    border-color: #80bdff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, .25);
}

.form-select[b-4paa3647g1] {
    width: 100%;
    padding: 8px 12px;
    font-size: 13px;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
}

.phone-select-container[b-4paa3647g1] { display: flex; width: 100%; gap: 10px; }
.phone-select[b-4paa3647g1] { width: 120px; }

.btn-primary[b-4paa3647g1] {
    color: #fff;
    background-color: #5bc0de;
    border-color: #46b8da;
    padding: 8px 16px;
    font-size: 13px;
    border-radius: 3px;
    cursor: pointer;
    border: none;
}

.btn-primary:hover[b-4paa3647g1] { background-color: #31b0d5; border-color: #269abc; }

.btn-submit[b-4paa3647g1] { margin-top: 10px; }

.alert[b-4paa3647g1] {
    padding: 10px 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
    font-size: 13px;
}

.alert-danger[b-4paa3647g1] { color: #721c24; background-color: #f8d7da; border-color: #f5c6cb; }
.alert-success[b-4paa3647g1] { color: #155724; background-color: #d4edda; border-color: #c3e6cb; }
/* /Pages/AdminDashboard/ApiKey.razor.rz.scp.css */
.container[b-m61ggash8x] {
    padding: 20px;
    background-color: #f9f9f9;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.header-section[b-m61ggash8x] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    padding: 15px;
    border-radius: 5px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.select-api[b-m61ggash8x] {
    display: flex;
    align-items: center;
}

    .select-api label[b-m61ggash8x] {
        margin-right: 10px;
        color: #333;
        font-weight: 500;
    }

    .select-api input[b-m61ggash8x] {
        padding: 8px;
        width: 250px;
        border: 1px solid #ccc;
        border-radius: 4px 0 0 4px;
        outline: none;
    }

.search-btn[b-m61ggash8x] {
    padding: 8px 15px;
    background-color: #e0e0e0;
    border: 1px solid #ccc;
    border-left: none;
    border-radius: 0 4px 4px 0;
    cursor: pointer;
    transition: background-color 0.3s;
}

    .search-btn:hover[b-m61ggash8x] {
        background-color: #d0d0d0;
    }

.add-btn[b-m61ggash8x] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s;
}

    .add-btn:hover[b-m61ggash8x] {
        background: #f0f9fc;
    }

.filter-section[b-m61ggash8x] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #f1f1f1;
    padding: 10px 15px;
    border-radius: 5px;
    margin-bottom: 20px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.api-count[b-m61ggash8x] {
    color: #333;
    font-weight: 500;
}

.filter[b-m61ggash8x] {
    display: flex;
    align-items: center;
}

    .filter label[b-m61ggash8x] {
        margin-right: 10px;
        color: #555;
        font-weight: 500;
    }

    .filter select[b-m61ggash8x] {
        padding: 6px;
        border: 1px solid #ccc;
        border-radius: 4px;
        background-color: #fff;
        outline: none;
        transition: border-color 0.3s;
    }

        .filter select:focus[b-m61ggash8x] {
            border-color: #015974;
        }

.current-time[b-m61ggash8x] {
    color: #555;
    font-size: 0.9em;
}

.modal[b-m61ggash8x] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-m61ggash8x] {
    background-color: #fff;
    padding: 20px;
    border-radius: 8px;
    width: 450px;
    max-width: 90%;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    border: 1px solid #ddd;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

    .modal-content h3[b-m61ggash8x] {
        margin-top: 0;
        color: #015974;
        border-bottom: 1px solid #eee;
        padding-bottom: 10px;
        margin-bottom: 20px;
        font-size: 1.5em;
    }

.form-group[b-m61ggash8x] {
    margin-bottom: 20px;
}

    .form-group label[b-m61ggash8x] {
        display: block;
        margin-bottom: 5px;
        color: #333;
        font-weight: 500;
    }

    .form-group input[b-m61ggash8x],
    .form-group select[b-m61ggash8x] {
        width: 100%;
        padding: 10px;
        border: 1px solid #ccc;
        border-radius: 4px;
        box-sizing: border-box;
        font-size: 0.95em;
        transition: border-color 0.3s;
    }

        .form-group input:focus[b-m61ggash8x],
        .form-group select:focus[b-m61ggash8x] {
            border-color: #015974;
            outline: none;
        }

.date-time-group[b-m61ggash8x] {
    display: flex;
    align-items: center;
    gap: 15px;
}

.date-input[b-m61ggash8x],
.time-input[b-m61ggash8x] {
    width: 45%;
    padding: 10px;
}

.date-note[b-m61ggash8x] {
    margin-left: 15px;
    color: #666;
    font-size: 0.9em;
}

.note[b-m61ggash8x] {
    font-size: 0.85em;
    color: #666;
    margin-top: 5px;
    line-height: 1.5;
}

.button-group[b-m61ggash8x] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #eee;
}

.save-btn[b-m61ggash8x] {
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s;
}

    .save-btn.primary[b-m61ggash8x] {
        background-color: #015974;
        color: white;
    }

    .save-btn:hover[b-m61ggash8x] {
        background-color: #dfe3e8;
    }

    .save-btn.primary:hover[b-m61ggash8x] {
        background-color: #024d62;
    }

.close-btn[b-m61ggash8x] {
    display: block;
    margin-top: 20px;
    padding: 10px;
    background-color: #e9ecef;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    width: 100%;
    text-align: center;
    color: #333;
    font-weight: 500;
    transition: background-color 0.3s;
}

    .close-btn:hover[b-m61ggash8x] {
        background-color: #dfe3e8;
    }
/* /Pages/AdminDashboard/BussinessInformationModel.razor.rz.scp.css */
.container[b-8qrrm7tmkp] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1800px;
    margin: 0 auto;
    border-radius: 20px;
}

.header-section[b-8qrrm7tmkp] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

    .header-section h2[b-8qrrm7tmkp] {
        margin: 0;
        color: #fff;
        font-size: 1.8em;
        font-weight: 600;
    }

.add-btn[b-8qrrm7tmkp] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .add-btn:hover[b-8qrrm7tmkp] {
        background: #f0f9fc;
    }

.table-section[b-8qrrm7tmkp] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

table[b-8qrrm7tmkp] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

th[b-8qrrm7tmkp], td[b-8qrrm7tmkp] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-8qrrm7tmkp] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-8qrrm7tmkp] {
    color: #34495e;
}

.action-btn[b-8qrrm7tmkp] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-8qrrm7tmkp] {
    background-color: #28a745;
    color: white;
}

    .edit-btn:hover[b-8qrrm7tmkp] {
        background-color: #218838;
    }

.delete-btn[b-8qrrm7tmkp] {
    background-color: #dc3545;
    color: white;
}

    .delete-btn:hover[b-8qrrm7tmkp] {
        background-color: #c82333;
    }

.table-footer[b-8qrrm7tmkp] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

.modal[b-8qrrm7tmkp] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-8qrrm7tmkp] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 800px; /* Increased width for horizontal layout */
    max-width: 90%;
    max-height: 80vh; /* Limit vertical height */
    overflow-y: auto; /* Scroll if content exceeds height */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

    .modal-content h3[b-8qrrm7tmkp] {
        margin-top: 0;
        color: #015974;
        border-bottom: 2px solid #e9ecef;
        padding-bottom: 10px;
        margin-bottom: 20px;
        font-size: 1.6em;
        font-weight: 600;
    }

.form-grid[b-8qrrm7tmkp] {
    display: grid;
    grid-template-columns: 1fr; /* Single column by default, adjust as needed */
    gap: 20px;
}

.form-module[b-8qrrm7tmkp] {
    margin-bottom: 20px;
}

.form-row[b-8qrrm7tmkp] {
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
}

.form-group[b-8qrrm7tmkp] {
    flex: 1;
    margin-bottom: 0;
}

    .form-group label[b-8qrrm7tmkp] {
        display: block;
        margin-bottom: 8px;
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

    .form-group input[b-8qrrm7tmkp],
    .form-group select[b-8qrrm7tmkp] {
        width: 100%;
        padding: 12px;
        border: 1px solid #ced4da;
        border-radius: 6px;
        box-sizing: border-box;
        font-size: 1em;
        transition: border-color 0.3s ease;
    }

        .form-group input:focus[b-8qrrm7tmkp],
        .form-group select:focus[b-8qrrm7tmkp] {
            border-color: #015974;
            outline: none;
            box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
        }

.checkbox-group[b-8qrrm7tmkp] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-8qrrm7tmkp] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

    .checkbox-label input[type="checkbox"][b-8qrrm7tmkp] {
        margin-right: 12px;
        margin-bottom: 0;
        vertical-align: middle;
        height: 20px;
        width: 20px;
    }

    .checkbox-label span[b-8qrrm7tmkp] {
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

.button-group[b-8qrrm7tmkp] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-8qrrm7tmkp] {
    padding: 12px 12px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .save-btn.primary[b-8qrrm7tmkp] {
        background-color: #015974;
        color: white;
    }

    .save-btn:hover[b-8qrrm7tmkp] {
        background-color: #dfe3e8;
    }

    .save-btn.primary:hover[b-8qrrm7tmkp] {
        background-color: #024d62;
    }

.close-btn[b-8qrrm7tmkp] {
    padding: 12px 25px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .close-btn:hover[b-8qrrm7tmkp] {
        background-color: #dfe3e8;
    }
/* /Pages/AdminDashboard/BussinessType.razor.rz.scp.css */
.container[b-tnwrdv56h1] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1200px;
    margin: 0 auto;
    border-radius: 20px;
}

.header-section[b-tnwrdv56h1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

    .header-section h2[b-tnwrdv56h1] {
        margin: 0;
        color: #fff;
        font-size: 1.8em;
        font-weight: 600;
    }

.add-btn[b-tnwrdv56h1] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .add-btn:hover[b-tnwrdv56h1] {
        background: #f0f9fc;
    }

.table-section[b-tnwrdv56h1] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

table[b-tnwrdv56h1] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

th[b-tnwrdv56h1], td[b-tnwrdv56h1] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-tnwrdv56h1] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-tnwrdv56h1] {
    color: #34495e;
}

.action-btn[b-tnwrdv56h1] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-tnwrdv56h1] {
    background-color: #28a745;
    color: white;
}

    .edit-btn:hover[b-tnwrdv56h1] {
        background-color: #218838;
    }

.delete-btn[b-tnwrdv56h1] {
    background-color: #dc3545;
    color: white;
}

    .delete-btn:hover[b-tnwrdv56h1] {
        background-color: #c82333;
    }

.modal[b-tnwrdv56h1] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-tnwrdv56h1] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 400px;
    max-width: 90%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

    .modal-content h3[b-tnwrdv56h1] {
        margin-top: 0;
        color: #015974;
        border-bottom: 2px solid #e9ecef;
        padding-bottom: 10px;
        margin-bottom: 20px;
        font-size: 1.6em;
        font-weight: 600;
    }

.form-group[b-tnwrdv56h1] {
    margin-bottom: 20px;
}

    .form-group label[b-tnwrdv56h1] {
        display: block;
        margin-bottom: 8px;
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

    .form-group input[b-tnwrdv56h1] {
        width: 100%;
        padding: 12px;
        border: 1px solid #ced4da;
        border-radius: 6px;
        box-sizing: border-box;
        font-size: 1em;
        transition: border-color 0.3s ease;
    }

        .form-group input:focus[b-tnwrdv56h1] {
            border-color: #015974;
            outline: none;
            box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
        }

.checkbox-group[b-tnwrdv56h1] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-tnwrdv56h1] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

    .checkbox-label input[type="checkbox"][b-tnwrdv56h1] {
        margin-right: 12px;
        margin-bottom: 0;
        vertical-align: middle;
        height: 20px;
        width: 20px;
    }

    .checkbox-label span[b-tnwrdv56h1] {
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

.button-group[b-tnwrdv56h1] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-tnwrdv56h1] {
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .save-btn.primary[b-tnwrdv56h1] {
        background-color: #015974;
        color: white;
    }

    .save-btn:hover[b-tnwrdv56h1] {
        background-color: #dfe3e8;
    }

    .save-btn.primary:hover[b-tnwrdv56h1] {
        background-color: #024d62;
    }

.close-btn[b-tnwrdv56h1] {
    display: block;
    margin-top: 20px;
    padding: 12px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    width: 100%;
    text-align: center;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .close-btn:hover[b-tnwrdv56h1] {
        background-color: #dfe3e8;
    }
/* /Pages/AdminDashboard/ChecklistItem.razor.rz.scp.css */
.container[b-lnpae38qwl] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1200px;
    width: 100%;
    box-sizing: border-box;
    margin: 0 auto;
}

.header-section[b-lnpae38qwl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

.header-section h2[b-lnpae38qwl] {
    margin: 0;
    color: #fff;
    font-size: 1.8em;
    font-weight: 600;
}

.add-btn[b-lnpae38qwl] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.add-btn:hover[b-lnpae38qwl] {
    background: #f0f9fc;
}

.search-bar[b-lnpae38qwl] {
    display: flex;
    margin-bottom: 20px;
}

.search-bar input[b-lnpae38qwl] {
    flex: 1;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 6px 0 0 6px;
    font-size: 1em;
    transition: border-color 0.3s ease;
}

.search-bar input:focus[b-lnpae38qwl] {
    border-color: #015974;
    outline: none;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.search-bar button[b-lnpae38qwl] {
    padding: 12px 20px;
    background-color: #015974;
    color: white;
    border: none;
    border-radius: 0 6px 6px 0;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.search-bar button:hover[b-lnpae38qwl] {
    background-color: #024d62;
}

.table-section[b-lnpae38qwl] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

table[b-lnpae38qwl] {
    width: 100%;
    border-collapse: collapse;
}

th[b-lnpae38qwl],
td[b-lnpae38qwl] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-lnpae38qwl] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-lnpae38qwl] {
    color: #34495e;
}

.status-dot[b-lnpae38qwl] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    vertical-align: middle;
}

.status-dot[b-lnpae38qwl]::before {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.status-dot.active[b-lnpae38qwl]::before {
    background-color: #28a745;
}

.status-dot.inactive[b-lnpae38qwl]::before {
    background-color: #dc3545;
}

.action-btn[b-lnpae38qwl] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-lnpae38qwl] {
    background-color: #28a745;
    color: white;
}

.edit-btn:hover[b-lnpae38qwl] {
    background-color: #218838;
}

.delete-btn[b-lnpae38qwl] {
    background-color: #dc3545;
    color: white;
}

.delete-btn:hover[b-lnpae38qwl] {
    background-color: #c82333;
}

.table-footer[b-lnpae38qwl] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

.modal[b-lnpae38qwl] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-lnpae38qwl] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 400px;
    max-width: 90%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

.modal-content h3[b-lnpae38qwl] {
    margin-top: 0;
    color: #015974;
    border-bottom: 2px solid #e9ecef;
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-size: 1.6em;
    font-weight: 600;
}

.form-group[b-lnpae38qwl] {
    margin-bottom: 20px;
}

.form-group label[b-lnpae38qwl] {
    display: block;
    margin-bottom: 8px;
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.form-group input[b-lnpae38qwl],
.form-group select[b-lnpae38qwl] {
    width: 100%;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    box-sizing: border-box;
    font-size: 1em;
    transition: border-color 0.3s ease;
}

.form-group input:focus[b-lnpae38qwl],
.form-group select:focus[b-lnpae38qwl] {
    border-color: #015974;
    outline: none;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.checkbox-group[b-lnpae38qwl] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-lnpae38qwl] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

.checkbox-label input[type="checkbox"][b-lnpae38qwl] {
    margin-right: 12px;
    margin-bottom: 0;
    vertical-align: middle;
    height: 20px;
    width: 20px;
}

.checkbox-label span[b-lnpae38qwl] {
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.button-group[b-lnpae38qwl] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-lnpae38qwl] {
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.save-btn.primary[b-lnpae38qwl] {
    background-color: #015974;
    color: white;
}

.save-btn:hover[b-lnpae38qwl] {
    background-color: #dfe3e8;
}

.save-btn.primary:hover[b-lnpae38qwl] {
    background-color: #024d62;
}

.close-btn[b-lnpae38qwl] {
    display: block;
    margin-top: 20px;
    padding: 12px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    width: 100%;
    text-align: center;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.close-btn:hover[b-lnpae38qwl] {
    background-color: #dfe3e8;
}
/* /Pages/AdminDashboard/Currencies.razor.rz.scp.css */
.container[b-g6aq9hgx99] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 100%;
    margin: 0 auto;
    border-radius: 20px;
}

.header-section[b-g6aq9hgx99] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

    .header-section h2[b-g6aq9hgx99] {
        margin: 0;
        color: #fff;
        font-size: 1.8em;
        font-weight: 600;
    }

.add-btn[b-g6aq9hgx99] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .add-btn:hover[b-g6aq9hgx99] {
        background: #f0f9fc;
    }

.table-section[b-g6aq9hgx99] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

table[b-g6aq9hgx99] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;

}

th[b-g6aq9hgx99], td[b-g6aq9hgx99] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-g6aq9hgx99] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-g6aq9hgx99] {
    color: #34495e;
}

.action-btn[b-g6aq9hgx99] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-g6aq9hgx99] {
    background-color: #28a745;
    color: white;
}

    .edit-btn:hover[b-g6aq9hgx99] {
        background-color: #218838;
    }

.delete-btn[b-g6aq9hgx99] {
    background-color: #dc3545;
    color: white;
}

    .delete-btn:hover[b-g6aq9hgx99] {
        background-color: #c82333;
    }

.modal[b-g6aq9hgx99] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-g6aq9hgx99] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 400px;
    max-width: 90%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

    .modal-content h3[b-g6aq9hgx99] {
        margin-top: 0;
        color: #015974;
        border-bottom: 2px solid #e9ecef;
        padding-bottom: 10px;
        margin-bottom: 20px;
        font-size: 1.6em;
        font-weight: 600;
    }

.form-group[b-g6aq9hgx99] {
    margin-bottom: 20px;
}

    .form-group label[b-g6aq9hgx99] {
        display: block;
        margin-bottom: 8px;
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

    .form-group input[b-g6aq9hgx99] {
        width: 100%;
        padding: 12px;
        border: 1px solid #ced4da;
        border-radius: 6px;
        box-sizing: border-box;
        font-size: 1em;
        transition: border-color 0.3s ease;
    }

        .form-group input:focus[b-g6aq9hgx99] {
            border-color: #015974;
            outline: none;
            box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
        }

.checkbox-group[b-g6aq9hgx99] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-g6aq9hgx99] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

    .checkbox-label input[type="checkbox"][b-g6aq9hgx99] {
        margin-right: 12px;
        margin-bottom: 0;
        vertical-align: middle;
        height: 20px;
        width: 20px;
    }

    .checkbox-label span[b-g6aq9hgx99] {
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

.button-group[b-g6aq9hgx99] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-g6aq9hgx99] {
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .save-btn.primary[b-g6aq9hgx99] {
        background-color: #015974;
        color: white;
    }

    .save-btn:hover[b-g6aq9hgx99] {
        background-color: #dfe3e8;
    }

    .save-btn.primary:hover[b-g6aq9hgx99] {
        background-color: #024d62;
    }

.close-btn[b-g6aq9hgx99] {
    display: block;
    margin-top: 20px;
    padding: 12px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    width: 100%;
    text-align: center;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .close-btn:hover[b-g6aq9hgx99] {
        background-color: #dfe3e8;
    }
/* /Pages/AdminDashboard/EstimationReports.razor.rz.scp.css */
/* ═══════════ Container ═══════════ */
    .er-container[b-4ucar8ff0v] {
        padding: 1.5rem;
        max-width: 1400px;
        margin: 0 auto;
    }

    /* ═══════════ Header ═══════════ */
    .er-header[b-4ucar8ff0v] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 1.5rem;
    }
    .er-header-left[b-4ucar8ff0v] {
        display: flex;
        align-items: center;
        gap: 1rem;
    }
    .er-header-left h2[b-4ucar8ff0v] {
        margin: 0;
        font-size: 1.5rem;
        color: #1a2332;
    }
    .er-badge[b-4ucar8ff0v] {
        background: linear-gradient(135deg, #015974, #9D6023);
        color: #fff;
        font-size: 0.7rem;
        font-weight: 600;
        padding: 0.25rem 0.75rem;
        border-radius: 12px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
    .er-header-right[b-4ucar8ff0v] {
        display: flex;
        gap: 0.5rem;
    }
    .btn-refresh[b-4ucar8ff0v] {
        background: #f0f4f8;
        border: 1px solid #d0d9e3;
        padding: 0.5rem 1rem;
        border-radius: 8px;
        cursor: pointer;
        font-size: 0.85rem;
        color: #4a5568;
        transition: all 0.2s;
    }
    .btn-refresh:hover[b-4ucar8ff0v] { background: #e2e8f0; }

    /* ═══════════ Stats ═══════════ */
    .stats-row[b-4ucar8ff0v] {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
        gap: 1rem;
        margin-bottom: 1.5rem;
    }
    .stat-card[b-4ucar8ff0v] {
        background: #fff;
        border-radius: 12px;
        padding: 1.25rem;
        display: flex;
        align-items: center;
        gap: 1rem;
        box-shadow: 0 1px 4px rgba(0,0,0,0.06);
        border-left: 4px solid transparent;
    }
    .stat-card.total[b-4ucar8ff0v] { border-left-color: #015974; }
    .stat-card.pending[b-4ucar8ff0v] { border-left-color: #f6ad55; }
    .stat-card.in-progress[b-4ucar8ff0v] { border-left-color: #4299e1; }
    .stat-card.completed[b-4ucar8ff0v] { border-left-color: #48bb78; }
    .stat-icon[b-4ucar8ff0v] {
        width: 44px;
        height: 44px;
        border-radius: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.1rem;
    }
    .stat-card.total .stat-icon[b-4ucar8ff0v] { background: #ebf0ff; color: #015974; }
    .stat-card.pending .stat-icon[b-4ucar8ff0v] { background: #fef3e2; color: #dd6b20; }
    .stat-card.in-progress .stat-icon[b-4ucar8ff0v] { background: #ebf8ff; color: #015974; }
    .stat-card.completed .stat-icon[b-4ucar8ff0v] { background: #f0fff4; color: #38a169; }
    .stat-info[b-4ucar8ff0v] { display: flex; flex-direction: column; }
    .stat-number[b-4ucar8ff0v] { font-size: 1.5rem; font-weight: 700; color: #1a2332; }
    .stat-label[b-4ucar8ff0v] { font-size: 0.8rem; color: #718096; text-transform: uppercase; letter-spacing: 0.5px; }

    /* ═══════════ Filters ═══════════ */
    .filter-bar[b-4ucar8ff0v] {
        display: flex;
        flex-wrap: wrap;
        gap: 1rem;
        background: #fff;
        padding: 1.25rem;
        border-radius: 12px;
        margin-bottom: 1.5rem;
        box-shadow: 0 1px 4px rgba(0,0,0,0.06);
        align-items: flex-end;
    }
    .filter-item[b-4ucar8ff0v] { display: flex; flex-direction: column; gap: 0.3rem; }
    .filter-item.search-item[b-4ucar8ff0v] { flex: 1; min-width: 200px; }
    .filter-item label[b-4ucar8ff0v] { font-size: 0.75rem; font-weight: 600; color: #4a5568; text-transform: uppercase; letter-spacing: 0.5px; }
    .filter-item input[b-4ucar8ff0v],
    .filter-item select[b-4ucar8ff0v] {
        padding: 0.5rem 0.75rem;
        border: 1px solid #d0d9e3;
        border-radius: 8px;
        font-size: 0.85rem;
        background: #f7fafc;
    }
    .filter-item input:focus[b-4ucar8ff0v],
    .filter-item select:focus[b-4ucar8ff0v] { outline: none; border-color: #015974; box-shadow: 0 0 0 3px rgba(1, 89, 116, 0.15); }
    .filter-actions[b-4ucar8ff0v] { display: flex; gap: 0.5rem; align-items: flex-end; }
    .btn-apply[b-4ucar8ff0v] {
        background: linear-gradient(135deg, #015974, #9D6023);
        color: #fff;
        border: none;
        padding: 0.5rem 1.25rem;
        border-radius: 8px;
        font-size: 0.85rem;
        cursor: pointer;
        font-weight: 600;
    }
    .btn-apply:hover[b-4ucar8ff0v] { opacity: 0.9; }
    .btn-clear[b-4ucar8ff0v] {
        background: #fff;
        border: 1px solid #d0d9e3;
        padding: 0.5rem 1rem;
        border-radius: 8px;
        font-size: 0.85rem;
        cursor: pointer;
        color: #4a5568;
    }
    .btn-clear:hover[b-4ucar8ff0v] { background: #f7fafc; }

    /* ═══════════ Table ═══════════ */
    .er-table-wrapper[b-4ucar8ff0v] {
        background: #fff;
        border-radius: 12px;
        overflow-x: auto;
        box-shadow: 0 1px 4px rgba(0,0,0,0.06);
        margin-bottom: 1rem;
    }
    .er-table[b-4ucar8ff0v] {
        width: 100%;
        border-collapse: collapse;
    }
    .er-table thead th[b-4ucar8ff0v] {
        background: #f7fafc;
        padding: 0.85rem 1rem;
        text-align: left;
        font-size: 0.75rem;
        font-weight: 700;
        color: #4a5568;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        border-bottom: 2px solid #e2e8f0;
    }
    .er-table tbody td[b-4ucar8ff0v] {
        padding: 0.85rem 1rem;
        font-size: 0.875rem;
        border-bottom: 1px solid #edf2f7;
        vertical-align: middle;
    }
    .er-table tbody tr:hover[b-4ucar8ff0v] { background: #f7fafc; }

    .order-badge[b-4ucar8ff0v] {
        background: #ebf8ff;
        color: #2b6cb0;
        font-size: 0.78rem;
        font-weight: 600;
        padding: 0.25rem 0.6rem;
        border-radius: 6px;
    }

    /* Report type tags */
    .report-tags[b-4ucar8ff0v] { display: flex; flex-wrap: wrap; gap: 0.3rem; }
    .report-tag[b-4ucar8ff0v] {
        background: #f0f4ff;
        color: #4c51bf;
        font-size: 0.72rem;
        font-weight: 600;
        padding: 0.2rem 0.5rem;
        border-radius: 4px;
        white-space: nowrap;
    }

    /* Status badges */
    .status-badge[b-4ucar8ff0v] {
        display: inline-block;
        padding: 0.25rem 0.65rem;
        border-radius: 12px;
        font-size: 0.75rem;
        font-weight: 600;
    }
    .status-new[b-4ucar8ff0v] { background: #fefce8; color: #a16207; }
    .status-progress[b-4ucar8ff0v] { background: #dbeafe; color: #1d4ed8; }
    .status-pending[b-4ucar8ff0v] { background: #fff7ed; color: #c2410c; }
    .status-completed[b-4ucar8ff0v] { background: #dcfce7; color: #15803d; }
    .status-hold[b-4ucar8ff0v] { background: #f3f4f6; color: #4b5563; }
    .status-cancelled[b-4ucar8ff0v] { background: #fef2f2; color: #b91c1c; }

    /* Action buttons */
    .btn-action[b-4ucar8ff0v] {
        border: none;
        padding: 0.4rem 0.6rem;
        border-radius: 6px;
        cursor: pointer;
        font-size: 0.8rem;
        transition: all 0.2s;
    }
    .btn-view[b-4ucar8ff0v] { background: #ebf0ff; color: #015974; }
    .btn-view:hover[b-4ucar8ff0v] { background: #015974; color: #fff; }

    /* ═══════════ Pagination ═══════════ */
    .pagination-section[b-4ucar8ff0v] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0.75rem 0;
    }
    .page-info[b-4ucar8ff0v] { font-size: 0.82rem; color: #718096; }
    .pagination-buttons[b-4ucar8ff0v] { display: flex; gap: 0.3rem; }
    .page-btn[b-4ucar8ff0v] {
        width: 34px;
        height: 34px;
        border: 1px solid #d0d9e3;
        border-radius: 6px;
        background: #fff;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 0.85rem;
        color: #4a5568;
    }
    .page-btn.active[b-4ucar8ff0v] { background: #015974; color: #fff; border-color: #015974; }
    .page-btn:disabled[b-4ucar8ff0v] { opacity: 0.4; cursor: not-allowed; }

    /* ═══════════ Modal ═══════════ */
    .modal-overlay[b-4ucar8ff0v] {
        position: fixed;
        top: 0; left: 0; right: 0; bottom: 0;
        background: rgba(0,0,0,0.5);
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 1000;
        padding: 1rem;
    }
    .modal-panel[b-4ucar8ff0v] {
        background: #fff;
        border-radius: 16px;
        width: 100%;
        max-width: 800px;
        max-height: 85vh;
        display: flex;
        flex-direction: column;
        box-shadow: 0 20px 60px rgba(0,0,0,0.15);
    }
    .modal-header-er[b-4ucar8ff0v] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 1.25rem 1.5rem;
        border-bottom: 1px solid #e2e8f0;
    }
    .modal-header-er h3[b-4ucar8ff0v] {
        margin: 0;
        font-size: 1.15rem;
        color: #1a2332;
    }
    .btn-close-modal[b-4ucar8ff0v] {
        background: none;
        border: none;
        font-size: 1.5rem;
        color: #718096;
        cursor: pointer;
        padding: 0.25rem 0.5rem;
        line-height: 1;
    }
    .btn-close-modal:hover[b-4ucar8ff0v] { color: #1a2332; }
    .modal-body-er[b-4ucar8ff0v] {
        padding: 1.5rem;
        overflow-y: auto;
        flex: 1;
    }
    .modal-footer-er[b-4ucar8ff0v] {
        display: flex;
        justify-content: flex-end;
        gap: 0.5rem;
        padding: 1rem 1.5rem;
        border-top: 1px solid #e2e8f0;
    }
    .btn-cancel[b-4ucar8ff0v] {
        background: #f0f4f8;
        border: 1px solid #d0d9e3;
        padding: 0.5rem 1.25rem;
        border-radius: 8px;
        cursor: pointer;
        font-size: 0.85rem;
        color: #4a5568;
    }
    .btn-cancel:hover[b-4ucar8ff0v] { background: #e2e8f0; }

    /* Detail grid */
    .detail-grid[b-4ucar8ff0v] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1.5rem;
    }
    .detail-section[b-4ucar8ff0v] {
        background: #f7fafc;
        border-radius: 10px;
        padding: 1rem;
    }
    .detail-section.full-width[b-4ucar8ff0v] { grid-column: 1 / -1; }
    .section-title[b-4ucar8ff0v] {
        font-size: 0.85rem;
        font-weight: 700;
        color: #2d3748;
        margin-bottom: 0.75rem;
        padding-bottom: 0.5rem;
        border-bottom: 1px solid #e2e8f0;
    }
    .section-title i[b-4ucar8ff0v] { margin-right: 0.4rem; color: #015974; }
    .info-row[b-4ucar8ff0v] {
        display: flex;
        justify-content: space-between;
        padding: 0.35rem 0;
        font-size: 0.85rem;
    }
    .info-label[b-4ucar8ff0v] { font-weight: 600; color: #4a5568; }

    /* Report tags in modal */
    .report-tags-detail[b-4ucar8ff0v] { display: flex; flex-wrap: wrap; gap: 0.5rem; }
    .report-tag-lg[b-4ucar8ff0v] {
        background: linear-gradient(135deg, #ebf0ff, #e0e7ff);
        color: #4c51bf;
        font-size: 0.82rem;
        font-weight: 600;
        padding: 0.4rem 0.85rem;
        border-radius: 8px;
        border: 1px solid #c7d2fe;
    }

    /* Checklist items */
    .checklist-items[b-4ucar8ff0v] { display: flex; flex-direction: column; gap: 0.4rem; }
    .checklist-row[b-4ucar8ff0v] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 0.85rem;
        color: #2d3748;
    }
    .notes-text[b-4ucar8ff0v] {
        font-size: 0.85rem;
        color: #4a5568;
        line-height: 1.6;
        margin: 0;
        white-space: pre-wrap;
    }

    /* Loading */
    .loading-container[b-4ucar8ff0v] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.75rem;
        padding: 2rem;
    }
    .spinner[b-4ucar8ff0v] {
        width: 24px;
        height: 24px;
        border: 3px solid #e2e8f0;
        border-top-color: #015974;
        border-radius: 50%;
        animation: spin-b-4ucar8ff0v 0.8s linear infinite;
    }
    @keyframes spin-b-4ucar8ff0v { to { transform: rotate(360deg); } }

    /* Responsive */
    @media (max-width: 768px) {
        .er-header[b-4ucar8ff0v] { flex-direction: column; gap: 0.75rem; align-items: flex-start; }
        .filter-bar[b-4ucar8ff0v] { flex-direction: column; }
        .detail-grid[b-4ucar8ff0v] { grid-template-columns: 1fr; }
        .stats-row[b-4ucar8ff0v] { grid-template-columns: repeat(2, 1fr); }
    }
/* /Pages/AdminDashboard/Groups.razor.rz.scp.css */
/* === Layout === */
.container[b-7fazqwxrj5] {
    padding: 25px;
    max-width: 1100px;
    margin: 0 auto;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

/* === Header === */
.header-section[b-7fazqwxrj5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

    .header-section input[b-7fazqwxrj5] {
        max-width: 300px;
    }

/* === Table === */
table[b-7fazqwxrj5] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.95rem;
}

th[b-7fazqwxrj5], td[b-7fazqwxrj5] {
    padding: 12px 16px;
    border-bottom: 1px solid #e9ecef;
    vertical-align: middle;
}

th[b-7fazqwxrj5] {
    background: #f8f9fa;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.85rem;
    color: #495057;
}

/* === Buttons === */
.btn[b-7fazqwxrj5] {
    padding: 6px 14px;
    font-size: 0.85rem;
    font-weight: 500;
}

.btn-info[b-7fazqwxrj5] {
    background-color: #015974;
    border-color: #015974;
    color: #fff;
}

    .btn-info:hover[b-7fazqwxrj5] {
        background-color: #0b5ed7;
    }

/* === Modal Backdrop === */
.modal-backdrop[b-7fazqwxrj5] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1050;
}

/* === Modal Content === */
.modal-dialog[b-7fazqwxrj5] {
    background: #fff;
    border-radius: 8px;
    padding: 20px;
    width: 95%;
    max-width: 700px;
    box-shadow: 0 5px 25px rgba(0,0,0,0.2);
}

    .modal-dialog h5[b-7fazqwxrj5] {
        font-size: 1.25rem;
        font-weight: 600;
        margin-bottom: 15px;
    }

    /* === Rights Table === */
    .modal-dialog table[b-7fazqwxrj5] {
        width: 100%;
        font-size: 0.9rem;
        border: 1px solid #dee2e6;
    }

    .modal-dialog th[b-7fazqwxrj5],
    .modal-dialog td[b-7fazqwxrj5] {
        text-align: center;
        padding: 10px;
    }

        .modal-dialog th:first-child[b-7fazqwxrj5],
        .modal-dialog td:first-child[b-7fazqwxrj5] {
            text-align: left;
        }

/* === Checkboxes === */
input[type="checkbox"][b-7fazqwxrj5] {
    width: 18px;
    height: 18px;
    cursor: pointer;
}

/* === Footer Buttons === */
.modal-dialog .text-end button[b-7fazqwxrj5] {
    min-width: 90px;
}

/* === Small screen tweaks === */
@media (max-width: 576px) {
    .modal-dialog[b-7fazqwxrj5] {
        padding: 15px;
    }

    table th[b-7fazqwxrj5],
    table td[b-7fazqwxrj5] {
        font-size: 0.85rem;
        padding: 8px;
    }
}
/* /Pages/AdminDashboard/InternationalPricing.razor.rz.scp.css */
.container[b-6pzj9h3x8i] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1500px;
    width: 100%;
    box-sizing: border-box;
    margin: 0 auto;
    border-radius: 20px
}

.header-section[b-6pzj9h3x8i] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

.header-section h2[b-6pzj9h3x8i] {
    margin: 0;
    color: #fff;
    font-size: 1.8em;
    font-weight: 600;
}

.info-banner[b-6pzj9h3x8i] {
    background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
    padding: 15px 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    color: #1565c0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.info-banner i[b-6pzj9h3x8i] {
    font-size: 1.2em;
}

.filter-section[b-6pzj9h3x8i] {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
    padding: 15px;
    background-color: #f8f9fa;
    border-radius: 8px;
}

.filter-group[b-6pzj9h3x8i] {
    flex: 1;
}

.filter-group label[b-6pzj9h3x8i] {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: #2c3e50;
}

.filter-group select[b-6pzj9h3x8i] {
    width: 100%;
    padding: 10px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    font-size: 1em;
}

.add-btn[b-6pzj9h3x8i] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.add-btn:hover[b-6pzj9h3x8i] {
    background: #f0f9fc;
}

.table-section[b-6pzj9h3x8i] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    overflow-x: auto;
    max-width: 100%;
}

table[b-6pzj9h3x8i] {
    width: 100%;
    border-collapse: collapse;
}

th[b-6pzj9h3x8i],
td[b-6pzj9h3x8i] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-6pzj9h3x8i] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-6pzj9h3x8i] {
    color: #34495e;
}

.currency-badge[b-6pzj9h3x8i] {
    background-color: #e3f2fd;
    color: #1565c0;
    padding: 4px 10px;
    border-radius: 15px;
    font-weight: 600;
    font-size: 0.85em;
    margin-right: 8px;
}

.price-cell[b-6pzj9h3x8i] {
    font-weight: 600;
    color: #2e7d32;
    font-size: 1.1em;
}

.status-badge[b-6pzj9h3x8i] {
    padding: 5px 12px;
    border-radius: 15px;
    font-size: 0.85em;
    font-weight: 500;
}

.status-badge.active[b-6pzj9h3x8i] {
    background-color: #d4edda;
    color: #155724;
}

.status-badge.inactive[b-6pzj9h3x8i] {
    background-color: #f8d7da;
    color: #721c24;
}

.table-footer[b-6pzj9h3x8i] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

.modal[b-6pzj9h3x8i] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-6pzj9h3x8i] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 500px;
    max-width: 90%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.modal-content h3[b-6pzj9h3x8i] {
    margin-top: 0;
    color: #015974;
    border-bottom: 2px solid #e9ecef;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

.form-group[b-6pzj9h3x8i] {
    margin-bottom: 20px;
}

.form-group label[b-6pzj9h3x8i] {
    display: block;
    margin-bottom: 8px;
    color: #2c3e50;
    font-weight: 500;
}

.form-group input[b-6pzj9h3x8i],
.form-group select[b-6pzj9h3x8i] {
    width: 100%;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    box-sizing: border-box;
    font-size: 1em;
}

.form-group input:focus[b-6pzj9h3x8i],
.form-group select:focus[b-6pzj9h3x8i] {
    border-color: #015974;
    outline: none;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.checkbox-group[b-6pzj9h3x8i] {
    display: flex;
    align-items: center;
}

.button-group[b-6pzj9h3x8i] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-6pzj9h3x8i] {
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    cursor: pointer;
    font-weight: 500;
}

.save-btn.primary[b-6pzj9h3x8i] {
    background-color: #015974;
    color: white;
}

.save-btn.primary:hover[b-6pzj9h3x8i] {
    background-color: #024d62;
}

.close-btn[b-6pzj9h3x8i] {
    padding: 12px 25px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    color: #2c3e50;
    font-weight: 500;
}

.close-btn:hover[b-6pzj9h3x8i] {
    background-color: #dfe3e8;
}

.error[b-6pzj9h3x8i] {
    background-color: #f8d7da;
    color: #721c24;
    padding: 10px;
    border-radius: 6px;
    margin-bottom: 15px;
}

.btn[b-6pzj9h3x8i] {
    padding: 8px 15px;
    margin-right: 5px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
}

.btn-warning[b-6pzj9h3x8i] {
    background-color: #ffc107;
    color: #212529;
}

.btn-warning:hover[b-6pzj9h3x8i] {
    background-color: #e0a800;
}

.btn-danger[b-6pzj9h3x8i] {
    background-color: #dc3545;
    color: white;
}

.btn-danger:hover[b-6pzj9h3x8i] {
    background-color: #c82333;
}

.btn-secondary[b-6pzj9h3x8i] {
    background-color: #6c757d;
    color: white;
    margin-left: 10px;
}

.btn-secondary:hover[b-6pzj9h3x8i] {
    background-color: #5a6268;
}
/* /Pages/AdminDashboard/InvoiceHistory.razor.rz.scp.css */
.page-wrapper[b-aiw0v7rb1y] {
    padding: 24px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1500px;
    width: 100%;
    box-sizing: border-box;
    margin: 0 auto;
}

.page-header[b-aiw0v7rb1y] {
    margin-bottom: 24px;
    padding: 20px 26px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
    display: flex;
    align-items: center;
    gap: 12px;
    color: #fff;
}

.header-icon[b-aiw0v7rb1y] {
    font-size: 1.5rem;
    line-height: 1;
}

.page-title[b-aiw0v7rb1y] {
    margin: 0;
    font-size: 1.4rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.01em;
}

.content-card[b-aiw0v7rb1y] {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid #e9ecef;
    overflow: hidden;
}

/* ─── Toolbar (tabs + search) ─── */
.toolbar[b-aiw0v7rb1y] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    padding: 16px 20px;
    background: #f8f9fa;
    border-bottom: 1px solid #e9ecef;
}

/* ─── Tabs ─── */
.invoice-tabs[b-aiw0v7rb1y] {
    display: flex;
    gap: 4px;
    background: #e9ecef;
    padding: 4px;
    border-radius: 8px;
}

.tab-btn[b-aiw0v7rb1y] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 18px;
    border: none;
    background: transparent;
    cursor: pointer;
    border-radius: 6px;
    font-size: 0.9rem;
    font-weight: 500;
    color: #6c757d;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.tab-btn:hover[b-aiw0v7rb1y] {
    background: #ffffff;
    color: #2c3e50;
}

.tab-btn.active[b-aiw0v7rb1y] {
    background: linear-gradient(135deg, #015974, #9D6023);
    color: #ffffff;
    font-weight: 600;
    box-shadow: 0 1px 4px rgba(1, 89, 116, 0.35);
}

.tab-count[b-aiw0v7rb1y] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border-radius: 10px;
    font-size: 0.75rem;
    font-weight: 700;
    background: rgba(255, 255, 255, 0.25);
}

.tab-btn:not(.active) .tab-count[b-aiw0v7rb1y] {
    background: #ced4da;
    color: #495057;
}

/* ─── Search Bar ─── */
.search-bar[b-aiw0v7rb1y] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #ffffff;
    border: 1px solid #ced4da;
    border-radius: 8px;
    padding: 8px 14px;
    min-width: 300px;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.search-bar:focus-within[b-aiw0v7rb1y] {
    border-color: #2d7a7a;
    box-shadow: 0 0 0 3px rgba(45, 122, 122, 0.12);
}

.search-icon[b-aiw0v7rb1y] {
    width: 16px;
    height: 16px;
    color: #6c757d;
    flex-shrink: 0;
}

.search-input[b-aiw0v7rb1y] {
    border: none;
    outline: none;
    font-size: 0.9rem;
    color: #2c3e50;
    background: transparent;
    flex: 1;
    min-width: 0;
}

.search-input[b-aiw0v7rb1y]::placeholder {
    color: #adb5bd;
}

/* ─── Table Section ─── */
.table-section[b-aiw0v7rb1y] {
    overflow-x: auto;
}

table[b-aiw0v7rb1y] {
    width: 100%;
    border-collapse: collapse;
}

thead tr[b-aiw0v7rb1y] {
    background: #f1f3f5;
    border-bottom: 2px solid #dee2e6;
}

th[b-aiw0v7rb1y] {
    padding: 12px 16px;
    text-align: left;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #6c757d;
    white-space: nowrap;
}

td[b-aiw0v7rb1y] {
    padding: 14px 16px;
    color: #2c3e50;
    font-size: 0.9rem;
    border-bottom: 1px solid #f1f3f5;
    vertical-align: middle;
}

tbody tr[b-aiw0v7rb1y] {
    transition: background 0.15s ease;
}

tbody tr:hover[b-aiw0v7rb1y] {
    background: #f8fffe;
}

tbody tr:last-child td[b-aiw0v7rb1y] {
    border-bottom: none;
}

/* ─── Table Cell Helpers ─── */
.invoice-ref[b-aiw0v7rb1y] {
    font-family: 'Courier New', monospace;
    font-size: 0.82rem;
    font-weight: 700;
    color: #2d7a7a;
    letter-spacing: 0.05em;
}

.customer-name[b-aiw0v7rb1y] {
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 3px;
}

.customer-email[b-aiw0v7rb1y] {
    font-size: 0.8rem;
    color: #6c757d;
}

.date-cell[b-aiw0v7rb1y] {
    white-space: nowrap;
    color: #495057;
    font-size: 0.85rem;
}

.center-cell[b-aiw0v7rb1y] {
    text-align: center;
}

.project-count-badge[b-aiw0v7rb1y] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: #e9ecef;
    border-radius: 50%;
    font-size: 0.82rem;
    font-weight: 700;
    color: #495057;
}

.amount-cell[b-aiw0v7rb1y] {
    font-weight: 600;
    color: #2c3e50;
    white-space: nowrap;
}

/* ─── Status Badges ─── */
.status-badge[b-aiw0v7rb1y] {
    display: inline-block;
    padding: 4px 11px;
    border-radius: 20px;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    white-space: nowrap;
}

.status-paid[b-aiw0v7rb1y]     { background: #d4edda; color: #155724; }
.status-pending[b-aiw0v7rb1y]  { background: #fff3cd; color: #856404; }
.status-finalised[b-aiw0v7rb1y]{ background: #d1ecf1; color: #0c5460; }
.status-rejected[b-aiw0v7rb1y] { background: #f8d7da; color: #721c24; }
.status-draft[b-aiw0v7rb1y]    { background: #e2e3e5; color: #383d41; }

/* ─── View Button ─── */
.view-btn[b-aiw0v7rb1y] {
    padding: 6px 16px;
    background: #2d7a7a;
    color: #ffffff;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 500;
    transition: background 0.2s ease, transform 0.1s;
    white-space: nowrap;
}

.view-btn:hover[b-aiw0v7rb1y] {
    background: #236060;
    transform: translateY(-1px);
}

.view-btn:active[b-aiw0v7rb1y] {
    transform: translateY(0);
}

/* ─── Empty State ─── */
.empty-state[b-aiw0v7rb1y] {
    padding: 56px 20px;
    text-align: center;
}

.empty-content[b-aiw0v7rb1y] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.empty-content svg[b-aiw0v7rb1y] {
    width: 52px;
    height: 52px;
    color: #ced4da;
}

.empty-content p[b-aiw0v7rb1y] {
    margin: 0;
    font-size: 0.95rem;
    color: #6c757d;
}

/* ─── Loading State ─── */
.loading-state[b-aiw0v7rb1y] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 64px 20px;
    gap: 14px;
    color: #6c757d;
    font-size: 0.9rem;
}

.spinner[b-aiw0v7rb1y] {
    width: 36px;
    height: 36px;
    border: 3px solid #e9ecef;
    border-top-color: #2d7a7a;
    border-radius: 50%;
    animation: spin-b-aiw0v7rb1y 0.75s linear infinite;
}

@keyframes spin-b-aiw0v7rb1y {
    to { transform: rotate(360deg); }
}

/* ─── Pagination ─── */
.pagination-section[b-aiw0v7rb1y] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 14px 20px;
    background: #f8f9fa;
    border-top: 1px solid #e9ecef;
}

.page-info[b-aiw0v7rb1y] {
    font-size: 0.875rem;
    color: #6c757d;
}

.page-info strong[b-aiw0v7rb1y] {
    color: #2c3e50;
}

.record-count[b-aiw0v7rb1y] {
    margin-left: 4px;
    color: #adb5bd;
}

.pagination-buttons[b-aiw0v7rb1y] {
    display: flex;
    gap: 4px;
}

.page-btn[b-aiw0v7rb1y] {
    min-width: 34px;
    height: 34px;
    padding: 0 8px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #dee2e6;
    background: #ffffff;
    color: #495057;
    cursor: pointer;
    border-radius: 6px;
    font-size: 0.9rem;
    font-weight: 500;
    transition: all 0.15s ease;
    user-select: none;
}

.page-btn:hover:not(:disabled)[b-aiw0v7rb1y] {
    background: #e9ecef;
    border-color: #adb5bd;
    color: #212529;
}

.page-btn.active[b-aiw0v7rb1y] {
    background: #2d7a7a;
    border-color: #2d7a7a;
    color: #ffffff;
    font-weight: 700;
    cursor: default;
}

.page-btn:disabled[b-aiw0v7rb1y] {
    cursor: not-allowed;
    opacity: 0.4;
    background: #f8f9fa;
    color: #aaa;
    border-color: #e9ecef;
}

/* ─── Responsive ─── */
@media (max-width: 768px) {
    .page-wrapper[b-aiw0v7rb1y] { padding: 16px; }

    .toolbar[b-aiw0v7rb1y] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-bar[b-aiw0v7rb1y] {
        min-width: unset;
    }

    .pagination-section[b-aiw0v7rb1y] {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
}
/* /Pages/AdminDashboard/JobsBoard.razor.rz.scp.css */
.qa-container[b-1h9c76olvz] {
        padding: 24px;
        max-width: 100%;
    }

    .qa-header[b-1h9c76olvz] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 24px;
        background: linear-gradient(190deg, #015974, #9D6023);
        padding: 20px 24px;
        border-radius: 12px;
        color: white;
    }

    .qa-header-left[b-1h9c76olvz] {
        display: flex;
        align-items: center;
        gap: 12px;
    }

    .qa-header h2[b-1h9c76olvz] {
        margin: 0;
        font-size: 1.5rem;
        font-weight: 700;
        color: white;
    }

    .qa-header-right[b-1h9c76olvz] {
        display: flex;
        gap: 10px;
    }

    .btn-create[b-1h9c76olvz] {
        background: #22c55e;
        color: white;
        border: none;
        padding: 10px 20px;
        border-radius: 8px;
        font-weight: 600;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 6px;
        transition: background 0.2s;
    }

    .btn-create:hover[b-1h9c76olvz] { background: #16a34a; }

    .btn-refresh[b-1h9c76olvz] {
        background: rgba(255,255,255,0.15);
        color: white;
        border: 1px solid rgba(255,255,255,0.3);
        padding: 10px 16px;
        border-radius: 8px;
        cursor: pointer;
        transition: background 0.2s;
    }

    .btn-refresh:hover[b-1h9c76olvz] { background: rgba(255,255,255,0.25); }

    /* Stats */
    .stats-row[b-1h9c76olvz] {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 16px;
        margin-bottom: 20px;
    }

    .stat-card[b-1h9c76olvz] {
        background: white;
        border-radius: 12px;
        padding: 20px;
        display: flex;
        align-items: center;
        gap: 16px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.06);
        border-left: 4px solid transparent;
    }

    .stat-card.pending[b-1h9c76olvz] { border-left-color: #f59e0b; }
    .stat-card.in-progress[b-1h9c76olvz] { border-left-color: #3b82f6; }
    .stat-card.completed[b-1h9c76olvz] { border-left-color: #22c55e; }
    .stat-card.payment-pending[b-1h9c76olvz] { border-left-color: #a855f7; }
    .stat-card.unpaid[b-1h9c76olvz] { border-left-color: #ef4444; }

    .stat-icon[b-1h9c76olvz] {
        width: 48px;
        height: 48px;
        border-radius: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.3rem;
    }

    .stat-card.pending .stat-icon[b-1h9c76olvz] { background: #fef3c7; color: #f59e0b; }
    .stat-card.in-progress .stat-icon[b-1h9c76olvz] { background: #dbeafe; color: #3b82f6; }
    .stat-card.completed .stat-icon[b-1h9c76olvz] { background: #dcfce7; color: #22c55e; }
    .stat-card.payment-pending .stat-icon[b-1h9c76olvz] { background: #f3e8ff; color: #a855f7; }
    .stat-card.unpaid .stat-icon[b-1h9c76olvz] { background: #fee2e2; color: #ef4444; }

    .stat-info[b-1h9c76olvz] { display: flex; flex-direction: column; }
    .stat-number[b-1h9c76olvz] { font-size: 1.8rem; font-weight: 700; color: #1e293b; line-height: 1; }
    .stat-label[b-1h9c76olvz] { font-size: 0.85rem; color: #64748b; margin-top: 4px; }

    /* Filters */
    .filter-bar[b-1h9c76olvz] {
        background: white;
        border-radius: 10px;
        padding: 16px;
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        align-items: flex-end;
        margin-bottom: 20px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    }

    .filter-item[b-1h9c76olvz] {
        display: flex;
        flex-direction: column;
        gap: 4px;
        min-width: 140px;
    }

    .filter-item.search-item[b-1h9c76olvz] { min-width: 260px; }

    .filter-item label[b-1h9c76olvz] {
        font-size: 0.78rem;
        font-weight: 600;
        color: #64748b;
        text-transform: uppercase;
        letter-spacing: 0.4px;
    }

    .filter-item input[b-1h9c76olvz],
    .filter-item select[b-1h9c76olvz] {
        padding: 8px 12px;
        border: 1px solid #e2e8f0;
        border-radius: 6px;
        font-size: 0.9rem;
        background: #f8fafc;
        color: #1e293b;
        outline: none;
        transition: border 0.2s;
    }

    .filter-item input:focus[b-1h9c76olvz],
    .filter-item select:focus[b-1h9c76olvz] { border-color: #015974; }

    .btn-apply[b-1h9c76olvz] {
        background: linear-gradient(190deg, #015974, #9D6023);
        color: white;
        border: none;
        padding: 9px 18px;
        border-radius: 6px;
        font-weight: 600;
        cursor: pointer;
        align-self: flex-end;
    }

    .btn-clear[b-1h9c76olvz] {
        background: #f1f5f9;
        color: #64748b;
        border: 1px solid #e2e8f0;
        padding: 9px 18px;
        border-radius: 6px;
        font-weight: 600;
        cursor: pointer;
        align-self: flex-end;
    }

    /* Table */
    .qa-table-wrapper[b-1h9c76olvz] {
        background: white;
        border-radius: 12px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.06);
        overflow: hidden;
    }

    .qa-table-wrapper .qa-table-scroll[b-1h9c76olvz] {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .qa-table-wrapper .qa-table-scroll[b-1h9c76olvz]::-webkit-scrollbar {
        height: 6px;
    }

    .qa-table-wrapper .qa-table-scroll[b-1h9c76olvz]::-webkit-scrollbar-track {
        background: #f1f5f9;
    }

    .qa-table-wrapper .qa-table-scroll[b-1h9c76olvz]::-webkit-scrollbar-thumb {
        background: #94a3b8;
        border-radius: 3px;
    }

    .qa-table-wrapper .qa-table-scroll[b-1h9c76olvz]::-webkit-scrollbar-thumb:hover {
        background: #015974;
    }

    .qa-table[b-1h9c76olvz] {
        width: 100%;
        min-width: 1100px;
        border-collapse: collapse;
        font-size: 0.88rem;
    }

    .qa-table thead tr[b-1h9c76olvz] {
        background: #f8fafc;
        border-bottom: 2px solid #e2e8f0;
    }

    .qa-table th[b-1h9c76olvz] {
        padding: 12px 14px;
        text-align: left;
        font-weight: 700;
        font-size: 0.78rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        color: #64748b;
        white-space: nowrap;
    }

    .qa-table td[b-1h9c76olvz] {
        padding: 12px 14px;
        border-bottom: 1px solid #f1f5f9;
        color: #374151;
        vertical-align: middle;
    }

    .qa-table tbody tr:hover[b-1h9c76olvz] { background: #f8fafc; }
    .qa-table tbody tr:last-child td[b-1h9c76olvz] { border-bottom: none; }

    .row-urgent[b-1h9c76olvz] { background: #fff7ed !important; }
    .row-urgent:hover[b-1h9c76olvz] { background: #fef3c7 !important; }

    .project-id-badge[b-1h9c76olvz] {
        background: #e0f2fe;
        color: #0369a1;
        padding: 3px 8px;
        border-radius: 4px;
        font-size: 0.78rem;
        font-weight: 700;
        white-space: nowrap;
    }

    .cell-name[b-1h9c76olvz] {
        max-width: 220px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .cell-name strong[b-1h9c76olvz] { color: #1e293b; display: block; overflow: hidden; text-overflow: ellipsis; }

    .customer-name[b-1h9c76olvz] { font-weight: 600; color: #374151; }

    .company-badge[b-1h9c76olvz] {
        background: #f0fdf4;
        color: #166534;
        padding: 2px 8px;
        border-radius: 4px;
        font-size: 0.8rem;
        font-weight: 600;
    }

    .badge-paid[b-1h9c76olvz] {
        background: #dcfce7;
        color: #166534;
        padding: 4px 10px;
        border-radius: 20px;
        font-size: 0.8rem;
        font-weight: 600;
    }

    .badge-pending[b-1h9c76olvz] {
        background: #f3e8ff;
        color: #7e22ce;
        padding: 4px 10px;
        border-radius: 20px;
        font-size: 0.8rem;
        font-weight: 600;
    }

    .badge-unpaid[b-1h9c76olvz] {
        background: #fee2e2;
        color: #991b1b;
        padding: 4px 10px;
        border-radius: 20px;
        font-size: 0.8rem;
        font-weight: 600;
    }

    .badge-rejected[b-1h9c76olvz] {
        background: #fef3c7;
        color: #92400e;
        padding: 4px 10px;
        border-radius: 20px;
        font-size: 0.8rem;
        font-weight: 600;
    }

    .badge-finalised[b-1h9c76olvz] {
        background: #dbeafe;
        color: #015974;
        padding: 4px 10px;
        border-radius: 20px;
        font-size: 0.8rem;
        font-weight: 600;
    }

    .status-badge[b-1h9c76olvz] {
        padding: 4px 10px;
        border-radius: 20px;
        font-size: 0.78rem;
        font-weight: 600;
        white-space: nowrap;
    }

    .status-badge.pending[b-1h9c76olvz] { background: #fef3c7; color: #92400e; }
    .status-badge.in-progress[b-1h9c76olvz] { background: #dbeafe; color: #1d4ed8; }
    .status-badge.completed[b-1h9c76olvz] { background: #dcfce7; color: #166534; }
    .status-badge.approved[b-1h9c76olvz] { background: #e0f2fe; color: #0369a1; }

    .type-label[b-1h9c76olvz] {
        background: #f3f4f6;
        color: #374151;
        padding: 3px 8px;
        border-radius: 4px;
        font-size: 0.8rem;
    }

    .urgency-badge[b-1h9c76olvz] {
        padding: 3px 8px;
        border-radius: 4px;
        font-size: 0.78rem;
        font-weight: 600;
    }

    .urgency-badge.urgent[b-1h9c76olvz] { background: #fee2e2; color: #991b1b; }
    .urgency-badge.high[b-1h9c76olvz] { background: #fed7aa; color: #9a3412; }
    .urgency-badge.normal[b-1h9c76olvz] { background: #dbeafe; color: #1d4ed8; }
    .urgency-badge.low[b-1h9c76olvz] { background: #f3f4f6; color: #6b7280; }

    .assigned-user[b-1h9c76olvz] {
        font-size: 0.82rem;
        color: #374151;
        display: flex;
        align-items: center;
        gap: 4px;
    }

    .cell-actions[b-1h9c76olvz] {
        display: flex;
        gap: 6px;
        white-space: nowrap;
    }

    .btn-action[b-1h9c76olvz] {
        padding: 6px 12px;
        border: none;
        border-radius: 6px;
        font-size: 0.82rem;
        font-weight: 600;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        gap: 4px;
        transition: all 0.15s;
    }

    .btn-action.manage[b-1h9c76olvz] { background: #dbeafe; color: #1d4ed8; }
    .btn-action.manage:hover[b-1h9c76olvz] { background: #bfdbfe; }
    .btn-action.delete[b-1h9c76olvz] { background: #fee2e2; color: #991b1b; }
    .btn-action.delete:hover[b-1h9c76olvz] { background: #fecaca; }

    .no-data[b-1h9c76olvz] {
        text-align: center;
        padding: 48px;
        color: #9ca3af;
        font-size: 1rem;
    }

    .no-data i[b-1h9c76olvz] { font-size: 2rem; display: block; margin-bottom: 12px; }

    .loading-state[b-1h9c76olvz] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        padding: 48px;
        color: #64748b;
    }

    /* Pagination */
    .pagination-bar[b-1h9c76olvz] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 16px 20px;
        border-top: 1px solid #f1f5f9;
        background: #fafafa;
    }

    .page-info[b-1h9c76olvz] { font-size: 0.85rem; color: #64748b; }

    .page-buttons[b-1h9c76olvz] { display: flex; gap: 4px; }

    .page-btn[b-1h9c76olvz] {
        width: 34px;
        height: 34px;
        border: 1px solid #e2e8f0;
        background: white;
        border-radius: 6px;
        cursor: pointer;
        font-size: 0.9rem;
        color: #374151;
        transition: all 0.15s;
    }

    .page-btn:hover:not(:disabled)[b-1h9c76olvz] { background: #f1f5f9; }
    .page-btn.active[b-1h9c76olvz] { background: linear-gradient(135deg, #015974, #9D6023); border-color: transparent; color: white; border-color: #015974; font-weight: 700; }
    .page-btn:disabled[b-1h9c76olvz] { opacity: 0.4; cursor: not-allowed; }

    /* Modals */
    .modal-overlay[b-1h9c76olvz] {
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.5);
        z-index: 1000;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 16px;
    }

    .modal-panel[b-1h9c76olvz] {
        background: white;
        border-radius: 16px;
        box-shadow: 0 20px 60px rgba(0,0,0,0.2);
        display: flex;
        flex-direction: column;
        max-height: 90vh;
        overflow: hidden;
    }

    .modal-manage[b-1h9c76olvz] { width: 100%; max-width: 900px; }
    .modal-create[b-1h9c76olvz] { width: 100%; max-width: 760px; }

    .modal-header-qa[b-1h9c76olvz] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 20px 24px;
        border-bottom: 1px solid #e2e8f0;
        background: linear-gradient(190deg, #015974, #9D6023);
        color: white;
    }

    .modal-header-qa h3[b-1h9c76olvz] { margin: 0; font-size: 1.1rem; color: white; }

    .btn-close-modal[b-1h9c76olvz] {
        background: rgba(255,255,255,0.15);
        border: none;
        color: white;
        width: 32px;
        height: 32px;
        border-radius: 50%;
        font-size: 1.2rem;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
    }

    .modal-body-qa[b-1h9c76olvz] {
        padding: 24px;
        overflow-y: auto;
        flex: 1;
    }

    .modal-footer-qa[b-1h9c76olvz] {
        padding: 16px 24px;
        border-top: 1px solid #e2e8f0;
        display: flex;
        gap: 10px;
        justify-content: flex-end;
        background: #f8fafc;
    }

    .btn-save[b-1h9c76olvz] {
        background: #015974;
        color: white;
        border: none;
        padding: 10px 24px;
        border-radius: 8px;
        font-weight: 600;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 6px;
        transition: background 0.2s;
    }

    .btn-save:hover[b-1h9c76olvz] { background: #014a62; }
    .btn-save:disabled[b-1h9c76olvz] { opacity: 0.6; cursor: not-allowed; }

    .btn-cancel[b-1h9c76olvz] {
        background: #f1f5f9;
        color: #64748b;
        border: 1px solid #e2e8f0;
        padding: 10px 24px;
        border-radius: 8px;
        font-weight: 600;
        cursor: pointer;
    }

    /* Manage Grid */
    .manage-grid[b-1h9c76olvz] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 24px;
    }

    .customer-info-section[b-1h9c76olvz] { grid-column: span 2; }

    .manage-section[b-1h9c76olvz] {
        background: #f8fafc;
        border-radius: 10px;
        padding: 16px;
        border: 1px solid #e2e8f0;
    }

    .section-title[b-1h9c76olvz] {
        font-size: 0.85rem;
        font-weight: 700;
        color: #374151;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        margin-bottom: 14px;
        display: flex;
        align-items: center;
        gap: 6px;
    }

    .form-row-qa[b-1h9c76olvz] {
        margin-bottom: 14px;
        display: flex;
        flex-direction: column;
        gap: 5px;
    }

    .form-row-qa label[b-1h9c76olvz] {
        font-size: 0.8rem;
        font-weight: 600;
        color: #64748b;
    }

    .form-input[b-1h9c76olvz] {
        width: 100%;
        padding: 8px 12px;
        border: 1px solid #e2e8f0;
        border-radius: 6px;
        font-size: 0.9rem;
        background: white;
        box-sizing: border-box;
        outline: none;
        transition: border 0.2s;
    }

    .form-input:focus[b-1h9c76olvz] { border-color: #015974; }

    .check-row[b-1h9c76olvz] {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 0.9rem;
    }

    .info-row[b-1h9c76olvz] {
        display: flex;
        gap: 8px;
        padding: 8px 0;
        border-bottom: 1px solid #e2e8f0;
        font-size: 0.9rem;
    }

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

    .info-label[b-1h9c76olvz] { font-weight: 600; color: #64748b; min-width: 80px; }

    /* Create grid */
    .create-grid[b-1h9c76olvz] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 14px;
    }

    .form-row-qa.full-width[b-1h9c76olvz] { grid-column: span 2; }

    .required[b-1h9c76olvz] { color: #ef4444; }

    .chip-grid[b-1h9c76olvz] {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        padding: 10px;
        background: white;
        border: 1px solid #e2e8f0;
        border-radius: 6px;
    }

    .chip[b-1h9c76olvz] {
        padding: 6px 12px;
        border-radius: 20px;
        background: #f1f5f9;
        color: #374151;
        cursor: pointer;
        font-size: 0.82rem;
        font-weight: 600;
        display: flex;
        align-items: center;
        gap: 6px;
        border: 2px solid transparent;
        transition: all 0.15s;
    }

    .chip input[type="checkbox"][b-1h9c76olvz] { display: none; }
    .chip-selected[b-1h9c76olvz] { background: #dbeafe; color: #1d4ed8; border-color: #3b82f6; }
    .chip-cost[b-1h9c76olvz] { font-size: 0.75rem; color: #6b7280; }
    .chip-selected .chip-cost[b-1h9c76olvz] { color: #3b82f6; }

    .checklist-grid[b-1h9c76olvz] {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        gap: 8px;
        padding: 10px;
        background: white;
        border: 1px solid #e2e8f0;
        border-radius: 6px;
        max-height: 180px;
        overflow-y: auto;
    }

    .check-item[b-1h9c76olvz] {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 0.85rem;
        cursor: pointer;
        padding: 4px 8px;
        border-radius: 4px;
        transition: background 0.15s;
    }

    .check-item:hover[b-1h9c76olvz] { background: #f1f5f9; }

    .alert-error[b-1h9c76olvz] {
        background: #fee2e2;
        color: #991b1b;
        padding: 10px 14px;
        border-radius: 6px;
        margin-bottom: 16px;
        font-size: 0.9rem;
        border-left: 4px solid #ef4444;
    }

    .spinner[b-1h9c76olvz] {
        width: 20px;
        height: 20px;
        border: 2px solid #e2e8f0;
        border-top-color: #015974;
        border-radius: 50%;
        animation: spin-b-1h9c76olvz 0.7s linear infinite;
        display: inline-block;
    }

    .spinner-sm[b-1h9c76olvz] {
        width: 14px;
        height: 14px;
        border: 2px solid rgba(255,255,255,0.4);
        border-top-color: white;
        border-radius: 50%;
        animation: spin-b-1h9c76olvz 0.7s linear infinite;
        display: inline-block;
    }

    @keyframes spin-b-1h9c76olvz { to { transform: rotate(360deg); } }

    @media (max-width: 991.98px) {
        .qa-container[b-1h9c76olvz] { padding: 14px; }
        .qa-header[b-1h9c76olvz] { padding: 16px 18px; flex-wrap: wrap; gap: 12px; }
        .qa-header h2[b-1h9c76olvz] { font-size: 1.2rem; }
        .qa-header-right[b-1h9c76olvz] { flex-wrap: wrap; }
        .stats-row[b-1h9c76olvz] { grid-template-columns: repeat(3, 1fr); }
    }

    @media (max-width: 768px) {
        .qa-container[b-1h9c76olvz] { padding: 10px; }
        .stats-row[b-1h9c76olvz] { grid-template-columns: repeat(2, 1fr); gap: 10px; }
        .stat-card[b-1h9c76olvz] { padding: 14px; gap: 10px; }
        .stat-icon[b-1h9c76olvz] { width: 40px; height: 40px; font-size: 1.05rem; }
        .stat-number[b-1h9c76olvz] { font-size: 1.4rem; }
        .stat-label[b-1h9c76olvz] { font-size: 0.78rem; }
        .manage-grid[b-1h9c76olvz] { grid-template-columns: 1fr; gap: 14px; }
        .customer-info-section[b-1h9c76olvz] { grid-column: span 1; }
        .create-grid[b-1h9c76olvz] { grid-template-columns: 1fr; }
        .form-row-qa.full-width[b-1h9c76olvz] { grid-column: span 1; }
        .filter-item[b-1h9c76olvz], .filter-item.search-item[b-1h9c76olvz] { min-width: 100%; }
        .pagination-bar[b-1h9c76olvz] { flex-direction: column; gap: 10px; padding: 12px; }
        .modal-overlay[b-1h9c76olvz] { padding: 8px; }
        .modal-header-qa[b-1h9c76olvz] { padding: 14px 16px; }
        .modal-header-qa h3[b-1h9c76olvz] { font-size: 0.95rem; }
        .modal-body-qa[b-1h9c76olvz] { padding: 14px; }
        .modal-footer-qa[b-1h9c76olvz] { padding: 12px 14px; flex-wrap: wrap; }
        .modal-footer-qa .btn-save[b-1h9c76olvz],
        .modal-footer-qa .btn-cancel[b-1h9c76olvz] { flex: 1; justify-content: center; padding: 10px 14px; }
        .btn-create[b-1h9c76olvz], .btn-refresh[b-1h9c76olvz] { padding: 8px 14px; font-size: 0.85rem; }
    }

    @media (max-width: 480px) {
        .stats-row[b-1h9c76olvz] { grid-template-columns: 1fr; }
        .qa-header h2[b-1h9c76olvz] { font-size: 1.05rem; }
        .qa-header-right .btn-create span[b-1h9c76olvz],
        .qa-header-right .btn-refresh span[b-1h9c76olvz] { display: none; }
    }
/* /Pages/AdminDashboard/ModellerPermission.razor.rz.scp.css */
.container[b-z25jd9d53z] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1200px;
    margin: 0 auto;
    border-radius: 20px;
}

.header-section[b-z25jd9d53z] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

    .header-section h2[b-z25jd9d53z] {
        margin: 0;
        color: #fff;
        font-size: 1.8em;
        font-weight: 600;
    }

.add-btn[b-z25jd9d53z] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .add-btn:hover[b-z25jd9d53z] {
        background: #f0f9fc;
    }

.table-section[b-z25jd9d53z] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

table[b-z25jd9d53z] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

th[b-z25jd9d53z], td[b-z25jd9d53z] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-z25jd9d53z] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-z25jd9d53z] {
    color: #34495e;
}

.action-btn[b-z25jd9d53z] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-z25jd9d53z] {
    background-color: #28a745;
    color: white;
}

    .edit-btn:hover[b-z25jd9d53z] {
        background-color: #218838;
    }

.delete-btn[b-z25jd9d53z] {
    background-color: #dc3545;
    color: white;
}

    .delete-btn:hover[b-z25jd9d53z] {
        background-color: #c82333;
    }

.modal[b-z25jd9d53z] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-z25jd9d53z] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 400px;
    max-width: 90%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

    .modal-content h3[b-z25jd9d53z] {
        margin-top: 0;
        color: #015974;
        border-bottom: 2px solid #e9ecef;
        padding-bottom: 10px;
        margin-bottom: 20px;
        font-size: 1.6em;
        font-weight: 600;
    }

.form-group[b-z25jd9d53z] {
    margin-bottom: 20px;
}

    .form-group label[b-z25jd9d53z] {
        display: block;
        margin-bottom: 8px;
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

    .form-group input[b-z25jd9d53z],
    .form-group select[b-z25jd9d53z] {
        width: 100%;
        padding: 12px;
        border: 1px solid #ced4da;
        border-radius: 6px;
        box-sizing: border-box;
        font-size: 1em;
        transition: border-color 0.3s ease;
    }

        .form-group input:focus[b-z25jd9d53z],
        .form-group select:focus[b-z25jd9d53z] {
            border-color: #015974;
            outline: none;
            box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
        }

.button-group[b-z25jd9d53z] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-z25jd9d53z] {
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .save-btn.primary[b-z25jd9d53z] {
        background-color: #015974;
        color: white;
    }

    .save-btn:hover[b-z25jd9d53z] {
        background-color: #dfe3e8;
    }

    .save-btn.primary:hover[b-z25jd9d53z] {
        background-color: #024d62;
    }

.close-btn[b-z25jd9d53z] {
    display: block;
    margin-top: 20px;
    padding: 12px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    width: 100%;
    text-align: center;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .close-btn:hover[b-z25jd9d53z] {
        background-color: #dfe3e8;
    }

.text-center[b-z25jd9d53z] {
    text-align: center;
}
/* /Pages/AdminDashboard/PaymentInvoice.razor.rz.scp.css */
.container[b-wooqbu395x] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1500px;
    width: 100%;
    box-sizing: border-box;
    /* Adjusted to match ProjectType layout */
    margin: 0 auto;
    border-radius: 20px;
}

.header-section[b-wooqbu395x] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.header-section h2[b-wooqbu395x] {
    margin: 0;
    color: #fff;
    font-size: 1.8em;
    font-weight: 600;
}

.add-btn[b-wooqbu395x] {
    background: #fff;
    color: #015974;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.add-btn:hover[b-wooqbu395x] {
    background: #f0f9fc;
}

.search-bar[b-wooqbu395x] {
    display: flex;
    margin-bottom: 20px;
}

.search-bar input[b-wooqbu395x] {
    flex: 1;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 6px 0 0 6px;
    font-size: 1em;
    transition: border-color 0.3s ease;
}

.search-bar input:focus[b-wooqbu395x] {
    border-color: #015974;
    outline: none;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.search-bar button[b-wooqbu395x] {
    padding: 12px 20px;
    background-color: #015974;
    color: white;
    border: none;
    border-radius: 0 6px 6px 0;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.search-bar button:hover[b-wooqbu395x] {
    background-color: #024d62;
}

.table-section[b-wooqbu395x] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    overflow-x: auto;
    max-width: 100%;
}

table[b-wooqbu395x] {
    width: 100%;
    border-collapse: collapse;
}

th[b-wooqbu395x],
td[b-wooqbu395x] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-wooqbu395x] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-wooqbu395x] {
    color: #34495e;
}

.text-center[b-wooqbu395x] {
    text-align: center;
}

.status-dot[b-wooqbu395x] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 5px;
    vertical-align: middle;
}

.status-dot.active[b-wooqbu395x] {
    background-color: #28a745;
}

.status-dot.inactive[b-wooqbu395x] {
    background-color: #dc3545;
}

.action-btn[b-wooqbu395x] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-wooqbu395x] {
    background-color: #28a745;
    color: white;
}

.edit-btn:hover[b-wooqbu395x] {
    background-color: #218838;
}

.delete-btn[b-wooqbu395x] {
    background-color: #dc3545;
    color: white;
}

.delete-btn:hover[b-wooqbu395x] {
    background-color: #c82333;
}

.table-footer[b-wooqbu395x] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

/* Pagination Controls */
.pagination-section[b-wooqbu395x] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px;
    border-top: 1px solid #e9ecef;
    margin-top: 10px;
    background-color: #f8f9fa;
    border-radius: 0 0 8px 8px;
}

.page-info[b-wooqbu395x] {
    font-size: 0.9em;
    color: #495057;
    font-weight: 500;
}

.pagination-buttons[b-wooqbu395x] {
    display: flex;
    gap: 5px;
}

.pagination-buttons .btn[b-wooqbu395x] {
    min-width: 32px;
    height: 32px;
    padding: 0 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #dee2e6;
    background-color: #fff;
    color: #333;
    cursor: pointer;
    border-radius: 4px;
    transition: all 0.2s ease;
    font-weight: 500;
}

.pagination-buttons .btn:hover:not(:disabled)[b-wooqbu395x] {
    background-color: #e9ecef;
    border-color: #adb5bd;
    color: #000;
}

.pagination-buttons .btn-primary[b-wooqbu395x] {
    background-color: #015974;
    color: white !important;
    border-color: #015974;
}

.pagination-buttons .btn-primary:hover[b-wooqbu395x] {
    background-color: #024d62;
    border-color: #024d62;
}

.pagination-buttons .btn:disabled[b-wooqbu395x] {
    cursor: not-allowed;
    opacity: 0.5;
    background-color: #f8f9fa;
    color: #aaa;
}

.modal[b-wooqbu395x] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-wooqbu395x] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 500px;
    max-width: 90%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
    position: relative;
}

.modal-content h3[b-wooqbu395x] {
    margin-top: 0;
    color: #015974;
    border-bottom: 2px solid #e9ecef;
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-size: 1.6em;
    font-weight: 600;
}

.form-group[b-wooqbu395x] {
    margin-bottom: 20px;
}

.form-group label[b-wooqbu395x] {
    display: block;
    margin-bottom: 8px;
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.form-group input[b-wooqbu395x],
.form-group select[b-wooqbu395x] {
    width: 100%;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    box-sizing: border-box;
    font-size: 1em;
    transition: border-color 0.3s ease;
}

.form-group input:focus[b-wooqbu395x],
.form-group select:focus[b-wooqbu395x] {
    border-color: #015974;
    outline: none;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.checkbox-group[b-wooqbu395x] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-wooqbu395x] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

.checkbox-label input[type="checkbox"][b-wooqbu395x] {
    margin-right: 12px;
    margin-bottom: 0;
    vertical-align: middle;
    height: 20px;
    width: 20px;
}

.checkbox-label span[b-wooqbu395x] {
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.button-group[b-wooqbu395x] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-wooqbu395x] {
    padding: 12px 12px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.save-btn.primary[b-wooqbu395x] {
    background-color: #015974;
    color: white;
}

.save-btn:hover[b-wooqbu395x] {
    background-color: #dfe3e8;
}

.save-btn.primary:hover[b-wooqbu395x] {
    background-color: #024d62;
}

.close-btn[b-wooqbu395x] {
    padding: 12px 25px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.close-btn:hover[b-wooqbu395x] {
    background-color: #dfe3e8;
}

/* Invoice status badges */
.invoice-status-badge[b-wooqbu395x] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 0.82em;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.status-draft[b-wooqbu395x] {
    background-color: #e9ecef;
    color: #495057;
}

.status-finalised[b-wooqbu395x] {
    background-color: #d4edda;
    color: #155724;
}

.status-rejected[b-wooqbu395x] {
    background-color: #f8d7da;
    color: #721c24;
}

/* Finalise button */
.finalise-btn[b-wooqbu395x] {
    background-color: #015974;
    color: white;
}

.finalise-btn:hover[b-wooqbu395x] {
    background-color: #014a60;
}

/* Reject button */
.reject-btn[b-wooqbu395x] {
    background-color: #fd7e14;
    color: white;
}

.reject-btn:hover[b-wooqbu395x] {
    background-color: #e8680c;
}

.reject-btn-primary[b-wooqbu395x] {
    padding: 12px 20px;
    background-color: #dc3545;
    color: white;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
    transition: background-color 0.3s ease;
}

.reject-btn-primary:hover:not(:disabled)[b-wooqbu395x] {
    background-color: #c82333;
}

.reject-btn-primary:disabled[b-wooqbu395x] {
    opacity: 0.6;
    cursor: not-allowed;
}

.rejection-reason-preview[b-wooqbu395x] {
    color: #721c24;
    margin-top: 3px;
    font-size: 0.82em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 220px;
}
/* /Pages/AdminDashboard/PermissionsManagement.razor.rz.scp.css */
.container[b-95b6iusj7e] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

.header-section[b-95b6iusj7e] {
    background: linear-gradient(190deg, #015974, #9D6023);
    color: white;
    padding: 25px 30px;
    border-radius: 12px;
    margin-bottom: 25px;
    box-shadow: 0 4px 15px rgba(1, 89, 116, 0.3);
}

.header-section h2[b-95b6iusj7e] {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1.5rem;
}

.header-section .subtitle[b-95b6iusj7e] {
    margin: 8px 0 0 0;
    opacity: 0.9;
    font-size: 0.95rem;
}

.loading[b-95b6iusj7e] {
    text-align: center;
    padding: 40px;
    color: #015974;
    font-size: 1.1rem;
}

.error-message[b-95b6iusj7e] {
    background: #fee2e2;
    color: #dc2626;
    padding: 15px 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.success-message[b-95b6iusj7e] {
    background: #d1fae5;
    color: #059669;
    padding: 15px 20px;
    border-radius: 8px;
    margin-top: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.info-message[b-95b6iusj7e] {
    background: #cceaf2;
    color: #015974;
    padding: 15px 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.role-selector[b-95b6iusj7e] {
    margin-bottom: 25px;
    display: flex;
    align-items: center;
    gap: 15px;
}

.role-selector label[b-95b6iusj7e] {
    font-weight: 600;
    color: #374151;
}

.role-selector select[b-95b6iusj7e] {
    padding: 10px 15px;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    font-size: 1rem;
    min-width: 250px;
    cursor: pointer;
    transition: border-color 0.2s;
}

.role-selector select:focus[b-95b6iusj7e] {
    outline: none;
    border-color: #015974;
}

.permissions-table-container[b-95b6iusj7e] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    padding: 20px;
}

.permissions-table[b-95b6iusj7e] {
    width: 100%;
    border-collapse: collapse;
}

.permissions-table thead th[b-95b6iusj7e] {
    background: #015974;
    color: white;
    padding: 12px 15px;
    text-align: center;
    font-weight: 600;
    border-bottom: 2px solid #e2e8f0;
}

.permissions-table thead th:first-child[b-95b6iusj7e] {
    border-radius: 8px 0 0 0;
}

.permissions-table thead th:last-child[b-95b6iusj7e] {
    border-radius: 0 8px 0 0;
}

.permissions-table thead th.module-col[b-95b6iusj7e] {
    text-align: left;
    width: 40%;
}

.permissions-table thead th.check-col[b-95b6iusj7e] {
    width: 12%;
}

.permissions-table tbody tr[b-95b6iusj7e] {
    border-bottom: 1px solid #f1f5f9;
    transition: background-color 0.15s;
}

.permissions-table tbody tr:hover[b-95b6iusj7e] {
    background: #fff7ed;
}

.permissions-table tbody td[b-95b6iusj7e] {
    padding: 12px 15px;
}

.permissions-table .module-name[b-95b6iusj7e] {
    color: #1e293b;
}

.permissions-table .check-cell[b-95b6iusj7e] {
    text-align: center;
}

.permissions-table .check-cell input[type="checkbox"][b-95b6iusj7e] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: #015974;
}

.permissions-table .check-cell input[type="checkbox"]:disabled[b-95b6iusj7e] {
    cursor: not-allowed;
    opacity: 0.5;
}

.actions-row[b-95b6iusj7e] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #e2e8f0;
    flex-wrap: wrap;
}

.actions-row button[b-95b6iusj7e] {
    padding: 10px 20px;
    border: none;
    border-radius: 8px;
    font-size: 0.95rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s;
}

.btn-check-all[b-95b6iusj7e] {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: white;
}

.btn-check-all:hover[b-95b6iusj7e] {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.4);
}

.btn-select-all[b-95b6iusj7e] {
    background: #e0e7ff;
    color: #4f46e5;
}

.btn-select-all:hover[b-95b6iusj7e] {
    background: #c7d2fe;
}

.btn-clear-all[b-95b6iusj7e] {
    background: #fee2e2;
    color: #dc2626;
}

.btn-clear-all:hover[b-95b6iusj7e] {
    background: #fecaca;
}

.btn-save[b-95b6iusj7e] {
    background: linear-gradient(190deg, #015974, #9D6023);
    color: white;
    font-weight: 600;
}

.btn-save:hover[b-95b6iusj7e] {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.4);
}

.btn-save:disabled[b-95b6iusj7e] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}
/* /Pages/AdminDashboard/Project.razor.rz.scp.css */
.container[b-3ahoddy4p5] {
    padding: 24px;
    background-color: #f8f9fa;
    font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
    max-width: 1400px;
    width: 100%;
    margin: 0 auto;
}

/* Header Section */
.header-section[b-3ahoddy4p5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 24px;
    padding: 20px 26px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.25);
    color: #fff;
}

.header-section h2[b-3ahoddy4p5] {
    margin: 0;
    color: #fff;
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: -0.025em;
}

.actions-group[b-3ahoddy4p5] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Add Button */
.add-btn[b-3ahoddy4p5] {
    background: #fff;
    color: #015974;
    padding: 8px 18px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 700;
    transition: all 0.2s ease;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12);
    letter-spacing: 0.3px;
}

.add-btn:hover[b-3ahoddy4p5] {
    background: #f0f9fc;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

.add-btn:active[b-3ahoddy4p5] {
    transform: translateY(0);
}

/* Table Section */
.table-section[b-3ahoddy4p5] {
    background-color: #ffffff;
    border-radius: 12px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03);
    overflow: hidden;
}

.table-wrapper[b-3ahoddy4p5] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

table[b-3ahoddy4p5] {
    width: 100%;
    min-width: 1100px;
    border-collapse: collapse;
    white-space: nowrap;
}

th[b-3ahoddy4p5] {
    background-color: #f9fafb;
    color: #4b5563;
    font-weight: 600;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 12px 14px;
    border-bottom: 2px solid #e5e7eb;
    text-align: left;
    white-space: nowrap;
}

td[b-3ahoddy4p5] {
    padding: 11px 14px;
    color: #374151;
    font-size: 0.825rem;
    border-bottom: 1px solid #f3f4f6;
    vertical-align: middle;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
}

tr:last-child td[b-3ahoddy4p5] {
    border-bottom: none;
}

tr:hover td[b-3ahoddy4p5] {
    background-color: #f9fafb;
}

/* Keep Actions column always fully visible */
td:last-child[b-3ahoddy4p5],
th:last-child[b-3ahoddy4p5] {
    white-space: nowrap;
    max-width: none;
}

/* Action Buttons */
.btn.btn-success[b-3ahoddy4p5] {
    background-color: #22c55e;
    color: #fff;
    border: none;
    padding: 5px 12px;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    margin-right: 4px;
    transition: background-color 0.15s ease;
    white-space: nowrap;
}

.btn.btn-success:hover[b-3ahoddy4p5] {
    background-color: #16a34a;
}

.btn.btn-info[b-3ahoddy4p5] {
    background-color: #0284a0;
    color: #fff;
    border: none;
    padding: 5px 12px;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    margin-right: 4px;
    transition: background-color 0.15s ease;
    white-space: nowrap;
    text-decoration: none;
    display: inline-block;
    line-height: normal;
}

.btn.btn-info:hover[b-3ahoddy4p5] {
    background-color: #017a9a;
    color: #fff;
}

.btn.btn-danger[b-3ahoddy4p5] {
    background-color: #ef4444;
    color: #fff;
    border: none;
    padding: 5px 12px;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.15s ease;
    white-space: nowrap;
}

.btn.btn-danger:hover[b-3ahoddy4p5] {
    background-color: #dc2626;
}

/* Pagination */
.pagination-section[b-3ahoddy4p5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    background-color: #ffffff;
    border-top: 1px solid #e5e7eb;
}

.page-info[b-3ahoddy4p5] {
    color: #6b7280;
    font-size: 0.875rem;
}

.pagination-buttons[b-3ahoddy4p5] {
    display: flex;
    gap: 4px;
    align-items: center;
}

.pagination-buttons .page-btn[b-3ahoddy4p5] {
    min-width: 34px;
    height: 34px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d1d5db;
    background-color: #fff;
    border-radius: 6px;
    color: #374151;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
    user-select: none;
}

.pagination-buttons .page-btn:hover:not(:disabled)[b-3ahoddy4p5] {
    border-color: #9ca3af;
    background-color: #f3f4f6;
    color: #111827;
}

.pagination-buttons .page-btn.active[b-3ahoddy4p5] {
    background: linear-gradient(135deg, #015974, #9D6023);
    border-color: transparent;
    color: #fff;
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(1, 89, 116, 0.35);
}

.pagination-buttons .page-btn.active:hover[b-3ahoddy4p5] {
    opacity: 0.92;
}

.pagination-buttons .page-btn:disabled[b-3ahoddy4p5] {
    cursor: not-allowed;
    opacity: 0.4;
    background-color: #f9fafb;
    color: #9ca3af;
    border-color: #e5e7eb;
}

.table-footer[b-3ahoddy4p5] {
    padding: 16px 24px;
    color: #6b7280;
    font-size: 0.875rem;
    background-color: #ffffff;
    border-top: 1px solid #e5e7eb;
}

/* ── Toast Notification ── */
.toast-notification[b-3ahoddy4p5] {
    position: fixed;
    top: 24px;
    right: 24px;
    z-index: 9999;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 20px;
    border-radius: 10px;
    font-size: 0.9rem;
    font-weight: 500;
    box-shadow: 0 8px 24px rgba(0,0,0,0.14);
    animation: toastSlideIn-b-3ahoddy4p5 0.3s cubic-bezier(0.34,1.56,0.64,1);
    min-width: 280px;
    max-width: 420px;
}

.toast-success[b-3ahoddy4p5] {
    background-color: #ecfdf5;
    border: 1px solid #6ee7b7;
    color: #065f46;
}

.toast-error[b-3ahoddy4p5] {
    background-color: #fef2f2;
    border: 1px solid #fca5a5;
    color: #7f1d1d;
}

.toast-icon[b-3ahoddy4p5] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: 700;
    flex-shrink: 0;
}

.toast-success .toast-icon[b-3ahoddy4p5] {
    background-color: #10b981;
    color: #fff;
}

.toast-error .toast-icon[b-3ahoddy4p5] {
    background-color: #ef4444;
    color: #fff;
}

.toast-text[b-3ahoddy4p5] {
    flex: 1;
    line-height: 1.4;
}

@keyframes toastSlideIn-b-3ahoddy4p5 {
    from { opacity: 0; transform: translateX(60px) scale(0.95); }
    to   { opacity: 1; transform: translateX(0) scale(1); }
}

/* Modal */
.modal[b-3ahoddy4p5] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(17, 24, 39, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 50;
    animation: fadeIn-b-3ahoddy4p5 0.2s ease-out;
}

.modal-content[b-3ahoddy4p5] {
    background-color: #ffffff;
    padding: 0;
    border-radius: 16px;
    width: 920px;
    max-width: 95%;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 40px -8px rgba(0, 0, 0, 0.18), 0 4px 12px rgba(0,0,0,0.06);
    animation: slideUp-b-3ahoddy4p5 0.3s ease-out;
    border: 1px solid #e5e7eb;
}

/* ── Modal Header Accent ── */
.modal-header-accent[b-3ahoddy4p5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 24px 28px 20px;
    border-bottom: 1px solid #e5e7eb;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 16px 16px 0 0;
    position: sticky;
    top: 0;
    z-index: 10;
}

.modal-title-block[b-3ahoddy4p5] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.modal-icon[b-3ahoddy4p5] {
    width: 44px;
    height: 44px;
    background: rgba(255,255,255,0.2);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.3rem;
    font-weight: 700;
    flex-shrink: 0;
}

.modal-title[b-3ahoddy4p5] {
    margin: 0;
    color: #fff;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.modal-subtitle[b-3ahoddy4p5] {
    margin: 2px 0 0;
    color: rgba(255,255,255,0.75);
    font-size: 0.8rem;
}

.modal-close-x[b-3ahoddy4p5] {
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: 8px;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #fff;
    font-size: 0.9rem;
    transition: all 0.15s;
    flex-shrink: 0;
}

.modal-close-x:hover[b-3ahoddy4p5] {
    background: rgba(255,255,255,0.3);
    border-color: rgba(255,255,255,0.5);
}

/* Form body padding */
.form-grid[b-3ahoddy4p5] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 24px 28px;
}

/* ── Section Headers ── */
.form-section-header[b-3ahoddy4p5] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #374151;
    padding: 6px 0 6px 10px;
    border-left: 3px solid #015974;
    background: #f0f9fc;
    border-radius: 0 6px 6px 0;
    margin-top: 4px;
}

.section-icon[b-3ahoddy4p5] {
    font-size: 1rem;
}

.section-field-error[b-3ahoddy4p5] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #dc2626;
    background: #fef2f2;
    border-radius: 4px;
    padding: 1px 8px;
    margin-left: auto;
    text-transform: none;
    letter-spacing: 0;
}

/* ── Validation Summary ── */
.validation-summary[b-3ahoddy4p5] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 0 28px;
    padding: 14px 16px;
    background: #fef2f2;
    border: 1px solid #fca5a5;
    border-radius: 10px;
    color: #7f1d1d;
    font-size: 0.875rem;
    animation: fadeIn-b-3ahoddy4p5 0.2s ease-out;
    margin-top: 16px;
}

.validation-summary-icon[b-3ahoddy4p5] {
    font-size: 1.2rem;
    flex-shrink: 0;
    margin-top: 1px;
}

.validation-summary ul[b-3ahoddy4p5] {
    margin: 4px 0 0 0;
    padding-left: 18px;
}

.validation-summary li[b-3ahoddy4p5] {
    margin-bottom: 2px;
}

.validation-summary strong[b-3ahoddy4p5] {
    display: block;
    color: #991b1b;
    margin-bottom: 2px;
}

/* ── Field-level errors ── */
.field-error-msg[b-3ahoddy4p5] {
    font-size: 0.775rem;
    color: #dc2626;
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: -4px;
}

.field-error-msg[b-3ahoddy4p5]::before {
    content: '⚠';
    font-size: 0.75rem;
}

input.input-error[b-3ahoddy4p5],
select.input-error[b-3ahoddy4p5] {
    border-color: #f87171 !important;
    background-color: #fff5f5 !important;
    box-shadow: 0 0 0 3px rgba(239,68,68,0.1) !important;
}

.chip-grid-error[b-3ahoddy4p5] {
    border-color: #f87171 !important;
    background-color: #fff5f5 !important;
}

.checklist-error[b-3ahoddy4p5] {
    border-color: #f87171 !important;
    background-color: #fff5f5 !important;
}

/* Required star */
.required-star[b-3ahoddy4p5] {
    color: #ef4444;
    font-weight: 700;
    margin-left: 2px;
}

/* ── Cost Summary Card ── */
.cost-summary-card[b-3ahoddy4p5] {
    background: linear-gradient(135deg, #e0f2fe 0%, #cceaf2 100%);
    border: 1px solid #7dd3dc;
    border-radius: 10px;
    padding: 16px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.cost-breakdown[b-3ahoddy4p5] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.cost-item[b-3ahoddy4p5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 0.85rem;
    font-weight: 600;
    color: #015974;
}

.cost-label[b-3ahoddy4p5] {
    font-size: 0.68rem;
    font-weight: 500;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.cost-sep[b-3ahoddy4p5] {
    color: #7dd3dc;
    font-size: 0.9rem;
    font-weight: 600;
    padding: 0 2px;
}

.cost-total[b-3ahoddy4p5] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.cost-total-label[b-3ahoddy4p5] {
    font-size: 0.68rem;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 500;
}

.cost-total-value[b-3ahoddy4p5] {
    font-size: 1.4rem;
    font-weight: 800;
    color: #015974;
    letter-spacing: -0.03em;
}

/* ── Approval Toggle ── */
.approval-check-group[b-3ahoddy4p5] {
    justify-content: center;
}

.approval-toggle[b-3ahoddy4p5] {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    padding: 12px 0;
}

.approval-toggle input[type="checkbox"][b-3ahoddy4p5] {
    display: none;
}

.approval-toggle-track[b-3ahoddy4p5] {
    width: 42px;
    height: 24px;
    border-radius: 12px;
    background: #d1d5db;
    position: relative;
    transition: background 0.2s;
    flex-shrink: 0;
}

.approval-toggle-track[b-3ahoddy4p5]::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: white;
    transition: transform 0.2s;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}

.approval-toggle input[type="checkbox"]:checked ~ .approval-toggle-track[b-3ahoddy4p5] {
    background: #22c55e;
}

.approval-toggle input[type="checkbox"]:checked ~ .approval-toggle-track[b-3ahoddy4p5]::after {
    transform: translateX(18px);
}

.approval-toggle-label[b-3ahoddy4p5] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
    user-select: none;
}

/* ── File Upload Zone ── */
.file-upload-zone[b-3ahoddy4p5] {
    border: 2px dashed #d1d5db;
    border-radius: 10px;
    padding: 20px;
    text-align: center;
    background: #f9fafb;
    transition: border-color 0.2s, background 0.2s;
    cursor: pointer;
    position: relative;
}

.file-upload-zone:hover[b-3ahoddy4p5] {
    border-color: #7dd3dc;
    background: #e0f2fe;
}

.file-input[b-3ahoddy4p5] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

.file-upload-hint[b-3ahoddy4p5] {
    color: #6b7280;
    font-size: 0.85rem;
}

.file-list[b-3ahoddy4p5] {
    margin-top: 12px;
}

.file-list-title[b-3ahoddy4p5] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 6px;
}

.file-list-item[b-3ahoddy4p5] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    margin-bottom: 6px;
    font-size: 0.85rem;
}

.file-icon[b-3ahoddy4p5] {
    flex-shrink: 0;
}

.file-name[b-3ahoddy4p5] {
    flex: 1;
    color: #374151;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.file-name small[b-3ahoddy4p5] {
    color: #9ca3af;
}

.file-name a[b-3ahoddy4p5] {
    color: #015974;
    text-decoration: none;
}

.file-name a:hover[b-3ahoddy4p5] {
    text-decoration: underline;
}

.file-remove-btn[b-3ahoddy4p5] {
    background: none;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 3px 10px;
    font-size: 0.78rem;
    color: #6b7280;
    cursor: pointer;
    flex-shrink: 0;
    transition: all 0.15s;
}

.file-remove-btn:hover[b-3ahoddy4p5] {
    background: #f3f4f6;
    color: #374151;
}

.file-remove-danger[b-3ahoddy4p5] {
    color: #dc2626;
    border-color: #fca5a5;
}

.file-remove-danger:hover[b-3ahoddy4p5] {
    background: #fee2e2;
    border-color: #f87171;
    color: #dc2626;
}

.file-empty[b-3ahoddy4p5] {
    color: #9ca3af;
    font-size: 0.85rem;
    text-align: center;
    padding: 12px 0;
}

.checklist-empty[b-3ahoddy4p5] {
    color: #9ca3af;
    font-size: 0.85rem;
    padding: 8px 0;
}

/* Button group stays at bottom of padded form */
.button-group[b-3ahoddy4p5] {
    margin: 0;
    padding: 16px 28px 20px;
    border-top: 1px solid #e5e7eb;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    background: #f9fafb;
    border-radius: 0 0 16px 16px;
    position: sticky;
    bottom: 0;
}


.w-100[b-3ahoddy4p5] { width: 100%; }

/* ── Form Layout ── */
.form-row[b-3ahoddy4p5] {
    display: flex;
    gap: 24px;
    width: 100%;
}

.form-group[b-3ahoddy4p5] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.form-group label[b-3ahoddy4p5] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #374151;
}

.form-group input[b-3ahoddy4p5],
.form-group select[b-3ahoddy4p5],
.form-group textarea[b-3ahoddy4p5] {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    background-color: #f9fafb;
    color: #111827;
    font-size: 0.9rem;
    font-family: inherit;
    transition: all 0.2s ease;
    resize: vertical;
}

.form-group input:focus[b-3ahoddy4p5],
.form-group select:focus[b-3ahoddy4p5],
.form-group textarea:focus[b-3ahoddy4p5] {
    outline: none;
    border-color: #015974;
    background-color: white;
    box-shadow: 0 0 0 3px rgba(1, 89, 116, 0.1);
}

/* Checkbox specific */
.checkbox-group[b-3ahoddy4p5] {
    display: flex;
    align-items: center;
    padding-bottom: 10px;
}

.checkbox-list[b-3ahoddy4p5] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 200px;
    overflow-y: auto;
    padding: 8px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    background-color: #f9fafb;
}

.checkbox-item[b-3ahoddy4p5] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.9rem;
    color: #374151;
}

.checkbox-item input[type="checkbox"][b-3ahoddy4p5] {
    width: 16px;
    height: 16px;
    accent-color: #015974;
    cursor: pointer;
    margin: 0;
    flex-shrink: 0;
}

/* ── Report Type Chip Selector ── */
.report-chip-grid[b-3ahoddy4p5] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 12px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    background-color: #f9fafb;
    min-height: 58px;
}

.report-chip[b-3ahoddy4p5] {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 10px 20px;
    border: 1.5px solid #d1d5db;
    border-radius: 8px;
    background-color: #ffffff;
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
    min-width: 130px;
    text-align: center;
    user-select: none;
}

/* Hide the actual checkbox input */
.report-chip input[type="checkbox"][b-3ahoddy4p5] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

.report-chip:hover[b-3ahoddy4p5] {
    border-color: #7dd3dc;
    background-color: #f0f9fc;
}

.report-chip.selected[b-3ahoddy4p5] {
    border-color: #015974;
    background-color: #e0f2fe;
    box-shadow: 0 0 0 3px rgba(1, 89, 116, 0.12);
}

/* Checkmark badge on selected */
.report-chip.selected[b-3ahoddy4p5]::after {
    content: '✓';
    position: absolute;
    top: 5px;
    right: 7px;
    font-size: 0.6rem;
    font-weight: 800;
    color: #015974;
    line-height: 1;
}

.chip-name[b-3ahoddy4p5] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    line-height: 1.2;
}

.report-chip.selected .chip-name[b-3ahoddy4p5] {
    color: #015974;
}

.chip-cost[b-3ahoddy4p5] {
    font-size: 0.72rem;
    font-weight: 500;
    color: #6b7280;
    background-color: #f3f4f6;
    padding: 2px 8px;
    border-radius: 20px;
    line-height: 1.4;
}

.report-chip.selected .chip-cost[b-3ahoddy4p5] {
    background-color: #cceaf2;
    color: #015974;
}

.save-btn[b-3ahoddy4p5] {
    background: linear-gradient(135deg, #015974, #9D6023);
    color: white;
    padding: 10px 24px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    border: none;
    cursor: pointer;
    transition: all 0.2s;
    box-shadow: 0 1px 4px rgba(1, 89, 116, 0.25);
}

.save-btn:hover:not(:disabled)[b-3ahoddy4p5] {
    opacity: 0.9;
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(1, 89, 116, 0.3);
}

.save-btn:disabled[b-3ahoddy4p5],
.close-btn:disabled[b-3ahoddy4p5] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

.save-btn-loading[b-3ahoddy4p5] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background-color: #3b82f6;
}

.btn-spinner[b-3ahoddy4p5] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: spin-b-3ahoddy4p5 0.7s linear infinite;
    flex-shrink: 0;
}

.close-btn[b-3ahoddy4p5] {
    background-color: white;
    color: #374151;
    padding: 10px 24px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    border: 1px solid #d1d5db;
    cursor: pointer;
    transition: all 0.2s;
}

.close-btn:hover[b-3ahoddy4p5] {
    background-color: #f3f4f6;
    border-color: #9ca3af;
    color: #111827;
}

/* Search Input */
.search-input[b-3ahoddy4p5] {
    padding: 8px 14px;
    border: 1.5px solid rgba(255,255,255,0.35);
    border-radius: 8px;
    width: 280px;
    max-width: 100%;
    background: rgba(255,255,255,0.15);
    color: #fff;
    font-size: 0.875rem;
    transition: all 0.2s;
}

.search-input[b-3ahoddy4p5]::placeholder { color: rgba(255,255,255,0.65); }

.search-input:focus[b-3ahoddy4p5] {
    outline: none;
    background: rgba(255,255,255,0.25);
    border-color: rgba(255,255,255,0.7);
    box-shadow: 0 0 0 3px rgba(255,255,255,0.15);
}

/* ── Table cell helpers ── */
.cell-owner[b-3ahoddy4p5] {
    display: block;
    font-weight: 600;
    color: #1e293b;
    font-size: 0.845rem;
}

.cell-sub[b-3ahoddy4p5] {
    display: block;
    font-size: 0.74rem;
    color: #94a3b8;
    margin-top: 1px;
}

.cell-muted[b-3ahoddy4p5] {
    color: #94a3b8;
    font-size: 0.845rem;
}

.cell-assigned[b-3ahoddy4p5] {
    color: #015974;
    font-weight: 600;
    font-size: 0.845rem;
}

.cost-cell[b-3ahoddy4p5] {
    font-weight: 700;
    color: #015974;
    white-space: nowrap;
}

/* ── Action buttons ── */
.actions-cell[b-3ahoddy4p5] {
    white-space: nowrap;
}

.action-btn[b-3ahoddy4p5] {
    display: inline-block;
    padding: 4px 11px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    color: white;
    font-size: 0.78rem;
    font-weight: 600;
    margin-right: 4px;
    transition: all 0.15s ease;
    letter-spacing: 0.2px;
    text-decoration: none;
    line-height: 1.6;
}

.action-btn:last-child[b-3ahoddy4p5] { margin-right: 0; }
.action-btn:hover[b-3ahoddy4p5] { opacity: 0.85; transform: translateY(-1px); }

.action-btn.detail[b-3ahoddy4p5]  { background: #015974; }
.action-btn.invoice[b-3ahoddy4p5] { background: #16a34a; }
.action-btn.delete[b-3ahoddy4p5]  { background: #dc2626; }

/* ── Project ID badge ── */
.project-id-badge[b-3ahoddy4p5] {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    color: #9D6023;
    background: #fef3e2;
    padding: 2px 7px;
    border-radius: 4px;
    white-space: nowrap;
}

/* Loading Spinner */
.loading-container[b-3ahoddy4p5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 0;
    gap: 16px;
    color: #6b7280;
    font-size: 0.9rem;
    font-weight: 500;
}

.spinner[b-3ahoddy4p5] {
    width: 36px;
    height: 36px;
    border: 3px solid #e5e7eb;
    border-top-color: #015974;
    border-radius: 50%;
    animation: spin-b-3ahoddy4p5 0.7s linear infinite;
}

@keyframes spin-b-3ahoddy4p5 {
    to { transform: rotate(360deg); }
}

/* Animations */
@keyframes fadeIn-b-3ahoddy4p5 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slideUp-b-3ahoddy4p5 {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Responsive adjustments */
@media (max-width: 900px) {
    .search-input[b-3ahoddy4p5] {
        width: 200px;
    }

    .report-chip[b-3ahoddy4p5] {
        min-width: 110px;
        padding: 8px 14px;
    }
}

@media (max-width: 768px) {
    .container[b-3ahoddy4p5] {
        padding: 16px;
    }

    .header-section[b-3ahoddy4p5] {
        flex-direction: column;
        gap: 12px;
        align-items: stretch;
    }

    .actions-group[b-3ahoddy4p5] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-input[b-3ahoddy4p5] {
        width: 100%;
    }

    .form-row[b-3ahoddy4p5] {
        flex-direction: column;
        gap: 16px;
    }

    .modal-content[b-3ahoddy4p5] {
        width: 100%;
        padding: 20px;
        border-radius: 12px;
    }

    .report-chip-grid[b-3ahoddy4p5] {
        gap: 8px;
        padding: 10px;
    }

    .report-chip[b-3ahoddy4p5] {
        min-width: 0;
        flex: 1 1 calc(50% - 8px);
    }

    .pagination-section[b-3ahoddy4p5] {
        flex-direction: column;
        align-items: center;
        gap: 8px;
    }
}
/* /Pages/AdminDashboard/ProjectChecklistItem.razor.rz.scp.css */
.container[b-6q30qmumog] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1200px;
    width: 100%;
    box-sizing: border-box;
    margin: 0 auto;
    border-radius: 20px;
}

.header-section[b-6q30qmumog] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

.actions-group[b-6q30qmumog] {
    display: flex;
    align-items: center;
    gap: 15px;
}

.search-input[b-6q30qmumog] {
    padding: 10px 15px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    width: 300px;
    font-size: 0.95em;
    outline: none;
    transition: all 0.3s ease;
}

.search-input:focus[b-6q30qmumog] {
    border-color: #015974;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.2);
}

.header-section h2[b-6q30qmumog] {
    margin: 0;
    color: #fff;
    font-size: 1.8em;
    font-weight: 600;
}

.add-btn[b-6q30qmumog] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.add-btn:hover[b-6q30qmumog] {
    background: #f0f9fc;
}

.table-section[b-6q30qmumog] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    overflow-x: auto;
    max-width: 100%;
}

table[b-6q30qmumog] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

th[b-6q30qmumog],
td[b-6q30qmumog] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-6q30qmumog] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-6q30qmumog] {
    color: #34495e;
}

.action-btn[b-6q30qmumog] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-6q30qmumog] {
    background-color: #28a745;
    color: white;
}

.edit-btn:hover[b-6q30qmumog] {
    background-color: #218838;
}

.delete-btn[b-6q30qmumog] {
    background-color: #dc3545;
    color: white;
}

.delete-btn:hover[b-6q30qmumog] {
    background-color: #c82333;
}

.table-footer[b-6q30qmumog] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

.modal[b-6q30qmumog] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-6q30qmumog] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 800px;
    /* Increased width for horizontal layout */
    max-width: 90%;
    max-height: 80vh;
    /* Limit vertical height */
    overflow-y: auto;
    /* Scroll if content exceeds height */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

.modal-content h3[b-6q30qmumog] {
    margin-top: 0;
    color: #015974;
    border-bottom: 2px solid #e9ecef;
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-size: 1.6em;
    font-weight: 600;
}

.form-grid[b-6q30qmumog] {
    display: grid;
    grid-template-columns: 1fr;
    /* Single column by default, adjust as needed */
    gap: 20px;
}

.form-module[b-6q30qmumog] {
    margin-bottom: 20px;
}

.form-row[b-6q30qmumog] {
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
}

.form-group[b-6q30qmumog] {
    flex: 1;
    margin-bottom: 0;
}

.form-group label[b-6q30qmumog] {
    display: block;
    margin-bottom: 8px;
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.form-group input[b-6q30qmumog],
.form-group select[b-6q30qmumog] {
    width: 100%;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    box-sizing: border-box;
    font-size: 1em;
    transition: border-color 0.3s ease;
}

.form-group input:focus[b-6q30qmumog],
.form-group select:focus[b-6q30qmumog] {
    border-color: #015974;
    outline: none;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.checkbox-group[b-6q30qmumog] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-6q30qmumog] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

.checkbox-label input[type="checkbox"][b-6q30qmumog] {
    margin-right: 12px;
    margin-bottom: 0;
    vertical-align: middle;
    height: 20px;
    width: 20px;
}

.checkbox-label span[b-6q30qmumog] {
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.button-group[b-6q30qmumog] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-6q30qmumog] {
    padding: 12px 12px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.save-btn.primary[b-6q30qmumog] {
    background-color: #015974;
    color: white;
}

.save-btn:hover[b-6q30qmumog] {
    background-color: #dfe3e8;
}

.save-btn.primary:hover[b-6q30qmumog] {
    background-color: #024d62;
}

.close-btn[b-6q30qmumog] {
    padding: 12px 25px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.close-btn:hover[b-6q30qmumog] {
    background-color: #dfe3e8;
}

/* Pagination Styles */
.pagination-section[b-6q30qmumog] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px;
    border-top: 1px solid #e9ecef;
    margin-top: 10px;
    background-color: #f8f9fa;
    border-radius: 0 0 8px 8px;
}

.page-info[b-6q30qmumog] {
    color: #666;
    font-size: 0.9em;
    font-weight: 500;
}

.pagination-buttons[b-6q30qmumog] {
    display: flex;
    gap: 5px;
}

.pagination-buttons .btn[b-6q30qmumog] {
    min-width: 32px;
    height: 32px;
    padding: 0 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #dee2e6;
    background-color: #fff;
    color: #333;
    cursor: pointer;
    border-radius: 4px;
    transition: all 0.2s ease;
    font-weight: 500;
}

.pagination-buttons .btn:hover:not(:disabled)[b-6q30qmumog] {
    background-color: #e9ecef;
    border-color: #adb5bd;
    color: #000;
}

.pagination-buttons .btn-primary[b-6q30qmumog] {
    background-color: #015974;
    color: white !important;
    border-color: #015974;
}

.pagination-buttons .btn-primary:hover[b-6q30qmumog] {
    background-color: #024d62;
    border-color: #024d62;
}

.pagination-buttons .btn:disabled[b-6q30qmumog] {
    cursor: not-allowed;
    opacity: 0.5;
    background-color: #f8f9fa;
    color: #aaa;
}
/* /Pages/AdminDashboard/ProjectComments.razor.rz.scp.css */
.container[b-f3sf5u8afc] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1800px;
    margin: 0 auto;
    border-radius: 20px;
}

.header-section[b-f3sf5u8afc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.actions-group[b-f3sf5u8afc] {
    display: flex;
    align-items: center;
    gap: 15px;
}

.search-input[b-f3sf5u8afc] {
    padding: 10px 15px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    width: 300px;
    font-size: 0.95em;
    outline: none;
    transition: all 0.3s ease;
}

.search-input:focus[b-f3sf5u8afc] {
    border-color: #015974;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.2);
}

.header-section h2[b-f3sf5u8afc] {
    margin: 0;
    color: #fff;
    font-size: 1.8em;
    font-weight: 600;
}

.add-btn[b-f3sf5u8afc] {
    background: #fff;
    color: #015974;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.add-btn:hover[b-f3sf5u8afc] {
    background: #f0f9fc;
}

.table-section[b-f3sf5u8afc] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

table[b-f3sf5u8afc] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

th[b-f3sf5u8afc],
td[b-f3sf5u8afc] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-f3sf5u8afc] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-f3sf5u8afc] {
    color: #34495e;
}

.action-btn[b-f3sf5u8afc] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-f3sf5u8afc] {
    background-color: #28a745;
    color: white;
}

.edit-btn:hover[b-f3sf5u8afc] {
    background-color: #218838;
}

.delete-btn[b-f3sf5u8afc] {
    background-color: #dc3545;
    color: white;
}

.delete-btn:hover[b-f3sf5u8afc] {
    background-color: #c82333;
}

.table-footer[b-f3sf5u8afc] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

.modal[b-f3sf5u8afc] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-f3sf5u8afc] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 800px;
    /* Increased width for horizontal layout */
    max-width: 90%;
    max-height: 80vh;
    /* Limit vertical height */
    overflow-y: auto;
    /* Scroll if content exceeds height */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

.modal-content h3[b-f3sf5u8afc] {
    margin-top: 0;
    color: #015974;
    border-bottom: 2px solid #e9ecef;
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-size: 1.6em;
    font-weight: 600;
}

.form-grid[b-f3sf5u8afc] {
    display: grid;
    grid-template-columns: 1fr;
    /* Single column by default, adjust as needed */
    gap: 20px;
}

.form-module[b-f3sf5u8afc] {
    margin-bottom: 20px;
}

.form-row[b-f3sf5u8afc] {
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
}

.form-group[b-f3sf5u8afc] {
    flex: 1;
    margin-bottom: 0;
}

.form-group label[b-f3sf5u8afc] {
    display: block;
    margin-bottom: 8px;
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.form-group input[b-f3sf5u8afc],
.form-group select[b-f3sf5u8afc] {
    width: 100%;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    box-sizing: border-box;
    font-size: 1em;
    transition: border-color 0.3s ease;
}

.form-group input:focus[b-f3sf5u8afc],
.form-group select:focus[b-f3sf5u8afc] {
    border-color: #015974;
    outline: none;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.checkbox-group[b-f3sf5u8afc] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-f3sf5u8afc] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

.checkbox-label input[type="checkbox"][b-f3sf5u8afc] {
    margin-right: 12px;
    margin-bottom: 0;
    vertical-align: middle;
    height: 20px;
    width: 20px;
}

.checkbox-label span[b-f3sf5u8afc] {
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.button-group[b-f3sf5u8afc] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-f3sf5u8afc] {
    padding: 12px 12px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.save-btn.primary[b-f3sf5u8afc] {
    background-color: #015974;
    color: white;
}

.save-btn:hover[b-f3sf5u8afc] {
    background-color: #dfe3e8;
}

.save-btn.primary:hover[b-f3sf5u8afc] {
    background-color: #024d62;
}

.close-btn[b-f3sf5u8afc] {
    padding: 12px 25px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.close-btn:hover[b-f3sf5u8afc] {
    background-color: #dfe3e8;
}

/* Pagination Styles */
.pagination-section[b-f3sf5u8afc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px;
    border-top: 1px solid #e9ecef;
    margin-top: 10px;
    background-color: #f8f9fa;
    border-radius: 0 0 8px 8px;
}

.page-info[b-f3sf5u8afc] {
    color: #666;
    font-size: 0.9em;
    font-weight: 500;
}

.pagination-buttons[b-f3sf5u8afc] {
    display: flex;
    gap: 5px;
}

.pagination-buttons .btn[b-f3sf5u8afc] {
    min-width: 32px;
    height: 32px;
    padding: 0 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #dee2e6;
    background-color: #fff;
    color: #333;
    cursor: pointer;
    border-radius: 4px;
    transition: all 0.2s ease;
    font-weight: 500;
}

.pagination-buttons .btn:hover:not(:disabled)[b-f3sf5u8afc] {
    background-color: #e9ecef;
    border-color: #adb5bd;
    color: #000;
}

.pagination-buttons .btn-primary[b-f3sf5u8afc] {
    background-color: #015974;
    color: white !important;
    border-color: #015974;
}

.pagination-buttons .btn-primary:hover[b-f3sf5u8afc] {
    background-color: #024d62;
    border-color: #024d62;
}

.pagination-buttons .btn:disabled[b-f3sf5u8afc] {
    cursor: not-allowed;
    opacity: 0.5;
    background-color: #f8f9fa;
    color: #aaa;
}

/* ── New modal & table styles ─────────────────────────────── */

/* Table enhancements */
.pc-project-name[b-f3sf5u8afc] { font-weight: 600; color: #1e293b; font-size: 0.88rem; }
.pc-comment-cell[b-f3sf5u8afc] { max-width: 300px; color: #374151; font-size: 0.88rem; white-space: pre-wrap; word-break: break-word; }
.pc-date[b-f3sf5u8afc] { font-size: 0.82rem; color: #94a3b8; white-space: nowrap; }
.pc-user-chip[b-f3sf5u8afc] { display: inline-flex; align-items: center; gap: 5px; font-size: 0.83rem; color: #4b5563; font-weight: 500; }
.pc-user-chip i[b-f3sf5u8afc] { color: #015974; font-size: 0.9rem; }

.pc-badge[b-f3sf5u8afc] { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 20px; font-size: 0.72rem; font-weight: 600; white-space: nowrap; }
.pc-badge-visible[b-f3sf5u8afc]   { background: #dcfce7; color: #166534; }
.pc-badge-hidden[b-f3sf5u8afc]    { background: #f1f5f9; color: #64748b; }
.pc-badge-approved[b-f3sf5u8afc]  { background: #cceaf2; color: #015974; }
.pc-badge-rejected[b-f3sf5u8afc]  { background: #fee2e2; color: #991b1b; }
.pc-badge-pending[b-f3sf5u8afc]   { background: #fef3c7; color: #92400e; }

.pc-actions[b-f3sf5u8afc] { display: flex; gap: 6px; }
.pc-action-btn[b-f3sf5u8afc] { width: 32px; height: 32px; border: none; border-radius: 7px; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 0.82rem; transition: all 0.15s; }
.pc-edit[b-f3sf5u8afc]   { background: #e0f2fe; color: #0369a1; }
.pc-delete[b-f3sf5u8afc] { background: #fee2e2; color: #991b1b; }
.pc-edit:hover[b-f3sf5u8afc]   { background: #0369a1; color: white; }
.pc-delete:hover[b-f3sf5u8afc] { background: #991b1b; color: white; }

/* Modal */
.pc-modal-backdrop[b-f3sf5u8afc] {
    position: fixed; inset: 0; background: rgba(0,0,0,0.45);
    display: flex; align-items: center; justify-content: center; z-index: 1000;
    backdrop-filter: blur(2px);
}
.pc-modal[b-f3sf5u8afc] {
    background: white; border-radius: 16px; width: 560px; max-width: 95vw;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2); overflow: hidden;
}
.pc-modal-sm[b-f3sf5u8afc] { width: 420px; }

.pc-modal-header[b-f3sf5u8afc] {
    display: flex; align-items: center; gap: 14px; padding: 20px 24px;
    background: linear-gradient(135deg, #015974, #9D6023); color: white;
}
.pc-modal-header-danger[b-f3sf5u8afc] { background: linear-gradient(135deg, #dc2626, #9f1239); }
.pc-modal-icon[b-f3sf5u8afc] {
    width: 44px; height: 44px; border-radius: 50%; background: rgba(255,255,255,0.2);
    display: flex; align-items: center; justify-content: center; font-size: 1.1rem; flex-shrink: 0;
}
.pc-modal-title[b-f3sf5u8afc] { margin: 0; font-size: 1.1rem; font-weight: 700; color: white; }
.pc-modal-sub[b-f3sf5u8afc] { margin: 2px 0 0; font-size: 0.78rem; color: rgba(255,255,255,0.8); }
.pc-modal-close[b-f3sf5u8afc] {
    margin-left: auto; background: rgba(255,255,255,0.2); border: none; color: white;
    width: 30px; height: 30px; border-radius: 50%; cursor: pointer; font-size: 0.85rem;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background 0.15s;
}
.pc-modal-close:hover[b-f3sf5u8afc] { background: rgba(255,255,255,0.35); }

.pc-modal-body[b-f3sf5u8afc] { padding: 24px; display: flex; flex-direction: column; gap: 18px; }
.pc-modal-footer[b-f3sf5u8afc] {
    padding: 16px 24px; display: flex; justify-content: flex-end; gap: 10px;
    border-top: 1px solid #f1f5f9; background: #f8fafc;
}

.pc-label[b-f3sf5u8afc] { font-size: 0.8rem; font-weight: 600; color: #64748b; margin-bottom: 6px; display: flex; align-items: center; gap: 6px; }
.pc-label i[b-f3sf5u8afc] { color: #015974; }
.pc-field[b-f3sf5u8afc] { display: flex; flex-direction: column; }
.pc-select[b-f3sf5u8afc], .pc-textarea[b-f3sf5u8afc] {
    width: 100%; padding: 10px 13px; border: 1px solid #e2e8f0; border-radius: 9px;
    font-size: 0.9rem; background: #f8fafc; outline: none; transition: border 0.2s; box-sizing: border-box;
    font-family: inherit;
}
.pc-select:focus[b-f3sf5u8afc], .pc-textarea:focus[b-f3sf5u8afc] { border-color: #015974; background: white; box-shadow: 0 0 0 3px rgba(1,89,116,0.08); }
.pc-textarea[b-f3sf5u8afc] { resize: vertical; min-height: 100px; }

.pc-toggles[b-f3sf5u8afc] { display: flex; gap: 10px; flex-wrap: wrap; }
.pc-toggle[b-f3sf5u8afc] {
    display: flex; align-items: center; gap: 8px; padding: 8px 14px;
    border: 1.5px solid #e2e8f0; border-radius: 8px; cursor: pointer; font-size: 0.83rem;
    font-weight: 600; color: #64748b; transition: all 0.15s; user-select: none;
}
.pc-toggle input[b-f3sf5u8afc] { display: none; }
.pc-toggle:hover[b-f3sf5u8afc] { border-color: #015974; color: #015974; }
.pc-toggle.active-approved[b-f3sf5u8afc] { background: #dcfce7; border-color: #22c55e; color: #166534; }
.pc-toggle.active-rejected[b-f3sf5u8afc] { background: #fee2e2; border-color: #ef4444; color: #991b1b; }
.pc-toggle.active-visible[b-f3sf5u8afc]  { background: #e0f2fe; border-color: #0284a0; color: #0369a1; }

.pc-error[b-f3sf5u8afc] {
    background: #fee2e2; color: #991b1b; padding: 10px 14px; border-radius: 8px;
    font-size: 0.85rem; font-weight: 500; display: flex; align-items: center; gap: 7px;
    border-left: 4px solid #ef4444;
}

.pc-btn-cancel[b-f3sf5u8afc] {
    padding: 9px 20px; background: #f1f5f9; border: none; border-radius: 8px;
    font-size: 0.88rem; font-weight: 600; color: #64748b; cursor: pointer; transition: background 0.15s;
}
.pc-btn-cancel:hover[b-f3sf5u8afc] { background: #e2e8f0; }
.pc-btn-save[b-f3sf5u8afc] {
    padding: 9px 20px; background: linear-gradient(135deg, #015974, #9D6023); border: none;
    border-radius: 8px; font-size: 0.88rem; font-weight: 600; color: white; cursor: pointer;
    display: flex; align-items: center; gap: 7px; transition: opacity 0.15s;
}
.pc-btn-save:hover:not(:disabled)[b-f3sf5u8afc] { opacity: 0.9; }
.pc-btn-save:disabled[b-f3sf5u8afc] { opacity: 0.6; cursor: not-allowed; }
.pc-btn-danger[b-f3sf5u8afc] {
    padding: 9px 20px; background: #dc2626; border: none; border-radius: 8px;
    font-size: 0.88rem; font-weight: 600; color: white; cursor: pointer;
    display: flex; align-items: center; gap: 7px; transition: background 0.15s;
}
.pc-btn-danger:hover[b-f3sf5u8afc] { background: #b91c1c; }

.pc-spinner[b-f3sf5u8afc] {
    width: 14px; height: 14px; border: 2px solid rgba(255,255,255,0.4); border-top-color: white;
    border-radius: 50%; animation: pcspin 0.7s linear infinite; display: inline-block;
}
@@keyframes pcspin { to[b-f3sf5u8afc] { transform: rotate(360deg); } }
/* /Pages/AdminDashboard/ProjectDetail.razor.rz.scp.css */
.project-detail-container[b-zqjpqxof71] {
    padding: 20px;
    max-width: 1400px;
    margin: 0 auto;
}

.loading-spinner[b-zqjpqxof71] {
    text-align: center;
    padding: 40px;
}

.header-section[b-zqjpqxof71] {
    margin-bottom: 20px;
    padding: 18px 24px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

.breadcrumb[b-zqjpqxof71] {
    font-size: 0.82rem;
    color: rgba(255,255,255,0.75);
    margin-bottom: 8px;
}

.breadcrumb a[b-zqjpqxof71] {
    color: rgba(255,255,255,0.85);
    text-decoration: none;
}

.breadcrumb a:hover[b-zqjpqxof71] {
    color: #fff;
    text-decoration: underline;
}

.breadcrumb span[b-zqjpqxof71] {
    margin: 0 6px;
    opacity: 0.6;
}

.header-section h2[b-zqjpqxof71] {
    margin: 0;
    font-size: 1.6rem;
    color: #fff;
    font-weight: 700;
}

.tabs-container[b-zqjpqxof71] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.tabs-header[b-zqjpqxof71] {
    display: flex;
    border-bottom: 2px solid #e9ecef;
    background: #f8f9fa;
}

.tab-btn[b-zqjpqxof71] {
    flex: 1;
    padding: 15px 20px;
    border: none;
    background: transparent;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.85rem;
    color: #666;
    transition: all 0.3s ease;
    border-bottom: 3px solid transparent;
}

.tab-btn:hover[b-zqjpqxof71] {
    background: #e9ecef;
    color: #333;
}

.tab-btn.active[b-zqjpqxof71] {
    color: #015974;
    border-bottom-color: #015974;
    background: white;
}

.tab-content[b-zqjpqxof71] {
    padding: 30px;
}

/* Details Tab */
.detail-card[b-zqjpqxof71] {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 24px;
    height: 100%;
}

.detail-field[b-zqjpqxof71] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 18px;
}

.detail-label[b-zqjpqxof71] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.detail-value[b-zqjpqxof71] {
    font-size: 0.95rem;
    color: #333;
}

.detail-section-block[b-zqjpqxof71] {
    margin-bottom: 18px;
}

.detail-section-title[b-zqjpqxof71] {
    display: flex;
    align-items: center;
    font-size: 1rem;
    font-weight: 700;
    color: #333;
    margin-bottom: 10px;
    gap: 8px;
}

.detail-section-title[b-zqjpqxof71]::before {
    content: '';
    display: inline-block;
    width: 4px;
    height: 18px;
    background: #2d7a7a;
    border-radius: 2px;
}

.badge-group[b-zqjpqxof71] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.location-block[b-zqjpqxof71] {
    width: 100%;
}

.map-frame[b-zqjpqxof71] {
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid #dee2e6;
}

.map-placeholder[b-zqjpqxof71] {
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f8f9fa;
    border: 1px dashed #dee2e6;
    border-radius: 6px;
}

.badge-delivery[b-zqjpqxof71] {
    background: #0dcaf0;
    color: #fff;
}

.badge-date[b-zqjpqxof71] {
    background: #015974;
    color: #fff;
}

.checklist-badges[b-zqjpqxof71] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.badge[b-zqjpqxof71] {
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 500;
}

.badge-primary[b-zqjpqxof71] {
    background: #2d7a7a;
    color: white;
}

.badge-info[b-zqjpqxof71] {
    background: #015974;
    color: white;
}

.badge-success[b-zqjpqxof71] {
    background: #28a745;
    color: white;
}

.badge-danger[b-zqjpqxof71] {
    background: #dc3545;
    color: white;
}

.badge-warning[b-zqjpqxof71] {
    background: #ffc107;
    color: #333;
}

.location-inputs[b-zqjpqxof71] {
    margin-top: 10px;
}

.coordinate-row[b-zqjpqxof71] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
    margin-top: 10px;
}

/* Files Tab */
.file-upload-area[b-zqjpqxof71] {
    margin: 20px 0;
    position: relative;
}

.file-input[b-zqjpqxof71] {
    cursor: pointer;
    height: 100%;
    inset: 0;
    opacity: 0;
    position: absolute;
    width: 100%;
    z-index: 2;
}

.file-drop-zone[b-zqjpqxof71] {
    display: block;
    padding: 40px;
    border: 2px dashed #ccc;
    border-radius: 8px;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.file-drop-zone:hover[b-zqjpqxof71] {
    border-color: #2d7a7a;
    background: #f8f9fa;
}

.selected-files[b-zqjpqxof71] {
    margin: 20px 0;
}

.file-item[b-zqjpqxof71],
.existing-file[b-zqjpqxof71] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px;
    background: #f8f9fa;
    border-radius: 6px;
    margin-bottom: 10px;
}

.btn-remove[b-zqjpqxof71] {
    background: #dc3545;
    color: white;
    border: none;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    cursor: pointer;
    font-size: 1.2rem;
    line-height: 1;
}

.file-actions[b-zqjpqxof71] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.file-status[b-zqjpqxof71] {
    border-radius: 12px;
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    margin-left: 8px;
    padding: 2px 8px;
}

.file-status.approved[b-zqjpqxof71] {
    background: #dcfce7;
    color: #166534;
}

.file-status.pending[b-zqjpqxof71],
.file-status.rejected[b-zqjpqxof71] {
    background: #fee2e2;
    color: #991b1b;
}

.external-files-title[b-zqjpqxof71] {
    margin-top: 24px;
}

.external-file span[b-zqjpqxof71] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    min-width: 0;
}

.external-file a[b-zqjpqxof71] {
    color: #015974;
    word-break: break-all;
}

/* Admin Tab */
.admin-tab .form-group[b-zqjpqxof71] {
    margin-bottom: 20px;
}

.admin-tab label[b-zqjpqxof71] {
    font-weight: 600;
    margin-bottom: 8px;
    display: block;
}

/* Comments Tab */
.form-check[b-zqjpqxof71] {
    margin: 15px 0;
}

.comment-item[b-zqjpqxof71] {
    padding: 15px;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 15px;
}

.comment-header[b-zqjpqxof71] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.comment-date[b-zqjpqxof71] {
    color: #666;
    font-size: 0.85rem;
}

.comment-flags[b-zqjpqxof71] {
    margin-top: 10px;
}

/* History Tab */
.timeline[b-zqjpqxof71] {
    position: relative;
    padding-left: 30px;
}

.timeline-item[b-zqjpqxof71] {
    position: relative;
    padding-bottom: 30px;
}

.timeline-marker[b-zqjpqxof71] {
    position: absolute;
    left: -30px;
    top: 5px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #2d7a7a;
    border: 3px solid white;
    box-shadow: 0 0 0 2px #2d7a7a;
}

.timeline-item[b-zqjpqxof71]::before {
    content: '';
    position: absolute;
    left: -25px;
    top: 17px;
    bottom: -30px;
    width: 2px;
    background: #e9ecef;
}

.timeline-item:last-child[b-zqjpqxof71]::before {
    display: none;
}

.timeline-content[b-zqjpqxof71] {
    background: #f8f9fa;
    padding: 15px;
    border-radius: 8px;
}

.timeline-header[b-zqjpqxof71] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}

.timeline-date[b-zqjpqxof71] {
    color: #666;
    font-size: 0.85rem;
}

.timeline-user[b-zqjpqxof71] {
    margin: 0;
    color: #666;
    font-size: 0.9rem;
}

/* Common */
.form-control[b-zqjpqxof71] {
    width: 100%;
    padding: 10px;
    border: 1px solid #ced4da;
    border-radius: 4px;
    font-size: 0.95rem;
}

.form-control:focus[b-zqjpqxof71] {
    outline: none;
    border-color: #2d7a7a;
    box-shadow: 0 0 0 3px rgba(45, 122, 122, 0.1);
}

.btn[b-zqjpqxof71] {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
    transition: all 0.3s ease;
}

.btn-primary[b-zqjpqxof71] {
    background: #2d7a7a;
    color: white;
}

.btn-primary:hover:not(:disabled)[b-zqjpqxof71] {
    background: #1a5f5f;
}

.btn-primary:disabled[b-zqjpqxof71] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-sm[b-zqjpqxof71] {
    padding: 6px 12px;
    font-size: 0.85rem;
}

.btn-info[b-zqjpqxof71] {
    background: #015974;
    color: white;
}

.btn-success[b-zqjpqxof71] {
    background: #28a745;
    color: white;
}

.alert[b-zqjpqxof71] {
    padding: 12px 16px;
    border-radius: 6px;
    margin: 15px 0;
}

.alert-success[b-zqjpqxof71] {
    background: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}

.alert-danger[b-zqjpqxof71] {
    background: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}

.note[b-zqjpqxof71] {
    font-size: 0.85rem;
    color: #666;
    font-weight: 400;
}

.text-muted[b-zqjpqxof71] {
    color: #6c757d;
}

hr[b-zqjpqxof71] {
    margin: 30px 0;
    border: none;
    border-top: 1px solid #e9ecef;
}

@media (max-width: 768px) {
    .detail-row[b-zqjpqxof71] {
        grid-template-columns: 1fr;
    }

    .tabs-header[b-zqjpqxof71] {
        flex-wrap: wrap;
    }

    .tab-btn[b-zqjpqxof71] {
        flex: 1 1 50%;
    }

    .coordinate-row[b-zqjpqxof71] {
        grid-template-columns: 1fr;
    }
}

/* Approval Toggle */
.is-approved-btn[b-zqjpqxof71] {
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    padding: 8px;
    width: 100%;
    transition: all 0.2s ease-in-out;
}

.is-approved-btn:hover[b-zqjpqxof71] {
    filter: brightness(0.85);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}

.is-approved-btn:disabled[b-zqjpqxof71] {
    cursor: not-allowed;
    opacity: 0.7;
}

.toggle-icon[b-zqjpqxof71] {
    font-size: 0.85em;
    opacity: 0.7;
    margin-left: 8px;
    transition: transform 0.2s;
}

.is-approved-btn:hover .toggle-icon[b-zqjpqxof71] {
    opacity: 1;
    transform: scale(1.1);
}
/* /Pages/AdminDashboard/ProjectFile.razor.rz.scp.css */
.container[b-1g88zh9hu2] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 100%;
    margin: 0 auto;
    border-radius: 20px;
}

.header-section[b-1g88zh9hu2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

    .header-section h2[b-1g88zh9hu2] {
        margin: 0;
        color: #fff;
        font-size: 1.8em;
        font-weight: 600;
    }

.add-btn[b-1g88zh9hu2] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .add-btn:hover[b-1g88zh9hu2] {
        background: #f0f9fc;
    }

.table-section[b-1g88zh9hu2] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

table[b-1g88zh9hu2] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

th[b-1g88zh9hu2], td[b-1g88zh9hu2] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-1g88zh9hu2] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-1g88zh9hu2] {
    color: #34495e;
}

.action-btn[b-1g88zh9hu2] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-1g88zh9hu2] {
    background-color: #28a745;
    color: white;
}

    .edit-btn:hover[b-1g88zh9hu2] {
        background-color: #218838;
    }

.delete-btn[b-1g88zh9hu2] {
    background-color: #dc3545;
    color: white;
}

    .delete-btn:hover[b-1g88zh9hu2] {
        background-color: #c82333;
    }

.modal[b-1g88zh9hu2] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-1g88zh9hu2] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 400px;
    max-width: 90%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

    .modal-content h3[b-1g88zh9hu2] {
        margin-top: 0;
        color: #015974;
        border-bottom: 2px solid #e9ecef;
        padding-bottom: 10px;
        margin-bottom: 20px;
        font-size: 1.6em;
        font-weight: 600;
    }

.form-group[b-1g88zh9hu2] {
    margin-bottom: 20px;
}

    .form-group label[b-1g88zh9hu2] {
        display: block;
        margin-bottom: 8px;
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

    .form-group input[b-1g88zh9hu2] {
        width: 100%;
        padding: 12px;
        border: 1px solid #ced4da;
        border-radius: 6px;
        box-sizing: border-box;
        font-size: 1em;
        transition: border-color 0.3s ease;
    }

        .form-group input:focus[b-1g88zh9hu2] {
            border-color: #015974;
            outline: none;
            box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
        }

.checkbox-group[b-1g88zh9hu2] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-1g88zh9hu2] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

    .checkbox-label input[type="checkbox"][b-1g88zh9hu2] {
        margin-right: 12px;
        margin-bottom: 0;
        vertical-align: middle;
        height: 20px;
        width: 20px;
    }

    .checkbox-label span[b-1g88zh9hu2] {
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

.button-group[b-1g88zh9hu2] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-1g88zh9hu2] {
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .save-btn.primary[b-1g88zh9hu2] {
        background-color: #015974;
        color: white;
    }

    .save-btn:hover[b-1g88zh9hu2] {
        background-color: #dfe3e8;
    }

    .save-btn.primary:hover[b-1g88zh9hu2] {
        background-color: #024d62;
    }

.close-btn[b-1g88zh9hu2] {
    display: block;
    margin-top: 20px;
    padding: 12px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    width: 100%;
    text-align: center;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .close-btn:hover[b-1g88zh9hu2] {
        background-color: #dfe3e8;
    }
/* /Pages/AdminDashboard/ProjectReportTypes.razor.rz.scp.css */
.container[b-w1iaitskvl] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1800px;
    margin: 0 auto;
    border-radius: 20px;
}

.header-section[b-w1iaitskvl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

.actions-group[b-w1iaitskvl] {
    display: flex;
    align-items: center;
    gap: 15px;
}

.search-input[b-w1iaitskvl] {
    padding: 10px 15px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    width: 300px;
    font-size: 0.95em;
    outline: none;
    transition: all 0.3s ease;
}

.search-input:focus[b-w1iaitskvl] {
    border-color: #015974;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.2);
}

.header-section h2[b-w1iaitskvl] {
    margin: 0;
    color: #fff;
    font-size: 1.8em;
    font-weight: 600;
}

.add-btn[b-w1iaitskvl] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.add-btn:hover[b-w1iaitskvl] {
    background: #f0f9fc;
}

.table-section[b-w1iaitskvl] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

table[b-w1iaitskvl] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

th[b-w1iaitskvl],
td[b-w1iaitskvl] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-w1iaitskvl] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-w1iaitskvl] {
    color: #34495e;
}

.action-btn[b-w1iaitskvl] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-w1iaitskvl] {
    background-color: #28a745;
    color: white;
}

.edit-btn:hover[b-w1iaitskvl] {
    background-color: #218838;
}

.delete-btn[b-w1iaitskvl] {
    background-color: #dc3545;
    color: white;
}

.delete-btn:hover[b-w1iaitskvl] {
    background-color: #c82333;
}

.table-footer[b-w1iaitskvl] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

.modal[b-w1iaitskvl] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-w1iaitskvl] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 800px;
    /* Increased width for horizontal layout */
    max-width: 90%;
    max-height: 80vh;
    /* Limit vertical height */
    overflow-y: auto;
    /* Scroll if content exceeds height */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

.modal-content h3[b-w1iaitskvl] {
    margin-top: 0;
    color: #015974;
    border-bottom: 2px solid #e9ecef;
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-size: 1.6em;
    font-weight: 600;
}

.form-grid[b-w1iaitskvl] {
    display: grid;
    grid-template-columns: 1fr;
    /* Single column by default, adjust as needed */
    gap: 20px;
}

.form-module[b-w1iaitskvl] {
    margin-bottom: 20px;
}

.form-row[b-w1iaitskvl] {
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
}

.form-group[b-w1iaitskvl] {
    flex: 1;
    margin-bottom: 0;
}

.form-group label[b-w1iaitskvl] {
    display: block;
    margin-bottom: 8px;
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.form-group input[b-w1iaitskvl],
.form-group select[b-w1iaitskvl] {
    width: 100%;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    box-sizing: border-box;
    font-size: 1em;
    transition: border-color 0.3s ease;
}

.form-group input:focus[b-w1iaitskvl],
.form-group select:focus[b-w1iaitskvl] {
    border-color: #015974;
    outline: none;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.checkbox-group[b-w1iaitskvl] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-w1iaitskvl] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

.checkbox-label input[type="checkbox"][b-w1iaitskvl] {
    margin-right: 12px;
    margin-bottom: 0;
    vertical-align: middle;
    height: 20px;
    width: 20px;
}

.checkbox-label span[b-w1iaitskvl] {
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.button-group[b-w1iaitskvl] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-w1iaitskvl] {
    padding: 12px 12px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.save-btn.primary[b-w1iaitskvl] {
    background-color: #015974;
    color: white;
}

.save-btn:hover[b-w1iaitskvl] {
    background-color: #dfe3e8;
}

.save-btn.primary:hover[b-w1iaitskvl] {
    background-color: #024d62;
}

.close-btn[b-w1iaitskvl] {
    padding: 12px 25px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.close-btn:hover[b-w1iaitskvl] {
    background-color: #dfe3e8;
}

/* Pagination Styles */
.pagination-section[b-w1iaitskvl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px;
    border-top: 1px solid #e9ecef;
    margin-top: 10px;
    background-color: #f8f9fa;
    border-radius: 0 0 8px 8px;
}

.page-info[b-w1iaitskvl] {
    color: #666;
    font-size: 0.9em;
    font-weight: 500;
}

.pagination-buttons[b-w1iaitskvl] {
    display: flex;
    gap: 5px;
}

.pagination-buttons .btn[b-w1iaitskvl] {
    min-width: 32px;
    height: 32px;
    padding: 0 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #dee2e6;
    background-color: #fff;
    color: #333;
    cursor: pointer;
    border-radius: 4px;
    transition: all 0.2s ease;
    font-weight: 500;
}

.pagination-buttons .btn:hover:not(:disabled)[b-w1iaitskvl] {
    background-color: #e9ecef;
    border-color: #adb5bd;
    color: #000;
}

.pagination-buttons .btn-primary[b-w1iaitskvl] {
    background-color: #015974;
    color: white !important;
    border-color: #015974;
}

.pagination-buttons .btn-primary:hover[b-w1iaitskvl] {
    background-color: #024d62;
    border-color: #024d62;
}

.pagination-buttons .btn:disabled[b-w1iaitskvl] {
    cursor: not-allowed;
    opacity: 0.5;
    background-color: #f8f9fa;
    color: #aaa;
}
/* /Pages/AdminDashboard/ProjectStatus.razor.rz.scp.css */
.container[b-binsbi338x] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1200px;
    width: 100%;
    box-sizing: border-box;
    margin: 0 auto;
}

.header-section[b-binsbi338x] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

.header-section h2[b-binsbi338x] {
    margin: 0;
    color: #fff;
    font-size: 1.8em;
    font-weight: 600;
}

.add-btn[b-binsbi338x] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.add-btn:hover[b-binsbi338x] {
    background: #f0f9fc;
}

.actions-group[b-binsbi338x] {
    display: flex;
    align-items: center;
    gap: 15px;
}

.search-input[b-binsbi338x] {
    padding: 10px 15px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    width: 300px;
    font-size: 0.95em;
    outline: none;
    transition: all 0.3s ease;
}

.search-input:focus[b-binsbi338x] {
    border-color: #015974;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.2);
}

.table-section[b-binsbi338x] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    overflow-x: auto;
    max-width: 100%;
}

table[b-binsbi338x] {
    width: 100%;
    border-collapse: collapse;
}

th[b-binsbi338x],
td[b-binsbi338x] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-binsbi338x] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-binsbi338x] {
    color: #34495e;
}

.text-center[b-binsbi338x] {
    text-align: center;
}

.status-dot[b-binsbi338x] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    vertical-align: middle;
}

.status-dot[b-binsbi338x]::before {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.status-dot.active[b-binsbi338x]::before {
    background-color: #28a745;
}

.status-dot.inactive[b-binsbi338x]::before {
    background-color: #dc3545;
}

.action-btn[b-binsbi338x] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-binsbi338x] {
    background-color: #28a745;
    color: white;
}

.edit-btn:hover[b-binsbi338x] {
    background-color: #218838;
}

.delete-btn[b-binsbi338x] {
    background-color: #dc3545;
    color: white;
}

.delete-btn:hover[b-binsbi338x] {
    background-color: #c82333;
}

.table-footer[b-binsbi338x] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

.modal[b-binsbi338x] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-binsbi338x] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 500px;
    max-width: 90%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
    position: relative;
}

.modal-content h3[b-binsbi338x] {
    margin-top: 0;
    color: #015974;
    border-bottom: 2px solid #e9ecef;
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-size: 1.6em;
    font-weight: 600;
}

.form-group[b-binsbi338x] {
    margin-bottom: 20px;
}

.form-group label[b-binsbi338x] {
    display: block;
    margin-bottom: 8px;
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.form-group input[b-binsbi338x],
.form-group select[b-binsbi338x] {
    width: 100%;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    box-sizing: border-box;
    font-size: 1em;
    transition: border-color 0.3s ease;
}

.form-group input:focus[b-binsbi338x],
.form-group select:focus[b-binsbi338x] {
    border-color: #015974;
    outline: none;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.checkbox-group[b-binsbi338x] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-binsbi338x] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

.checkbox-label input[type="checkbox"][b-binsbi338x] {
    margin-right: 12px;
    margin-bottom: 0;
    vertical-align: middle;
    height: 20px;
    width: 20px;
}

.checkbox-label span[b-binsbi338x] {
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.button-group[b-binsbi338x] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-binsbi338x] {
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.save-btn.primary[b-binsbi338x] {
    background-color: #015974;
    color: white;
}

.save-btn:hover[b-binsbi338x] {
    background-color: #dfe3e8;
}

.save-btn.primary:hover[b-binsbi338x] {
    background-color: #024d62;
}

.close-btn[b-binsbi338x] {
    display: block;
    margin-top: 20px;
    padding: 12px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    width: 100%;
    text-align: center;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.close-btn:hover[b-binsbi338x] {
    background-color: #dfe3e8;
}

/* Pagination Styles */
.pagination-section[b-binsbi338x] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px;
    border-top: 1px solid #e9ecef;
    margin-top: 10px;
    background-color: #f8f9fa;
    border-radius: 0 0 8px 8px;
}

.page-info[b-binsbi338x] {
    color: #666;
    font-size: 0.9em;
    font-weight: 500;
}

.pagination-buttons[b-binsbi338x] {
    display: flex;
    gap: 5px;
}

.pagination-buttons .btn[b-binsbi338x] {
    min-width: 32px;
    height: 32px;
    padding: 0 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #dee2e6;
    background-color: #fff;
    color: #333;
    cursor: pointer;
    border-radius: 4px;
    transition: all 0.2s ease;
    font-weight: 500;
}

.pagination-buttons .btn:hover:not(:disabled)[b-binsbi338x] {
    background-color: #e9ecef;
    border-color: #adb5bd;
    color: #000;
}

.pagination-buttons .btn-primary[b-binsbi338x] {
    background-color: #015974;
    color: white !important;
    border-color: #015974;
}

.pagination-buttons .btn-primary:hover[b-binsbi338x] {
    background-color: #024d62;
    border-color: #024d62;
}

.pagination-buttons .btn:disabled[b-binsbi338x] {
    cursor: not-allowed;
    opacity: 0.5;
    background-color: #f8f9fa;
    color: #aaa;
}
/* /Pages/AdminDashboard/ProjectStatusHistories.razor.rz.scp.css */
.container[b-gb6047lz5u] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1200px;
    margin: 0 auto;
    border-radius: 20px;
}

.header-section[b-gb6047lz5u] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

.actions-group[b-gb6047lz5u] {
    display: flex;
    align-items: center;
    gap: 15px;
}

.search-input[b-gb6047lz5u] {
    padding: 10px 15px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    width: 300px;
    font-size: 0.95em;
    outline: none;
    transition: all 0.3s ease;
}

.search-input:focus[b-gb6047lz5u] {
    border-color: #015974;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.2);
}

.header-section h2[b-gb6047lz5u] {
    margin: 0;
    color: #fff;
    font-size: 1.8em;
    font-weight: 600;
}

.add-btn[b-gb6047lz5u] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.add-btn:hover[b-gb6047lz5u] {
    background: #f0f9fc;
}

.table-section[b-gb6047lz5u] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

table[b-gb6047lz5u] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

th[b-gb6047lz5u],
td[b-gb6047lz5u] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-gb6047lz5u] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-gb6047lz5u] {
    color: #34495e;
}

.action-btn[b-gb6047lz5u] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-gb6047lz5u] {
    background-color: #28a745;
    color: white;
}

.edit-btn:hover[b-gb6047lz5u] {
    background-color: #218838;
}

.delete-btn[b-gb6047lz5u] {
    background-color: #dc3545;
    color: white;
}

.delete-btn:hover[b-gb6047lz5u] {
    background-color: #c82333;
}

.table-footer[b-gb6047lz5u] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

.modal[b-gb6047lz5u] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-gb6047lz5u] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 800px;
    /* Increased width for horizontal layout */
    max-width: 90%;
    max-height: 80vh;
    /* Limit vertical height */
    overflow-y: auto;
    /* Scroll if content exceeds height */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

.modal-content h3[b-gb6047lz5u] {
    margin-top: 0;
    color: #015974;
    border-bottom: 2px solid #e9ecef;
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-size: 1.6em;
    font-weight: 600;
}

.form-grid[b-gb6047lz5u] {
    display: grid;
    grid-template-columns: 1fr;
    /* Single column by default, adjust as needed */
    gap: 20px;
}

.form-module[b-gb6047lz5u] {
    margin-bottom: 20px;
}

.form-row[b-gb6047lz5u] {
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
}

.form-group[b-gb6047lz5u] {
    flex: 1;
    margin-bottom: 0;
}

.form-group label[b-gb6047lz5u] {
    display: block;
    margin-bottom: 8px;
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.form-group input[b-gb6047lz5u],
.form-group select[b-gb6047lz5u] {
    width: 100%;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    box-sizing: border-box;
    font-size: 1em;
    transition: border-color 0.3s ease;
}

.form-group input:focus[b-gb6047lz5u],
.form-group select:focus[b-gb6047lz5u] {
    border-color: #015974;
    outline: none;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.checkbox-group[b-gb6047lz5u] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-gb6047lz5u] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

.checkbox-label input[type="checkbox"][b-gb6047lz5u] {
    margin-right: 12px;
    margin-bottom: 0;
    vertical-align: middle;
    height: 20px;
    width: 20px;
}

.checkbox-label span[b-gb6047lz5u] {
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.button-group[b-gb6047lz5u] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-gb6047lz5u] {
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.save-btn.primary[b-gb6047lz5u] {
    background-color: #015974;
    color: white;
}

.save-btn:hover[b-gb6047lz5u] {
    background-color: #dfe3e8;
}

.save-btn.primary:hover[b-gb6047lz5u] {
    background-color: #024d62;
}

.close-btn[b-gb6047lz5u] {
    display: block;
    margin-top: 20px;
    padding: 12px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    width: 100%;
    text-align: center;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.close-btn:hover[b-gb6047lz5u] {
    background-color: #dfe3e8;
}

/* Pagination Styles */
.pagination-section[b-gb6047lz5u] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px;
    border-top: 1px solid #e9ecef;
    margin-top: 10px;
    background-color: #f8f9fa;
    border-radius: 0 0 8px 8px;
}

.page-info[b-gb6047lz5u] {
    color: #666;
    font-size: 0.9em;
    font-weight: 500;
}

.pagination-buttons[b-gb6047lz5u] {
    display: flex;
    gap: 5px;
}

.pagination-buttons .btn[b-gb6047lz5u] {
    min-width: 32px;
    height: 32px;
    padding: 0 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #dee2e6;
    background-color: #fff;
    color: #333;
    cursor: pointer;
    border-radius: 4px;
    transition: all 0.2s ease;
    font-weight: 500;
}

.pagination-buttons .btn:hover:not(:disabled)[b-gb6047lz5u] {
    background-color: #e9ecef;
    border-color: #adb5bd;
    color: #000;
}

.pagination-buttons .btn-primary[b-gb6047lz5u] {
    background-color: #015974;
    color: white !important;
    border-color: #015974;
}

.pagination-buttons .btn-primary:hover[b-gb6047lz5u] {
    background-color: #024d62;
    border-color: #024d62;
}

.pagination-buttons .btn:disabled[b-gb6047lz5u] {
    cursor: not-allowed;
    opacity: 0.5;
    background-color: #f8f9fa;
    color: #aaa;
}
/* /Pages/AdminDashboard/ProjectTypes.razor.rz.scp.css */
.container[b-5l2jtsase5] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1500px;
    margin: 0 auto;
    border-radius: 20px
}

.header-section[b-5l2jtsase5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

.header-section h2[b-5l2jtsase5] {
    margin: 0;
    color: #fff;
    font-size: 1.8em;
    font-weight: 600;
}

.add-btn[b-5l2jtsase5] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.add-btn:hover[b-5l2jtsase5] {
    background: #f0f9fc;
}

.actions-group[b-5l2jtsase5] {
    display: flex;
    align-items: center;
    gap: 15px;
}

.search-input[b-5l2jtsase5] {
    padding: 10px 15px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    width: 300px;
    font-size: 0.95em;
    outline: none;
    transition: all 0.3s ease;
}

.search-input:focus[b-5l2jtsase5] {
    border-color: #015974;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.2);
}

.table-section[b-5l2jtsase5] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

table[b-5l2jtsase5] {
    width: 100%;
    border-collapse: collapse;
}

th[b-5l2jtsase5],
td[b-5l2jtsase5] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-5l2jtsase5] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-5l2jtsase5] {
    color: #34495e;
}

.status-dot[b-5l2jtsase5] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    vertical-align: middle;
}

.status-dot[b-5l2jtsase5]::before {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.status-dot.active[b-5l2jtsase5]::before {
    background-color: #28a745;
}

.status-dot.inactive[b-5l2jtsase5]::before {
    background-color: #dc3545;
}

.action-btn[b-5l2jtsase5] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-5l2jtsase5] {
    background-color: #28a745;
    color: white;
}

.edit-btn:hover[b-5l2jtsase5] {
    background-color: #218838;
}

.delete-btn[b-5l2jtsase5] {
    background-color: #dc3545;
    color: white;
}

.delete-btn:hover[b-5l2jtsase5] {
    background-color: #c82333;
}

.table-footer[b-5l2jtsase5] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

.modal[b-5l2jtsase5] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-5l2jtsase5] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 500px;
    max-width: 90%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

.modal-content h3[b-5l2jtsase5] {
    margin-top: 0;
    color: #015974;
    border-bottom: 2px solid #e9ecef;
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-size: 1.6em;
    font-weight: 600;
}

.form-group[b-5l2jtsase5] {
    margin-bottom: 20px;
}

.form-group label[b-5l2jtsase5] {
    display: block;
    margin-bottom: 8px;
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.form-group input[b-5l2jtsase5],
.form-group select[b-5l2jtsase5] {
    width: 100%;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    box-sizing: border-box;
    font-size: 1em;
    transition: border-color 0.3s ease;
}

.form-group input:focus[b-5l2jtsase5],
.form-group select:focus[b-5l2jtsase5] {
    border-color: #015974;
    outline: none;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.checkbox-group[b-5l2jtsase5] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-5l2jtsase5] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

.checkbox-label input[type="checkbox"][b-5l2jtsase5] {
    margin-right: 12px;
    margin-bottom: 0;
    vertical-align: middle;
    height: 20px;
    width: 20px;
}

.checkbox-label span[b-5l2jtsase5] {
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.checklist-section[b-5l2jtsase5] {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #e9ecef;
}

.checklist-section h4[b-5l2jtsase5] {
    margin-bottom: 10px;
    color: #2c3e50;
    font-size: 1.2em;
}

.add-checklist-btn[b-5l2jtsase5] {
    background-color: #015974;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    margin-bottom: 15px;
    font-size: 1em;
}

.add-checklist-btn:hover[b-5l2jtsase5] {
    background-color: #024d62;
}

.checklist-item[b-5l2jtsase5] {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 15px;
    padding: 10px;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    background-color: #f8f9fa;
}

.checklist-item .form-group[b-5l2jtsase5] {
    flex: 1;
    margin-bottom: 0;
}

.delete-checklist-btn[b-5l2jtsase5] {
    background-color: #dc3545;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
}

.delete-checklist-btn:hover[b-5l2jtsase5] {
    background-color: #c82333;
}

.button-group[b-5l2jtsase5] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-5l2jtsase5] {
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.save-btn.primary[b-5l2jtsase5] {
    background-color: #015974;
    color: white;
}

.save-btn:hover[b-5l2jtsase5] {
    background-color: #dfe3e8;
}

.save-btn.primary:hover[b-5l2jtsase5] {
    background-color: #024d62;
}

.close-btn[b-5l2jtsase5] {
    display: block;
    margin-top: 20px;
    padding: 12px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    width: 100%;
    text-align: center;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.close-btn:hover[b-5l2jtsase5] {
    background-color: #dfe3e8;
}

/* Pagination Styles */
.pagination-section[b-5l2jtsase5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px;
    border-top: 1px solid #e9ecef;
    margin-top: 10px;
    background-color: #f8f9fa;
    border-radius: 0 0 8px 8px;
}

.page-info[b-5l2jtsase5] {
    color: #666;
    font-size: 0.9em;
    font-weight: 500;
}

.pagination-buttons[b-5l2jtsase5] {
    display: flex;
    gap: 5px;
}

.pagination-buttons .btn[b-5l2jtsase5] {
    min-width: 32px;
    height: 32px;
    padding: 0 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #dee2e6;
    background-color: #fff;
    color: #333;
    cursor: pointer;
    border-radius: 4px;
    transition: all 0.2s ease;
    font-weight: 500;
}

.pagination-buttons .btn:hover:not(:disabled)[b-5l2jtsase5] {
    background-color: #e9ecef;
    border-color: #adb5bd;
    color: #000;
}

.pagination-buttons .btn-primary[b-5l2jtsase5] {
    background-color: #015974;
    color: white !important;
    border-color: #015974;
}

.pagination-buttons .btn-primary:hover[b-5l2jtsase5] {
    background-color: #024d62;
    border-color: #024d62;
}

.pagination-buttons .btn:disabled[b-5l2jtsase5] {
    cursor: not-allowed;
    opacity: 0.5;
    background-color: #f8f9fa;
    color: #aaa;
}
/* /Pages/AdminDashboard/ProjectUrgencies.razor.rz.scp.css */
.container[b-qtroisc2hb] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1200px;
    width: 100%;
    box-sizing: border-box;
    margin: 0 auto;
}

.header-section[b-qtroisc2hb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

.header-section h2[b-qtroisc2hb] {
    margin: 0;
    color: #fff;
    font-size: 1.8em;
    font-weight: 600;
}

.add-btn[b-qtroisc2hb] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.add-btn:hover[b-qtroisc2hb] {
    background: #f0f9fc;
}

.actions-group[b-qtroisc2hb] {
    display: flex;
    align-items: center;
    gap: 15px;
}

.search-input[b-qtroisc2hb] {
    padding: 10px 15px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    width: 300px;
    font-size: 0.95em;
    outline: none;
    transition: all 0.3s ease;
}

.search-input:focus[b-qtroisc2hb] {
    border-color: #015974;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.2);
}

.table-section[b-qtroisc2hb] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    overflow-x: auto;
    max-width: 100%;
}

table[b-qtroisc2hb] {
    width: 100%;
    border-collapse: collapse;
}

th[b-qtroisc2hb],
td[b-qtroisc2hb] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-qtroisc2hb] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-qtroisc2hb] {
    color: #34495e;
}

.status-dot[b-qtroisc2hb] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 5px;
    vertical-align: middle;
}

.status-dot.active[b-qtroisc2hb] {
    background-color: #28a745;
}

.status-dot.inactive[b-qtroisc2hb] {
    background-color: #dc3545;
}

.action-btn[b-qtroisc2hb] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-qtroisc2hb] {
    background-color: #28a745;
    color: white;
}

.edit-btn:hover[b-qtroisc2hb] {
    background-color: #218838;
}

.delete-btn[b-qtroisc2hb] {
    background-color: #dc3545;
    color: white;
}

.delete-btn:hover[b-qtroisc2hb] {
    background-color: #c82333;
}

.table-footer[b-qtroisc2hb] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

.modal[b-qtroisc2hb] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-qtroisc2hb] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 500px;
    max-width: 90%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
    position: relative;
}

.modal-content h3[b-qtroisc2hb] {
    margin-top: 0;
    color: #015974;
    border-bottom: 2px solid #e9ecef;
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-size: 1.6em;
    font-weight: 600;
}

.form-group[b-qtroisc2hb] {
    margin-bottom: 20px;
}

.form-group label[b-qtroisc2hb] {
    display: block;
    margin-bottom: 8px;
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.form-group input[b-qtroisc2hb],
.form-group select[b-qtroisc2hb] {
    width: 100%;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    box-sizing: border-box;
    font-size: 1em;
    transition: border-color 0.3s ease;
}

.form-group input:focus[b-qtroisc2hb],
.form-group select:focus[b-qtroisc2hb] {
    border-color: #015974;
    outline: none;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.checkbox-group[b-qtroisc2hb] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-qtroisc2hb] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

.checkbox-label input[type="checkbox"][b-qtroisc2hb] {
    margin-right: 12px;
    margin-bottom: 0;
    vertical-align: middle;
    height: 20px;
    width: 20px;
}

.checkbox-label span[b-qtroisc2hb] {
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.button-group[b-qtroisc2hb] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-qtroisc2hb] {
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.save-btn.primary[b-qtroisc2hb] {
    background-color: #015974;
    color: white;
}

.save-btn:hover[b-qtroisc2hb] {
    background-color: #dfe3e8;
}

.save-btn.primary:hover[b-qtroisc2hb] {
    background-color: #024d62;
}

.close-btn[b-qtroisc2hb] {
    display: block;
    margin-top: 20px;
    padding: 12px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    width: 100%;
    text-align: center;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.close-btn:hover[b-qtroisc2hb] {
    background-color: #dfe3e8;
}

/* Pagination Styles */
.pagination-section[b-qtroisc2hb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px;
    border-top: 1px solid #e9ecef;
    margin-top: 10px;
    background-color: #f8f9fa;
    border-radius: 0 0 8px 8px;
}

.page-info[b-qtroisc2hb] {
    color: #666;
    font-size: 0.9em;
    font-weight: 500;
}

.pagination-buttons[b-qtroisc2hb] {
    display: flex;
    gap: 5px;
}

.pagination-buttons .btn[b-qtroisc2hb] {
    min-width: 32px;
    height: 32px;
    padding: 0 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #dee2e6;
    background-color: #fff;
    color: #333;
    cursor: pointer;
    border-radius: 4px;
    transition: all 0.2s ease;
    font-weight: 500;
}

.pagination-buttons .btn:hover:not(:disabled)[b-qtroisc2hb] {
    background-color: #e9ecef;
    border-color: #adb5bd;
    color: #000;
}

.pagination-buttons .btn-primary[b-qtroisc2hb] {
    background-color: #015974;
    color: white !important;
    border-color: #015974;
}

.pagination-buttons .btn-primary:hover[b-qtroisc2hb] {
    background-color: #024d62;
    border-color: #024d62;
}

.pagination-buttons .btn:disabled[b-qtroisc2hb] {
    cursor: not-allowed;
    opacity: 0.5;
    background-color: #f8f9fa;
    color: #aaa;
}
/* /Pages/AdminDashboard/ReportTypes.razor.rz.scp.css */
.container[b-8pojzli0ev] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1200px;
    margin: 0 auto;
}

.header-section[b-8pojzli0ev] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

.header-section h2[b-8pojzli0ev] {
    margin: 0;
    color: #fff;
    font-size: 1.8em;
    font-weight: 600;
}

.add-btn[b-8pojzli0ev] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.add-btn:hover[b-8pojzli0ev] {
    background: #f0f9fc;
}

.search-bar[b-8pojzli0ev] {
    display: flex;
    margin-bottom: 20px;
}

.search-bar input[b-8pojzli0ev] {
    flex: 1;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 6px 0 0 6px;
    font-size: 1em;
    transition: border-color 0.3s ease;
}

.search-bar input:focus[b-8pojzli0ev] {
    border-color: #015974;
    outline: none;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.search-bar button[b-8pojzli0ev] {
    padding: 12px 20px;
    background-color: #015974;
    color: white;
    border: none;
    border-radius: 0 6px 6px 0;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.search-bar button:hover[b-8pojzli0ev] {
    background-color: #024d62;
}

.table-section[b-8pojzli0ev] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

table[b-8pojzli0ev] {
    width: 100%;
    border-collapse: collapse;
}

th[b-8pojzli0ev],
td[b-8pojzli0ev] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-8pojzli0ev] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-8pojzli0ev] {
    color: #34495e;
}

.status-dot[b-8pojzli0ev] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    vertical-align: middle;
}

.status-dot[b-8pojzli0ev]::before {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.status-dot.active[b-8pojzli0ev]::before {
    background-color: #28a745;
}

.status-dot.inactive[b-8pojzli0ev]::before {
    background-color: #dc3545;
}

.action-btn[b-8pojzli0ev] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-8pojzli0ev] {
    background-color: #28a745;
    color: white;
}

.edit-btn:hover[b-8pojzli0ev] {
    background-color: #218838;
}

.delete-btn[b-8pojzli0ev] {
    background-color: #dc3545;
    color: white;
}

.delete-btn:hover[b-8pojzli0ev] {
    background-color: #c82333;
}

.table-footer[b-8pojzli0ev] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

.modal[b-8pojzli0ev] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-8pojzli0ev] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 500px;
    max-width: 90%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

.modal-content h3[b-8pojzli0ev] {
    margin-top: 0;
    color: #015974;
    border-bottom: 2px solid #e9ecef;
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-size: 1.6em;
    font-weight: 600;
}

.form-group[b-8pojzli0ev] {
    margin-bottom: 20px;
}

.form-group label[b-8pojzli0ev] {
    display: block;
    margin-bottom: 8px;
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.form-group input[b-8pojzli0ev],
.form-group select[b-8pojzli0ev] {
    width: 100%;
    padding: 12px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    box-sizing: border-box;
    font-size: 1em;
    transition: border-color 0.3s ease;
}

.form-group input:focus[b-8pojzli0ev],
.form-group select:focus[b-8pojzli0ev] {
    border-color: #015974;
    outline: none;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

.checkbox-group[b-8pojzli0ev] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-8pojzli0ev] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

.checkbox-label input[type="checkbox"][b-8pojzli0ev] {
    margin-right: 12px;
    margin-bottom: 0;
    vertical-align: middle;
    height: 20px;
    width: 20px;
}

.checkbox-label span[b-8pojzli0ev] {
    color: #2c3e50;
    font-weight: 500;
    font-size: 1em;
}

.error[b-8pojzli0ev] {
    color: #dc3545;
    margin-bottom: 15px;
    padding: 10px;
    background-color: #ffebee;
    border-radius: 4px;
}

.button-group[b-8pojzli0ev] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-8pojzli0ev] {
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.save-btn.primary[b-8pojzli0ev] {
    background-color: #015974;
    color: white;
}

.save-btn:hover[b-8pojzli0ev] {
    background-color: #dfe3e8;
}

.save-btn.primary:hover[b-8pojzli0ev] {
    background-color: #024d62;
}

.close-btn[b-8pojzli0ev] {
    display: block;
    margin-top: 20px;
    padding: 12px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    width: 100%;
    text-align: center;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

.close-btn:hover[b-8pojzli0ev] {
    background-color: #dfe3e8;
}
/* /Pages/AdminDashboard/StripeProduct.razor.rz.scp.css */
.container[b-nbkpnhfs35] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1200px;
    margin: 0 auto;
    border-radius: 20px;
}

.header-section[b-nbkpnhfs35] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

    .header-section h2[b-nbkpnhfs35] {
        margin: 0;
        color: #fff;
        font-size: 1.8em;
        font-weight: 600;
    }

.add-btn[b-nbkpnhfs35] {
    background: #fff;
    color: #015974; font-weight: 700;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .add-btn:hover[b-nbkpnhfs35] {
        background: #f0f9fc;
    }

.table-section[b-nbkpnhfs35] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

table[b-nbkpnhfs35] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

th[b-nbkpnhfs35], td[b-nbkpnhfs35] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-nbkpnhfs35] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-nbkpnhfs35] {
    color: #34495e;
}

.action-btn[b-nbkpnhfs35] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-nbkpnhfs35] {
    background-color: #28a745;
    color: white;
}

    .edit-btn:hover[b-nbkpnhfs35] {
        background-color: #218838;
    }

.delete-btn[b-nbkpnhfs35] {
    background-color: #dc3545;
    color: white;
}

    .delete-btn:hover[b-nbkpnhfs35] {
        background-color: #c82333;
    }

.table-footer[b-nbkpnhfs35] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

.modal[b-nbkpnhfs35] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-nbkpnhfs35] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 800px;
    max-width: 90%;
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

    .modal-content h3[b-nbkpnhfs35] {
        margin-top: 0;
        color: #015974;
        border-bottom: 2px solid #e9ecef;
        padding-bottom: 10px;
        margin-bottom: 20px;
        font-size: 1.6em;
        font-weight: 600;
    }

    .modal-content h4[b-nbkpnhfs35] {
        margin-top: 20px;
        color: #2c3e50;
        font-size: 1.4em;
        font-weight: 600;
        margin-bottom: 15px;
    }

.form-grid[b-nbkpnhfs35] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

.form-module[b-nbkpnhfs35] {
    margin-bottom: 20px;
}

.form-row[b-nbkpnhfs35] {
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
}

.form-group[b-nbkpnhfs35] {
    flex: 1;
    margin-bottom: 0;
}

    .form-group label[b-nbkpnhfs35] {
        display: block;
        margin-bottom: 8px;
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

    .form-group input[b-nbkpnhfs35],
    .form-group select[b-nbkpnhfs35] {
        width: 100%;
        padding: 12px;
        border: 1px solid #ced4da;
        border-radius: 6px;
        box-sizing: border-box;
        font-size: 1em;
        transition: border-color 0.3s ease;
    }

        .form-group input:focus[b-nbkpnhfs35],
        .form-group select:focus[b-nbkpnhfs35] {
            border-color: #015974;
            outline: none;
            box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
        }

.checkbox-group[b-nbkpnhfs35] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-nbkpnhfs35] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

    .checkbox-label input[type="checkbox"][b-nbkpnhfs35] {
        margin-right: 12px;
        margin-bottom: 0;
        vertical-align: middle;
        height: 20px;
        width: 20px;
    }

    .checkbox-label span[b-nbkpnhfs35] {
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

.price-entry[b-nbkpnhfs35] {
    margin-bottom: 20px;
    padding: 15px;
    background-color: #f8f9fa;
    border-radius: 6px;
    position: relative;
}

.add-price-btn[b-nbkpnhfs35] {
    background-color: #28a745;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .add-price-btn:hover[b-nbkpnhfs35] {
        background-color: #218838;
    }

.delete-price-btn[b-nbkpnhfs35] {
    background-color: #dc3545;
    color: white;
    padding: 8px 15px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

    .delete-price-btn:hover[b-nbkpnhfs35] {
        background-color: #c82333;
    }

.button-group[b-nbkpnhfs35] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 20px;
}

.save-btn[b-nbkpnhfs35] {
    background-color: #015974;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
}

    .save-btn:hover[b-nbkpnhfs35] {
        background-color: #024d62;
    }

.close-btn[b-nbkpnhfs35] {
    background-color: #6c757d;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
}

    .close-btn:hover[b-nbkpnhfs35] {
        background-color: #5a6268;
    }
/* /Pages/AdminDashboard/UnpaidInvoiceList.razor.rz.scp.css */
.page-wrapper[b-zgch46gwxx] {
    padding: 24px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1500px;
    width: 100%;
    box-sizing: border-box;
    margin: 0 auto;
}

.page-header[b-zgch46gwxx] {
    margin-bottom: 24px;
    padding: 20px 24px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.07);
    
    display: flex;
    align-items: center;
    gap: 12px;
}

.header-icon[b-zgch46gwxx] {
    font-size: 1.5rem;
    line-height: 1;
}

.page-title[b-zgch46gwxx] {
    margin: 0;
    font-size: 1.65rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.01em;
}

.content-card[b-zgch46gwxx] {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid #e9ecef;
    overflow: hidden;
}

/* ─── Search Bar ─── */
.toolbar[b-zgch46gwxx] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 16px 20px;
    background: #f8f9fa;
    border-bottom: 1px solid #e9ecef;
}

.search-bar[b-zgch46gwxx] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #ffffff;
    border: 1px solid #ced4da;
    border-radius: 8px;
    padding: 8px 14px;
    min-width: 320px;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.search-bar:focus-within[b-zgch46gwxx] {
    border-color: #dc3545;
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1);
}

.search-icon[b-zgch46gwxx] {
    width: 16px;
    height: 16px;
    color: #6c757d;
    flex-shrink: 0;
}

.search-input[b-zgch46gwxx] {
    border: none;
    outline: none;
    font-size: 0.9rem;
    color: #2c3e50;
    background: transparent;
    flex: 1;
    min-width: 0;
}

.search-input[b-zgch46gwxx]::placeholder {
    color: #adb5bd;
}

/* ─── Table Section ─── */
.table-section[b-zgch46gwxx] {
    overflow-x: auto;
}

table[b-zgch46gwxx] {
    width: 100%;
    border-collapse: collapse;
}

thead tr[b-zgch46gwxx] {
    background: #f1f3f5;
    border-bottom: 2px solid #dee2e6;
}

th[b-zgch46gwxx] {
    padding: 12px 16px;
    text-align: left;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #6c757d;
    white-space: nowrap;
}

td[b-zgch46gwxx] {
    padding: 14px 16px;
    color: #2c3e50;
    font-size: 0.9rem;
    border-bottom: 1px solid #f1f3f5;
    vertical-align: middle;
}

tbody tr[b-zgch46gwxx] {
    transition: background 0.15s ease;
}

tbody tr:hover[b-zgch46gwxx] {
    background: #fff8f8;
}

tbody tr:last-child td[b-zgch46gwxx] {
    border-bottom: none;
}

/* ─── Table Cell Helpers ─── */
.invoice-ref[b-zgch46gwxx] {
    font-family: 'Courier New', monospace;
    font-size: 0.82rem;
    font-weight: 700;
    color: #c0392b;
    letter-spacing: 0.05em;
}

.customer-name[b-zgch46gwxx] {
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 3px;
}

.customer-email[b-zgch46gwxx] {
    font-size: 0.8rem;
    color: #6c757d;
}

.date-cell[b-zgch46gwxx] {
    white-space: nowrap;
    color: #495057;
    font-size: 0.85rem;
}

.center-cell[b-zgch46gwxx] {
    text-align: center;
}

.project-count-badge[b-zgch46gwxx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: #e9ecef;
    border-radius: 50%;
    font-size: 0.82rem;
    font-weight: 700;
    color: #495057;
}

.amount-cell[b-zgch46gwxx] {
    font-weight: 600;
    color: #2c3e50;
    white-space: nowrap;
}

/* ─── Status Badges ─── */
.status-badge[b-zgch46gwxx] {
    display: inline-block;
    padding: 4px 11px;
    border-radius: 20px;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    white-space: nowrap;
}

.status-paid[b-zgch46gwxx]     { background: #d4edda; color: #155724; }
.status-pending[b-zgch46gwxx]  { background: #fff3cd; color: #856404; }
.status-finalised[b-zgch46gwxx]{ background: #d1ecf1; color: #0c5460; }
.status-rejected[b-zgch46gwxx] { background: #f8d7da; color: #721c24; }
.status-draft[b-zgch46gwxx]    { background: #e2e3e5; color: #383d41; }

/* ─── Rejection Reason Preview ─── */
.rejection-reason-preview[b-zgch46gwxx] {
    display: flex;
    align-items: flex-start;
    gap: 4px;
    margin-top: 5px;
    color: #721c24;
    font-size: 0.78rem;
    font-style: italic;
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ─── View Button ─── */
.view-btn[b-zgch46gwxx] {
    padding: 6px 16px;
    background: #2d7a7a;
    color: #ffffff;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 500;
    transition: background 0.2s ease, transform 0.1s;
    white-space: nowrap;
}

.view-btn:hover[b-zgch46gwxx] {
    background: #236060;
    transform: translateY(-1px);
}

.view-btn:active[b-zgch46gwxx] {
    transform: translateY(0);
}

/* ─── Empty State ─── */
.empty-state[b-zgch46gwxx] {
    padding: 56px 20px;
    text-align: center;
}

.empty-content[b-zgch46gwxx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.empty-content svg[b-zgch46gwxx] {
    width: 52px;
    height: 52px;
    color: #ced4da;
}

.empty-content p[b-zgch46gwxx] {
    margin: 0;
    font-size: 0.95rem;
    color: #6c757d;
}

/* ─── Loading State ─── */
.loading-state[b-zgch46gwxx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 64px 20px;
    gap: 14px;
    color: #6c757d;
    font-size: 0.9rem;
}

.spinner[b-zgch46gwxx] {
    width: 36px;
    height: 36px;
    border: 3px solid #e9ecef;
    border-top-color: #dc3545;
    border-radius: 50%;
    animation: spin-b-zgch46gwxx 0.75s linear infinite;
}

@keyframes spin-b-zgch46gwxx {
    to { transform: rotate(360deg); }
}

/* ─── Pagination ─── */
.pagination-section[b-zgch46gwxx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 14px 20px;
    background: #f8f9fa;
    border-top: 1px solid #e9ecef;
}

.page-info[b-zgch46gwxx] {
    font-size: 0.875rem;
    color: #6c757d;
}

.page-info strong[b-zgch46gwxx] {
    color: #2c3e50;
}

.record-count[b-zgch46gwxx] {
    margin-left: 4px;
    color: #adb5bd;
}

.pagination-buttons[b-zgch46gwxx] {
    display: flex;
    gap: 4px;
}

.page-btn[b-zgch46gwxx] {
    min-width: 34px;
    height: 34px;
    padding: 0 8px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #dee2e6;
    background: #ffffff;
    color: #495057;
    cursor: pointer;
    border-radius: 6px;
    font-size: 0.9rem;
    font-weight: 500;
    transition: all 0.15s ease;
    user-select: none;
}

.page-btn:hover:not(:disabled)[b-zgch46gwxx] {
    background: #e9ecef;
    border-color: #adb5bd;
    color: #212529;
}

.page-btn.active[b-zgch46gwxx] {
    background: #dc3545;
    border-color: #dc3545;
    color: #ffffff;
    font-weight: 700;
    cursor: default;
}

.page-btn:disabled[b-zgch46gwxx] {
    cursor: not-allowed;
    opacity: 0.4;
    background: #f8f9fa;
    color: #aaa;
    border-color: #e9ecef;
}

/* ─── Responsive ─── */
@media (max-width: 768px) {
    .page-wrapper[b-zgch46gwxx] { padding: 16px; }

    .toolbar[b-zgch46gwxx] {
        justify-content: stretch;
    }

    .search-bar[b-zgch46gwxx] {
        min-width: unset;
        width: 100%;
    }

    .pagination-section[b-zgch46gwxx] {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
}
/* /Pages/AdminDashboard/Users.razor.rz.scp.css */
.container[b-kug6un33l2] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1500px;
    margin: 0 auto;
    border-radius: 20px;
}

.header-section[b-kug6un33l2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 25px;
    padding: 18px 24px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
}

.header-actions[b-kug6un33l2] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.search-input[b-kug6un33l2] {
    padding: 8px 14px;
    border: 1.5px solid rgba(255,255,255,0.35);
    border-radius: 6px;
    font-size: 0.875em;
    width: 260px;
    max-width: 100%;
    background: rgba(255,255,255,0.15);
    color: #fff;
    transition: all 0.2s;
    outline: none;
}

.search-input[b-kug6un33l2]::placeholder { color: rgba(255,255,255,0.65); }

.search-input:focus[b-kug6un33l2] {
    border-color: rgba(255,255,255,0.7);
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.15);
}

.header-section h2[b-kug6un33l2] {
    margin: 0;
    color: #fff;
    font-size: 1.4em;
    font-weight: 700;
}

.add-btn[b-kug6un33l2],
.save-btn[b-kug6un33l2],
.close-btn[b-kug6un33l2],
.delete-btn[b-kug6un33l2],
.action-btn[b-kug6un33l2] {
    padding: 10px 18px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.95em;
    font-weight: 500;
    transition: background-color 0.3s ease, transform 0.2s;
}

.add-btn[b-kug6un33l2],
.save-btn.primary[b-kug6un33l2] {
    background: #fff;
    color: #015974;
    font-weight: 700;
}

.add-btn:hover[b-kug6un33l2],
.save-btn.primary:hover[b-kug6un33l2] {
    background: #f0f9fc;
    transform: translateY(-2px);
}

.close-btn[b-kug6un33l2] {
    background-color: #6c757d;
    color: #fff;
}

.close-btn:hover[b-kug6un33l2] {
    background-color: #5a6268;
}

.delete-btn[b-kug6un33l2] {
    background-color: #dc3545;
    color: #fff;
}

.delete-btn:hover[b-kug6un33l2] {
    background-color: #b02a37;
}

.action-btn[b-kug6un33l2] {
    margin-right: 8px;
}

.edit-btn[b-kug6un33l2] {
    background-color: #015974;
    color: #fff;
}

.edit-btn:hover[b-kug6un33l2] {
    background-color: #117a8b;
}

.table-section[b-kug6un33l2] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
    overflow-x: auto;
}

.table-section table[b-kug6un33l2] {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 10px;
}

.table-section th[b-kug6un33l2],
.table-section td[b-kug6un33l2] {
    border: 1px solid #dee2e6;
    padding: 12px 15px;
    text-align: left;
    font-size: 0.95em;
}

.table-section th[b-kug6un33l2] {
    background-color: #f1f3f5;
    color: #495057;
    font-weight: 600;
}

.table-section tr:nth-child(even)[b-kug6un33l2] {
    background-color: #f8f9fa;
}

.table-section tr:hover[b-kug6un33l2] {
    background-color: #e9ecef;
}

.table-footer[b-kug6un33l2] {
    font-size: 0.9em;
    color: #6c757d;
    padding: 5px 0;
}

.form-grid[b-kug6un33l2] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
}

.card[b-kug6un33l2] {
    padding: 20px;
    background-color: #ffffff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

.card h3[b-kug6un33l2],
.card h4[b-kug6un33l2] {
    margin-top: 0;
    margin-bottom: 15px;
    font-size: 1.2em;
    color: #2c3e50;
}

.form-group[b-kug6un33l2] {
    margin-bottom: 15px;
    display: flex;
    flex-direction: column;
}

/* Ensure form groups can shrink within rows and not overflow */
.form-row .form-group[b-kug6un33l2] {
    flex: 1 1 240px;
    min-width: 0;
}

.form-group label[b-kug6un33l2] {
    font-size: 0.9em;
    margin-bottom: 6px;
    font-weight: 500;
    color: #495057;
}

.form-group input:not([type="checkbox"])[b-kug6un33l2],
.form-group select[b-kug6un33l2] {
    padding: 8px 10px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    font-size: 0.95em;
    outline: none;
    transition: border-color 0.2s;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.form-group input:focus[b-kug6un33l2],
.form-group select:focus[b-kug6un33l2] {
    border-color: #015974;
}

.form-row[b-kug6un33l2] {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.checkbox-group[b-kug6un33l2] {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.checkbox-label[b-kug6un33l2] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    margin-bottom: 0;
}

.checkbox-label input[type="checkbox"][b-kug6un33l2] {
    margin: 0;
}

.modal[b-kug6un33l2] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 20px;
    overflow-y: auto;
    z-index: 1050;
}

.modal-content[b-kug6un33l2] {
    background-color: #fff;
    padding: 25px;
    border-radius: 10px;
    width: 100%;
    max-width: 960px;
    max-height: calc(100vh - 80px);
    overflow-y: auto;
    box-sizing: border-box;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

.modal-content h3[b-kug6un33l2] {
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 1.4em;
    color: #2c3e50;
}

.button-group[b-kug6un33l2] {
    display: flex;
    gap: 12px;
    margin-top: 20px;
}

.error[b-kug6un33l2] {
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 10px 14px;
    background-color: #fff3f3;
    border: 1px solid #f5c2c2;
    border-left: 4px solid #dc3545;
    border-radius: 4px;
    color: #dc3545;
    font-weight: 500;
    font-size: 0.95em;
}

.success[b-kug6un33l2] {
    margin-top: 15px;
    color: #28a745;
    font-weight: 500;
    font-size: 0.95em;
}

.text-center[b-kug6un33l2] {
    text-align: center;
}

/* Tabs logic */
.tabs-container[b-kug6un33l2] {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
    border-bottom: 2px solid #f1f3f5;
    padding-bottom: 5px;
}

.tab-btn[b-kug6un33l2] {
    padding: 10px 25px;
    border: none;
    background: none;
    font-size: 1.1em;
    font-weight: 500;
    color: #6c757d;
    cursor: pointer;
    transition: all 0.3s ease;
    border-radius: 8px 8px 0 0;
    position: relative;
}

.tab-btn:hover[b-kug6un33l2] {
    color: #015974;
    background-color: #f8f9fa;
}

.tab-btn.active[b-kug6un33l2] {
    color: #015974;
    font-weight: 600;
}

.tab-btn.active[b-kug6un33l2]::after {
    content: '';
    position: absolute;
    bottom: -7px;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: #015974;
    border-radius: 3px;
}

.role-badge[b-kug6un33l2] {
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 0.85em;
    font-weight: 600;
    background-color: #e9ecef;
    color: #495057;
    display: inline-block;
}

/* -------------------- Pagination -------------------- */
.pagination-section[b-kug6un33l2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 12px 0 4px 0;
    border-top: 1px solid #e9ecef;
    margin-top: 8px;
}

.page-info[b-kug6un33l2] {
    color: #6c757d;
    font-size: 0.875rem;
    font-weight: 500;
}

.pagination-buttons[b-kug6un33l2] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
}

.pagination-buttons .page-btn[b-kug6un33l2] {
    min-width: 34px;
    height: 34px;
    padding: 0 8px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #dee2e6;
    background-color: #fff;
    color: #495057;
    cursor: pointer;
    border-radius: 6px;
    font-weight: 500;
    font-size: 1rem;
    line-height: 1;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
    user-select: none;
}

.pagination-buttons .page-btn:hover:not(:disabled)[b-kug6un33l2] {
    background-color: #e9ecef;
    border-color: #adb5bd;
    color: #212529;
}

.pagination-buttons .page-btn.active[b-kug6un33l2] {
    background-color: #015974;
    border-color: #015974;
    color: #fff;
    font-weight: 600;
}

.pagination-buttons .page-btn.active:hover[b-kug6un33l2] {
    background-color: #024d62;
    border-color: #024d62;
}

.pagination-buttons .page-btn:disabled[b-kug6un33l2] {
    cursor: not-allowed;
    opacity: 0.4;
    background-color: #f8f9fa;
    color: #aaa;
    border-color: #e9ecef;
}

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

    .form-row[b-kug6un33l2] {
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    .header-section[b-kug6un33l2] {
        flex-direction: column;
        align-items: stretch;
    }

    .header-actions[b-kug6un33l2] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-input[b-kug6un33l2] {
        width: 100%;
    }

    .add-btn[b-kug6un33l2] {
        width: 100%;
        text-align: center;
    }

    .pagination-section[b-kug6un33l2] {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
}
/* /Pages/Auth/AccessGranted.razor.rz.scp.css */
.granted-container[b-tq2tvw21bz] {
    max-width: 420px;
    margin: 0 auto;
    padding: 40px 24px;
    text-align: center;
}

.logo-container[b-tq2tvw21bz] {
    margin-bottom: 24px;
}

.success-badge[b-tq2tvw21bz] {
    font-size: 3.5rem;
    margin-bottom: 16px;
}

.page-title[b-tq2tvw21bz] {
    font-size: 2rem;
    font-weight: 800;
    color: #1a1a1a;
    margin-bottom: 8px;
}

.body-text[b-tq2tvw21bz] {
    font-size: 1rem;
    color: #6b7280;
    margin-bottom: 28px;
}

.status-card[b-tq2tvw21bz] {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 16px 20px;
    margin-bottom: 28px;
    text-align: left;
}

.status-row[b-tq2tvw21bz] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.status-chip[b-tq2tvw21bz] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
}

.status-chip.verified[b-tq2tvw21bz] {
    background: #dcfce7;
    color: #166534;
}

.status-chip.pending-chip[b-tq2tvw21bz] {
    background: #fef9c3;
    color: #854d0e;
}

.status-dot[b-tq2tvw21bz] {
    color: #d1d5db;
}

.status-note[b-tq2tvw21bz] {
    font-size: 0.875rem;
    color: #6b7280;
    margin: 0;
    line-height: 1.5;
}

.btn-primary[b-tq2tvw21bz] {
    padding: 13px 40px;
    background: #015974;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
    display: inline-block;
}

.btn-primary:hover[b-tq2tvw21bz] {
    background: #0040cc;
}
/* /Pages/Auth/CheckInbox.razor.rz.scp.css */
.inbox-container[b-sn3gmnb4mx] {
    max-width: 420px;
    margin: 0 auto;
    padding: 40px 24px;
    text-align: center;
}

.logo-container[b-sn3gmnb4mx] {
    margin-bottom: 24px;
}

.inbox-icon[b-sn3gmnb4mx] {
    font-size: 3rem;
    margin-bottom: 16px;
}

.page-title[b-sn3gmnb4mx] {
    font-size: 1.75rem;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 12px;
}

.body-text[b-sn3gmnb4mx] {
    font-size: 1rem;
    color: #444;
    margin-bottom: 8px;
    line-height: 1.6;
}

.email-highlight[b-sn3gmnb4mx] {
    color: #015974;
}

.instruction[b-sn3gmnb4mx] {
    font-size: 0.95rem;
    color: #666;
    margin-bottom: 28px;
}

.resend-section[b-sn3gmnb4mx] {
    margin-bottom: 16px;
}

.btn-primary[b-sn3gmnb4mx] {
    padding: 12px 32px;
    background: #015974;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: background 0.15s;
    min-width: 180px;
    justify-content: center;
}

.btn-primary:hover:not(:disabled)[b-sn3gmnb4mx] {
    background: #0040cc;
}

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

.alert[b-sn3gmnb4mx] {
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 0.875rem;
    margin: 12px auto;
    max-width: 340px;
}

.alert-success[b-sn3gmnb4mx] {
    background: #f0fdf4;
    border: 1px solid #86efac;
    color: #166534;
}

.alert-error[b-sn3gmnb4mx] {
    background: #fef2f2;
    border: 1px solid #fca5a5;
    color: #b91c1c;
}

.troubleshoot[b-sn3gmnb4mx] {
    margin: 24px auto;
    max-width: 340px;
    text-align: left;
    font-size: 0.875rem;
    color: #6b7280;
}

.troubleshoot summary[b-sn3gmnb4mx] {
    cursor: pointer;
    font-weight: 600;
    color: #374151;
    list-style: none;
    padding: 4px 0;
}

.troubleshoot summary[b-sn3gmnb4mx]::-webkit-details-marker {
    display: none;
}

.troubleshoot summary[b-sn3gmnb4mx]::before {
    content: '+ ';
}

details[open] summary[b-sn3gmnb4mx]::before {
    content: '− ';
}

.troubleshoot ul[b-sn3gmnb4mx] {
    margin: 8px 0 0 0;
    padding-left: 20px;
    line-height: 1.8;
}

.troubleshoot a[b-sn3gmnb4mx] {
    color: #015974;
    text-decoration: underline;
}

.security-note[b-sn3gmnb4mx] {
    font-size: 0.75rem;
    color: #9ca3af;
    margin-top: 24px;
}

.spinner[b-sn3gmnb4mx] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255,255,255,0.4);
    border-top-color: #fff;
    border-radius: 50%;
    display: inline-block;
    animation: spin 0.6s linear infinite;
}

@@keyframes spin {
    to[b-sn3gmnb4mx] { transform: rotate(360deg); }
}
/* /Pages/Auth/ForgotPassword.razor.rz.scp.css */
.spinner-btn[b-9mz3ucu23m] {
        display: inline-block;
        width: 16px;
        height: 16px;
        border: 2px solid rgba(255,255,255,0.3);
        border-top-color: #fff;
        border-radius: 50%;
        animation: spin-b-9mz3ucu23m 0.6s linear infinite;
        vertical-align: middle;
        margin-right: 6px;
    }

    @keyframes spin-b-9mz3ucu23m {
        to { transform: rotate(360deg); }
    }

    button:disabled[b-9mz3ucu23m] {
        opacity: 0.7;
        cursor: not-allowed;
    }
/* /Pages/Auth/GetAccess.razor.rz.scp.css */
/* ── Wrapper ─────────────────────────────────────────────── */
.ga-wrap[b-kas9m7dnqo] {
    width: 100%;
}

/* ── Header ──────────────────────────────────────────────── */
.ga-header[b-kas9m7dnqo] {
    margin-bottom: 28px;
}

.ga-title[b-kas9m7dnqo] {
    font-size: 1.6rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 6px 0;
    letter-spacing: -0.3px;
    line-height: 1.2;
}

.ga-subtitle[b-kas9m7dnqo] {
    font-size: 0.9rem;
    color: #6b7280;
    margin: 0;
    line-height: 1.5;
}

/* ── Form ────────────────────────────────────────────────── */
.ga-form[b-kas9m7dnqo] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* ── Field ───────────────────────────────────────────────── */
.ga-field[b-kas9m7dnqo] {
    margin-bottom: 16px;
}

.ga-label[b-kas9m7dnqo] {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 7px;
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

.ga-input-wrap[b-kas9m7dnqo] {
    position: relative;
    display: block;
}

/* Icon styles handled inline to avoid Blazor scoped-CSS specificity issues */
.ga-input-icon[b-kas9m7dnqo] {
    position: absolute;
    left: 13px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    pointer-events: none;
    z-index: 2;
}

.ga-input[b-kas9m7dnqo] {
    width: 100%;
    padding: 12px 14px 12px 42px !important;
    border: 1.5px solid #e5e7eb;
    border-radius: 10px;
    font-size: 0.95rem;
    color: #111827;
    background: #f9fafb;
    transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
    box-sizing: border-box;
}

.ga-input:focus[b-kas9m7dnqo] {
    outline: none;
    border-color: #015974;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(1, 89, 116, 0.1);
}

.ga-input[b-kas9m7dnqo]::placeholder {
    color: #b0b7c3;
}

.ga-error[b-kas9m7dnqo] {
    display: block;
    font-size: 0.8rem;
    color: #dc2626;
    margin-top: 5px;
    padding-left: 2px;
}

/* ── Alert ───────────────────────────────────────────────── */
.ga-alert[b-kas9m7dnqo] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    color: #b91c1c;
    font-size: 0.85rem;
    padding: 10px 13px;
    margin-bottom: 14px;
}

/* ── Primary Button — sidebar gradient: teal → brown ─────── */
.ga-btn[b-kas9m7dnqo] {
    width: 100% !important;
    padding: 13px 16px !important;
    background: linear-gradient(190deg, #015974, #9D6023) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 10px !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    transition: opacity 0.2s, transform 0.15s, box-shadow 0.15s !important;
    box-shadow: 0 3px 12px rgba(1, 89, 116, 0.3) !important;
    letter-spacing: 0.2px !important;
    margin-bottom: 14px !important;
    transform: none !important;
}

.ga-btn:hover:not(:disabled)[b-kas9m7dnqo] {
    opacity: 0.9 !important;
    box-shadow: 0 5px 18px rgba(1, 89, 116, 0.4) !important;
    transform: translateY(-1px) !important;
}

.ga-btn:active:not(:disabled)[b-kas9m7dnqo] {
    opacity: 1 !important;
    transform: translateY(0) !important;
    box-shadow: 0 2px 6px rgba(1, 89, 116, 0.2) !important;
}

.ga-btn:disabled[b-kas9m7dnqo] {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
    transform: none !important;
}

/* ── Hint line under button ──────────────────────────────── */
.ga-hint[b-kas9m7dnqo] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-size: 0.75rem;
    color: #9ca3af;
    margin-bottom: 20px;
}

/* ── Divider ─────────────────────────────────────────────── */
.ga-divider[b-kas9m7dnqo] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    color: #d1d5db;
    font-size: 0.8rem;
}

.ga-divider[b-kas9m7dnqo]::before,
.ga-divider[b-kas9m7dnqo]::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}

.ga-divider span[b-kas9m7dnqo] {
    color: #9ca3af;
    font-size: 0.78rem;
    font-weight: 500;
}

/* ── Alt button (no work email) ──────────────────────────── */
.ga-alt-btn[b-kas9m7dnqo] {
    display: block;
    width: 100%;
    padding: 11px 16px;
    border: 1.5px solid #e5e7eb;
    border-radius: 10px;
    font-size: 0.88rem;
    font-weight: 500;
    color: #4b5563;
    text-align: center;
    text-decoration: none !important;
    background: #fff;
    transition: border-color 0.15s, color 0.15s, background 0.15s;
    margin-bottom: 0;
    box-sizing: border-box;
}

.ga-alt-btn:hover[b-kas9m7dnqo] {
    border-color: #015974;
    color: #015974;
    background: #f0f9ff;
}

/* ── Legal text ──────────────────────────────────────────── */
.ga-legal[b-kas9m7dnqo] {
    font-size: 0.72rem;
    color: #9ca3af;
    margin-top: 18px;
    text-align: center;
    line-height: 1.6;
}

.ga-legal a[b-kas9m7dnqo] {
    color: #015974;
    text-decoration: underline;
}

/* ── Sent state ──────────────────────────────────────────── */
.ga-sent[b-kas9m7dnqo] {
    text-align: center;
    padding: 8px 0 4px;
}

.ga-sent-icon[b-kas9m7dnqo] {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #e0f2fe;
    border: 1.5px solid #7dd3dc;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 18px;
}

.ga-sent-title[b-kas9m7dnqo] {
    font-size: 1.3rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 8px;
}

.ga-sent-body[b-kas9m7dnqo] {
    font-size: 0.9rem;
    color: #6b7280;
    margin: 0 0 4px;
}

.ga-sent-email[b-kas9m7dnqo] {
    display: inline-block;
    font-size: 0.95rem;
    font-weight: 600;
    color: #015974;
    background: #f0f9ff;
    border: 1px solid #bae6fd;
    border-radius: 6px;
    padding: 4px 12px;
    margin-bottom: 14px;
}

.ga-sent-note[b-kas9m7dnqo] {
    font-size: 0.8rem;
    color: #9ca3af;
    margin: 0 0 20px;
    line-height: 1.5;
}

.ga-back-link[b-kas9m7dnqo] {
    font-size: 0.85rem;
    color: #6b7280;
    text-decoration: none;
}

.ga-back-link:hover[b-kas9m7dnqo] {
    color: #015974;
    text-decoration: underline;
}

/* ── Spinner ─────────────────────────────────────────────── */
.ga-spinner[b-kas9m7dnqo] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255,255,255,0.35);
    border-top-color: #fff;
    border-radius: 50%;
    display: inline-block;
    animation: ga-spin 0.65s linear infinite;
    flex-shrink: 0;
}

@@keyframes ga-spin {
    to[b-kas9m7dnqo] { transform: rotate(360deg); }
}
/* /Pages/Auth/Login.razor.rz.scp.css */
/* ── Wrapper ── */
.ln-wrap[b-x0xjqee04f] {
    width: 100%;
}

/* ── Brand logo ── */
.ln-brand[b-x0xjqee04f] {
    text-align: center;
    margin-bottom: 22px;
}

.ln-logo[b-x0xjqee04f] {
    width: 200px;
    height: auto;
    display: inline-block;
}

/* ── Header ── */
.ln-header[b-x0xjqee04f] {
    margin-bottom: 24px;
    text-align: center;
}

.ln-title[b-x0xjqee04f] {
    font-size: 1.55rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 6px;
    letter-spacing: -0.3px;
}

.ln-subtitle[b-x0xjqee04f] {
    font-size: 0.88rem;
    color: #6b7280;
    margin: 0;
}

/* ── Form ── */
.ln-form[b-x0xjqee04f] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* ── Field ── */
.ln-field[b-x0xjqee04f] {
    margin-bottom: 16px;
}

.ln-label[b-x0xjqee04f] {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 7px;
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

.ln-label-row[b-x0xjqee04f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 7px;
}

.ln-forgot[b-x0xjqee04f] {
    font-size: 0.78rem;
    color: #015974;
    text-decoration: none;
    font-weight: 500;
}

.ln-forgot:hover[b-x0xjqee04f] {
    text-decoration: underline;
}

/* ── Input ──
   Plain, minimal, Stripe/Linear style. One element, one background,
   one border. No icon cell, no flex wrapper, no seams. */
.ln-input[b-x0xjqee04f] {
    display: block;
    width: 100% !important;
    height: 46px !important;
    padding: 0 14px !important;
    margin: 0 !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
    font-size: 0.95rem;
    color: #111827;
    font-family: inherit;
    letter-spacing: 0.1px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    box-sizing: border-box;
    outline: none !important;
}

.ln-input:hover[b-x0xjqee04f] {
    border-color: #d1d5db !important;
}

.ln-input:focus[b-x0xjqee04f],
.ln-input:focus-visible[b-x0xjqee04f] {
    border-color: #015974 !important;
    box-shadow: 0 0 0 3px rgba(1, 89, 116, 0.14);
}

.ln-input[b-x0xjqee04f]::placeholder {
    color: #9ca3af;
    font-weight: 400;
}

/* Kill Blazor's global .valid.modified / .invalid 2px outline from
   wwwroot/css/app.css -- our own border/ring is the only signal. */
.ln-input.valid.modified[b-x0xjqee04f],
.ln-input.invalid[b-x0xjqee04f],
.ln-input.modified.invalid[b-x0xjqee04f] {
    outline: none !important;
    border-radius: 10px !important;
}

/* Error state -- subtle red border + soft red ring on focus. No pink fill. */
.ln-input.invalid[b-x0xjqee04f] {
    border-color: #f5a3a3 !important;
}

.ln-input.invalid:focus[b-x0xjqee04f],
.ln-input.invalid:focus-visible[b-x0xjqee04f] {
    border-color: #dc2626 !important;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.14);
}

/* Autofill: repaint to plain white so Chrome's lavender tint never shows. */
.ln-input:-webkit-autofill[b-x0xjqee04f],
.ln-input:-webkit-autofill:hover[b-x0xjqee04f],
.ln-input:-webkit-autofill:focus[b-x0xjqee04f],
.ln-input:-webkit-autofill:active[b-x0xjqee04f] {
    -webkit-box-shadow: 0 0 0 1000px #ffffff inset, 0 1px 2px rgba(16, 24, 40, 0.04) !important;
    -webkit-text-fill-color: #111827 !important;
    caret-color: #111827;
    transition: background-color 9999s ease-in-out 0s;
}

.ln-input:-webkit-autofill:focus[b-x0xjqee04f] {
    -webkit-box-shadow: 0 0 0 1000px #ffffff inset, 0 0 0 3px rgba(1, 89, 116, 0.14) !important;
}

/* ── Validation error ── */
.ln-error[b-x0xjqee04f] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.78rem;
    font-weight: 500;
    color: #b91c1c;
    margin-top: 6px;
    padding-left: 2px;
    line-height: 1.3;
}

.ln-error[b-x0xjqee04f]::before {
    content: "";
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #dc2626;
    flex-shrink: 0;
}

/* ── Alert ── */
.ln-alert[b-x0xjqee04f] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px 14px;
    border-radius: 8px;
    font-size: 0.855rem;
    font-weight: 500;
    margin-bottom: 14px;
    line-height: 1.4;
}

.ln-alert-error[b-x0xjqee04f] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
}

.ln-alert-success[b-x0xjqee04f] {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #166534;
}

/* ── Submit button ── */
.ln-btn[b-x0xjqee04f] {
    width: 100%;
    padding: 13px;
    border: none;
    border-radius: 10px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    color: #fff;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.2s, transform 0.15s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 4px;
    letter-spacing: 0.2px;
}

.ln-btn:hover:not(:disabled)[b-x0xjqee04f] {
    opacity: 0.92;
    transform: translateY(-1px);
}

.ln-btn:disabled[b-x0xjqee04f] {
    opacity: 0.7;
    cursor: not-allowed;
    transform: none;
}

/* ── Loading spinner ── */
.ln-spinner[b-x0xjqee04f] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255,255,255,0.35);
    border-top-color: #fff;
    border-radius: 50%;
    animation: lnSpin-b-x0xjqee04f 0.7s linear infinite;
    flex-shrink: 0;
}

@keyframes lnSpin-b-x0xjqee04f { to { transform: rotate(360deg); } }

/* ── Footer links ── */
.ln-footer[b-x0xjqee04f] {
    margin-top: 20px;
    text-align: center;
}

.ln-signup-link[b-x0xjqee04f] {
    font-size: 0.88rem;
    color: #6b7280;
    text-decoration: none;
}

.ln-signup-link strong[b-x0xjqee04f] {
    color: #015974;
    font-weight: 600;
}

.ln-signup-link:hover strong[b-x0xjqee04f] {
    text-decoration: underline;
}
/* /Pages/Auth/QualifyBusiness.razor.rz.scp.css */
.qualify-container[b-x4unefy0es] {
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    background: linear-gradient(135deg, #9D6023 0%, #015974 100%);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    box-sizing: border-box;
}

.qualify-card[b-x4unefy0es] {
    width: 100%;
    max-width: 1180px;
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    background: #ffffff;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 40px 100px rgba(1, 89, 116, 0.28),
                0 10px 28px rgba(0, 0, 0, 0.08);
    animation: qualifyIn-b-x4unefy0es 0.55s cubic-bezier(0.2, 0.9, 0.3, 1.1);
    position: relative;
}

@keyframes qualifyIn-b-x4unefy0es {
    from { opacity: 0; transform: translateY(16px) scale(0.99); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ── Left Brand Panel ── */
.qualify-brand[b-x4unefy0es] {
    position: relative;
    padding: 48px 44px;
    color: #fff;
    background: linear-gradient(135deg, #015974 0%, #0a7691 45%, #9D6023 100%);
    overflow: hidden;
    display: flex;
    align-items: center;
}

.qualify-brand[b-x4unefy0es]::before,
.qualify-brand[b-x4unefy0es]::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    background: rgba(255,255,255,0.08);
    pointer-events: none;
}

.qualify-brand[b-x4unefy0es]::before {
    width: 340px; height: 340px;
    top: -120px; right: -120px;
}

.qualify-brand[b-x4unefy0es]::after {
    width: 220px; height: 220px;
    bottom: -90px; left: -80px;
    background: rgba(255,255,255,0.05);
}

.brand-inner[b-x4unefy0es] {
    position: relative;
    z-index: 1;
    width: 100%;
}

.brand-logo-wrap[b-x4unefy0es] {
    background: #fff;
    display: inline-flex;
    padding: 10px 16px;
    border-radius: 12px;
    margin-bottom: 22px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
}

.brand-logo[b-x4unefy0es] {
    height: 56px;
    width: auto;
    max-width: 220px;
    object-fit: contain;
}

.brand-pill[b-x4unefy0es] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.7rem;
    font-weight: 700;
    color: #fff;
    background: rgba(255,255,255,0.18);
    padding: 5px 12px;
    border-radius: 20px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    border: 1px solid rgba(255,255,255,0.22);
    margin-bottom: 18px;
}

.brand-title[b-x4unefy0es] {
    margin: 0 0 10px;
    font-size: 1.9rem;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.5px;
}

.brand-sub[b-x4unefy0es] {
    margin: 0 0 28px;
    font-size: 0.95rem;
    line-height: 1.55;
    color: rgba(255,255,255,0.85);
    max-width: 420px;
}

.brand-features[b-x4unefy0es] {
    list-style: none;
    padding: 0;
    margin: 0 0 32px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.brand-features li[b-x4unefy0es] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.feat-icon[b-x4unefy0es] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(255,255,255,0.2);
    color: #fff;
    border: 1px solid rgba(255,255,255,0.3);
}

.brand-features li div[b-x4unefy0es] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.brand-features strong[b-x4unefy0es] {
    font-size: 0.92rem;
    font-weight: 700;
    color: #fff;
}

.brand-features span[b-x4unefy0es] {
    font-size: 0.82rem;
    color: rgba(255,255,255,0.75);
}

.brand-footer[b-x4unefy0es] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
    color: rgba(255,255,255,0.7);
    padding-top: 18px;
    border-top: 1px solid rgba(255,255,255,0.15);
}

/* ── Right Form Panel ── */
.qualify-panel[b-x4unefy0es] {
    padding: 48px 56px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}

.qualify-header[b-x4unefy0es] {
    margin-bottom: 6px;
}

.page-title[b-x4unefy0es] {
    margin: 0 0 8px;
    font-size: 1.7rem;
    font-weight: 800;
    color: #0f172a;
    letter-spacing: -0.4px;
}

.page-subtitle[b-x4unefy0es] {
    margin: 0;
    font-size: 0.94rem;
    color: #64748b;
    line-height: 1.55;
}

.qualify-form[b-x4unefy0es] {
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin-top: 28px;
}

.field-row[b-x4unefy0es] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.field-group[b-x4unefy0es] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.field-label[b-x4unefy0es] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #334155;
    letter-spacing: 0.2px;
}

.required[b-x4unefy0es] { color: #dc2626; }
.optional[b-x4unefy0es] { color: #94a3b8; font-weight: 400; font-size: 0.78rem; }

.field-wrap[b-x4unefy0es] {
    position: relative;
    display: flex;
    align-items: center;
}

.field-icon[b-x4unefy0es] {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #94a3b8;
    pointer-events: none;
    transition: color 0.18s;
    z-index: 1;
}

[b-x4unefy0es] .field-input {
    width: 100%;
    padding: 12px 14px 12px 44px;
    border: 1.5px solid #e2e8f0;
    border-radius: 10px;
    font-size: 0.92rem;
    color: #0f172a;
    background: #f8fafc;
    transition: all 0.18s;
    box-sizing: border-box;
    font-family: inherit;
}

[b-x4unefy0es] .field-input::placeholder { color: #94a3b8; }

[b-x4unefy0es] .field-input:hover {
    border-color: #cbd5e1;
    background: #fff;
}

[b-x4unefy0es] .field-input:focus {
    outline: none;
    border-color: #015974;
    background: #fff;
    box-shadow: 0 0 0 4px rgba(1, 89, 116, 0.1);
}

.field-wrap:focus-within .field-icon[b-x4unefy0es] { color: #015974; }

[b-x4unefy0es] .field-select {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    padding-left: 44px;
    padding-right: 38px;
    cursor: pointer;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    min-width: 0;
}

.field-row .field-group[b-x4unefy0es] { min-width: 0; }

.field-helper[b-x4unefy0es] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.76rem;
    color: #64748b;
    margin-top: 2px;
}

.field-error[b-x4unefy0es] {
    font-size: 0.78rem;
    color: #dc2626;
    font-weight: 500;
}

.alert-error[b-x4unefy0es] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
    padding: 10px 14px;
    border-radius: 10px;
    font-size: 0.86rem;
    font-weight: 500;
}

.btn-primary[b-x4unefy0es] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 13px 22px;
    margin-top: 6px;
    font-size: 0.95rem;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border: none;
    border-radius: 10px;
    cursor: pointer;
    letter-spacing: 0.3px;
    transition: all 0.18s;
    box-shadow: 0 6px 16px rgba(1, 89, 116, 0.3);
}

.btn-primary:hover:not(:disabled)[b-x4unefy0es] {
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(1, 89, 116, 0.4);
}

.btn-primary:active:not(:disabled)[b-x4unefy0es] { transform: translateY(0); }

.btn-primary:disabled[b-x4unefy0es] {
    opacity: 0.7;
    cursor: not-allowed;
}

.spinner[b-x4unefy0es] {
    width: 16px;
    height: 16px;
    border: 2.5px solid rgba(255, 255, 255, 0.35);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin-b-x4unefy0es 0.7s linear infinite;
}

@keyframes spin-b-x4unefy0es { to { transform: rotate(360deg); } }

.verify-note[b-x4unefy0es] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 22px;
    padding: 12px 14px;
    background: #f8fafc;
    border-left: 3px solid #015974;
    border-radius: 6px;
    font-size: 0.78rem;
    color: #64748b;
    line-height: 1.5;
}

.verify-note svg[b-x4unefy0es] {
    flex-shrink: 0;
    margin-top: 2px;
    color: #015974;
}

@media (max-width: 1100px) {
    .field-row[b-x4unefy0es] { grid-template-columns: 1fr; }
}

@media (max-width: 960px) {
    .qualify-card[b-x4unefy0es] {
        grid-template-columns: 1fr;
        max-width: 560px;
    }
    .qualify-brand[b-x4unefy0es] {
        padding: 36px 32px;
    }
    .qualify-brand[b-x4unefy0es]::before {
        width: 240px; height: 240px;
        top: -80px; right: -80px;
    }
    .qualify-brand[b-x4unefy0es]::after { display: none; }
    .brand-title[b-x4unefy0es] { font-size: 1.5rem; }
    .brand-features[b-x4unefy0es] { margin-bottom: 8px; }
    .brand-footer[b-x4unefy0es] { display: none; }
    .qualify-panel[b-x4unefy0es] { padding: 36px 32px; }
}

@media (max-width: 560px) {
    .qualify-container[b-x4unefy0es] { padding: 20px 12px; }
    .qualify-card[b-x4unefy0es] { border-radius: 18px; }
    .qualify-brand[b-x4unefy0es] { padding: 28px 22px; }
    .qualify-panel[b-x4unefy0es] { padding: 28px 22px; }
    .page-title[b-x4unefy0es]   { font-size: 1.35rem; }
    .field-row[b-x4unefy0es]    { grid-template-columns: 1fr; }
    .brand-logo[b-x4unefy0es]   { height: 44px; }
    .brand-title[b-x4unefy0es]  { font-size: 1.3rem; }
    .brand-features li[b-x4unefy0es] { gap: 10px; }
}
/* /Pages/Auth/RequestAccess.razor.rz.scp.css */
/* ── Wrapper ─────────────────────────────────────────────── */
.ra-wrap[b-9naxo1xnf3] {
    width: 100%;
}

/* ── Header ──────────────────────────────────────────────── */
.ra-header[b-9naxo1xnf3] {
    margin-bottom: 28px;
}

.ra-title[b-9naxo1xnf3] {
    font-size: 1.6rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 6px 0;
    letter-spacing: -0.3px;
    line-height: 1.2;
}

.ra-subtitle[b-9naxo1xnf3] {
    font-size: 0.9rem;
    color: #6b7280;
    margin: 0;
    line-height: 1.5;
}

/* ── Form ────────────────────────────────────────────────── */
.ra-form[b-9naxo1xnf3] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* ── Field ───────────────────────────────────────────────── */
.ra-field[b-9naxo1xnf3] {
    margin-bottom: 16px;
}

.ra-label[b-9naxo1xnf3] {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 7px;
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

.ra-required[b-9naxo1xnf3] {
    color: #dc2626;
}

.ra-optional[b-9naxo1xnf3] {
    font-weight: 400;
    color: #9ca3af;
    font-size: 0.78rem;
    text-transform: none;
    letter-spacing: 0;
}

/* ── Input ───────────────────────────────────────────────── */
.ra-input[b-9naxo1xnf3] {
    width: 100% !important;
    display: block !important;
    padding: 12px 14px 12px 42px !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 10px !important;
    font-size: 0.95rem !important;
    color: #111827 !important;
    background: #f8fafc !important;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05) !important;
    transition: border-color 0.18s, background 0.18s, box-shadow 0.18s !important;
    box-sizing: border-box !important;
    margin-bottom: 0 !important;
}

.ra-input:hover[b-9naxo1xnf3] {
    border-color: #cbd5e1 !important;
    background: #f1f5f9 !important;
}

.ra-input:focus[b-9naxo1xnf3] {
    outline: none !important;
    border-color: #015974 !important;
    background: #fff !important;
    box-shadow: 0 0 0 3px rgba(1, 89, 116, 0.12), inset 0 1px 2px rgba(0,0,0,0.03) !important;
}

.ra-input[b-9naxo1xnf3]::placeholder {
    color: #b0b7c3 !important;
}

/* ── Textarea ────────────────────────────────────────────── */
.ra-textarea[b-9naxo1xnf3] {
    width: 100% !important;
    display: block !important;
    padding: 12px 14px 12px 42px !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 10px !important;
    font-size: 0.95rem !important;
    color: #111827 !important;
    background: #f8fafc !important;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.05) !important;
    resize: vertical !important;
    min-height: 100px !important;
    transition: border-color 0.18s, background 0.18s, box-shadow 0.18s !important;
    box-sizing: border-box !important;
    font-family: inherit !important;
    line-height: 1.6 !important;
    margin-bottom: 0 !important;
}

.ra-textarea:hover[b-9naxo1xnf3] {
    border-color: #cbd5e1 !important;
    background: #f1f5f9 !important;
}

.ra-textarea:focus[b-9naxo1xnf3] {
    outline: none !important;
    border-color: #015974 !important;
    background: #fff !important;
    box-shadow: 0 0 0 3px rgba(1, 89, 116, 0.12), inset 0 1px 2px rgba(0,0,0,0.03) !important;
}

.ra-textarea[b-9naxo1xnf3]::placeholder {
    color: #b0b7c3 !important;
}

/* ── Validation error ────────────────────────────────────── */
.ra-error[b-9naxo1xnf3] {
    display: block;
    font-size: 0.8rem;
    color: #dc2626;
    margin-top: 5px;
    padding-left: 2px;
}

/* ── Alert ───────────────────────────────────────────────── */
.ra-alert[b-9naxo1xnf3] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    color: #b91c1c;
    font-size: 0.85rem;
    padding: 10px 13px;
    margin-bottom: 14px;
}

/* ── Primary Button — sidebar gradient: teal → brown ─────── */
.ra-btn[b-9naxo1xnf3] {
    width: 100% !important;
    padding: 13px 16px !important;
    background: linear-gradient(190deg, #015974, #9D6023) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 10px !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    transition: opacity 0.2s, transform 0.15s, box-shadow 0.15s !important;
    box-shadow: 0 3px 12px rgba(1, 89, 116, 0.3) !important;
    letter-spacing: 0.2px !important;
    margin-bottom: 0 !important;
    transform: none !important;
}

.ra-btn:hover:not(:disabled)[b-9naxo1xnf3] {
    opacity: 0.9 !important;
    box-shadow: 0 5px 18px rgba(1, 89, 116, 0.4) !important;
    transform: translateY(-1px) !important;
}

.ra-btn:active:not(:disabled)[b-9naxo1xnf3] {
    opacity: 1 !important;
    transform: translateY(0) !important;
    box-shadow: 0 2px 6px rgba(1, 89, 116, 0.2) !important;
}

.ra-btn:disabled[b-9naxo1xnf3] {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
    transform: none !important;
}

/* ── Back link ───────────────────────────────────────────── */
.ra-back[b-9naxo1xnf3] {
    text-align: center;
    margin-top: 20px;
}

.ra-back-link[b-9naxo1xnf3] {
    font-size: 0.85rem;
    color: #6b7280;
    text-decoration: none;
}

.ra-back-link:hover[b-9naxo1xnf3] {
    color: #015974;
    text-decoration: underline;
}

/* ── Success state ───────────────────────────────────────── */
.ra-success[b-9naxo1xnf3] {
    text-align: center;
    padding: 8px 0 4px;
}

.ra-success-icon[b-9naxo1xnf3] {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #f0fdf4;
    border: 1.5px solid #bbf7d0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 18px;
}

.ra-success-title[b-9naxo1xnf3] {
    font-size: 1.3rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 8px;
}

.ra-success-body[b-9naxo1xnf3] {
    font-size: 0.9rem;
    color: #6b7280;
    margin: 0 0 4px;
}

.ra-success-email[b-9naxo1xnf3] {
    display: inline-block;
    font-size: 0.95rem;
    font-weight: 600;
    color: #015974;
    background: #f0f9ff;
    border: 1px solid #bae6fd;
    border-radius: 6px;
    padding: 4px 12px;
    margin-bottom: 10px;
}

.ra-success-note[b-9naxo1xnf3] {
    font-size: 0.8rem;
    color: #9ca3af;
    margin: 0 0 20px;
    line-height: 1.5;
}

/* ── Spinner ─────────────────────────────────────────────── */
.ra-spinner[b-9naxo1xnf3] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255,255,255,0.35);
    border-top-color: #fff;
    border-radius: 50%;
    display: inline-block;
    animation: ra-spin 0.65s linear infinite;
    flex-shrink: 0;
}

@@keyframes ra-spin {
    to[b-9naxo1xnf3] { transform: rotate(360deg); }
}
/* /Pages/Auth/VerifyMagicLink.razor.rz.scp.css */
.verify-container[b-um65adabae] {
    max-width: 420px;
    margin: 0 auto;
    padding: 40px 24px;
    text-align: center;
}

.logo-container[b-um65adabae] {
    margin-bottom: 32px;
}

.status-box[b-um65adabae] {
    padding: 32px 24px;
}

.status-box h3[b-um65adabae] {
    font-size: 1.4rem;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 8px;
}

.status-box p[b-um65adabae] {
    color: #6b7280;
    font-size: 0.95rem;
}

.status-icon[b-um65adabae] {
    font-size: 3rem;
    margin-bottom: 16px;
}

.status-text[b-um65adabae] {
    color: #6b7280;
    font-size: 1rem;
    margin-top: 16px;
}

.status-box.success h3[b-um65adabae] {
    color: #166534;
}

.status-box.error h3[b-um65adabae] {
    color: #b91c1c;
}

.btn-primary[b-um65adabae] {
    display: inline-block;
    margin-top: 20px;
    padding: 12px 28px;
    background: #015974;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 0.95rem;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}

.btn-primary:hover[b-um65adabae] {
    background: #0040cc;
}

.spinner-large[b-um65adabae] {
    width: 48px;
    height: 48px;
    border: 4px solid #e5e7eb;
    border-top-color: #015974;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    margin: 0 auto 16px;
}

@@keyframes spin {
    to[b-um65adabae] { transform: rotate(360deg); }
}
/* /Pages/Auth/VerifySms.razor.rz.scp.css */
.sms-container[b-dmr95j1ntr] {
    max-width: 420px;
    margin: 0 auto;
    padding: 40px 24px;
    text-align: center;
}

.logo-container[b-dmr95j1ntr] {
    margin-bottom: 24px;
}

.page-title[b-dmr95j1ntr] {
    font-size: 1.75rem;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 12px;
}

.body-text[b-dmr95j1ntr] {
    font-size: 1rem;
    color: #444;
    margin-bottom: 28px;
    line-height: 1.6;
}

.mobile-highlight[b-dmr95j1ntr] {
    color: #015974;
}

.sms-form[b-dmr95j1ntr] {
    text-align: center;
}

.code-field-group[b-dmr95j1ntr] {
    margin-bottom: 20px;
}

.code-input[b-dmr95j1ntr] {
    width: 200px;
    padding: 14px;
    border: 2px solid #d1d5db;
    border-radius: 10px;
    font-size: 1.5rem;
    font-weight: 700;
    text-align: center;
    letter-spacing: 0.5em;
    color: #1a1a1a;
    background: #fff;
    transition: border-color 0.15s;
}

.code-input:focus[b-dmr95j1ntr] {
    outline: none;
    border-color: #015974;
    box-shadow: 0 0 0 3px rgba(0, 87, 255, 0.12);
}

.field-error[b-dmr95j1ntr] {
    display: block;
    font-size: 0.8rem;
    color: #dc2626;
    margin-top: 6px;
}

.alert-error[b-dmr95j1ntr] {
    background: #fef2f2;
    border: 1px solid #fca5a5;
    border-radius: 8px;
    color: #b91c1c;
    font-size: 0.875rem;
    padding: 10px 14px;
    margin-bottom: 16px;
    display: inline-block;
    max-width: 320px;
}

.alert-success[b-dmr95j1ntr] {
    background: #f0fdf4;
    border: 1px solid #86efac;
    border-radius: 8px;
    color: #166534;
    font-size: 0.875rem;
    padding: 10px 14px;
    margin-top: 12px;
    display: inline-block;
}

.btn-primary[b-dmr95j1ntr] {
    padding: 13px 48px;
    background: #015974;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: background 0.15s;
    min-width: 160px;
    justify-content: center;
}

.btn-primary:hover:not(:disabled)[b-dmr95j1ntr] {
    background: #0040cc;
}

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

.secondary-actions[b-dmr95j1ntr] {
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 0.875rem;
}

.btn-link[b-dmr95j1ntr] {
    background: none;
    border: none;
    color: #015974;
    cursor: pointer;
    font-size: 0.875rem;
    text-decoration: underline;
    padding: 0;
}

.btn-link:disabled[b-dmr95j1ntr] {
    color: #9ca3af;
    cursor: not-allowed;
    text-decoration: none;
}

.btn-link:hover:not(:disabled)[b-dmr95j1ntr] {
    color: #0040cc;
}

a.btn-link[b-dmr95j1ntr] {
    color: #015974;
    text-decoration: underline;
}

.divider[b-dmr95j1ntr] {
    color: #d1d5db;
}

.spinner[b-dmr95j1ntr] {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255,255,255,0.4);
    border-top-color: #fff;
    border-radius: 50%;
    display: inline-block;
    animation: spin 0.6s linear infinite;
}

@@keyframes spin {
    to[b-dmr95j1ntr] { transform: rotate(360deg); }
}
/* /Pages/Home.razor.rz.scp.css */
/* =============================================================
   Customer Dashboard (Home)
   ============================================================= */

.dash-wrap[b-uedmx9wixq] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 4px;
}

/* ── Hero Header ── */
.dash-hero[b-uedmx9wixq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
    padding: 26px 30px;
    background: linear-gradient(135deg, #015974 0%, #0a7691 50%, #9D6023 100%);
    border-radius: 18px;
    color: #fff;
    box-shadow: 0 20px 44px rgba(1, 89, 116, 0.22);
    position: relative;
    overflow: hidden;
}

.dash-hero[b-uedmx9wixq]::before,
.dash-hero[b-uedmx9wixq]::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    background: rgba(255,255,255,0.07);
    pointer-events: none;
}

.dash-hero[b-uedmx9wixq]::before {
    width: 260px; height: 260px;
    top: -90px; right: -80px;
}

.dash-hero[b-uedmx9wixq]::after {
    width: 160px; height: 160px;
    bottom: -60px; left: 40%;
    background: rgba(255,255,255,0.05);
}

.hero-left[b-uedmx9wixq] {
    position: relative;
    z-index: 1;
}

.hero-eyebrow[b-uedmx9wixq] {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    background: rgba(255,255,255,0.18);
    padding: 4px 11px;
    border-radius: 999px;
    margin-bottom: 10px;
    border: 1px solid rgba(255,255,255,0.25);
}

.hero-title[b-uedmx9wixq] {
    margin: 0 0 6px;
    font-size: 1.8rem;
    font-weight: 800;
    letter-spacing: -0.4px;
    line-height: 1.2;
}

.hero-sub[b-uedmx9wixq] {
    margin: 0;
    font-size: 0.95rem;
    color: rgba(255,255,255,0.85);
}

.hero-right[b-uedmx9wixq] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    position: relative;
    z-index: 1;
}

.hero-right .ve-btn-secondary[b-uedmx9wixq] {
    background: rgba(255,255,255,0.9);
    border-color: rgba(255,255,255,0.8);
    color: #015974;
}

.hero-right .ve-btn-secondary:hover[b-uedmx9wixq] {
    background: #fff;
    color: #015974;
}

/* ── Stats grid ── */
.stats-grid[b-uedmx9wixq] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
}

/* ── Activity grid ── */
.activity-grid[b-uedmx9wixq] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 16px;
}

.activity-body[b-uedmx9wixq] {
    padding: 8px 0 !important;
    min-height: 220px;
    max-height: 360px;
    overflow-y: auto;
}

.dash-list[b-uedmx9wixq] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
}

.dash-item[b-uedmx9wixq] {
    padding: 12px 18px;
    border-bottom: 1px solid #f1f5f9;
    transition: background 0.15s ease;
    cursor: default;
}

.dash-item:last-child[b-uedmx9wixq] { border-bottom: none; }
.dash-item:hover[b-uedmx9wixq]     { background: #f8fafc; }

.dash-item-head[b-uedmx9wixq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 4px;
}

.dash-item-title[b-uedmx9wixq] {
    font-weight: 700;
    color: #0f172a;
    font-size: 0.9rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dash-item-desc[b-uedmx9wixq] {
    display: block;
    font-size: 0.83rem;
    color: #64748b;
    line-height: 1.5;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.dash-item-date[b-uedmx9wixq] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #94a3b8;
    letter-spacing: 0.3px;
    flex-shrink: 0;
}

/* ── Empty state ── */
.empty-state[b-uedmx9wixq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 36px 20px;
    color: #94a3b8;
    gap: 10px;
    text-align: center;
}

.empty-state i[b-uedmx9wixq] {
    font-size: 2.2rem;
    opacity: 0.6;
}

.empty-state p[b-uedmx9wixq] {
    margin: 0;
    font-size: 0.88rem;
    color: #64748b;
}

/* ── Card header icon styling ── */
.ve-card-header h3 i[b-uedmx9wixq] {
    color: #015974;
    margin-right: 6px;
}

/* ── Responsive ── */
@media (max-width: 991.98px) {
    .stats-grid[b-uedmx9wixq] { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
    .activity-grid[b-uedmx9wixq] { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    .dash-wrap[b-uedmx9wixq] { gap: 14px; padding: 2px; }
    .dash-hero[b-uedmx9wixq] {
        padding: 18px 18px;
        flex-direction: column;
        align-items: flex-start;
        border-radius: 14px;
    }
    .hero-eyebrow[b-uedmx9wixq] { font-size: 0.65rem; padding: 3px 9px; }
    .hero-title[b-uedmx9wixq] { font-size: 1.3rem; }
    .hero-sub[b-uedmx9wixq] { font-size: 0.88rem; }
    .hero-right[b-uedmx9wixq] { width: 100%; gap: 8px; }
    .hero-right .ve-btn[b-uedmx9wixq] { flex: 1; justify-content: center; padding: 8px 12px; font-size: 0.85rem; }
    .stats-grid[b-uedmx9wixq] { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .activity-body[b-uedmx9wixq] { max-height: 300px; }
    .dash-item[b-uedmx9wixq] { padding: 10px 14px; }
    .dash-item-title[b-uedmx9wixq] { font-size: 0.85rem; }
    .dash-item-desc[b-uedmx9wixq] { font-size: 0.78rem; }
}

@media (max-width: 480px) {
    .dash-hero[b-uedmx9wixq] { padding: 16px; }
    .hero-title[b-uedmx9wixq] { font-size: 1.15rem; }
    .stats-grid[b-uedmx9wixq] { grid-template-columns: 1fr; }
    .dash-hero[b-uedmx9wixq]::before { width: 180px; height: 180px; top: -70px; right: -60px; }
    .dash-hero[b-uedmx9wixq]::after { display: none; }
}
/* /Pages/ModellerDashboard/AssignedProjects.razor.rz.scp.css */
/* Reuse the same styles from UserProjects.razor */
    .assigned-projects-container[b-hnbatalgvq] {
        width: 100%;
        padding: 16px;
        box-sizing: border-box;
    }

    .header-section[b-hnbatalgvq] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 12px;
        margin-bottom: 20px;
        background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
        padding: 15px 20px;
        border-radius: 8px;
    }

    .header-section h2[b-hnbatalgvq] {
        color: #fff;
        margin: 0;
        font-size: 1.4rem;
    }

    .actions-group[b-hnbatalgvq] {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 10px;
    }

    .search-input[b-hnbatalgvq] {
        padding: 8px 12px;
        border: 1.5px solid rgba(255,255,255,0.35); background: rgba(255,255,255,0.15); color: #fff;
        border-radius: 4px;
        width: 260px;
        max-width: 100%;
        font-size: 0.875rem;
    }

    .search-input:focus[b-hnbatalgvq] {
        outline: none;
        border-color: rgba(255,255,255,0.7); box-shadow: 0 0 0 3px rgba(255,255,255,0.15);
    }

    .table-section[b-hnbatalgvq] {
        background: white;
        border-radius: 8px;
        padding: 0;
        box-shadow: 0 2px 4px rgba(0,0,0,0.05);
        overflow: hidden;
    }

    .table-wrapper[b-hnbatalgvq] {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    table[b-hnbatalgvq] {
        width: 100%;
        min-width: 960px;
        border-collapse: collapse;
        table-layout: auto;
    }

    th[b-hnbatalgvq] {
        text-align: left;
        color: #6c757d;
        font-size: 0.78rem;
        font-weight: 600;
        padding: 12px 14px;
        border-bottom: 2px solid #dee2e6;
        text-transform: uppercase;
        white-space: nowrap;
        background: #f8f9fa;
    }

    td[b-hnbatalgvq] {
        padding: 12px 14px;
        border-bottom: 1px solid #f2f2f2;
        color: #495057;
        vertical-align: middle;
        font-size: 0.875rem;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    tr:last-child td[b-hnbatalgvq] {
        border-bottom: none;
    }

    tr:hover td[b-hnbatalgvq] {
        background-color: #f9fafb;
    }

    tr[style*="cursor: pointer"]:hover td[b-hnbatalgvq] {
        background-color: #e8f4f8;
        transition: background-color 0.2s ease;
    }

    .project-name-link[b-hnbatalgvq] {
        color: #015974;
        font-weight: 500;
    }

    .table-footer[b-hnbatalgvq] {
        padding: 12px 16px;
        color: #6c757d;
        font-size: 0.875rem;
        border-top: 1px solid #e9ecef;
    }

    .pagination-section[b-hnbatalgvq] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 10px;
        padding: 12px 16px;
        border-top: 1px solid #e9ecef;
        background-color: #f8f9fa;
        border-radius: 0 0 8px 8px;
    }

    .page-info[b-hnbatalgvq] {
        color: #666;
        font-size: 0.875rem;
        font-weight: 500;
    }

    .pagination-buttons[b-hnbatalgvq] {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
        align-items: center;
    }

    .pagination-buttons .page-btn[b-hnbatalgvq] {
        min-width: 34px;
        height: 34px;
        padding: 0 8px;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        border: 1px solid #dee2e6;
        background-color: #fff;
        color: #333;
        cursor: pointer;
        border-radius: 6px;
        transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
        font-weight: 500;
        font-size: 1rem;
        line-height: 1;
        user-select: none;
    }

    .pagination-buttons .page-btn:hover:not(:disabled)[b-hnbatalgvq] {
        background-color: #e9ecef;
        border-color: #adb5bd;
        color: #000;
    }

    .pagination-buttons .page-btn.active[b-hnbatalgvq] {
        background: linear-gradient(135deg, #015974, #9D6023); border-color: transparent;
        color: #fff;
        border-color: #015974;
        font-weight: 600;
    }

    .pagination-buttons .page-btn.active:hover[b-hnbatalgvq] {
        background-color: #0056b3;
        border-color: #0056b3;
    }

    .pagination-buttons .page-btn:disabled[b-hnbatalgvq] {
        cursor: not-allowed;
        opacity: 0.4;
        background-color: #f8f9fa;
        color: #aaa;
        border-color: #e9ecef;
    }

    /* ── Loading Spinner ── */
    .loading-container[b-hnbatalgvq] {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 40px 0;
        gap: 16px;
        color: #6b7280;
        font-size: 0.9rem;
        font-weight: 500;
    }

    .spinner[b-hnbatalgvq] {
        width: 36px;
        height: 36px;
        border: 3px solid #e5e7eb;
        border-top-color: #015974;
        border-radius: 50%;
        animation: spin-b-hnbatalgvq 0.7s linear infinite;
    }

    @keyframes spin-b-hnbatalgvq {
        to { transform: rotate(360deg); }
    }

    @media (max-width: 900px) {
        .search-input[b-hnbatalgvq] {
            width: 200px;
        }
    }

    @media (max-width: 640px) {
        .header-section[b-hnbatalgvq] {
            flex-direction: column;
            align-items: stretch;
        }

        .actions-group[b-hnbatalgvq] {
            flex-direction: column;
            align-items: stretch;
        }

        .search-input[b-hnbatalgvq] {
            width: 100%;
        }

        table[b-hnbatalgvq], thead[b-hnbatalgvq], tbody[b-hnbatalgvq], th[b-hnbatalgvq], td[b-hnbatalgvq], tr[b-hnbatalgvq] {
            display: block;
        }

        thead tr[b-hnbatalgvq] {
            display: none;
        }

        tbody tr[b-hnbatalgvq] {
            border: 1px solid #dee2e6;
            border-radius: 8px;
            margin-bottom: 12px;
            padding: 4px 0;
            background: #fff;
            box-shadow: 0 1px 3px rgba(0,0,0,0.06);
        }

        tbody tr:hover td[b-hnbatalgvq] {
            background: transparent;
        }

        td[b-hnbatalgvq] {
            display: flex;
            align-items: flex-start;
            gap: 8px;
            padding: 8px 14px;
            border-bottom: 1px solid #f2f2f2;
            font-size: 0.875rem;
            max-width: 100% !important;
        }

        td:last-child[b-hnbatalgvq] {
            border-bottom: none;
        }

        td[b-hnbatalgvq]::before {
            content: attr(data-label);
            font-weight: 600;
            color: #6c757d;
            font-size: 0.75rem;
            text-transform: uppercase;
            min-width: 100px;
            flex-shrink: 0;
        }

        .pagination-section[b-hnbatalgvq] {
            flex-direction: column;
            align-items: center;
            text-align: center;
        }
    }
/* /Pages/ModellerDashboard/ModelerAllProjects.razor.rz.scp.css */
.assigned-projects-container[b-9r4jp52w84] {
        width: 100%;
        padding: 16px;
        box-sizing: border-box;
    }

    .header-section[b-9r4jp52w84] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 12px;
        margin-bottom: 20px;
        background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
        padding: 15px 20px;
        border-radius: 8px;
    }

    .header-section h2[b-9r4jp52w84] {
        color: #fff;
        margin: 0;
        font-size: 1.4rem;
    }

    .actions-group[b-9r4jp52w84] {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .search-input[b-9r4jp52w84] {
        padding: 8px 12px;
        border: 1.5px solid rgba(255,255,255,0.35); background: rgba(255,255,255,0.15); color: #fff;
        border-radius: 4px;
        width: 260px;
        max-width: 100%;
        font-size: 0.875rem;
    }

    .search-input:focus[b-9r4jp52w84] {
        outline: none;
        border-color: rgba(255,255,255,0.7); box-shadow: 0 0 0 3px rgba(255,255,255,0.15);
    }

    .table-section[b-9r4jp52w84] {
        background: white;
        border-radius: 8px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.05);
        overflow: hidden;
    }

    .table-wrapper[b-9r4jp52w84] {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    table[b-9r4jp52w84] {
        width: 100%;
        min-width: 960px;
        border-collapse: collapse;
    }

    th[b-9r4jp52w84] {
        text-align: left;
        color: #6c757d;
        font-size: 0.78rem;
        font-weight: 600;
        padding: 12px 14px;
        border-bottom: 2px solid #dee2e6;
        text-transform: uppercase;
        white-space: nowrap;
        background: #f8f9fa;
    }

    td[b-9r4jp52w84] {
        padding: 12px 14px;
        border-bottom: 1px solid #f2f2f2;
        color: #495057;
        vertical-align: middle;
        font-size: 0.875rem;
        word-break: break-word;
    }

    tr:last-child td[b-9r4jp52w84] { border-bottom: none; }

    tr[style*="cursor: pointer"]:hover td[b-9r4jp52w84] {
        background-color: #e8f4f8;
        transition: background-color 0.2s ease;
    }

    .project-name-link[b-9r4jp52w84] {
        color: #015974;
        font-weight: 500;
    }

    .fw-bold[b-9r4jp52w84] { font-weight: 600; }

    .modeler-badge[b-9r4jp52w84] {
        display: inline-block;
        background: #015974;
        color: white;
        padding: 3px 10px;
        border-radius: 4px;
        font-size: 0.8rem;
        font-weight: 500;
    }

    .status-badge[b-9r4jp52w84] {
        display: inline-block;
        background: #ffc107;
        color: #333;
        padding: 3px 10px;
        border-radius: 4px;
        font-size: 0.8rem;
        font-weight: 500;
    }

    .text-muted[b-9r4jp52w84] { color: #6c757d; }

    .table-footer[b-9r4jp52w84] {
        padding: 12px 16px;
        color: #6c757d;
        font-size: 0.875rem;
        border-top: 1px solid #e9ecef;
    }

    .pagination-section[b-9r4jp52w84] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 10px;
        padding: 12px 16px;
        border-top: 1px solid #e9ecef;
        background-color: #f8f9fa;
        border-radius: 0 0 8px 8px;
    }

    .page-info[b-9r4jp52w84] { color: #666; font-size: 0.875rem; font-weight: 500; }

    .pagination-buttons[b-9r4jp52w84] {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
        align-items: center;
    }

    .page-btn[b-9r4jp52w84] {
        min-width: 34px;
        height: 34px;
        padding: 0 8px;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        border: 1px solid #dee2e6;
        background-color: #fff;
        color: #333;
        cursor: pointer;
        border-radius: 6px;
        transition: background-color 0.15s ease;
        font-weight: 500;
        font-size: 1rem;
        user-select: none;
    }

    .page-btn:hover:not(:disabled)[b-9r4jp52w84] { background-color: #e9ecef; border-color: #adb5bd; }
    .page-btn.active[b-9r4jp52w84] { background: linear-gradient(135deg, #015974, #9D6023); border-color: transparent; color: #fff; border-color: #015974; font-weight: 600; }
    .page-btn:disabled[b-9r4jp52w84] { cursor: not-allowed; opacity: 0.4; }

    .loading-container[b-9r4jp52w84] {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 40px 0;
        gap: 16px;
        color: #6b7280;
        font-size: 0.9rem;
    }

    .spinner[b-9r4jp52w84] {
        width: 36px;
        height: 36px;
        border: 3px solid #e5e7eb;
        border-top-color: #015974;
        border-radius: 50%;
        animation: spin-b-9r4jp52w84 0.7s linear infinite;
    }

    @keyframes spin-b-9r4jp52w84 { to { transform: rotate(360deg); } }
/* /Pages/ModellerDashboard/ModelerMyProjects.razor.rz.scp.css */
.assigned-projects-container[b-qziz1dxtsq] {
        width: 100%;
        padding: 16px;
        box-sizing: border-box;
    }

    .header-section[b-qziz1dxtsq] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 12px;
        margin-bottom: 20px;
        background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
        padding: 15px 20px;
        border-radius: 8px;
    }

    .header-section h2[b-qziz1dxtsq] {
        color: #fff;
        margin: 0;
        font-size: 1.4rem;
    }

    .actions-group[b-qziz1dxtsq] {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .search-input[b-qziz1dxtsq] {
        padding: 8px 12px;
        border: 1.5px solid rgba(255,255,255,0.35); background: rgba(255,255,255,0.15); color: #fff;
        border-radius: 4px;
        width: 260px;
        max-width: 100%;
        font-size: 0.875rem;
    }

    .search-input:focus[b-qziz1dxtsq] {
        outline: none;
        border-color: rgba(255,255,255,0.7); box-shadow: 0 0 0 3px rgba(255,255,255,0.15);
    }

    .table-section[b-qziz1dxtsq] {
        background: white;
        border-radius: 8px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.05);
        overflow: hidden;
    }

    .table-wrapper[b-qziz1dxtsq] {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    table[b-qziz1dxtsq] {
        width: 100%;
        min-width: 760px;
        border-collapse: collapse;
    }

    th[b-qziz1dxtsq] {
        text-align: left;
        color: #6c757d;
        font-size: 0.78rem;
        font-weight: 600;
        padding: 12px 14px;
        border-bottom: 2px solid #dee2e6;
        text-transform: uppercase;
        white-space: nowrap;
        background: #f8f9fa;
    }

    td[b-qziz1dxtsq] {
        padding: 12px 14px;
        border-bottom: 1px solid #f2f2f2;
        color: #495057;
        vertical-align: middle;
        font-size: 0.875rem;
        word-break: break-word;
    }

    tr:last-child td[b-qziz1dxtsq] { border-bottom: none; }

    tr[style*="cursor: pointer"]:hover td[b-qziz1dxtsq] {
        background-color: #e8f4f8;
        transition: background-color 0.2s ease;
    }

    .project-name-link[b-qziz1dxtsq] {
        color: #015974;
        font-weight: 500;
    }

    .fw-bold[b-qziz1dxtsq] { font-weight: 600; }

    .status-badge[b-qziz1dxtsq] {
        display: inline-block;
        background: #ffc107;
        color: #333;
        padding: 3px 10px;
        border-radius: 4px;
        font-size: 0.8rem;
        font-weight: 500;
    }

    .text-muted[b-qziz1dxtsq] { color: #6c757d; }

    .table-footer[b-qziz1dxtsq] {
        padding: 12px 16px;
        color: #6c757d;
        font-size: 0.875rem;
        border-top: 1px solid #e9ecef;
    }

    .pagination-section[b-qziz1dxtsq] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 10px;
        padding: 12px 16px;
        border-top: 1px solid #e9ecef;
        background-color: #f8f9fa;
        border-radius: 0 0 8px 8px;
    }

    .page-info[b-qziz1dxtsq] { color: #666; font-size: 0.875rem; font-weight: 500; }

    .pagination-buttons[b-qziz1dxtsq] {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
        align-items: center;
    }

    .page-btn[b-qziz1dxtsq] {
        min-width: 34px;
        height: 34px;
        padding: 0 8px;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        border: 1px solid #dee2e6;
        background-color: #fff;
        color: #333;
        cursor: pointer;
        border-radius: 6px;
        transition: background-color 0.15s ease;
        font-weight: 500;
        font-size: 1rem;
        user-select: none;
    }

    .page-btn:hover:not(:disabled)[b-qziz1dxtsq] { background-color: #e9ecef; border-color: #adb5bd; }
    .page-btn.active[b-qziz1dxtsq] { background: linear-gradient(135deg, #015974, #9D6023); border-color: transparent; color: #fff; border-color: #015974; font-weight: 600; }
    .page-btn:disabled[b-qziz1dxtsq] { cursor: not-allowed; opacity: 0.4; }

    .loading-container[b-qziz1dxtsq] {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 40px 0;
        gap: 16px;
        color: #6b7280;
        font-size: 0.9rem;
    }

    .spinner[b-qziz1dxtsq] {
        width: 36px;
        height: 36px;
        border: 3px solid #e5e7eb;
        border-top-color: #015974;
        border-radius: 50%;
        animation: spin-b-qziz1dxtsq 0.7s linear infinite;
    }

    @keyframes spin-b-qziz1dxtsq { to { transform: rotate(360deg); } }
/* /Pages/ModellerDashboard/ModellerDashboard.razor.rz.scp.css */
.modeller-dashboard[b-1dboh1imx0] {
        padding: 2rem;
        max-width: 1200px;
        margin: 0 auto;
    }

    .welcome-section[b-1dboh1imx0] {
        background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
        color: white;
        padding: 3rem 2rem;
        border-radius: 12px;
        margin-bottom: 2rem;
        text-align: center;
    }

    .welcome-section h1[b-1dboh1imx0] {
        font-size: 2.5rem;
        margin-bottom: 0.5rem;
        font-weight: 700;
    }

    .welcome-section p[b-1dboh1imx0] {
        font-size: 1.2rem;
        opacity: 0.9;
    }

    .quick-stats[b-1dboh1imx0] {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
        gap: 1.5rem;
    }

    .stat-card[b-1dboh1imx0] {
        background: white;
        padding: 2rem;
        border-radius: 12px;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        text-align: center;
        transition: transform 0.2s ease, box-shadow 0.2s ease;
    }

    .stat-card:hover[b-1dboh1imx0] {
        transform: translateY(-4px);
        box-shadow: 0 8px 12px rgba(0, 0, 0, 0.15);
    }

    .stat-card i[b-1dboh1imx0] {
        font-size: 3rem;
        color: #015974;
        margin-bottom: 1rem;
    }

    .stat-card h3[b-1dboh1imx0] {
        font-size: 1.5rem;
        margin-bottom: 0.5rem;
        color: #333;
    }

    .stat-card p[b-1dboh1imx0] {
        color: #666;
        margin-bottom: 1.5rem;
    }

    .btn-primary[b-1dboh1imx0] {
        background: #015974;
        color: white;
        border: none;
        padding: 0.75rem 2rem;
        border-radius: 8px;
        font-size: 1rem;
        font-weight: 600;
        cursor: pointer;
        transition: background 0.2s ease;
    }

    .btn-primary:hover[b-1dboh1imx0] {
        background: #015974;
    }

    @media (max-width: 991.98px) {
        .modeller-dashboard[b-1dboh1imx0] { padding: 1.25rem; }
        .welcome-section[b-1dboh1imx0] { padding: 2rem 1.25rem; }
        .welcome-section h1[b-1dboh1imx0] { font-size: 1.8rem; }
        .welcome-section p[b-1dboh1imx0] { font-size: 1rem; }
        .quick-stats[b-1dboh1imx0] { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; }
    }

    @media (max-width: 768px) {
        .modeller-dashboard[b-1dboh1imx0] { padding: 0.75rem; }
        .welcome-section[b-1dboh1imx0] { padding: 1.5rem 1rem; margin-bottom: 1.25rem; border-radius: 10px; }
        .welcome-section h1[b-1dboh1imx0] { font-size: 1.4rem; }
        .welcome-section p[b-1dboh1imx0] { font-size: 0.92rem; }
        .quick-stats[b-1dboh1imx0] { grid-template-columns: 1fr; gap: 0.85rem; }
        .stat-card[b-1dboh1imx0] { padding: 1.25rem; }
        .stat-card i[b-1dboh1imx0] { font-size: 2.2rem; margin-bottom: 0.75rem; }
        .stat-card h3[b-1dboh1imx0] { font-size: 1.15rem; }
        .stat-card p[b-1dboh1imx0] { font-size: 0.88rem; margin-bottom: 1rem; }
        .btn-primary[b-1dboh1imx0] { padding: 0.6rem 1.5rem; font-size: 0.9rem; }
    }
/* /Pages/ModellerDashboard/ModellerProfile.razor.rz.scp.css */
.profile-container[b-3wrjcawot5] {
    max-width: 1400px;
    margin: 0 auto;
    background-color: #f8f9fa;
    padding: 20px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.page-title[b-3wrjcawot5] {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 20px;
    color: #fff;
}

.section[b-3wrjcawot5] {
    background: white;
    border: 1px solid #e0e0e0;
    margin-bottom: 20px;
    border-radius: 2px;
}

.section-header[b-3wrjcawot5] {
    padding: 14px 20px;
    border-bottom: 1px solid #e2e8f0;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
}

.section-header h3[b-3wrjcawot5] {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    border-left: 3px solid rgba(255,255,255,0.4);
    padding-left: 10px;
    line-height: 1;
}

.section-body[b-3wrjcawot5] { padding: 20px; }

.form-row[b-3wrjcawot5] { display: flex; margin-bottom: 15px; align-items: center; }

.form-label[b-3wrjcawot5] {
    width: 200px;
    min-width: 200px;
    font-size: 13px;
    color: #666;
    margin-right: 20px;
    text-align: left;
}

.form-label.required[b-3wrjcawot5]::after { content: " *"; color: red; }

.form-input-container[b-3wrjcawot5] { flex-grow: 1; display: flex; gap: 10px; }

.form-control[b-3wrjcawot5] {
    width: 100%;
    padding: 8px 12px;
    font-size: 13px;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.form-control:focus[b-3wrjcawot5] {
    border-color: #80bdff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, .25);
}

.form-select[b-3wrjcawot5] {
    width: 100%;
    padding: 8px 12px;
    font-size: 13px;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
}

.phone-select-container[b-3wrjcawot5] { display: flex; width: 100%; gap: 10px; }
.phone-select[b-3wrjcawot5] { width: 120px; }

.btn-primary[b-3wrjcawot5] {
    color: #fff;
    background-color: #5bc0de;
    border-color: #46b8da;
    padding: 8px 16px;
    font-size: 13px;
    border-radius: 3px;
    cursor: pointer;
    border: none;
}

.btn-primary:hover[b-3wrjcawot5] { background-color: #31b0d5; border-color: #269abc; }

.btn-submit[b-3wrjcawot5] { margin-top: 10px; }

.alert[b-3wrjcawot5] {
    padding: 10px 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
    font-size: 13px;
}

.alert-danger[b-3wrjcawot5] { color: #721c24; background-color: #f8d7da; border-color: #f5c6cb; }
.alert-success[b-3wrjcawot5] { color: #155724; background-color: #d4edda; border-color: #c3e6cb; }
/* /Pages/ModellerDashboard/ProjectDetail.razor.rz.scp.css */
.project-detail-container[b-i3wdcjr76i] {
        padding: 20px;
        max-width: 1400px;
        margin: 0 auto;
    }

    .loading-spinner[b-i3wdcjr76i] {
        text-align: center;
        padding: 40px;
    }

    .header-section[b-i3wdcjr76i] {
        margin-bottom: 20px;
    }

    .breadcrumb[b-i3wdcjr76i] {
        font-size: 0.9rem;
        color: #666;
        margin-bottom: 10px;
    }

    .breadcrumb a[b-i3wdcjr76i] {
        color: #015974;
        text-decoration: none;
    }

    .breadcrumb a:hover[b-i3wdcjr76i] {
        text-decoration: underline;
    }

    .breadcrumb span[b-i3wdcjr76i] {
        margin: 0 8px;
    }

    .header-section h2[b-i3wdcjr76i] {
        margin: 0;
        font-size: 1.8rem;
        color: #fff;
    }

    .tabs-container[b-i3wdcjr76i] {
        background: white;
        border-radius: 8px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        overflow: hidden;
    }

    .tabs-header[b-i3wdcjr76i] {
        display: flex;
        border-bottom: 2px solid #e9ecef;
        background: #f8f9fa;
    }

    .tab-btn[b-i3wdcjr76i] {
        flex: 1;
        padding: 15px 20px;
        border: none;
        background: transparent;
        cursor: pointer;
        font-weight: 600;
        font-size: 0.85rem;
        color: #666;
        transition: all 0.3s ease;
        border-bottom: 3px solid transparent;
    }

    .tab-btn:hover[b-i3wdcjr76i] {
        background: #e9ecef;
        color: #333;
    }

    .tab-btn.active[b-i3wdcjr76i] {
        color: #015974;
        border-bottom-color: #015974;
        background: white;
    }

    .tab-content[b-i3wdcjr76i] {
        padding: 30px;
    }

    /* Details Tab */
    .detail-card[b-i3wdcjr76i] {
        background: #fff;
        border: 1px solid #e9ecef;
        border-radius: 8px;
        padding: 24px;
        height: 100%;
    }

    .detail-field[b-i3wdcjr76i] {
        display: flex;
        flex-direction: column;
        gap: 6px;
        margin-bottom: 18px;
    }

    .detail-label[b-i3wdcjr76i] {
        font-size: 0.82rem;
        font-weight: 600;
        color: #888;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

    .detail-value[b-i3wdcjr76i] {
        font-size: 0.95rem;
        color: #333;
    }

    .detail-section-block[b-i3wdcjr76i] {
        margin-bottom: 18px;
    }

    .detail-section-title[b-i3wdcjr76i] {
        display: flex;
        align-items: center;
        font-size: 1rem;
        font-weight: 700;
        color: #333;
        margin-bottom: 10px;
        gap: 8px;
    }

    .detail-section-title[b-i3wdcjr76i]::before {
        content: '';
        display: inline-block;
        width: 4px;
        height: 18px;
        background: #015974;
        border-radius: 2px;
    }

    .badge-group[b-i3wdcjr76i] {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .location-block[b-i3wdcjr76i] {
        width: 100%;
    }

    .map-frame[b-i3wdcjr76i] {
        border-radius: 6px;
        overflow: hidden;
        border: 1px solid #dee2e6;
    }

    .map-placeholder[b-i3wdcjr76i] {
        height: 200px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: #f8f9fa;
        border: 1px dashed #dee2e6;
        border-radius: 6px;
    }

    .badge-delivery[b-i3wdcjr76i] {
        background: #0dcaf0;
        color: #fff;
    }

    .badge-date[b-i3wdcjr76i] {
        background: #015974;
        color: #fff;
    }

    .checklist-badges[b-i3wdcjr76i] {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .badge[b-i3wdcjr76i] {
        padding: 6px 12px;
        border-radius: 4px;
        font-size: 0.85rem;
        font-weight: 500;
    }

    .badge-primary[b-i3wdcjr76i] {
        background: #015974;
        color: white;
    }

    .badge-info[b-i3wdcjr76i] {
        background: #015974;
        color: white;
    }

    .badge-success[b-i3wdcjr76i] {
        background: #28a745;
        color: white;
    }

    .badge-danger[b-i3wdcjr76i] {
        background: #dc3545;
        color: white;
    }

    .badge-warning[b-i3wdcjr76i] {
        background: #ffc107;
        color: #333;
    }

    .location-inputs[b-i3wdcjr76i] {
        margin-top: 10px;
    }

    .coordinate-row[b-i3wdcjr76i] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 15px;
        margin-top: 10px;
    }

    /* Files Tab */
    .file-upload-area[b-i3wdcjr76i] {
        margin: 20px 0;
        position: relative;
    }

    .file-input[b-i3wdcjr76i] {
        cursor: pointer;
        height: 100%;
        inset: 0;
        opacity: 0;
        position: absolute;
        width: 100%;
        z-index: 2;
    }

    .file-drop-zone[b-i3wdcjr76i] {
        display: block;
        padding: 40px;
        border: 2px dashed #ccc;
        border-radius: 8px;
        text-align: center;
        cursor: pointer;
        transition: all 0.3s ease;
    }

    .file-drop-zone:hover[b-i3wdcjr76i] {
        border-color: #015974;
        background: #f8f9fa;
    }

    .selected-files[b-i3wdcjr76i] {
        margin: 20px 0;
    }

    .file-item[b-i3wdcjr76i], .existing-file[b-i3wdcjr76i] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 12px;
        background: #f8f9fa;
        border-radius: 6px;
        margin-bottom: 10px;
    }

    .btn-remove[b-i3wdcjr76i] {
        background: #dc3545;
        color: white;
        border: none;
        border-radius: 50%;
        width: 28px;
        height: 28px;
        cursor: pointer;
        font-size: 1.2rem;
        line-height: 1;
    }

    .file-actions[b-i3wdcjr76i] {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .file-status[b-i3wdcjr76i] {
        border-radius: 12px;
        display: inline-block;
        font-size: 0.72rem;
        font-weight: 700;
        margin-left: 8px;
        padding: 2px 8px;
    }

    .file-status.approved[b-i3wdcjr76i] {
        background: #dcfce7;
        color: #166534;
    }

    .file-status.pending[b-i3wdcjr76i],
    .file-status.rejected[b-i3wdcjr76i] {
        background: #fee2e2;
        color: #991b1b;
    }

    .external-files-title[b-i3wdcjr76i] {
        margin-top: 24px;
    }

    .external-file span[b-i3wdcjr76i] {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        min-width: 0;
    }

    .external-file a[b-i3wdcjr76i] {
        color: #015974;
        word-break: break-all;
    }

    /* Admin Tab */
    .admin-tab .form-group[b-i3wdcjr76i] {
        margin-bottom: 20px;
    }

    .admin-tab label[b-i3wdcjr76i] {
        font-weight: 600;
        margin-bottom: 8px;
        display: block;
    }

    /* Comments Tab */
    .form-check[b-i3wdcjr76i] {
        margin: 15px 0;
    }

    .comment-item[b-i3wdcjr76i] {
        padding: 15px;
        background: #f8f9fa;
        border-radius: 8px;
        margin-bottom: 15px;
    }

    .comment-header[b-i3wdcjr76i] {
        display: flex;
        justify-content: space-between;
        margin-bottom: 10px;
    }

    .comment-date[b-i3wdcjr76i] {
        color: #666;
        font-size: 0.85rem;
    }

    .comment-flags[b-i3wdcjr76i] {
        margin-top: 10px;
    }

    /* History Tab */
    .timeline[b-i3wdcjr76i] {
        position: relative;
        padding-left: 30px;
    }

    .timeline-item[b-i3wdcjr76i] {
        position: relative;
        padding-bottom: 30px;
    }

    .timeline-marker[b-i3wdcjr76i] {
        position: absolute;
        left: -30px;
        top: 5px;
        width: 12px;
        height: 12px;
        border-radius: 50%;
        background: #015974;
        border: 3px solid white;
        box-shadow: 0 0 0 2px #015974;
    }

    .timeline-item[b-i3wdcjr76i]::before {
        content: '';
        position: absolute;
        left: -25px;
        top: 17px;
        bottom: -30px;
        width: 2px;
        background: #e9ecef;
    }

    .timeline-item:last-child[b-i3wdcjr76i]::before {
        display: none;
    }

    .timeline-content[b-i3wdcjr76i] {
        background: #f8f9fa;
        padding: 15px;
        border-radius: 8px;
    }

    .timeline-header[b-i3wdcjr76i] {
        display: flex;
        justify-content: space-between;
        margin-bottom: 8px;
    }

    .timeline-date[b-i3wdcjr76i] {
        color: #666;
        font-size: 0.85rem;
    }

    .timeline-user[b-i3wdcjr76i] {
        margin: 0;
        color: #666;
        font-size: 0.9rem;
    }

    /* Common */
    .form-control[b-i3wdcjr76i] {
        width: 100%;
        padding: 10px;
        border: 1px solid #ced4da;
        border-radius: 4px;
        font-size: 0.95rem;
    }

    .form-control:focus[b-i3wdcjr76i] {
        outline: none;
        border-color: #015974;
        box-shadow: 0 0 0 3px rgba(45, 122, 122, 0.1);
    }

    .btn[b-i3wdcjr76i] {
        padding: 10px 20px;
        border: none;
        border-radius: 6px;
        cursor: pointer;
        font-weight: 600;
        transition: all 0.3s ease;
    }

    .btn-primary[b-i3wdcjr76i] {
        background: #015974;
        color: white;
    }

    .btn-primary:hover:not(:disabled)[b-i3wdcjr76i] {
        background: #015974;
    }

    .btn-primary:disabled[b-i3wdcjr76i] {
        opacity: 0.5;
        cursor: not-allowed;
    }

    .btn-sm[b-i3wdcjr76i] {
        padding: 6px 12px;
        font-size: 0.85rem;
    }

    .btn-info[b-i3wdcjr76i] {
        background: #015974;
        color: white;
    }

    .btn-success[b-i3wdcjr76i] {
        background: #28a745;
        color: white;
    }

    .alert[b-i3wdcjr76i] {
        padding: 12px 16px;
        border-radius: 6px;
        margin: 15px 0;
    }

    .alert-success[b-i3wdcjr76i] {
        background: #d4edda;
        color: #155724;
        border: 1px solid #c3e6cb;
    }

    .alert-danger[b-i3wdcjr76i] {
        background: #f8d7da;
        color: #721c24;
        border: 1px solid #f5c6cb;
    }

    .note[b-i3wdcjr76i] {
        font-size: 0.85rem;
        color: #666;
        font-weight: 400;
    }

    .text-muted[b-i3wdcjr76i] {
        color: #6c757d;
    }

    hr[b-i3wdcjr76i] {
        margin: 30px 0;
        border: none;
        border-top: 1px solid #e9ecef;
    }

    @media (max-width: 768px) {
        .detail-row[b-i3wdcjr76i] {
            grid-template-columns: 1fr;
        }

        .tabs-header[b-i3wdcjr76i] {
            flex-wrap: wrap;
        }

        .tab-btn[b-i3wdcjr76i] {
            flex: 1 1 50%;
        }

        .coordinate-row[b-i3wdcjr76i] {
            grid-template-columns: 1fr;
        }
    }
/* /Pages/QADashboard/QAInvoiceDetail.razor.rz.scp.css */
/* QA invoice detail — shares inv-* globals from portal-theme.css */

.inv-status-chip[b-tsrv35mx48] {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 0.72rem;
    font-weight: 600;
}

.chip-success[b-tsrv35mx48] { background: #d1fae5; color: #065f46; }
.chip-muted[b-tsrv35mx48]   { background: #f3f4f6; color: #6b7280; }

.inv-open-btn[b-tsrv35mx48] {
    padding: 3px 10px;
    border: 1px solid #015974;
    background: transparent;
    color: #015974;
    border-radius: 4px;
    font-size: 0.78rem;
    cursor: pointer;
    white-space: nowrap;
}

.inv-open-btn:hover[b-tsrv35mx48] { background: #015974; color: #fff; }

.inv-btn-danger[b-tsrv35mx48] {
    padding: 9px 18px;
    border: none;
    background: #dc2626;
    color: #fff;
    border-radius: 8px;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 600;
    transition: opacity 0.15s;
}

.inv-btn-danger:hover:not(:disabled)[b-tsrv35mx48] { opacity: 0.88; }
.inv-btn-danger:disabled[b-tsrv35mx48] { opacity: 0.55; cursor: not-allowed; }

.inv-modal-backdrop[b-tsrv35mx48] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
}

.inv-modal-card[b-tsrv35mx48] {
    background: #fff;
    padding: 28px;
    border-radius: 10px;
    max-width: 480px;
    width: 90%;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
}

.inv-modal-card h4[b-tsrv35mx48] { margin: 0 0 8px; font-size: 1.1rem; }
.inv-modal-card p[b-tsrv35mx48]  { color: #6b7280; margin: 0 0 14px; font-size: 0.875rem; }

.inv-textarea[b-tsrv35mx48] {
    width: 100%;
    padding: 10px 12px;
    border: 1.5px solid #d1d5db;
    border-radius: 6px;
    font-size: 0.875rem;
    font-family: inherit;
    resize: vertical;
    box-sizing: border-box;
}

.inv-textarea:focus[b-tsrv35mx48] { outline: none; border-color: #015974; box-shadow: 0 0 0 3px rgba(1,89,116,0.1); }

.inv-modal-actions[b-tsrv35mx48] {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 16px;
}
/* /Pages/QADashboard/QAInvoiceHistory.razor.rz.scp.css */
.invoice-tabs[b-6n2o528q2g] { display: flex; gap: 8px; margin-bottom: 12px; }
    .tab-btn[b-6n2o528q2g] { padding: 8px 18px; border: 1px solid #ccc; background: #f5f5f5; cursor: pointer; border-radius: 4px 4px 0 0; }
    .tab-btn.active[b-6n2o528q2g] { background: #015974; color: #fff; border-color: #015974; }
    .invoice-status-badge[b-6n2o528q2g] { padding: 4px 10px; border-radius: 12px; font-size: 0.85em; font-weight: 600; }
    .status-paid[b-6n2o528q2g] { background: #d4edda; color: #155724; }
    .status-pending[b-6n2o528q2g] { background: #fff3cd; color: #856404; }
    .status-finalised[b-6n2o528q2g] { background: #d1ecf1; color: #0c5460; }
    .status-rejected[b-6n2o528q2g] { background: #f8d7da; color: #721c24; }
    .status-draft[b-6n2o528q2g] { background: #e2e3e5; color: #383d41; }
/* /Pages/QADashboard/QAJobsBoard.razor.rz.scp.css */
.qa-container[b-pbzlfonr3p] {
        padding: 24px;
        max-width: 100%;
    }

    .qa-header[b-pbzlfonr3p] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 24px;
        background: linear-gradient(190deg, #015974, #9D6023);
        padding: 20px 24px;
        border-radius: 12px;
        color: white;
    }

    .qa-header-left[b-pbzlfonr3p] {
        display: flex;
        align-items: center;
        gap: 12px;
    }

    .qa-header h2[b-pbzlfonr3p] {
        margin: 0;
        font-size: 1.5rem;
        font-weight: 700;
        color: white;
    }

    .qa-badge[b-pbzlfonr3p] {
        background: rgba(255,255,255,0.2);
        padding: 4px 12px;
        border-radius: 20px;
        font-size: 0.75rem;
        font-weight: 600;
        letter-spacing: 0.5px;
        text-transform: uppercase;
    }

    .qa-header-right[b-pbzlfonr3p] {
        display: flex;
        gap: 10px;
    }

    .btn-create[b-pbzlfonr3p] {
        background: #22c55e;
        color: white;
        border: none;
        padding: 10px 20px;
        border-radius: 8px;
        font-weight: 600;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 6px;
        transition: background 0.2s;
    }

    .btn-create:hover[b-pbzlfonr3p] { background: #16a34a; }

    .btn-refresh[b-pbzlfonr3p] {
        background: rgba(255,255,255,0.15);
        color: white;
        border: 1px solid rgba(255,255,255,0.3);
        padding: 10px 16px;
        border-radius: 8px;
        cursor: pointer;
        transition: background 0.2s;
    }

    .btn-refresh:hover[b-pbzlfonr3p] { background: rgba(255,255,255,0.25); }

    /* Stats */
    .stats-row[b-pbzlfonr3p] {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 16px;
        margin-bottom: 20px;
    }

    .stat-card[b-pbzlfonr3p] {
        background: white;
        border-radius: 12px;
        padding: 20px;
        display: flex;
        align-items: center;
        gap: 16px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.06);
        border-left: 4px solid transparent;
    }

    .stat-card.pending[b-pbzlfonr3p] { border-left-color: #f59e0b; }
    .stat-card.in-progress[b-pbzlfonr3p] { border-left-color: #3b82f6; }
    .stat-card.completed[b-pbzlfonr3p] { border-left-color: #22c55e; }
    .stat-card.unpaid[b-pbzlfonr3p] { border-left-color: #ef4444; }

    .stat-icon[b-pbzlfonr3p] {
        width: 48px;
        height: 48px;
        border-radius: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.3rem;
    }

    .stat-card.pending .stat-icon[b-pbzlfonr3p] { background: #fef3c7; color: #f59e0b; }
    .stat-card.in-progress .stat-icon[b-pbzlfonr3p] { background: #dbeafe; color: #3b82f6; }
    .stat-card.completed .stat-icon[b-pbzlfonr3p] { background: #dcfce7; color: #22c55e; }
    .stat-card.unpaid .stat-icon[b-pbzlfonr3p] { background: #fee2e2; color: #ef4444; }

    .stat-info[b-pbzlfonr3p] { display: flex; flex-direction: column; }
    .stat-number[b-pbzlfonr3p] { font-size: 1.8rem; font-weight: 700; color: #1e293b; line-height: 1; }
    .stat-label[b-pbzlfonr3p] { font-size: 0.85rem; color: #64748b; margin-top: 4px; }

    /* Filters */
    .filter-bar[b-pbzlfonr3p] {
        background: white;
        border-radius: 10px;
        padding: 16px;
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        align-items: flex-end;
        margin-bottom: 20px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    }

    .filter-item[b-pbzlfonr3p] {
        display: flex;
        flex-direction: column;
        gap: 4px;
        min-width: 140px;
    }

    .filter-item.search-item[b-pbzlfonr3p] { min-width: 260px; }

    .filter-item label[b-pbzlfonr3p] {
        font-size: 0.78rem;
        font-weight: 600;
        color: #64748b;
        text-transform: uppercase;
        letter-spacing: 0.4px;
    }

    .filter-item input[b-pbzlfonr3p],
    .filter-item select[b-pbzlfonr3p] {
        padding: 8px 12px;
        border: 1px solid #e2e8f0;
        border-radius: 6px;
        font-size: 0.9rem;
        background: #f8fafc;
        color: #1e293b;
        outline: none;
        transition: border 0.2s;
    }

    .filter-item input:focus[b-pbzlfonr3p],
    .filter-item select:focus[b-pbzlfonr3p] { border-color: #015974; }

    .btn-apply[b-pbzlfonr3p] {
        background: linear-gradient(190deg, #015974, #9D6023);
        color: white;
        border: none;
        padding: 9px 18px;
        border-radius: 6px;
        font-weight: 600;
        cursor: pointer;
        align-self: flex-end;
    }

    .btn-clear[b-pbzlfonr3p] {
        background: #f1f5f9;
        color: #64748b;
        border: 1px solid #e2e8f0;
        padding: 9px 18px;
        border-radius: 6px;
        font-weight: 600;
        cursor: pointer;
        align-self: flex-end;
    }

    /* Table */
    .qa-table-wrapper[b-pbzlfonr3p] {
        background: white;
        border-radius: 12px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.06);
        overflow: hidden;
    }

    .qa-table-wrapper .qa-table-scroll[b-pbzlfonr3p] {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .qa-table-wrapper .qa-table-scroll[b-pbzlfonr3p]::-webkit-scrollbar {
        height: 6px;
    }

    .qa-table-wrapper .qa-table-scroll[b-pbzlfonr3p]::-webkit-scrollbar-track {
        background: #f1f5f9;
    }

    .qa-table-wrapper .qa-table-scroll[b-pbzlfonr3p]::-webkit-scrollbar-thumb {
        background: #94a3b8;
        border-radius: 3px;
    }

    .qa-table-wrapper .qa-table-scroll[b-pbzlfonr3p]::-webkit-scrollbar-thumb:hover {
        background: #015974;
    }

    .qa-table[b-pbzlfonr3p] {
        width: 100%;
        min-width: 1100px;
        border-collapse: collapse;
        font-size: 0.88rem;
    }

    .qa-table thead tr[b-pbzlfonr3p] {
        background: #f8fafc;
        border-bottom: 2px solid #e2e8f0;
    }

    .qa-table th[b-pbzlfonr3p] {
        padding: 12px 14px;
        text-align: left;
        font-weight: 700;
        font-size: 0.78rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        color: #64748b;
        white-space: nowrap;
    }

    .qa-table td[b-pbzlfonr3p] {
        padding: 12px 14px;
        border-bottom: 1px solid #f1f5f9;
        color: #374151;
        vertical-align: middle;
    }

    .qa-table tbody tr:hover[b-pbzlfonr3p] { background: #f8fafc; }
    .qa-table tbody tr:last-child td[b-pbzlfonr3p] { border-bottom: none; }

    .row-urgent[b-pbzlfonr3p] { background: #fff7ed !important; }
    .row-urgent:hover[b-pbzlfonr3p] { background: #fef3c7 !important; }

    .project-id-badge[b-pbzlfonr3p] {
        background: #e0f2fe;
        color: #0369a1;
        padding: 3px 8px;
        border-radius: 4px;
        font-size: 0.78rem;
        font-weight: 700;
        white-space: nowrap;
    }

    .cell-name[b-pbzlfonr3p] {
        max-width: 220px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .cell-name strong[b-pbzlfonr3p] { color: #1e293b; display: block; overflow: hidden; text-overflow: ellipsis; }

    .customer-name[b-pbzlfonr3p] { font-weight: 600; color: #374151; }

    .company-badge[b-pbzlfonr3p] {
        background: #f0fdf4;
        color: #166534;
        padding: 2px 8px;
        border-radius: 4px;
        font-size: 0.8rem;
        font-weight: 600;
    }

    .badge-paid[b-pbzlfonr3p] {
        background: #dcfce7;
        color: #166534;
        padding: 4px 10px;
        border-radius: 20px;
        font-size: 0.8rem;
        font-weight: 600;
    }

    .badge-unpaid[b-pbzlfonr3p] {
        background: #fee2e2;
        color: #991b1b;
        padding: 4px 10px;
        border-radius: 20px;
        font-size: 0.8rem;
        font-weight: 600;
    }

    .status-badge[b-pbzlfonr3p] {
        padding: 4px 10px;
        border-radius: 20px;
        font-size: 0.78rem;
        font-weight: 600;
        white-space: nowrap;
    }

    .status-badge.pending[b-pbzlfonr3p] { background: #fef3c7; color: #92400e; }
    .status-badge.in-progress[b-pbzlfonr3p] { background: #dbeafe; color: #1d4ed8; }
    .status-badge.completed[b-pbzlfonr3p] { background: #dcfce7; color: #166534; }
    .status-badge.approved[b-pbzlfonr3p] { background: #e0f2fe; color: #0369a1; }

    .type-label[b-pbzlfonr3p] {
        background: #f3f4f6;
        color: #374151;
        padding: 3px 8px;
        border-radius: 4px;
        font-size: 0.8rem;
    }

    .urgency-badge[b-pbzlfonr3p] {
        padding: 3px 8px;
        border-radius: 4px;
        font-size: 0.78rem;
        font-weight: 600;
    }

    .urgency-badge.urgent[b-pbzlfonr3p] { background: #fee2e2; color: #991b1b; }
    .urgency-badge.high[b-pbzlfonr3p] { background: #fed7aa; color: #9a3412; }
    .urgency-badge.normal[b-pbzlfonr3p] { background: #dbeafe; color: #1d4ed8; }
    .urgency-badge.low[b-pbzlfonr3p] { background: #f3f4f6; color: #6b7280; }

    .assigned-user[b-pbzlfonr3p] {
        font-size: 0.82rem;
        color: #374151;
        display: flex;
        align-items: center;
        gap: 4px;
    }

    .cell-actions[b-pbzlfonr3p] {
        display: flex;
        gap: 6px;
        white-space: nowrap;
    }

    .btn-action[b-pbzlfonr3p] {
        padding: 6px 12px;
        border: none;
        border-radius: 6px;
        font-size: 0.82rem;
        font-weight: 600;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        gap: 4px;
        transition: all 0.15s;
    }

    .btn-action.manage[b-pbzlfonr3p] { background: #dbeafe; color: #1d4ed8; }
    .btn-action.manage:hover[b-pbzlfonr3p] { background: #bfdbfe; }
    .btn-action.delete[b-pbzlfonr3p] { background: #fee2e2; color: #991b1b; }
    .btn-action.delete:hover[b-pbzlfonr3p] { background: #fecaca; }

    .no-data[b-pbzlfonr3p] {
        text-align: center;
        padding: 48px;
        color: #9ca3af;
        font-size: 1rem;
    }

    .no-data i[b-pbzlfonr3p] { font-size: 2rem; display: block; margin-bottom: 12px; }

    .loading-state[b-pbzlfonr3p] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        padding: 48px;
        color: #64748b;
    }

    /* Pagination */
    .pagination-bar[b-pbzlfonr3p] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 16px 20px;
        border-top: 1px solid #f1f5f9;
        background: #fafafa;
    }

    .page-info[b-pbzlfonr3p] { font-size: 0.85rem; color: #64748b; }

    .page-buttons[b-pbzlfonr3p] { display: flex; gap: 4px; }

    .page-btn[b-pbzlfonr3p] {
        width: 34px;
        height: 34px;
        border: 1px solid #e2e8f0;
        background: white;
        border-radius: 6px;
        cursor: pointer;
        font-size: 0.9rem;
        color: #374151;
        transition: all 0.15s;
    }

    .page-btn:hover:not(:disabled)[b-pbzlfonr3p] { background: #f1f5f9; }
    
    .page-btn:disabled[b-pbzlfonr3p] { opacity: 0.4; cursor: not-allowed; }

    /* Modals */
    .modal-overlay[b-pbzlfonr3p] {
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.5);
        z-index: 1000;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 16px;
    }

    .modal-panel[b-pbzlfonr3p] {
        background: white;
        border-radius: 16px;
        box-shadow: 0 20px 60px rgba(0,0,0,0.2);
        display: flex;
        flex-direction: column;
        max-height: 90vh;
        overflow: hidden;
    }

    .modal-manage[b-pbzlfonr3p] { width: 100%; max-width: 900px; }
    .modal-create[b-pbzlfonr3p] { width: 100%; max-width: 760px; }

    .modal-header-qa[b-pbzlfonr3p] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 20px 24px;
        border-bottom: 1px solid #e2e8f0;
        background: linear-gradient(190deg, #015974, #9D6023);
        color: white;
    }

    .modal-header-qa h3[b-pbzlfonr3p] { margin: 0; font-size: 1.1rem; color: white; }

    .btn-close-modal[b-pbzlfonr3p] {
        background: rgba(255,255,255,0.15);
        border: none;
        color: white;
        width: 32px;
        height: 32px;
        border-radius: 50%;
        font-size: 1.2rem;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
    }

    .modal-body-qa[b-pbzlfonr3p] {
        padding: 24px;
        overflow-y: auto;
        flex: 1;
    }

    .modal-footer-qa[b-pbzlfonr3p] {
        padding: 16px 24px;
        border-top: 1px solid #e2e8f0;
        display: flex;
        gap: 10px;
        justify-content: flex-end;
        background: #f8fafc;
    }

    .btn-save[b-pbzlfonr3p] {
        background: #015974;
        color: white;
        border: none;
        padding: 10px 24px;
        border-radius: 8px;
        font-weight: 600;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 6px;
        transition: background 0.2s;
    }

    .btn-save:hover[b-pbzlfonr3p] { background: #014a62; }
    .btn-save:disabled[b-pbzlfonr3p] { opacity: 0.6; cursor: not-allowed; }

    .btn-cancel[b-pbzlfonr3p] {
        background: #f1f5f9;
        color: #64748b;
        border: 1px solid #e2e8f0;
        padding: 10px 24px;
        border-radius: 8px;
        font-weight: 600;
        cursor: pointer;
    }

    /* Manage Grid */
    .manage-grid[b-pbzlfonr3p] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 24px;
    }

    .customer-info-section[b-pbzlfonr3p] { grid-column: span 2; }

    .manage-section[b-pbzlfonr3p] {
        background: #f8fafc;
        border-radius: 10px;
        padding: 16px;
        border: 1px solid #e2e8f0;
    }

    .section-title[b-pbzlfonr3p] {
        font-size: 0.85rem;
        font-weight: 700;
        color: #374151;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        margin-bottom: 14px;
        display: flex;
        align-items: center;
        gap: 6px;
    }

    .form-row-qa[b-pbzlfonr3p] {
        margin-bottom: 14px;
        display: flex;
        flex-direction: column;
        gap: 5px;
    }

    .form-row-qa label[b-pbzlfonr3p] {
        font-size: 0.8rem;
        font-weight: 600;
        color: #64748b;
    }

    .form-input[b-pbzlfonr3p] {
        width: 100%;
        padding: 8px 12px;
        border: 1px solid #e2e8f0;
        border-radius: 6px;
        font-size: 0.9rem;
        background: white;
        box-sizing: border-box;
        outline: none;
        transition: border 0.2s;
    }

    .form-input:focus[b-pbzlfonr3p] { border-color: #015974; }

    .check-row[b-pbzlfonr3p] {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 0.9rem;
    }

    .info-row[b-pbzlfonr3p] {
        display: flex;
        gap: 8px;
        padding: 8px 0;
        border-bottom: 1px solid #e2e8f0;
        font-size: 0.9rem;
    }

    .info-row:last-child[b-pbzlfonr3p] { border-bottom: none; }

    .info-label[b-pbzlfonr3p] { font-weight: 600; color: #64748b; min-width: 80px; }

    /* Create grid */
    .create-grid[b-pbzlfonr3p] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 14px;
    }

    .form-row-qa.full-width[b-pbzlfonr3p] { grid-column: span 2; }

    .required[b-pbzlfonr3p] { color: #ef4444; }

    .chip-grid[b-pbzlfonr3p] {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        padding: 10px;
        background: white;
        border: 1px solid #e2e8f0;
        border-radius: 6px;
    }

    .chip[b-pbzlfonr3p] {
        padding: 6px 12px;
        border-radius: 20px;
        background: #f1f5f9;
        color: #374151;
        cursor: pointer;
        font-size: 0.82rem;
        font-weight: 600;
        display: flex;
        align-items: center;
        gap: 6px;
        border: 2px solid transparent;
        transition: all 0.15s;
    }

    .chip input[type="checkbox"][b-pbzlfonr3p] { display: none; }
    .chip-selected[b-pbzlfonr3p] { background: #dbeafe; color: #1d4ed8; border-color: #3b82f6; }
    .chip-cost[b-pbzlfonr3p] { font-size: 0.75rem; color: #6b7280; }
    .chip-selected .chip-cost[b-pbzlfonr3p] { color: #3b82f6; }

    .checklist-grid[b-pbzlfonr3p] {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        gap: 8px;
        padding: 10px;
        background: white;
        border: 1px solid #e2e8f0;
        border-radius: 6px;
        max-height: 180px;
        overflow-y: auto;
    }

    .check-item[b-pbzlfonr3p] {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 0.85rem;
        cursor: pointer;
        padding: 4px 8px;
        border-radius: 4px;
        transition: background 0.15s;
    }

    .check-item:hover[b-pbzlfonr3p] { background: #f1f5f9; }

    .alert-error[b-pbzlfonr3p] {
        background: #fee2e2;
        color: #991b1b;
        padding: 10px 14px;
        border-radius: 6px;
        margin-bottom: 16px;
        font-size: 0.9rem;
        border-left: 4px solid #ef4444;
    }

    .spinner[b-pbzlfonr3p] {
        width: 20px;
        height: 20px;
        border: 2px solid #e2e8f0;
        border-top-color: #015974;
        border-radius: 50%;
        animation: spin-b-pbzlfonr3p 0.7s linear infinite;
        display: inline-block;
    }

    .spinner-sm[b-pbzlfonr3p] {
        width: 14px;
        height: 14px;
        border: 2px solid rgba(255,255,255,0.4);
        border-top-color: white;
        border-radius: 50%;
        animation: spin-b-pbzlfonr3p 0.7s linear infinite;
        display: inline-block;
    }

    @keyframes spin-b-pbzlfonr3p { to { transform: rotate(360deg); } }

    @media (max-width: 991.98px) {
        .qa-container[b-pbzlfonr3p] { padding: 14px; }
        .qa-header[b-pbzlfonr3p] { padding: 16px 18px; flex-wrap: wrap; gap: 12px; }
        .qa-header h2[b-pbzlfonr3p] { font-size: 1.2rem; }
        .qa-header-right[b-pbzlfonr3p] { flex-wrap: wrap; }
        .stats-row[b-pbzlfonr3p] { grid-template-columns: repeat(2, 1fr); }
    }

    @media (max-width: 768px) {
        .qa-container[b-pbzlfonr3p] { padding: 10px; }
        .stats-row[b-pbzlfonr3p] { grid-template-columns: repeat(2, 1fr); gap: 10px; }
        .stat-card[b-pbzlfonr3p] { padding: 14px; gap: 10px; }
        .stat-icon[b-pbzlfonr3p] { width: 40px; height: 40px; font-size: 1.05rem; }
        .stat-number[b-pbzlfonr3p] { font-size: 1.4rem; }
        .stat-label[b-pbzlfonr3p] { font-size: 0.78rem; }
        .manage-grid[b-pbzlfonr3p] { grid-template-columns: 1fr; gap: 14px; }
        .customer-info-section[b-pbzlfonr3p] { grid-column: span 1; }
        .create-grid[b-pbzlfonr3p] { grid-template-columns: 1fr; }
        .form-row-qa.full-width[b-pbzlfonr3p] { grid-column: span 1; }
        .filter-item[b-pbzlfonr3p], .filter-item.search-item[b-pbzlfonr3p] { min-width: 100%; }
        .pagination-bar[b-pbzlfonr3p] { flex-direction: column; gap: 10px; padding: 12px; }
        .modal-overlay[b-pbzlfonr3p] { padding: 8px; }
        .modal-header-qa[b-pbzlfonr3p] { padding: 14px 16px; }
        .modal-header-qa h3[b-pbzlfonr3p] { font-size: 0.95rem; }
        .modal-body-qa[b-pbzlfonr3p] { padding: 14px; }
        .modal-footer-qa[b-pbzlfonr3p] { padding: 12px 14px; flex-wrap: wrap; }
        .modal-footer-qa .btn-save[b-pbzlfonr3p],
        .modal-footer-qa .btn-cancel[b-pbzlfonr3p] { flex: 1; justify-content: center; padding: 10px 14px; }
        .btn-create[b-pbzlfonr3p], .btn-refresh[b-pbzlfonr3p] { padding: 8px 14px; font-size: 0.85rem; }
    }

    @media (max-width: 480px) {
        .stats-row[b-pbzlfonr3p] { grid-template-columns: 1fr; }
        .qa-header h2[b-pbzlfonr3p] { font-size: 1.05rem; }
    }
/* /Pages/QADashboard/QAProfile.razor.rz.scp.css */
.qp-container[b-ubfpzlza1y] { padding: 24px; max-width: 1100px; }

    /* Header */
    .qp-header[b-ubfpzlza1y] {
        display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px;
        background: linear-gradient(190deg, #015974, #9D6023);
        padding: 24px 28px; border-radius: 14px; margin-bottom: 24px; color: white;
    }
    .qp-header-left[b-ubfpzlza1y] { display: flex; align-items: center; gap: 18px; }
    .qp-avatar[b-ubfpzlza1y] {
        width: 64px; height: 64px; border-radius: 50%; background: rgba(255,255,255,0.2);
        display: flex; align-items: center; justify-content: center; font-size: 1.8rem; color: white;
        flex-shrink: 0;
    }
    .qp-header h2[b-ubfpzlza1y] { margin: 0; font-size: 1.5rem; font-weight: 700; color: white; }
    .qp-role-tag[b-ubfpzlza1y] {
        background: rgba(255,255,255,0.2); padding: 3px 12px; border-radius: 20px;
        font-size: 0.75rem; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; margin-top: 4px; display: inline-block;
    }
    .qp-email[b-ubfpzlza1y] { font-size: 0.9rem; color: rgba(255,255,255,0.85); display: flex; align-items: center; gap: 7px; }

    /* Grid */
    .qp-grid[b-ubfpzlza1y] { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }

    /* Cards */
    .qp-card[b-ubfpzlza1y] {
        background: white; border-radius: 12px; padding: 24px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.07); border: 1px solid #f1f5f9;
    }
    .qp-card-links[b-ubfpzlza1y] { grid-column: span 2; }

    .qp-card-title[b-ubfpzlza1y] {
        font-size: 0.8rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.6px;
        color: #64748b; margin-bottom: 18px; display: flex; align-items: center; gap: 7px;
        padding-bottom: 10px; border-bottom: 1px solid #f1f5f9;
    }

    /* Info list */
    .qp-info-list[b-ubfpzlza1y] { display: flex; flex-direction: column; gap: 0; }
    .qp-info-row[b-ubfpzlza1y] {
        display: flex; justify-content: space-between; align-items: center;
        padding: 11px 0; border-bottom: 1px solid #f8fafc;
    }
    .qp-info-row:last-child[b-ubfpzlza1y] { border-bottom: none; }
    .qp-info-label[b-ubfpzlza1y] { font-size: 0.82rem; font-weight: 600; color: #94a3b8; }
    .qp-info-value[b-ubfpzlza1y] { font-size: 0.9rem; color: #1e293b; font-weight: 500; }
    .qp-muted[b-ubfpzlza1y] { color: #94a3b8 !important; font-size: 0.82rem !important; }
    .qp-role-badge[b-ubfpzlza1y] {
        background: linear-gradient(190deg, #015974, #9D6023); color: white;
        padding: 3px 12px; border-radius: 20px; font-size: 0.75rem; font-weight: 700;
    }

    /* Form */
    .qp-field[b-ubfpzlza1y] { display: flex; flex-direction: column; gap: 5px; margin-bottom: 16px; }
    .qp-field label[b-ubfpzlza1y] { font-size: 0.82rem; font-weight: 600; color: #64748b; }
    .qp-input[b-ubfpzlza1y] {
        width: 100%; padding: 10px 14px; border: 1px solid #e2e8f0; border-radius: 8px;
        font-size: 0.9rem; background: #f8fafc; outline: none; transition: border 0.2s; box-sizing: border-box;
    }
    .qp-input:focus[b-ubfpzlza1y] { border-color: #015974; background: white; box-shadow: 0 0 0 3px rgba(1,89,116,0.08); }

    .qp-btn-save[b-ubfpzlza1y] {
        background: linear-gradient(190deg, #015974, #9D6023); color: white; border: none;
        padding: 10px 24px; border-radius: 8px; font-weight: 600; font-size: 0.9rem;
        cursor: pointer; display: inline-flex; align-items: center; gap: 7px; margin-top: 4px;
        transition: opacity 0.2s;
    }
    .qp-btn-save:hover:not(:disabled)[b-ubfpzlza1y] { opacity: 0.9; }
    .qp-btn-save:disabled[b-ubfpzlza1y] { opacity: 0.6; cursor: not-allowed; }

    /* Alerts */
    .qp-alert[b-ubfpzlza1y] {
        padding: 10px 14px; border-radius: 8px; font-size: 0.88rem; font-weight: 500;
        display: flex; align-items: center; gap: 8px; margin-bottom: 16px;
    }
    .qp-alert-success[b-ubfpzlza1y] { background: #dcfce7; color: #166534; border-left: 4px solid #22c55e; }
    .qp-alert-error[b-ubfpzlza1y] { background: #fee2e2; color: #991b1b; border-left: 4px solid #ef4444; }

    /* Quick links */
    .qp-link-grid[b-ubfpzlza1y] { display: flex; gap: 16px; flex-wrap: wrap; }
    .qp-link-card[b-ubfpzlza1y] {
        display: flex; flex-direction: column; align-items: center; gap: 10px;
        padding: 20px 32px; background: #f8fafc; border: 1px solid #e2e8f0;
        border-radius: 10px; text-decoration: none; color: #374151;
        font-weight: 600; font-size: 0.88rem; transition: all 0.15s; min-width: 130px;
    }
    .qp-link-card:hover[b-ubfpzlza1y] { background: #e0f2fe; border-color: #015974; color: #015974; transform: translateY(-2px); }
    .qp-link-card i[b-ubfpzlza1y] { font-size: 1.6rem; color: #015974; }

    /* Spinner */
    .qp-spinner-sm[b-ubfpzlza1y] {
        width: 14px; height: 14px; border: 2px solid rgba(255,255,255,0.4); border-top-color: white;
        border-radius: 50%; animation: qpspin-b-ubfpzlza1y 0.7s linear infinite; display: inline-block;
    }
    @keyframes qpspin-b-ubfpzlza1y { to { transform: rotate(360deg); } }

    @media (max-width: 768px) {
        .qp-grid[b-ubfpzlza1y] { grid-template-columns: 1fr; }
        .qp-card-links[b-ubfpzlza1y] { grid-column: span 1; }
        .qp-header[b-ubfpzlza1y] { flex-direction: column; align-items: flex-start; }
    }
/* /Pages/QADashboard/QAProjectDetail.razor.rz.scp.css */
.project-detail-container[b-s6vegep9ui] {
        padding: 20px;
        max-width: 1400px;
        margin: 0 auto;
    }

    .loading-spinner[b-s6vegep9ui] {
        text-align: center;
        padding: 40px;
    }

    .header-section[b-s6vegep9ui] {
        margin-bottom: 20px;
    }

    .breadcrumb[b-s6vegep9ui] {
        font-size: 0.9rem;
        color: #666;
        margin-bottom: 10px;
    }

    .breadcrumb a[b-s6vegep9ui] {
        color: #015974;
        text-decoration: none;
    }

    .breadcrumb a:hover[b-s6vegep9ui] {
        text-decoration: underline;
    }

    .breadcrumb span[b-s6vegep9ui] {
        margin: 0 8px;
    }

    .header-section h2[b-s6vegep9ui] {
        margin: 0;
        font-size: 1.8rem;
        color: #fff;
    }

    .tabs-container[b-s6vegep9ui] {
        background: white;
        border-radius: 8px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        overflow: hidden;
    }

    .tabs-header[b-s6vegep9ui] {
        display: flex;
        border-bottom: 2px solid #e9ecef;
        background: #f8f9fa;
    }

    .tab-btn[b-s6vegep9ui] {
        flex: 1;
        padding: 15px 20px;
        border: none;
        background: transparent;
        cursor: pointer;
        font-weight: 600;
        font-size: 0.85rem;
        color: #666;
        transition: all 0.3s ease;
        border-bottom: 3px solid transparent;
    }

    .tab-btn:hover[b-s6vegep9ui] {
        background: #e9ecef;
        color: #333;
    }

    .tab-btn.active[b-s6vegep9ui] {
        color: #015974;
        border-bottom-color: #015974;
        background: white;
    }

    .tab-content[b-s6vegep9ui] {
        padding: 30px;
    }

    .detail-card[b-s6vegep9ui] {
        background: #fff;
        border: 1px solid #e9ecef;
        border-radius: 8px;
        padding: 24px;
        height: 100%;
    }

    .detail-field[b-s6vegep9ui] {
        display: flex;
        flex-direction: column;
        gap: 6px;
        margin-bottom: 18px;
    }

    .detail-label[b-s6vegep9ui] {
        font-size: 0.82rem;
        font-weight: 600;
        color: #888;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

    .detail-value[b-s6vegep9ui] {
        font-size: 0.95rem;
        color: #333;
    }

    .detail-section-block[b-s6vegep9ui] {
        margin-bottom: 18px;
    }

    .detail-section-title[b-s6vegep9ui] {
        display: flex;
        align-items: center;
        font-size: 1rem;
        font-weight: 700;
        color: #333;
        margin-bottom: 10px;
        gap: 8px;
    }

    .detail-section-title[b-s6vegep9ui]::before {
        content: '';
        display: inline-block;
        width: 4px;
        height: 18px;
        background: #015974;
        border-radius: 2px;
    }

    .badge-group[b-s6vegep9ui] {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .location-block[b-s6vegep9ui] {
        width: 100%;
    }

    .map-frame[b-s6vegep9ui] {
        border-radius: 6px;
        overflow: hidden;
        border: 1px solid #dee2e6;
    }

    .map-placeholder[b-s6vegep9ui] {
        height: 200px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: #f8f9fa;
        border: 1px dashed #dee2e6;
        border-radius: 6px;
    }

    .badge[b-s6vegep9ui] {
        padding: 6px 12px;
        border-radius: 4px;
        font-size: 0.85rem;
        font-weight: 500;
        display: inline-block;
    }

    .badge-primary[b-s6vegep9ui] {
        background: #015974;
        color: white;
    }

    .badge-info[b-s6vegep9ui] {
        background: #015974;
        color: white;
    }

    .badge-success[b-s6vegep9ui] {
        background: #28a745;
        color: white;
    }

    .badge-danger[b-s6vegep9ui] {
        background: #dc3545;
        color: white;
    }

    .badge-warning[b-s6vegep9ui] {
        background: #ffc107;
        color: #333;
    }

    .badge-delivery[b-s6vegep9ui] {
        background: #0dcaf0;
        color: #fff;
    }

    .badge-date[b-s6vegep9ui] {
        background: #015974;
        color: #fff;
    }

    .badge-type[b-s6vegep9ui] {
        background: #015974;
        color: white;
    }

    /* Files Tab */
    .file-upload-area[b-s6vegep9ui] {
        margin: 20px 0;
        position: relative;
    }

    .file-input[b-s6vegep9ui] {
        cursor: pointer;
        height: 100%;
        inset: 0;
        opacity: 0;
        position: absolute;
        width: 100%;
        z-index: 2;
    }

    .file-drop-zone[b-s6vegep9ui] {
        display: block;
        padding: 40px;
        border: 2px dashed #ccc;
        border-radius: 8px;
        text-align: center;
        cursor: pointer;
        transition: all 0.3s ease;
    }

    .file-drop-zone:hover[b-s6vegep9ui] {
        border-color: #015974;
        background: #f8f9fa;
    }

    .selected-files[b-s6vegep9ui] {
        margin: 20px 0;
    }

    .file-item[b-s6vegep9ui], .existing-file[b-s6vegep9ui] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 12px;
        background: #f8f9fa;
        border-radius: 6px;
        margin-bottom: 10px;
    }

    .btn-remove[b-s6vegep9ui] {
        background: #dc3545;
        color: white;
        border: none;
        border-radius: 50%;
        width: 28px;
        height: 28px;
        cursor: pointer;
        font-size: 1.2rem;
        line-height: 1;
    }

    .file-actions[b-s6vegep9ui] {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .file-status[b-s6vegep9ui] {
        border-radius: 12px;
        display: inline-block;
        font-size: 0.72rem;
        font-weight: 700;
        margin-left: 8px;
        padding: 2px 8px;
    }

    .file-status.approved[b-s6vegep9ui] {
        background: #dcfce7;
        color: #166534;
    }

    .file-status.pending[b-s6vegep9ui],
    .file-status.rejected[b-s6vegep9ui] {
        background: #fee2e2;
        color: #991b1b;
    }

    .external-files-title[b-s6vegep9ui] {
        margin-top: 24px;
    }

    .external-file span[b-s6vegep9ui] {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        min-width: 0;
    }

    .external-file a[b-s6vegep9ui] {
        color: #015974;
        word-break: break-all;
    }

    /* Admin Tab */
    .admin-tab .form-group[b-s6vegep9ui] {
        margin-bottom: 20px;
    }

    .admin-tab label[b-s6vegep9ui] {
        font-weight: 600;
        margin-bottom: 8px;
        display: block;
    }

    /* Comments Tab */
    .form-check[b-s6vegep9ui] {
        margin: 15px 0;
    }

    .comment-item[b-s6vegep9ui] {
        padding: 15px;
        background: #f8f9fa;
        border-radius: 8px;
        margin-bottom: 15px;
    }

    .comment-header[b-s6vegep9ui] {
        display: flex;
        justify-content: space-between;
        margin-bottom: 10px;
    }

    .comment-date[b-s6vegep9ui] {
        color: #666;
        font-size: 0.85rem;
    }

    .comment-flags[b-s6vegep9ui] {
        margin-top: 10px;
    }

    /* History Tab */
    .timeline[b-s6vegep9ui] {
        position: relative;
        padding-left: 30px;
    }

    .timeline-item[b-s6vegep9ui] {
        position: relative;
        padding-bottom: 30px;
    }

    .timeline-marker[b-s6vegep9ui] {
        position: absolute;
        left: -30px;
        top: 5px;
        width: 12px;
        height: 12px;
        border-radius: 50%;
        background: #015974;
        border: 3px solid white;
        box-shadow: 0 0 0 2px #015974;
    }

    .timeline-item[b-s6vegep9ui]::before {
        content: '';
        position: absolute;
        left: -25px;
        top: 17px;
        bottom: -30px;
        width: 2px;
        background: #e9ecef;
    }

    .timeline-item:last-child[b-s6vegep9ui]::before {
        display: none;
    }

    .timeline-content[b-s6vegep9ui] {
        background: #f8f9fa;
        padding: 15px;
        border-radius: 8px;
    }

    .timeline-header[b-s6vegep9ui] {
        display: flex;
        justify-content: space-between;
        margin-bottom: 8px;
    }

    .timeline-date[b-s6vegep9ui] {
        color: #666;
        font-size: 0.85rem;
    }

    .timeline-user[b-s6vegep9ui] {
        margin: 0;
        color: #666;
        font-size: 0.9rem;
    }

    /* Common */
    .form-control[b-s6vegep9ui] {
        width: 100%;
        padding: 10px;
        border: 1px solid #ced4da;
        border-radius: 4px;
        font-size: 0.95rem;
    }

    .form-control:focus[b-s6vegep9ui] {
        outline: none;
        border-color: #015974;
        box-shadow: 0 0 0 3px rgba(45, 122, 122, 0.1);
    }

    .btn[b-s6vegep9ui] {
        padding: 10px 20px;
        border: none;
        border-radius: 6px;
        cursor: pointer;
        font-weight: 600;
        transition: all 0.3s ease;
    }

    .btn-primary[b-s6vegep9ui] {
        background: #015974;
        color: white;
    }

    .btn-primary:hover:not(:disabled)[b-s6vegep9ui] {
        background: #015974;
    }

    .btn-primary:disabled[b-s6vegep9ui] {
        opacity: 0.5;
        cursor: not-allowed;
    }

    .btn-sm[b-s6vegep9ui] {
        padding: 6px 12px;
        font-size: 0.85rem;
    }

    .btn-success[b-s6vegep9ui] {
        background: #28a745;
        color: white;
    }

    .btn-danger[b-s6vegep9ui] {
        background: #dc3545;
        color: white;
    }

    .alert[b-s6vegep9ui] {
        padding: 12px 16px;
        border-radius: 6px;
        margin: 15px 0;
    }

    .alert-success[b-s6vegep9ui] {
        background: #d4edda;
        color: #155724;
        border: 1px solid #c3e6cb;
    }

    .alert-danger[b-s6vegep9ui] {
        background: #f8d7da;
        color: #721c24;
        border: 1px solid #f5c6cb;
    }

    .note[b-s6vegep9ui] {
        font-size: 0.85rem;
        color: #666;
        font-weight: 400;
    }

    .text-muted[b-s6vegep9ui] {
        color: #6c757d;
    }

    hr[b-s6vegep9ui] {
        margin: 30px 0;
        border: none;
        border-top: 1px solid #e9ecef;
    }

    @media (max-width: 768px) {
        .tabs-header[b-s6vegep9ui] {
            flex-wrap: wrap;
        }

        .tab-btn[b-s6vegep9ui] {
            flex: 1 1 50%;
        }
    }
/* /Pages/QADashboard/QAProjects.razor.rz.scp.css */
.container[b-d79e9dytdx] {
    padding: 24px;
    background-color: #f8f9fa;
    font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
    max-width: 1400px;
    width: 100%;
    margin: 0 auto;
}

.header-section[b-d79e9dytdx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 24px;
    padding: 18px 24px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.22);
    color: #fff;
}

.header-section h2[b-d79e9dytdx] {
        color: #fff;
    margin: 0;
    color: #fff;
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: -0.025em;
}

.actions-group[b-d79e9dytdx] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.add-btn[b-d79e9dytdx] {
    background: #fff;
    color: #015974;
    padding: 8px 18px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 700;
    transition: all 0.2s ease;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}

.add-btn:hover[b-d79e9dytdx] {
    background: #f0f9fc;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

.table-section[b-d79e9dytdx] {
    background-color: #ffffff;
    border-radius: 12px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03);
    overflow: hidden;
}

.table-wrapper[b-d79e9dytdx] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.table-wrapper[b-d79e9dytdx]::-webkit-scrollbar { height: 6px; }
.table-wrapper[b-d79e9dytdx]::-webkit-scrollbar-track { background: #f1f5f9; }
.table-wrapper[b-d79e9dytdx]::-webkit-scrollbar-thumb { background: #94a3b8; border-radius: 3px; }
.table-wrapper[b-d79e9dytdx]::-webkit-scrollbar-thumb:hover { background: #015974; }

table[b-d79e9dytdx] {
    width: 100%;
    min-width: 1100px;
    border-collapse: collapse;
    white-space: nowrap;
}

th[b-d79e9dytdx] {
    background-color: #f9fafb;
    color: #4b5563;
    font-weight: 600;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 12px 14px;
    border-bottom: 2px solid #e5e7eb;
    text-align: left;
    white-space: nowrap;
}

td[b-d79e9dytdx] {
    padding: 11px 14px;
    color: #374151;
    font-size: 0.825rem;
    border-bottom: 1px solid #f3f4f6;
    vertical-align: middle;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
}

tr:last-child td[b-d79e9dytdx] { border-bottom: none; }
tr:hover td[b-d79e9dytdx] { background-color: #f9fafb; }

td:last-child[b-d79e9dytdx], th:last-child[b-d79e9dytdx] { white-space: nowrap; max-width: none; }

.btn.btn-sm[b-d79e9dytdx] { padding: 4px 10px; font-size: 0.78rem; border-radius: 5px; border: none; font-weight: 500; cursor: pointer; margin-right: 4px; transition: background-color 0.15s; text-decoration: none; display: inline-block; }
.btn.btn-success[b-d79e9dytdx] { background-color: #22c55e; color: #fff; }
.btn.btn-success:hover[b-d79e9dytdx] { background-color: #16a34a; }
.btn.btn-info[b-d79e9dytdx] { background-color: #0284a0; color: #fff; }
.btn.btn-info:hover[b-d79e9dytdx] { background-color: #017a9a; }
.btn.btn-danger[b-d79e9dytdx] { background-color: #ef4444; color: #fff; }
.btn.btn-danger:hover[b-d79e9dytdx] { background-color: #dc2626; }

.pagination-section[b-d79e9dytdx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    background-color: #ffffff;
    border-top: 1px solid #e5e7eb;
}

.page-info[b-d79e9dytdx] { color: #6b7280; font-size: 0.875rem; }

.pagination-buttons[b-d79e9dytdx] { display: flex; gap: 4px; align-items: center; }

.pagination-buttons .page-btn[b-d79e9dytdx] {
    min-width: 34px; height: 34px; padding: 0 8px;
    display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid #d1d5db; background-color: #fff; border-radius: 6px;
    color: #374151; font-size: 1rem; font-weight: 500; cursor: pointer;
    transition: all 0.15s; user-select: none;
}

.pagination-buttons .page-btn:hover:not(:disabled)[b-d79e9dytdx] { border-color: #015974; background-color: #e0f2fe; color: #015974; }
.pagination-buttons .page-btn.active[b-d79e9dytdx] { background: linear-gradient(135deg, #015974, #9D6023); border-color: transparent; color: #fff; font-weight: 600; box-shadow: 0 2px 6px rgba(1,89,116,0.35); }
.pagination-buttons .page-btn:disabled[b-d79e9dytdx] { cursor: not-allowed; opacity: 0.4; background-color: #f9fafb; }

.table-footer[b-d79e9dytdx] { padding: 16px 24px; color: #6b7280; font-size: 0.875rem; border-top: 1px solid #e5e7eb; }

.search-input[b-d79e9dytdx] {
    padding: 8px 14px;
    border: 1.5px solid rgba(255,255,255,0.35);
    border-radius: 8px;
    width: 280px;
    max-width: 100%;
    background: rgba(255,255,255,0.15);
    color: #fff;
    font-size: 0.875rem;
    transition: all 0.2s;
}
.search-input[b-d79e9dytdx]::placeholder { color: rgba(255,255,255,0.65); } .search-input_placeholder[b-d79e9dytdx] { color: rgba(255,255,255,0.65); }
.search-input:focus[b-d79e9dytdx] { outline: none; border-color: rgba(255,255,255,0.7); background: rgba(255,255,255,0.25); box-shadow: 0 0 0 3px rgba(255,255,255,0.15); }

/* Modal */
.modal[b-d79e9dytdx] {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background-color: rgba(17, 24, 39, 0.6); backdrop-filter: blur(4px);
    display: flex; justify-content: center; align-items: center; z-index: 50;
    animation: fadeIn-b-d79e9dytdx 0.2s ease-out;
}

.modal-content[b-d79e9dytdx] {
    background-color: #ffffff; padding: 32px; border-radius: 16px;
    width: 900px; max-width: 95%; max-height: 90vh; overflow-y: auto;
    box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 10px 10px -5px rgba(0,0,0,0.04);
    animation: slideUp-b-d79e9dytdx 0.3s ease-out;
}

.modal-content h3[b-d79e9dytdx] {
    margin: 0 0 24px; color: #111827; font-size: 1.5rem; font-weight: 700;
    padding-bottom: 16px; border-bottom: 1px solid #e5e7eb;
}

.form-grid[b-d79e9dytdx] { display: flex; flex-direction: column; gap: 20px; }

.form-row[b-d79e9dytdx] { display: flex; gap: 24px; width: 100%; }

.form-group[b-d79e9dytdx] { flex: 1; display: flex; flex-direction: column; gap: 8px; }
.form-group label[b-d79e9dytdx] { font-size: 0.875rem; font-weight: 600; color: #374151; }
.form-group input[b-d79e9dytdx], .form-group select[b-d79e9dytdx], .form-group textarea[b-d79e9dytdx] {
    width: 100%; padding: 10px 14px; border: 1px solid #d1d5db; border-radius: 8px;
    background-color: #f9fafb; color: #111827; font-size: 0.95rem; transition: all 0.2s;
}
.form-group input:focus[b-d79e9dytdx], .form-group select:focus[b-d79e9dytdx], .form-group textarea:focus[b-d79e9dytdx] {
    outline: none; border-color: #015974; background-color: white; box-shadow: 0 0 0 3px rgba(1, 89, 116, 0.1);
}
.form-group input:disabled[b-d79e9dytdx], .form-group textarea:disabled[b-d79e9dytdx] {
    background-color: #f3f4f6; color: #6b7280; cursor: default;
}

.report-chip-grid[b-d79e9dytdx] {
    display: flex; flex-wrap: wrap; gap: 10px; padding: 12px;
    border: 1px solid #d1d5db; border-radius: 8px; background-color: #f9fafb; min-height: 58px;
}

.report-chip[b-d79e9dytdx] {
    position: relative; display: inline-flex; flex-direction: column; align-items: center;
    justify-content: center; gap: 4px; padding: 10px 20px; border: 1.5px solid #d1d5db;
    border-radius: 8px; background-color: #ffffff; cursor: pointer; min-width: 130px;
    text-align: center; user-select: none; transition: all 0.15s;
}
.report-chip input[type="checkbox"][b-d79e9dytdx] { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.report-chip:hover[b-d79e9dytdx] { border-color: #7dd3dc; background-color: #f0f9fc; }
.report-chip.selected[b-d79e9dytdx] { border-color: #015974; background-color: #e0f2fe; box-shadow: 0 0 0 3px rgba(1, 89, 116, 0.12); }
.report-chip.selected[b-d79e9dytdx]::after { content: '✓'; position: absolute; top: 5px; right: 7px; font-size: 0.6rem; font-weight: 800; color: #015974; }
.chip-name[b-d79e9dytdx] { font-size: 0.875rem; font-weight: 600; color: #374151; }
.report-chip.selected .chip-name[b-d79e9dytdx] { color: #024d62; }
.chip-cost[b-d79e9dytdx] { font-size: 0.72rem; font-weight: 500; color: #6b7280; background-color: #f3f4f6; padding: 2px 8px; border-radius: 20px; }
.report-chip.selected .chip-cost[b-d79e9dytdx] { background-color: #cceaf2; color: #015974; }

.checkbox-item[b-d79e9dytdx] { display: flex; align-items: center; gap: 10px; font-size: 0.9rem; color: #374151; }
.checkbox-item input[type="checkbox"][b-d79e9dytdx] { width: 16px; height: 16px; accent-color: #015974; cursor: pointer; margin: 0; }

.button-group[b-d79e9dytdx] {
    margin-top: 32px; padding-top: 20px; border-top: 1px solid #e5e7eb;
    display: flex; justify-content: flex-end; gap: 12px;
}

.save-btn[b-d79e9dytdx] {
    background-color: #015974; color: white; padding: 10px 24px; border-radius: 8px;
    font-weight: 600; font-size: 0.95rem; border: none; cursor: pointer; transition: all 0.2s;
}
.save-btn:hover[b-d79e9dytdx] { background-color: #024d62; transform: translateY(-1px); }
.save-btn:disabled[b-d79e9dytdx] { opacity: 0.6; cursor: not-allowed; transform: none; }

.close-btn[b-d79e9dytdx] {
    background-color: white; color: #374151; padding: 10px 24px; border-radius: 8px;
    font-weight: 600; font-size: 0.95rem; border: 1px solid #d1d5db; cursor: pointer; transition: all 0.2s;
}
.close-btn:hover[b-d79e9dytdx] { background-color: #f3f4f6; }

.loading-container[b-d79e9dytdx] {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 40px 0; gap: 16px; color: #6b7280; font-size: 0.9rem;
}

.spinner[b-d79e9dytdx] {
    width: 36px; height: 36px; border: 3px solid #e5e7eb; border-top-color: #015974;
    border-radius: 50%; animation: spin-b-d79e9dytdx 0.7s linear infinite;
}

@keyframes spin-b-d79e9dytdx { to { transform: rotate(360deg); } }
@keyframes fadeIn-b-d79e9dytdx { from { opacity: 0; } to { opacity: 1; } }
@keyframes slideUp-b-d79e9dytdx { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 768px) {
    .container[b-d79e9dytdx] { padding: 16px; }
    .header-section[b-d79e9dytdx] { flex-direction: column; gap: 12px; align-items: stretch; }
    .actions-group[b-d79e9dytdx] { flex-direction: column; align-items: stretch; }
    .search-input[b-d79e9dytdx] { width: 100%; }
    .form-row[b-d79e9dytdx] { flex-direction: column; gap: 16px; }
    .modal-content[b-d79e9dytdx] { width: 100%; padding: 20px; border-radius: 12px; }
    .pagination-section[b-d79e9dytdx] { flex-direction: column; align-items: center; gap: 8px; }
}
/* /Pages/QADashboard/QAUnpaidInvoiceList.razor.rz.scp.css */
.invoice-status-badge[b-g0rfov7vag] { padding: 4px 10px; border-radius: 12px; font-size: 0.85em; font-weight: 600; }
    .status-paid[b-g0rfov7vag] { background: #d4edda; color: #155724; }
    .status-pending[b-g0rfov7vag] { background: #fff3cd; color: #856404; }
    .status-finalised[b-g0rfov7vag] { background: #d1ecf1; color: #0c5460; }
    .status-rejected[b-g0rfov7vag] { background: #f8d7da; color: #721c24; }
    .status-draft[b-g0rfov7vag] { background: #e2e3e5; color: #383d41; }
    .rejection-reason-preview[b-g0rfov7vag] { color: #721c24; font-style: italic; margin-top: 4px; max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
/* /Pages/UserDashboard/ActiveOrder.razor.rz.scp.css */
.container[b-wid9dhr5rb] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1200px;
    margin: 0 auto;
    border-radius: 20px;
}

.header-section[b-wid9dhr5rb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

    .header-section h2[b-wid9dhr5rb] {
        margin: 0;
        color: #fff;
        font-size: 1.8em;
        font-weight: 600;
    }

.add-btn[b-wid9dhr5rb] {
    background: #fff;
    color: #015974;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .add-btn:hover[b-wid9dhr5rb] {
        background: #f0f9fc;
    }

.table-section[b-wid9dhr5rb] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    margin-bottom: 30px;
}

    .table-section h3[b-wid9dhr5rb] {
        margin-top: 0;
        color: #2c3e50;
        font-size: 1.5em;
        font-weight: 600;
        margin-bottom: 15px;
    }

table[b-wid9dhr5rb] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

th[b-wid9dhr5rb], td[b-wid9dhr5rb] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-wid9dhr5rb] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-wid9dhr5rb] {
    color: #34495e;
}

.action-btn[b-wid9dhr5rb] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-wid9dhr5rb] {
    background-color: #28a745;
    color: white;
}

    .edit-btn:hover[b-wid9dhr5rb] {
        background-color: #218838;
    }

.delete-btn[b-wid9dhr5rb] {
    background-color: #dc3545;
    color: white;
}

    .delete-btn:hover[b-wid9dhr5rb] {
        background-color: #c82333;
    }

.table-footer[b-wid9dhr5rb] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

.modal[b-wid9dhr5rb] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-wid9dhr5rb] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 800px; /* Increased width for horizontal layout */
    max-width: 90%;
    max-height: 80vh; /* Limit vertical height */
    overflow-y: auto; /* Scroll if content exceeds height */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

    .modal-content h3[b-wid9dhr5rb] {
        margin-top: 0;
        color: #015974;
        border-bottom: 2px solid #e9ecef;
        padding-bottom: 10px;
        margin-bottom: 20px;
        font-size: 1.6em;
        font-weight: 600;
    }

.form-grid[b-wid9dhr5rb] {
    display: grid;
    grid-template-columns: 1fr; /* Single column by default, adjust as needed */
    gap: 20px;
}

.form-module[b-wid9dhr5rb] {
    margin-bottom: 20px;
}

.form-row[b-wid9dhr5rb] {
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
}

.form-group[b-wid9dhr5rb] {
    flex: 1;
    margin-bottom: 0;
}

    .form-group label[b-wid9dhr5rb] {
        display: block;
        margin-bottom: 8px;
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

    .form-group input[b-wid9dhr5rb],
    .form-group select[b-wid9dhr5rb] {
        width: 100%;
        padding: 12px;
        border: 1px solid #ced4da;
        border-radius: 6px;
        box-sizing: border-box;
        font-size: 1em;
        transition: border-color 0.3s ease;
    }

        .form-group input:focus[b-wid9dhr5rb],
        .form-group select:focus[b-wid9dhr5rb] {
            border-color: #015974;
            outline: none;
            box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
        }

.checkbox-group[b-wid9dhr5rb] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-wid9dhr5rb] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

    .checkbox-label input[type="checkbox"][b-wid9dhr5rb] {
        margin-right: 12px;
        margin-bottom: 0;
        vertical-align: middle;
        height: 20px;
        width: 20px;
    }

    .checkbox-label span[b-wid9dhr5rb] {
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

.button-group[b-wid9dhr5rb] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-wid9dhr5rb] {
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .save-btn.primary[b-wid9dhr5rb] {
        background-color: #015974;
        color: white;
    }

    .save-btn:hover[b-wid9dhr5rb] {
        background-color: #dfe3e8;
    }

    .save-btn.primary:hover[b-wid9dhr5rb] {
        background-color: #024d62;
    }

.close-btn[b-wid9dhr5rb] {
    display: block;
    margin-top: 20px;
    padding: 12px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    width: 100%;
    text-align: center;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .close-btn:hover[b-wid9dhr5rb] {
        background-color: #dfe3e8;
    }

@media (max-width: 1024px) {
    .container[b-wid9dhr5rb] { padding: 14px; }
    .header-section h2[b-wid9dhr5rb] { font-size: 1.5em; }
    th[b-wid9dhr5rb], td[b-wid9dhr5rb] { padding: 11px; font-size: 0.88em; }
}

@media (max-width: 768px) {
    .container[b-wid9dhr5rb] { padding: 10px; }
    .header-section[b-wid9dhr5rb] { flex-direction: column; gap: 12px; align-items: stretch; padding: 16px; }
    .header-section h2[b-wid9dhr5rb] { font-size: 1.25em; }
    .add-btn[b-wid9dhr5rb] { width: 100%; padding: 10px 18px; }
    .table-section[b-wid9dhr5rb] { padding: 12px; overflow-x: auto; }
    table[b-wid9dhr5rb] { min-width: 600px; }
    .form-row[b-wid9dhr5rb] { flex-direction: column; gap: 12px; }
    .modal-content[b-wid9dhr5rb] { padding: 18px; width: 95%; }
    .modal-content h3[b-wid9dhr5rb] { font-size: 1.2em; }
    .button-group[b-wid9dhr5rb] { flex-direction: column-reverse; }
    .button-group button[b-wid9dhr5rb] { width: 100%; }
}

@media (max-width: 480px) {
    .container[b-wid9dhr5rb] { padding: 8px; }
    .header-section[b-wid9dhr5rb] { padding: 14px; }
    .header-section h2[b-wid9dhr5rb] { font-size: 1.1em; }
    .modal-content[b-wid9dhr5rb] { padding: 14px; max-height: 92vh; }
    .modal-content h3[b-wid9dhr5rb] { font-size: 1.05em; }
    .action-btn[b-wid9dhr5rb] { padding: 6px 10px; font-size: 0.82em; margin-right: 4px; }
    th[b-wid9dhr5rb], td[b-wid9dhr5rb] { padding: 9px; font-size: 0.82em; }
    .table-section h3[b-wid9dhr5rb] { font-size: 1.15em; }
}
/* /Pages/UserDashboard/ActiveProjects.razor.rz.scp.css */
/* ── Container ── */
    .ap-container[b-vmdgq0r6p1] {
        width: 100%;
        padding: 20px;
        box-sizing: border-box;
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    }

    /* ── Header ── */
    .ap-header[b-vmdgq0r6p1] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 12px;
        margin-bottom: 20px;
        background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
        padding: 18px 24px;
        border-radius: 10px;
        box-shadow: 0 4px 12px rgba(1, 89, 116, 0.25);
    }

    .ap-header h2[b-vmdgq0r6p1] {
        margin: 0;
        font-size: 1.35rem;
        font-weight: 600;
        color: #fff;
        letter-spacing: 0.3px;
    }

    .ap-actions-group[b-vmdgq0r6p1] {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 10px;
    }

    .ap-search-container[b-vmdgq0r6p1] { position: relative; }

    .ap-search-input[b-vmdgq0r6p1] {
        padding: 8px 14px;
        border: 1.5px solid rgba(255,255,255,0.35);
        border-radius: 6px;
        width: 240px;
        max-width: 100%;
        font-size: 0.875rem;
        background: rgba(255,255,255,0.15);
        color: #fff;
        transition: all 0.2s;
    }

    .ap-search-input[b-vmdgq0r6p1]::placeholder { color: rgba(255,255,255,0.65); }

    .ap-search-input:focus[b-vmdgq0r6p1] {
        outline: none;
        background: rgba(255,255,255,0.25);
        border-color: rgba(255,255,255,0.7);
        box-shadow: 0 0 0 3px rgba(255,255,255,0.15);
    }

    .ap-add-btn[b-vmdgq0r6p1] {
        background: #fff;
        color: #015974;
        border: none;
        padding: 8px 18px;
        border-radius: 6px;
        cursor: pointer;
        font-weight: 700;
        white-space: nowrap;
        font-size: 0.85rem;
        letter-spacing: 0.5px;
        transition: all 0.2s;
        box-shadow: 0 2px 6px rgba(0,0,0,0.12);
    }

    .ap-add-btn:hover[b-vmdgq0r6p1] {
        background: #f0f9fc;
        box-shadow: 0 4px 10px rgba(0,0,0,0.18);
        transform: translateY(-1px);
    }

    /* ── Table section ── */
    .ap-table-section[b-vmdgq0r6p1] {
        background: #fff;
        border-radius: 10px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.08);
        overflow: hidden;
        border: 1px solid #e9ecef;
    }

    .ap-table-wrapper[b-vmdgq0r6p1] {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    table[b-vmdgq0r6p1] {
        width: 100%;
        min-width: 1090px;
        border-collapse: collapse;
        table-layout: fixed;
    }

    thead tr[b-vmdgq0r6p1] {
        background: #f8f9fa;
        border-bottom: 2px solid #e2e8f0;
    }

    th[b-vmdgq0r6p1] {
        text-align: left;
        color: #64748b;
        font-size: 0.72rem;
        font-weight: 700;
        padding: 11px 14px;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        white-space: nowrap;
        overflow: hidden;
    }

    tbody tr[b-vmdgq0r6p1] {
        border-bottom: 1px solid #f1f5f9;
        transition: background 0.15s;
    }

    tbody tr:last-child[b-vmdgq0r6p1] { border-bottom: none; }

    tbody tr:hover[b-vmdgq0r6p1] { background: #f8fafc; }

    td[b-vmdgq0r6p1] {
        padding: 12px 14px;
        color: #374151;
        vertical-align: middle;
        font-size: 0.855rem;
        overflow: hidden;
    }

    /* ── Truncated cell ── */
    .ap-cell-truncate[b-vmdgq0r6p1] {
        display: block;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
        cursor: default;
    }

    /* ── Order badge ── */
    .ap-order-badge[b-vmdgq0r6p1] {
        display: inline-block;
        font-size: 0.75rem;
        font-weight: 700;
        color: #015974;
        background: #e0f2fe;
        padding: 2px 8px;
        border-radius: 4px;
        white-space: nowrap;
    }

    /* ── Cost cell ── */
    .ap-cost-cell[b-vmdgq0r6p1] {
        font-weight: 700;
        color: #015974;
        white-space: nowrap;
    }

    /* ── Action buttons ── */
    .ap-actions-cell[b-vmdgq0r6p1] { white-space: nowrap; }

    .ap-btn[b-vmdgq0r6p1] {
        padding: 5px 12px;
        border: none;
        border-radius: 5px;
        cursor: pointer;
        color: #fff;
        font-size: 0.78rem;
        font-weight: 600;
        margin-right: 5px;
        transition: all 0.15s ease;
        letter-spacing: 0.2px;
    }

    .ap-btn:last-child[b-vmdgq0r6p1] { margin-right: 0; }

    .ap-btn:hover[b-vmdgq0r6p1] { opacity: 0.88; transform: translateY(-1px); }

    .ap-btn-detail[b-vmdgq0r6p1]  { background: #64748b; }
    .ap-btn-invoice[b-vmdgq0r6p1] { background: #015974; }
    .ap-btn-delete[b-vmdgq0r6p1]  { background: #dc2626; }

    /* ── Empty state ── */
    .ap-empty[b-vmdgq0r6p1] {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 48px 0;
        color: #9ca3af;
        gap: 8px;
    }

    .ap-empty-icon[b-vmdgq0r6p1] { font-size: 2.5rem; }
    .ap-empty p[b-vmdgq0r6p1]    { margin: 0; font-size: 0.95rem; }

    /* ── Footer ── */
    .ap-footer[b-vmdgq0r6p1] {
        padding: 10px 16px;
        color: #6c757d;
        font-size: 0.82rem;
        border-top: 1px solid #e9ecef;
        background: #fafafa;
    }

    /* ── Pagination ── */
    .ap-pagination[b-vmdgq0r6p1] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 10px;
        padding: 14px 20px;
        border-top: 1px solid #e9ecef;
        background: #f8f9fa;
        border-radius: 0 0 10px 10px;
    }

    .ap-page-info[b-vmdgq0r6p1] {
        color: #64748b;
        font-size: 0.845rem;
        font-weight: 500;
    }

    .ap-page-btns[b-vmdgq0r6p1] {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
        align-items: center;
    }

    .ap-page-btn[b-vmdgq0r6p1] {
        min-width: 34px;
        height: 34px;
        padding: 0 8px;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        border: 1px solid #dee2e6;
        background: #fff;
        color: #374151;
        cursor: pointer;
        border-radius: 6px;
        transition: all 0.18s ease;
        font-weight: 600;
        font-size: 0.875rem;
        user-select: none;
    }

    .ap-page-btn:hover:not(:disabled)[b-vmdgq0r6p1] {
        background: #e0f2fe;
        border-color: #015974;
        color: #015974;
    }

    .ap-page-btn.active[b-vmdgq0r6p1] {
        background: linear-gradient(135deg, #015974, #9D6023);
        color: #fff;
        border-color: transparent;
        box-shadow: 0 2px 6px rgba(1, 89, 116, 0.35);
    }

    .ap-page-btn:disabled[b-vmdgq0r6p1] {
        cursor: not-allowed;
        opacity: 0.4;
        background: #fff;
        color: #adb5bd;
    }

    /* ── Loading ── */
    .ap-loading[b-vmdgq0r6p1] {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 48px 0;
        gap: 14px;
        color: #6b7280;
        font-size: 0.9rem;
    }

    .ap-spinner[b-vmdgq0r6p1] {
        width: 36px;
        height: 36px;
        border: 3px solid #e5e7eb;
        border-top-color: #015974;
        border-radius: 50%;
        animation: ap-spin-b-vmdgq0r6p1 0.7s linear infinite;
    }

    @keyframes ap-spin-b-vmdgq0r6p1 { to { transform: rotate(360deg); } }

    /* ── Detail Modal ── */
    .detail-overlay[b-vmdgq0r6p1] {
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.45);
        z-index: 1050;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 16px;
        animation: ap-fade-b-vmdgq0r6p1 0.2s ease;
    }

    @keyframes ap-fade-b-vmdgq0r6p1 { from { opacity:0; } to { opacity:1; } }

    .detail-panel[b-vmdgq0r6p1] {
        background: #fff;
        border-radius: 14px;
        width: 100%;
        max-width: 560px;
        max-height: 90vh;
        overflow-y: auto;
        box-shadow: 0 20px 60px rgba(0,0,0,0.25);
        animation: ap-slideup-b-vmdgq0r6p1 0.22s ease;
        display: flex;
        flex-direction: column;
    }

    @keyframes ap-slideup-b-vmdgq0r6p1 {
        from { transform: translateY(24px); opacity: 0; }
        to   { transform: translateY(0);    opacity: 1; }
    }

    .detail-header[b-vmdgq0r6p1] {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        padding: 20px 24px 16px;
        background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
        border-radius: 14px 14px 0 0;
        gap: 12px;
    }

    .detail-order-tag[b-vmdgq0r6p1] {
        display: inline-block;
        font-size: 0.72rem;
        font-weight: 700;
        color: rgba(255,255,255,0.75);
        background: rgba(255,255,255,0.15);
        padding: 2px 8px;
        border-radius: 4px;
        margin-bottom: 6px;
    }

    .detail-title[b-vmdgq0r6p1] {
        margin: 0;
        color: #fff;
        font-size: 1.15rem;
        font-weight: 700;
        line-height: 1.3;
    }

    .detail-x[b-vmdgq0r6p1] {
        background: rgba(255,255,255,0.15);
        border: none;
        color: #fff;
        font-size: 1.4rem;
        line-height: 1;
        width: 32px;
        height: 32px;
        border-radius: 6px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        transition: background 0.15s;
    }

    .detail-x:hover[b-vmdgq0r6p1] { background: rgba(255,255,255,0.3); }

    .detail-body[b-vmdgq0r6p1] { padding: 20px 24px; flex: 1; }

    .detail-cost-row[b-vmdgq0r6p1] {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 20px;
        flex-wrap: wrap;
    }

    .ap-cost-big[b-vmdgq0r6p1] {
        font-size: 1.3rem;
        font-weight: 800;
        color: #015974;
    }

    .detail-urgency-pill[b-vmdgq0r6p1] {
        font-size: 0.8rem;
        color: #64748b;
        background: #f1f5f9;
        padding: 3px 9px;
        border-radius: 20px;
        font-weight: 500;
    }

    .detail-grid[b-vmdgq0r6p1] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 14px 20px;
    }

    .detail-item[b-vmdgq0r6p1] {
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .detail-full[b-vmdgq0r6p1] { grid-column: 1 / -1; }

    .detail-label[b-vmdgq0r6p1] {
        font-size: 0.7rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.6px;
        color: #94a3b8;
    }

    .detail-value[b-vmdgq0r6p1] {
        font-size: 0.875rem;
        color: #1e293b;
        font-weight: 500;
        line-height: 1.45;
        word-break: break-word;
    }

    .detail-footer[b-vmdgq0r6p1] {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 16px 24px;
        border-top: 1px solid #e9ecef;
        background: #f8f9fa;
        border-radius: 0 0 14px 14px;
        flex-wrap: wrap;
    }

    .detail-close-btn[b-vmdgq0r6p1] {
        margin-left: auto;
        background: none;
        border: 1.5px solid #cbd5e1;
        color: #64748b;
        padding: 5px 14px;
        border-radius: 6px;
        cursor: pointer;
        font-size: 0.845rem;
        font-weight: 600;
        transition: all 0.15s;
    }

    .detail-close-btn:hover[b-vmdgq0r6p1] {
        background: #f1f5f9;
        border-color: #94a3b8;
        color: #374151;
    }

    /* ── Comments ── */
    .detail-comments[b-vmdgq0r6p1] {
        padding: 16px 24px;
        border-top: 1px solid #e9ecef;
    }

    .comments-title[b-vmdgq0r6p1] {
        font-size: 0.88rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        color: #64748b;
        margin: 0 0 12px;
    }

    .comments-loading[b-vmdgq0r6p1], .comments-empty[b-vmdgq0r6p1] {
        font-size: 0.855rem;
        color: #94a3b8;
        margin: 0 0 10px;
    }

    .comments-list[b-vmdgq0r6p1] { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }

    .comment-item[b-vmdgq0r6p1] {
        background: #f8fafc;
        border: 1px solid #e9ecef;
        border-radius: 8px;
        padding: 10px 14px;
    }

    .comment-meta[b-vmdgq0r6p1] {
        display: flex;
        align-items: center;
        gap: 10px;
        flex-wrap: wrap;
        margin-bottom: 4px;
    }

    .comment-author[b-vmdgq0r6p1] {
        font-size: 0.78rem;
        font-weight: 700;
        color: #015974;
    }

    .comment-date[b-vmdgq0r6p1] {
        font-size: 0.74rem;
        color: #94a3b8;
    }

    .comment-text[b-vmdgq0r6p1] {
        margin: 0;
        font-size: 0.855rem;
        color: #374151;
        line-height: 1.5;
    }

    .comment-input-area[b-vmdgq0r6p1] { display: flex; flex-direction: column; gap: 8px; }

    .comment-input[b-vmdgq0r6p1] {
        width: 100%;
        border: 1.5px solid #e2e8f0;
        border-radius: 8px;
        padding: 8px 12px;
        font-size: 0.855rem;
        resize: vertical;
        font-family: inherit;
        transition: border-color 0.15s;
        box-sizing: border-box;
    }

    .comment-input:focus[b-vmdgq0r6p1] {
        outline: none;
        border-color: #015974;
        box-shadow: 0 0 0 3px rgba(1,89,116,0.1);
    }

    .comment-submit-btn[b-vmdgq0r6p1] {
        align-self: flex-end;
        background: linear-gradient(135deg, #015974, #9D6023);
        color: #fff;
        border: none;
        padding: 7px 20px;
        border-radius: 6px;
        font-size: 0.845rem;
        font-weight: 600;
        cursor: pointer;
        transition: opacity 0.15s;
    }

    .comment-submit-btn:disabled[b-vmdgq0r6p1] { opacity: 0.6; cursor: not-allowed; }
    .comment-submit-btn:hover:not(:disabled)[b-vmdgq0r6p1] { opacity: 0.88; }

    .comment-error[b-vmdgq0r6p1] {
        margin: 0;
        font-size: 0.8rem;
        color: #dc2626;
    }

    /* ── Responsive: small desktop ── */
    @media (max-width: 1024px) {
        .ap-header h2[b-vmdgq0r6p1] { font-size: 1.2rem; }
        .ap-search-input[b-vmdgq0r6p1] { width: 200px; }
        th[b-vmdgq0r6p1], td[b-vmdgq0r6p1] { padding: 10px 10px; font-size: 0.8rem; }
        .ap-btn[b-vmdgq0r6p1] { padding: 5px 9px; font-size: 0.74rem; }
    }

    /* ── Responsive: tablet ── */
    @media (max-width: 900px) {
        .ap-search-input[b-vmdgq0r6p1] { width: 180px; }
        .detail-panel[b-vmdgq0r6p1] { max-width: 95%; }
    }

    /* ── Responsive: mobile ── */
    @media (max-width: 640px) {
        .ap-container[b-vmdgq0r6p1] { padding: 12px; }

        .ap-header[b-vmdgq0r6p1] {
            flex-direction: column;
            align-items: stretch;
            padding: 14px 16px;
        }

        .ap-actions-group[b-vmdgq0r6p1] { flex-direction: column; align-items: stretch; }
        .ap-search-input[b-vmdgq0r6p1]  { width: 100%; }
        .ap-add-btn[b-vmdgq0r6p1]       { width: 100%; text-align: center; }

        table[b-vmdgq0r6p1], thead[b-vmdgq0r6p1], tbody[b-vmdgq0r6p1], th[b-vmdgq0r6p1], td[b-vmdgq0r6p1], tr[b-vmdgq0r6p1] { display: block; }
        thead tr[b-vmdgq0r6p1] { display: none; }

        tbody tr[b-vmdgq0r6p1] {
            border: 1px solid #e2e8f0;
            border-radius: 10px;
            margin-bottom: 12px;
            padding: 4px 0;
            background: #fff;
            box-shadow: 0 1px 4px rgba(0,0,0,0.06);
        }

        tbody tr:hover[b-vmdgq0r6p1] { background: #fff; }

        td[b-vmdgq0r6p1] {
            display: flex;
            align-items: flex-start;
            gap: 8px;
            padding: 9px 14px;
            border-bottom: 1px solid #f1f5f9;
            max-width: 100% !important;
        }

        td:last-child[b-vmdgq0r6p1] { border-bottom: none; }

        td[b-vmdgq0r6p1]::before {
            content: attr(data-label);
            font-weight: 700;
            color: #64748b;
            font-size: 0.72rem;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            min-width: 90px;
            flex-shrink: 0;
            padding-top: 1px;
        }

        .ap-cell-truncate[b-vmdgq0r6p1] {
            white-space: normal;
            overflow: visible;
            text-overflow: unset;
        }

        .ap-actions-cell[b-vmdgq0r6p1] { flex-direction: row; flex-wrap: wrap; gap: 6px; }
        .ap-btn[b-vmdgq0r6p1] { margin-right: 0; }

        .ap-pagination[b-vmdgq0r6p1] {
            flex-direction: column;
            align-items: center;
            text-align: center;
        }

        .detail-grid[b-vmdgq0r6p1] { grid-template-columns: 1fr; }
        .detail-full[b-vmdgq0r6p1] { grid-column: 1; }
        .detail-footer[b-vmdgq0r6p1] { flex-direction: column; align-items: stretch; }
        .detail-close-btn[b-vmdgq0r6p1] { margin-left: 0; text-align: center; }
    }

    /* ── Responsive: small mobile ── */
    @media (max-width: 480px) {
        .ap-container[b-vmdgq0r6p1] { padding: 8px; }
        .ap-header h2[b-vmdgq0r6p1] { font-size: 1.05rem; }
        .detail-header[b-vmdgq0r6p1] { padding: 14px 16px 12px; }
        .detail-title[b-vmdgq0r6p1] { font-size: 1rem; }
        .detail-body[b-vmdgq0r6p1] { padding: 14px 16px; }
        .detail-comments[b-vmdgq0r6p1] { padding: 12px 16px; }
        .detail-footer[b-vmdgq0r6p1] { padding: 12px 16px; }
        .ap-cost-big[b-vmdgq0r6p1] { font-size: 1.1rem; }
        .ap-btn[b-vmdgq0r6p1] { padding: 5px 10px; font-size: 0.74rem; width: auto; margin: 0 4px 4px 0; }
        .ap-actions-cell[b-vmdgq0r6p1] { flex-direction: row; flex-wrap: wrap; gap: 4px; }
    }
/* /Pages/UserDashboard/AddProject.razor.rz.scp.css */
.add-project-page[b-733gczvokw] {
    color: #162033;
}

.project-form-shell[b-733gczvokw] {
    background: #fff;
    border: 1px solid #dbe3ec;
    border-radius: 8px;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.07);
    padding: 1.75rem;
}

.project-form-shell .form-label[b-733gczvokw] {
    color: #1f2937;
    font-size: 0.95rem;
    font-weight: 600;
    margin-bottom: 0.55rem;
}

.project-form-shell .form-control[b-733gczvokw],
.project-form-shell .form-select[b-733gczvokw] {
    min-height: 42px;
    border-color: #cbd5e1;
    border-radius: 6px;
    color: #111827;
    box-shadow: none;
    transition: border-color 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease;
}

.project-form-shell textarea.form-control[b-733gczvokw] {
    min-height: 96px;
    resize: vertical;
}

.project-form-shell .form-control:focus[b-733gczvokw],
.project-form-shell .form-select:focus[b-733gczvokw] {
    border-color: #0f6f86;
    box-shadow: 0 0 0 3px rgba(15, 111, 134, 0.13);
}

.project-form-shell .text-muted[b-733gczvokw] {
    color: #64748b !important;
}

.form-section[b-733gczvokw] {
    padding-top: 0.25rem;
}

.option-grid[b-733gczvokw] {
    display: grid;
    gap: 0.75rem;
}

.option-grid-reports[b-733gczvokw] {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.option-grid-checklist[b-733gczvokw] {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.option-tile[b-733gczvokw] {
    align-items: center;
    background: #fff;
    border: 1px solid #d8e0e8;
    border-radius: 7px;
    cursor: pointer;
    display: flex;
    gap: 0.65rem;
    min-height: 48px;
    padding: 0.75rem 0.85rem;
    transition: border-color 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease, transform 0.16s ease;
}

.option-tile:hover[b-733gczvokw] {
    border-color: #8fb7c2;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.07);
    transform: translateY(-1px);
}

.option-tile.selected[b-733gczvokw] {
    background: #f1fbfd;
    border-color: #0f6f86;
    box-shadow: 0 0 0 3px rgba(15, 111, 134, 0.1);
}

.option-tile.disabled[b-733gczvokw] {
    background: #f3f4f6;
    border-color: #e5e7eb;
    color: #94a3b8;
    cursor: not-allowed;
    opacity: 0.65;
    transform: none;
}

.option-tile.disabled:hover[b-733gczvokw] {
    box-shadow: none;
    transform: none;
}

.option-tile .form-check-input[b-733gczvokw] {
    flex: 0 0 auto;
    margin: 0;
}

.option-tile span[b-733gczvokw] {
    color: #1f2937;
    flex: 1;
    min-width: 0;
}

.option-tile strong[b-733gczvokw] {
    color: #6f4a1f;
    font-size: 0.9rem;
    font-weight: 700;
    white-space: nowrap;
}

.option-tile-compact[b-733gczvokw] {
    min-height: 42px;
    padding: 0.65rem 0.8rem;
}

.project-type-select[b-733gczvokw] {
    max-width: 360px;
}

.external-source-list[b-733gczvokw] {
    display: grid;
    gap: 0.6rem;
    margin-bottom: 0.65rem;
}

.external-source-row[b-733gczvokw] {
    display: grid;
    grid-template-columns: minmax(130px, 0.35fr) minmax(180px, 1fr) auto;
    gap: 0.5rem;
    align-items: center;
}

.external-source-type[b-733gczvokw] {
    min-width: 0;
}

.external-source-delete[b-733gczvokw] {
    min-height: 42px;
    white-space: nowrap;
}

@media (min-width: 769px) {
    .project-type-select[b-733gczvokw] {
        min-height: 36px;
        padding-bottom: 0.35rem;
        padding-top: 0.35rem;
    }

    .option-grid-checklist[b-733gczvokw] {
        gap: 0.5rem;
        grid-template-columns: repeat(auto-fit, minmax(150px, max-content));
    }

    .option-grid-checklist .option-tile-compact[b-733gczvokw] {
        min-height: 34px;
        padding: 0.4rem 0.55rem;
        width: 150px;
    }

    .option-grid-checklist .option-tile-compact span[b-733gczvokw] {
        font-size: 0.85rem;
        line-height: 1.2;
    }
}

.checklist-panel[b-733gczvokw],
.form-panel[b-733gczvokw],
.upload-panel[b-733gczvokw] {
    background: #f8fafc;
    border: 1px solid #dbe3ec;
    border-radius: 8px;
}

.checklist-panel[b-733gczvokw] {
    max-height: 220px;
    overflow-y: auto;
    padding: 0;
}

.form-panel[b-733gczvokw] {
    height: 100%;
    padding: 1rem;
}

.upload-panel[b-733gczvokw] {
    padding: 1.2rem;
    text-align: center;
}

.map-preview[b-733gczvokw] {
    background: #f1f5f9;
    border: 1px solid #dbe3ec;
    border-radius: 7px;
    height: 300px;
    overflow: hidden;
}

.empty-state[b-733gczvokw] {
    align-items: center;
    color: #64748b;
    display: flex;
    min-height: 48px;
    padding: 0.85rem;
}

.checklist-list[b-733gczvokw] {
    display: grid;
    gap: 0;
}

.checklist-row[b-733gczvokw] {
    align-items: flex-start;
    background: #fff;
    border-bottom: 1px solid #e5edf5;
    color: #1f2937;
    cursor: pointer;
    display: flex;
    gap: 0.55rem;
    line-height: 1.35;
    min-height: 34px;
    padding: 0.45rem 0.65rem;
    transition: background-color 0.14s ease, color 0.14s ease;
}

.checklist-row:last-child[b-733gczvokw] {
    border-bottom: none;
}

.checklist-row:hover[b-733gczvokw] {
    background: #f1fbfd;
}

.checklist-row.selected[b-733gczvokw] {
    background: #eaf8fc;
    color: #0f6f86;
    font-weight: 600;
}

.checklist-row .form-check-input[b-733gczvokw] {
    flex: 0 0 auto;
    margin-top: 0.18rem;
}

.checklist-row span[b-733gczvokw] {
    display: block;
    min-width: 0;
}

.project-submit-btn[b-733gczvokw] {
    background: #0f6f86;
    border: 1px solid #0f6f86;
    border-radius: 7px;
    color: #fff;
    min-height: 48px;
    transition: background-color 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.project-submit-btn:hover:not(:disabled)[b-733gczvokw] {
    background: #0b5d70;
    border-color: #0b5d70;
    box-shadow: 0 10px 22px rgba(15, 111, 134, 0.22);
    color: #fff;
    transform: translateY(-1px);
}

.project-submit-btn:disabled[b-733gczvokw] {
    background: #8aa7b0;
    border-color: #8aa7b0;
    color: #fff;
}

/* Cost Summary */
.cost-summary-card[b-733gczvokw] {
    border: 1px solid #dbe3ec;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
    background: #fff;
    margin-bottom: 1.5rem;
}

.cost-summary-header[b-733gczvokw] {
    background: #0f6f86;
    padding: 1.25rem 1.75rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    position: relative;
    overflow: hidden;
}

.cost-summary-header[b-733gczvokw]::before {
    display: none;
}

.cost-summary-header-icon[b-733gczvokw] {
    width: 36px;
    height: 36px;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 0.9rem;
    flex-shrink: 0;
}

.cost-summary-title[b-733gczvokw] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #fff;
    margin: 0;
    letter-spacing: 0.3px;
    position: relative;
    z-index: 1;
}

.cost-summary-body[b-733gczvokw] {
    padding: 1.5rem 1.75rem;
}

/* Section Labels */
.cost-section-label[b-733gczvokw] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #6f4a1f;
    margin-bottom: 0.75rem;
    padding-bottom: 0.35rem;
    border-bottom: 2px solid #f0e6d9;
}

/* Cost Rows */
.cost-row[b-733gczvokw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-size: 0.9rem;
    color: #4a4a5a;
    transition: background 0.15s ease;
}

.cost-row:hover[b-733gczvokw] {
    background: #f8f9fb;
}

.cost-row-label[b-733gczvokw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.cost-row-dot[b-733gczvokw] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #015974;
    flex-shrink: 0;
}

.cost-row-value[b-733gczvokw] {
    font-weight: 600;
    color: #1a1a2e;
    white-space: nowrap;
}

/* Divider */
.cost-divider[b-733gczvokw] {
    border: none;
    height: 1px;
    background: linear-gradient(to right, transparent, #d4d8dd, transparent);
    margin: 1rem 0;
}

/* Total Row */
.cost-total-row[b-733gczvokw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    background: #f1fbfd;
    border-radius: 7px;
    border: 1px solid rgba(15, 111, 134, 0.16);
}

.cost-total-label[b-733gczvokw] {
    font-size: 1rem;
    font-weight: 700;
    color: #1a1a2e;
}

.cost-total-value[b-733gczvokw] {
    font-size: 1.5rem;
    font-weight: 800;
    color: #0f6f86;
}

/* Two Column Layout */
.cost-columns[b-733gczvokw] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.cost-column-divider[b-733gczvokw] {
    position: relative;
}

.cost-column-divider[b-733gczvokw]::before {
    content: '';
    position: absolute;
    left: -0.75rem;
    top: 0;
    bottom: 0;
    width: 1px;
    background: linear-gradient(to bottom, transparent, #d4d8dd, transparent);
}

@media (max-width: 1024px) {
    .cost-summary-header[b-733gczvokw] { padding: 1rem 1.4rem; }
    .cost-summary-body[b-733gczvokw] { padding: 1.25rem 1.4rem; }
}

@media (max-width: 768px) {
    .project-form-shell[b-733gczvokw] { padding: 1.25rem; }
    .external-source-row[b-733gczvokw] { grid-template-columns: 1fr; }
    .external-source-delete[b-733gczvokw] { width: 100%; }
    .cost-summary-title[b-733gczvokw] { font-size: 1rem; }
    .cost-summary-body[b-733gczvokw] { padding: 1.1rem; }
    .cost-total-value[b-733gczvokw] { font-size: 1.3rem; }
}

@media (max-width: 576px) {
    .cost-columns[b-733gczvokw] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .cost-column-divider[b-733gczvokw]::before {
        display: none;
    }

    .cost-summary-body[b-733gczvokw] {
        padding: 1.25rem;
    }

    .cost-total-value[b-733gczvokw] {
        font-size: 1.25rem;
    }
}

@media (max-width: 480px) {
    .project-form-shell[b-733gczvokw] { padding: 1rem; }
    .option-grid-reports[b-733gczvokw],
    .option-grid-checklist[b-733gczvokw] { grid-template-columns: 1fr; }
    .cost-summary-header[b-733gczvokw] { padding: 0.9rem 1rem; }
    .cost-summary-title[b-733gczvokw] { font-size: 0.95rem; }
    .cost-summary-body[b-733gczvokw] { padding: 1rem; }
    .cost-row[b-733gczvokw] { padding: 0.45rem 0.5rem; font-size: 0.85rem; }
    .cost-total-row[b-733gczvokw] { padding: 0.85rem; }
    .cost-total-label[b-733gczvokw] { font-size: 0.92rem; }
    .cost-total-value[b-733gczvokw] { font-size: 1.15rem; }
}
/* /Pages/UserDashboard/CheckOut.razor.rz.scp.css */
.container[b-cvduujgmo0] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1200px;
    margin: 0 auto;
    border-radius: 20px;
}

.header-section[b-cvduujgmo0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

    .header-section h2[b-cvduujgmo0] {
        margin: 0;
        color: #fff;
        font-size: 1.8em;
        font-weight: 600;
    }

.add-btn[b-cvduujgmo0] {
    background: #fff;
    color: #015974;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .add-btn:hover[b-cvduujgmo0] {
        background: #f0f9fc;
    }

.table-section[b-cvduujgmo0] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    margin-bottom: 30px;
}

    .table-section h3[b-cvduujgmo0] {
        margin-top: 0;
        color: #2c3e50;
        font-size: 1.5em;
        font-weight: 600;
        margin-bottom: 15px;
    }

table[b-cvduujgmo0] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

th[b-cvduujgmo0], td[b-cvduujgmo0] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-cvduujgmo0] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-cvduujgmo0] {
    color: #34495e;
}

/* Invoice Breakdown Table Styles */
.invoice-breakdown[b-cvduujgmo0] {
    border-collapse: collapse;
}

    .invoice-breakdown th[b-cvduujgmo0],
    .invoice-breakdown td[b-cvduujgmo0] {
        padding: 12px 15px;
        border: 1px solid #e9ecef;
        vertical-align: top;
    }

    .invoice-breakdown th[b-cvduujgmo0] {
        background-color: #f8f9fa;
        font-weight: 600;
        text-align: left;
    }

.subtotal-row td[b-cvduujgmo0] {
    background-color: #f8f9fa;
    font-weight: 600;
}

.gst-row td[b-cvduujgmo0] {
    background-color: #f8f9fa;
}

.total-row td[b-cvduujgmo0] {
    background-color: #e3f2fd;
    font-weight: 700;
    font-size: 1.1em;
}

.table-footer[b-cvduujgmo0] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

/* Checkout Buttons */
.checkout-buttons[b-cvduujgmo0] {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-top: 30px;
    padding: 20px;
    background-color: #f8f9fa;
    border-radius: 8px;
}

.checkout-btn[b-cvduujgmo0] {
    background-color: #015974;
    color: white;
    padding: 15px 30px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1.1em;
    font-weight: 600;
    transition: background-color 0.3s ease;
    min-width: 120px;
}

    .checkout-btn:hover[b-cvduujgmo0] {
        background-color: #138496;
    }

.print-btn[b-cvduujgmo0] {
    background-color: #6c757d;
    color: white;
    padding: 15px 30px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1.1em;
    font-weight: 600;
    transition: background-color 0.3s ease;
    min-width: 120px;
}

    .print-btn:hover[b-cvduujgmo0] {
        background-color: #5a6268;
    }

.modal[b-cvduujgmo0] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-cvduujgmo0] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 800px;
    max-width: 90%;
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

    .modal-content h3[b-cvduujgmo0] {
        margin-top: 0;
        color: #015974;
        border-bottom: 2px solid #e9ecef;
        padding-bottom: 10px;
        margin-bottom: 20px;
        font-size: 1.6em;
        font-weight: 600;
    }

.form-grid[b-cvduujgmo0] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

.form-module[b-cvduujgmo0] {
    margin-bottom: 20px;
}

.form-row[b-cvduujgmo0] {
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
}

.form-group[b-cvduujgmo0] {
    flex: 1;
    margin-bottom: 0;
}

    .form-group label[b-cvduujgmo0] {
        display: block;
        margin-bottom: 8px;
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

    .form-group input[b-cvduujgmo0],
    .form-group select[b-cvduujgmo0] {
        width: 100%;
        padding: 12px;
        border: 1px solid #ced4da;
        border-radius: 6px;
        box-sizing: border-box;
        font-size: 1em;
        transition: border-color 0.3s ease;
    }

        .form-group input:focus[b-cvduujgmo0],
        .form-group select:focus[b-cvduujgmo0] {
            border-color: #015974;
            outline: none;
            box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
        }

.checkbox-group[b-cvduujgmo0] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-cvduujgmo0] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

    .checkbox-label input[type="checkbox"][b-cvduujgmo0] {
        margin-right: 12px;
        margin-bottom: 0;
        vertical-align: middle;
        height: 20px;
        width: 20px;
    }

    .checkbox-label span[b-cvduujgmo0] {
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

.button-group[b-cvduujgmo0] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-cvduujgmo0] {
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .save-btn.primary[b-cvduujgmo0] {
        background-color: #015974;
        color: white;
    }

    .save-btn:hover[b-cvduujgmo0] {
        background-color: #dfe3e8;
    }

    .save-btn.primary:hover[b-cvduujgmo0] {
        background-color: #024d62;
    }

.close-btn[b-cvduujgmo0] {
    display: block;
    margin-top: 20px;
    padding: 12px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    width: 100%;
    text-align: center;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .close-btn:hover[b-cvduujgmo0] {
        background-color: #dfe3e8;
    }

@media (max-width: 1024px) {
    .container[b-cvduujgmo0] { padding: 14px; }
    .header-section h2[b-cvduujgmo0] { font-size: 1.5em; }
    th[b-cvduujgmo0], td[b-cvduujgmo0] { padding: 11px; font-size: 0.88em; }
}

@media (max-width: 768px) {
    .container[b-cvduujgmo0] { padding: 10px; }
    .header-section[b-cvduujgmo0] { flex-direction: column; gap: 12px; align-items: stretch; padding: 16px; }
    .header-section h2[b-cvduujgmo0] { font-size: 1.25em; }
    .table-section[b-cvduujgmo0] { padding: 12px; overflow-x: auto; }
    table[b-cvduujgmo0] { min-width: 500px; }
    .checkout-buttons[b-cvduujgmo0] { flex-direction: column; padding: 14px; }
    .checkout-btn[b-cvduujgmo0], .print-btn[b-cvduujgmo0] { width: 100%; padding: 12px; font-size: 1em; }
    .form-row[b-cvduujgmo0] { flex-direction: column; gap: 12px; }
    .modal-content[b-cvduujgmo0] { padding: 18px; width: 95%; }
    .modal-content h3[b-cvduujgmo0] { font-size: 1.2em; }
    .button-group[b-cvduujgmo0] { flex-direction: column-reverse; }
    .button-group button[b-cvduujgmo0] { width: 100%; }
}

@media (max-width: 480px) {
    .container[b-cvduujgmo0] { padding: 8px; }
    .header-section[b-cvduujgmo0] { padding: 14px; }
    .header-section h2[b-cvduujgmo0] { font-size: 1.1em; }
    .table-section h3[b-cvduujgmo0] { font-size: 1.15em; }
    .checkout-btn[b-cvduujgmo0], .print-btn[b-cvduujgmo0] { padding: 10px; font-size: 0.92em; }
    .total-row td[b-cvduujgmo0] { font-size: 1em; }
    th[b-cvduujgmo0], td[b-cvduujgmo0] { padding: 9px; font-size: 0.82em; }
    .invoice-breakdown th[b-cvduujgmo0], .invoice-breakdown td[b-cvduujgmo0] { padding: 9px 10px; }
}
/* /Pages/UserDashboard/HelpSupport.razor.rz.scp.css */
.help-container[b-dflws1flcj] {
        padding: 20px;
        max-width: 1200px;
        margin: 0 auto;
    }

    .page-header[b-dflws1flcj] {
        display: flex;
        align-items: center;
        gap: 15px;
        margin-bottom: 30px;
        color: #333;
    }

    .header-icon[b-dflws1flcj] {
        font-size: 2rem;
        color: #333;
    }

    .header-text h2[b-dflws1flcj] {
        margin: 0;
        font-size: 1.5rem;
        font-weight: 600;
    }

    .breadcrumb[b-dflws1flcj] {
        margin: 0;
        color: #666;
        font-size: 0.9rem;
    }

    .content-card[b-dflws1flcj] {
        background: white;
        border-radius: 8px;
        padding: 30px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    }

    .content-card h3[b-dflws1flcj] {
        color: #333;
        margin-bottom: 20px;
        font-size: 1.2rem;
        font-weight: 600;
    }

    .instructions-list[b-dflws1flcj] {
        padding-left: 20px;
        color: #555;
        line-height: 1.6;
    }

    .instructions-list li[b-dflws1flcj] {
        margin-bottom: 10px;
    }

    .instructions-list ul[b-dflws1flcj] {
        margin-top: 10px;
        list-style-type: circle;
    }

    .support-link[b-dflws1flcj] {
        margin-top: 30px;
        padding-top: 20px;
        border-top: 1px solid #eee;
        color: #666;
    }

    .support-link a[b-dflws1flcj] {
        color: #015974;
        text-decoration: none;
    }

    .support-link a:hover[b-dflws1flcj] {
        text-decoration: underline;
    }

@media (max-width: 768px) {
    .help-container[b-dflws1flcj] { padding: 14px; }
    .page-header[b-dflws1flcj] { gap: 10px; margin-bottom: 20px; }
    .header-icon[b-dflws1flcj] { font-size: 1.6rem; }
    .header-text h2[b-dflws1flcj] { font-size: 1.25rem; }
    .content-card[b-dflws1flcj] { padding: 18px; }
    .content-card h3[b-dflws1flcj] { font-size: 1.05rem; }
}

@media (max-width: 480px) {
    .help-container[b-dflws1flcj] { padding: 10px; }
    .page-header[b-dflws1flcj] { flex-direction: column; align-items: flex-start; gap: 8px; }
    .header-text h2[b-dflws1flcj] { font-size: 1.1rem; }
    .content-card[b-dflws1flcj] { padding: 14px; }
    .content-card h3[b-dflws1flcj] { font-size: 1rem; }
    .instructions-list[b-dflws1flcj] { padding-left: 16px; font-size: 0.9rem; }
}
/* /Pages/UserDashboard/InvoiceDetails.razor.rz.scp.css */
/* All inv-* classes are in portal-theme.css (global).
   This file intentionally minimal — only scoped overrides if needed. */
/* /Pages/UserDashboard/OrderHistory.razor.rz.scp.css */
.oh-container[b-o2xlv5mfnz] {
        padding: 20px;
        max-width: 1100px;
    }

    .oh-header h2[b-o2xlv5mfnz] {
        font-size: 1.6rem;
        font-weight: 700;
        margin-bottom: 24px;
        color: #1a1a2e;
    }

    .oh-loading[b-o2xlv5mfnz], .oh-empty[b-o2xlv5mfnz] {
        padding: 40px 20px;
        text-align: center;
        color: #6c757d;
        background: #f8f9fa;
        border-radius: 8px;
        font-size: 0.95rem;
    }

    .oh-section[b-o2xlv5mfnz] {
        background: #fff;
        border-radius: 10px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.07);
        margin-bottom: 28px;
        overflow: hidden;
    }

    .oh-section-title[b-o2xlv5mfnz] {
        font-size: 1rem;
        font-weight: 600;
        color: #495057;
        padding: 14px 18px;
        background: #f8f9fa;
        border-bottom: 1px solid #e9ecef;
        margin: 0;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

    .oh-table-wrapper[b-o2xlv5mfnz] {
        overflow-x: auto;
    }

    .oh-table[b-o2xlv5mfnz] {
        width: 100%;
        border-collapse: collapse;
        font-size: 0.875rem;
    }

    .oh-table th[b-o2xlv5mfnz] {
        text-align: left;
        padding: 11px 14px;
        color: #6c757d;
        font-weight: 600;
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        border-bottom: 2px solid #dee2e6;
        background: #fdfdfd;
        white-space: nowrap;
    }

    .oh-table td[b-o2xlv5mfnz] {
        padding: 12px 14px;
        border-bottom: 1px solid #f2f2f2;
        color: #495057;
        vertical-align: middle;
    }

    .oh-table tr:last-child td[b-o2xlv5mfnz] { border-bottom: none; }
    .oh-table tr:hover td[b-o2xlv5mfnz] { background: #f9fafb; }

    .mono[b-o2xlv5mfnz] {
        font-family: 'Courier New', monospace;
        font-size: 0.82rem;
    }

    .oh-footer[b-o2xlv5mfnz] {
        padding: 10px 16px;
        font-size: 0.8rem;
        color: #6c757d;
        border-top: 1px solid #e9ecef;
        background: #f8f9fa;
    }

    .badge[b-o2xlv5mfnz] {
        display: inline-block;
        padding: 3px 10px;
        border-radius: 20px;
        font-size: 0.75rem;
        font-weight: 600;
    }

    .badge-paid[b-o2xlv5mfnz]    { background: #d4edda; color: #155724; }
    .badge-pending[b-o2xlv5mfnz] { background: #fff3cd; color: #856404; }
    .badge-open[b-o2xlv5mfnz]    { background: #cce5ff; color: #004085; }
    .badge-unknown[b-o2xlv5mfnz] { background: #e2e3e5; color: #383d41; }
    .badge-unpaid[b-o2xlv5mfnz]  { background: #fee2e2; color: #991b1b; }

    .oh-order-badge[b-o2xlv5mfnz] {
        display: inline-block;
        font-size: 0.75rem;
        font-weight: 700;
        color: #015974;
        background: #e0f2fe;
        padding: 2px 7px;
        border-radius: 4px;
        white-space: nowrap;
    }

    .oh-cost[b-o2xlv5mfnz] {
        font-weight: 700;
        color: #015974;
        white-space: nowrap;
    }

    .oh-pay-btn[b-o2xlv5mfnz] {
        background: linear-gradient(135deg, #015974, #9D6023);
        color: white;
        border: none;
        padding: 4px 12px;
        border-radius: 6px;
        font-size: 0.78rem;
        font-weight: 600;
        cursor: pointer;
        transition: opacity 0.2s;
        white-space: nowrap;
    }

    .oh-pay-btn:hover[b-o2xlv5mfnz] { opacity: 0.88; }

    .oh-view-btn[b-o2xlv5mfnz] {
        background: linear-gradient(135deg, #015974, #9D6023);
        color: white;
        border: none;
        padding: 4px 12px;
        border-radius: 6px;
        font-size: 0.78rem;
        font-weight: 600;
        cursor: pointer;
        transition: opacity 0.2s;
        white-space: nowrap;
    }

    .oh-view-btn:hover[b-o2xlv5mfnz] { opacity: 0.88; }

    .oh-pagination[b-o2xlv5mfnz] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 10px;
        padding: 12px 16px;
        border-top: 1px solid #e9ecef;
        background: #f8f9fa;
        border-radius: 0 0 10px 10px;
    }

    .oh-page-info[b-o2xlv5mfnz] {
        color: #64748b;
        font-size: 0.84rem;
        font-weight: 500;
    }

    .oh-page-btns[b-o2xlv5mfnz] {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
        align-items: center;
    }

    .oh-page-btn[b-o2xlv5mfnz] {
        min-width: 32px;
        height: 32px;
        padding: 0 8px;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        border: 1px solid #dee2e6;
        background: #fff;
        color: #374151;
        cursor: pointer;
        border-radius: 6px;
        transition: all 0.18s ease;
        font-weight: 600;
        font-size: 0.85rem;
        user-select: none;
    }

    .oh-page-btn:hover:not(:disabled)[b-o2xlv5mfnz] {
        background: #e0f2fe;
        border-color: #015974;
        color: #015974;
    }

    .oh-page-btn.active[b-o2xlv5mfnz] {
        background: linear-gradient(135deg, #015974, #9D6023);
        color: #fff;
        border-color: transparent;
        box-shadow: 0 2px 6px rgba(1, 89, 116, 0.35);
    }

    .oh-page-btn:disabled[b-o2xlv5mfnz] {
        cursor: not-allowed;
        opacity: 0.4;
        background: #fff;
        color: #adb5bd;
    }

    @media (max-width: 1024px) {
        .oh-container[b-o2xlv5mfnz] { padding: 14px; }
        .oh-header h2[b-o2xlv5mfnz] { font-size: 1.4rem; }
    }

    @media (max-width: 768px) {
        .oh-container[b-o2xlv5mfnz] { padding: 10px; }
        .oh-header h2[b-o2xlv5mfnz] { font-size: 1.2rem; margin-bottom: 16px; }
        .oh-table th[b-o2xlv5mfnz], .oh-table td[b-o2xlv5mfnz] { padding: 9px 10px; font-size: 0.82rem; }
        .oh-section-title[b-o2xlv5mfnz] { font-size: 0.92rem; padding: 12px 14px; }
    }

    @media (max-width: 480px) {
        .oh-container[b-o2xlv5mfnz] { padding: 8px; }
        .oh-header h2[b-o2xlv5mfnz] { font-size: 1.05rem; }
        .oh-table th[b-o2xlv5mfnz], .oh-table td[b-o2xlv5mfnz] { padding: 8px; font-size: 0.78rem; }
        .oh-pay-btn[b-o2xlv5mfnz], .oh-view-btn[b-o2xlv5mfnz] { padding: 5px 10px; font-size: 0.74rem; }
        .badge[b-o2xlv5mfnz] { padding: 2px 8px; font-size: 0.7rem; }
        .oh-pagination[b-o2xlv5mfnz] { flex-direction: column; align-items: center; text-align: center; }
    }
/* /Pages/UserDashboard/Profile.razor.rz.scp.css */
.profile-container[b-a2i7z40e5b] {
    max-width: 1400px;
    margin: 0 auto;
    background-color: #f8f9fa;
    /* Light grey background like the image */
    padding: 20px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.page-title[b-a2i7z40e5b] {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 20px;
    color: #fff;
}

/* Section Styling */
.section[b-a2i7z40e5b] {
    background: white;
    border: 1px solid #e0e0e0;
    margin-bottom: 20px;
    /* No border-radius or very small based on image sharp edges */
    border-radius: 2px;
}

.section-header[b-a2i7z40e5b] {
    padding: 14px 20px;
    border-bottom: 1px solid #e2e8f0;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
}

.section-header h3[b-a2i7z40e5b] {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    border-left: 3px solid rgba(255,255,255,0.4);
    padding-left: 10px;
    line-height: 1;
}

.section-body[b-a2i7z40e5b] {
    padding: 20px;
}

/* Form Layout */
.form-row[b-a2i7z40e5b] {
    display: flex;
    margin-bottom: 15px;
    align-items: center;
}

.form-label[b-a2i7z40e5b] {
    width: 200px;
    /* Fixed width for labels to align inputs */
    min-width: 200px;
    font-size: 13px;
    color: #666;
    margin-right: 20px;
    text-align: left;
}

.form-label.required[b-a2i7z40e5b]::after {
    content: " *";
    color: red;
}

.form-input-container[b-a2i7z40e5b] {
    flex-grow: 1;
    display: flex;
    gap: 10px;
}

.form-control[b-a2i7z40e5b] {
    width: 100%;
    padding: 8px 12px;
    font-size: 13px;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.form-control:focus[b-a2i7z40e5b] {
    border-color: #80bdff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, .25);
}

.form-select[b-a2i7z40e5b] {
    width: 100%;
    padding: 8px 12px;
    font-size: 13px;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
}

/* Specific input adjustments */
.phone-select-container[b-a2i7z40e5b] {
    display: flex;
    width: 100%;
    gap: 10px;
}

.phone-select[b-a2i7z40e5b] {
    width: 120px;
}

/* Button Styling */
.btn-primary[b-a2i7z40e5b] {
    color: #fff;
    background-color: #5bc0de;
    /* Light blue/cyan from image */
    border-color: #46b8da;
    padding: 8px 16px;
    font-size: 13px;
    border-radius: 3px;
    cursor: pointer;
    border: none;
}

.btn-primary:hover[b-a2i7z40e5b] {
    background-color: #31b0d5;
    border-color: #269abc;
}

.btn-submit[b-a2i7z40e5b] {
    margin-top: 10px;
}

/* Alert Styling */
.alert[b-a2i7z40e5b] {
    padding: 10px 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
    font-size: 13px;
}

.alert-danger[b-a2i7z40e5b] {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}

.alert-success[b-a2i7z40e5b] {
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
}

@media (max-width: 1024px) {
    .form-label[b-a2i7z40e5b] { width: 160px; min-width: 160px; }
}

@media (max-width: 768px) {
    .profile-container[b-a2i7z40e5b] { padding: 12px; }
    .form-row[b-a2i7z40e5b] { flex-direction: column; align-items: stretch; }
    .form-label[b-a2i7z40e5b] { width: 100%; min-width: 0; margin-right: 0; margin-bottom: 6px; }
    .form-input-container[b-a2i7z40e5b] { flex-direction: column; }
    .phone-select-container[b-a2i7z40e5b] { flex-direction: column; }
    .phone-select[b-a2i7z40e5b] { width: 100%; }
    .section-header[b-a2i7z40e5b] { padding: 12px 16px; }
    .section-body[b-a2i7z40e5b] { padding: 14px; }
}

@media (max-width: 480px) {
    .profile-container[b-a2i7z40e5b] { padding: 8px; }
    .section-header h3[b-a2i7z40e5b] { font-size: 13px; }
    .section-body[b-a2i7z40e5b] { padding: 12px; }
    .btn-primary[b-a2i7z40e5b] { width: 100%; padding: 10px 14px; }
}
/* /Pages/UserDashboard/Project.razor.rz.scp.css */
.container[b-z79dfe5ro8] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1800px;
    margin: 0 auto;
    border-radius: 20px;
}

.header-section[b-z79dfe5ro8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

    .header-section h2[b-z79dfe5ro8] {
        margin: 0;
        color: #fff;
        font-size: 1.8em;
        font-weight: 600;
    }

.add-btn[b-z79dfe5ro8] {
    background: #fff;
    color: #015974;
    padding: 12px 25px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 1em;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .add-btn:hover[b-z79dfe5ro8] {
        background: #f0f9fc;
    }

.table-section[b-z79dfe5ro8] {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

table[b-z79dfe5ro8] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

th[b-z79dfe5ro8], td[b-z79dfe5ro8] {
    padding: 15px;
    text-align: left;
    border-bottom: 2px solid #eef2f7;
}

th[b-z79dfe5ro8] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.9em;
}

td[b-z79dfe5ro8] {
    color: #34495e;
}

.action-btn[b-z79dfe5ro8] {
    padding: 8px 15px;
    margin-right: 10px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.9em;
    transition: background-color 0.3s ease;
}

.edit-btn[b-z79dfe5ro8] {
    background-color: #28a745;
    color: white;
}

    .edit-btn:hover[b-z79dfe5ro8] {
        background-color: #218838;
    }

.delete-btn[b-z79dfe5ro8] {
    background-color: #dc3545;
    color: white;
}

    .delete-btn:hover[b-z79dfe5ro8] {
        background-color: #c82333;
    }

.table-footer[b-z79dfe5ro8] {
    margin-top: 10px;
    color: #666;
    font-size: 0.9em;
}

.modal[b-z79dfe5ro8] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content[b-z79dfe5ro8] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 800px; /* Increased width for horizontal layout */
    max-width: 90%;
    max-height: 80vh; /* Limit vertical height */
    overflow-y: auto; /* Scroll if content exceeds height */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

    .modal-content h3[b-z79dfe5ro8] {
        margin-top: 0;
        color: #015974;
        border-bottom: 2px solid #e9ecef;
        padding-bottom: 10px;
        margin-bottom: 20px;
        font-size: 1.6em;
        font-weight: 600;
    }

.form-grid[b-z79dfe5ro8] {
    display: grid;
    grid-template-columns: 1fr; /* Single column by default, adjust as needed */
    gap: 20px;
}

.form-module[b-z79dfe5ro8] {
    margin-bottom: 20px;
}

.form-row[b-z79dfe5ro8] {
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
}

.form-group[b-z79dfe5ro8] {
    flex: 1;
    margin-bottom: 0;
}

    .form-group label[b-z79dfe5ro8] {
        display: block;
        margin-bottom: 8px;
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

    .form-group input[b-z79dfe5ro8],
    .form-group select[b-z79dfe5ro8] {
        width: 100%;
        padding: 12px;
        border: 1px solid #ced4da;
        border-radius: 6px;
        box-sizing: border-box;
        font-size: 1em;
        transition: border-color 0.3s ease;
    }

        .form-group input:focus[b-z79dfe5ro8],
        .form-group select:focus[b-z79dfe5ro8] {
            border-color: #015974;
            outline: none;
            box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
        }

.checkbox-group[b-z79dfe5ro8] {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.checkbox-label[b-z79dfe5ro8] {
    display: flex;
    align-items: center;
    margin: 0;
    width: 100%;
}

    .checkbox-label input[type="checkbox"][b-z79dfe5ro8] {
        margin-right: 12px;
        margin-bottom: 0;
        vertical-align: middle;
        height: 20px;
        width: 20px;
    }

    .checkbox-label span[b-z79dfe5ro8] {
        color: #2c3e50;
        font-weight: 500;
        font-size: 1em;
    }

.button-group[b-z79dfe5ro8] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

.save-btn[b-z79dfe5ro8] {
    padding: 12px 12px;
    border: none;
    border-radius: 6px;
    background-color: #e9ecef;
    color: #015974;
    cursor: pointer;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .save-btn.primary[b-z79dfe5ro8] {
        background-color: #015974;
        color: white;
    }

    .save-btn:hover[b-z79dfe5ro8] {
        background-color: #dfe3e8;
    }

    .save-btn.primary:hover[b-z79dfe5ro8] {
        background-color: #024d62;
    }

.close-btn[b-z79dfe5ro8] {
    padding: 12px 25px;
    background-color: #e9ecef;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    color: #2c3e50;
    font-weight: 500;
    transition: background-color 0.3s ease;
}

    .close-btn:hover[b-z79dfe5ro8] {
        background-color: #dfe3e8;
    }

@media (max-width: 1024px) {
    .container[b-z79dfe5ro8] { padding: 14px; }
    .header-section h2[b-z79dfe5ro8] { font-size: 1.5em; }
    th[b-z79dfe5ro8], td[b-z79dfe5ro8] { padding: 11px; font-size: 0.88em; }
}

@media (max-width: 768px) {
    .container[b-z79dfe5ro8] { padding: 10px; }
    .header-section[b-z79dfe5ro8] { flex-direction: column; gap: 12px; align-items: stretch; padding: 16px; }
    .header-section h2[b-z79dfe5ro8] { font-size: 1.25em; }
    .add-btn[b-z79dfe5ro8] { width: 100%; padding: 10px 18px; }
    .table-section[b-z79dfe5ro8] { padding: 10px; overflow-x: auto; }
    table[b-z79dfe5ro8] { min-width: 600px; }
    .form-row[b-z79dfe5ro8] { flex-direction: column; gap: 12px; }
    .modal-content[b-z79dfe5ro8] { padding: 18px; width: 95%; }
    .modal-content h3[b-z79dfe5ro8] { font-size: 1.2em; }
    .button-group[b-z79dfe5ro8] { flex-direction: column-reverse; }
    .button-group button[b-z79dfe5ro8] { width: 100%; }
}

@media (max-width: 480px) {
    .container[b-z79dfe5ro8] { padding: 8px; }
    .header-section[b-z79dfe5ro8] { padding: 14px; }
    .header-section h2[b-z79dfe5ro8] { font-size: 1.1em; }
    .modal-content[b-z79dfe5ro8] { padding: 14px; max-height: 92vh; }
    .modal-content h3[b-z79dfe5ro8] { font-size: 1.05em; }
    .action-btn[b-z79dfe5ro8] { padding: 6px 10px; font-size: 0.82em; margin-right: 4px; }
    th[b-z79dfe5ro8], td[b-z79dfe5ro8] { padding: 9px; font-size: 0.82em; }
}
/* /Pages/UserDashboard/ProjectInvoice.razor.rz.scp.css */
/* Invoice Card */
.invoice-card[b-bxmqo9jexe] {
    border: none;
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
    background: #fff;
}

/* Header */
.invoice-header[b-bxmqo9jexe] {
    background: linear-gradient(135deg, #015974, #9D6023);
    padding: 2rem 2.5rem;
    position: relative;
    overflow: hidden;
}

.invoice-header[b-bxmqo9jexe]::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(255,255,255,0.08) 0%, transparent 70%);
    border-radius: 50%;
}

.invoice-header[b-bxmqo9jexe]::after {
    content: '';
    position: absolute;
    bottom: -30%;
    left: 10%;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(255,255,255,0.05) 0%, transparent 70%);
    border-radius: 50%;
}

.invoice-header-content[b-bxmqo9jexe] {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.invoice-title[b-bxmqo9jexe] {
    font-size: 1.75rem;
    font-weight: 700;
    color: #fff;
    margin: 0;
    letter-spacing: 0.5px;
}

.invoice-subtitle[b-bxmqo9jexe] {
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.9rem;
    margin-top: 0.25rem;
}

.invoice-badge[b-bxmqo9jexe] {
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.25);
    color: #fff;
    padding: 0.5rem 1.25rem;
    border-radius: 2rem;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.5px;
}

/* Body */
.invoice-body[b-bxmqo9jexe] {
    padding: 2rem 2.5rem;
}

/* Invoice Meta */
.invoice-meta[b-bxmqo9jexe] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    background: #f8f9fb;
    border-radius: 0.75rem;
    margin-bottom: 2rem;
    border: 1px solid #e9ecef;
}

.invoice-number[b-bxmqo9jexe] {
    font-size: 1rem;
    font-weight: 700;
    color: #015974;
}

.invoice-date[b-bxmqo9jexe] {
    font-size: 0.85rem;
    color: #6c757d;
}

/* Section Title */
.section-title[b-bxmqo9jexe] {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #9D6023;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #f0e6d9;
}

/* Line Items */
.line-item-group[b-bxmqo9jexe] {
    margin-bottom: 1.75rem;
}

.line-item-header[b-bxmqo9jexe] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.line-item-icon[b-bxmqo9jexe] {
    width: 36px;
    height: 36px;
    border-radius: 0.5rem;
    background: linear-gradient(135deg, #015974, #017a9e);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 0.85rem;
    flex-shrink: 0;
}

.line-item-name[b-bxmqo9jexe] {
    font-weight: 700;
    font-size: 1.05rem;
    color: #1a1a2e;
}

.line-items-table[b-bxmqo9jexe] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin-bottom: 0.5rem;
}

.line-items-table td[b-bxmqo9jexe] {
    padding: 0.6rem 1rem;
    font-size: 0.9rem;
    color: #4a4a5a;
    border-bottom: 1px solid #f0f1f3;
}

.line-items-table tr:last-child td[b-bxmqo9jexe] {
    border-bottom: none;
}

.line-items-table td:last-child[b-bxmqo9jexe] {
    text-align: right;
    font-weight: 600;
    color: #1a1a2e;
    white-space: nowrap;
}

.line-item-subtotal[b-bxmqo9jexe] {
    display: flex;
    justify-content: flex-end;
    padding: 0.5rem 1rem;
    background: #f8f9fb;
    border-radius: 0.5rem;
    font-weight: 700;
    font-size: 1rem;
    color: #015974;
}

/* Divider */
.invoice-divider[b-bxmqo9jexe] {
    border: none;
    height: 1px;
    background: linear-gradient(to right, transparent, #d4d8dd, transparent);
    margin: 0.5rem 0 1.75rem;
}

/* Totals */
.totals-section[b-bxmqo9jexe] {
    margin-top: 1.5rem;
    margin-left: auto;
    max-width: 380px;
}

.totals-table[b-bxmqo9jexe] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.totals-table td[b-bxmqo9jexe] {
    padding: 0.6rem 1rem;
    font-size: 0.9rem;
}

.totals-table .totals-label[b-bxmqo9jexe] {
    color: #6c757d;
    font-weight: 500;
}

.totals-table .totals-value[b-bxmqo9jexe] {
    text-align: right;
    font-weight: 600;
    color: #1a1a2e;
}

.totals-table .total-row td[b-bxmqo9jexe] {
    padding-top: 1rem;
    border-top: 2px solid #015974;
}

.totals-table .total-row .totals-label[b-bxmqo9jexe] {
    font-size: 1rem;
    font-weight: 700;
    color: #1a1a2e;
}

.totals-table .total-row .totals-value[b-bxmqo9jexe] {
    font-size: 1.25rem;
    font-weight: 800;
    color: #015974;
}

/* Actions */
.invoice-actions[b-bxmqo9jexe] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 2.5rem;
    background: #f8f9fb;
    border-top: 1px solid #e9ecef;
}

.btn-invoice-secondary[b-bxmqo9jexe] {
    background: #fff;
    border: 1.5px solid #d4d8dd;
    color: #4a4a5a;
    padding: 0.6rem 1.25rem;
    border-radius: 0.5rem;
    font-weight: 600;
    font-size: 0.875rem;
    transition: all 0.2s ease;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-invoice-secondary:hover[b-bxmqo9jexe] {
    border-color: #015974;
    color: #015974;
    background: #f0f7fa;
}

.btn-checkout[b-bxmqo9jexe] {
    background: linear-gradient(135deg, #015974, #017a9e);
    border: none;
    color: #fff;
    padding: 0.75rem 2.5rem;
    border-radius: 0.625rem;
    font-weight: 700;
    font-size: 1rem;
    letter-spacing: 0.3px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    box-shadow: 0 4px 15px rgba(1, 89, 116, 0.3);
}

.btn-checkout:hover[b-bxmqo9jexe] {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(1, 89, 116, 0.4);
    background: linear-gradient(135deg, #016d8f, #0190b8);
}

/* Invoice status badge variants */
.invoice-badge-finalised[b-bxmqo9jexe] {
    background: rgba(40, 167, 69, 0.25);
    border-color: rgba(40, 167, 69, 0.4);
    color: #fff;
}

.invoice-badge-rejected[b-bxmqo9jexe] {
    background: rgba(220, 53, 69, 0.3);
    border-color: rgba(220, 53, 69, 0.5);
    color: #fff;
}

.invoice-badge-draft[b-bxmqo9jexe] {
    background: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.25);
    color: #fff;
}

/* Rejection alert */
.rejection-alert[b-bxmqo9jexe] {
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 0.5rem;
    padding: 1rem 1.25rem;
    margin-bottom: 1.25rem;
    color: #856404;
}

.rejection-alert strong[b-bxmqo9jexe] {
    display: block;
    margin-bottom: 0.4rem;
    font-size: 1rem;
}

.rejection-alert p[b-bxmqo9jexe] {
    margin: 0.25rem 0 0;
    font-size: 0.9rem;
}

/* Finalised notice */
.finalised-notice[b-bxmqo9jexe] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-top: 1.5rem;
    padding: 0.75rem 1.25rem;
    background: #d4edda;
    border: 1px solid #c3e6cb;
    border-radius: 0.5rem;
    color: #155724;
    font-size: 0.9rem;
    font-weight: 500;
}

/* Finalise button */
.btn-finalise[b-bxmqo9jexe] {
    background: linear-gradient(135deg, #9D6023, #c47d2e);
    border: none;
    color: #fff;
    padding: 0.75rem 1.75rem;
    border-radius: 0.625rem;
    font-weight: 700;
    font-size: 0.95rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    box-shadow: 0 4px 15px rgba(157, 96, 35, 0.3);
    margin-right: 0.75rem;
}

.btn-finalise:hover:not(:disabled)[b-bxmqo9jexe] {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(157, 96, 35, 0.4);
}

.btn-finalise:disabled[b-bxmqo9jexe] {
    opacity: 0.65;
    cursor: not-allowed;
    transform: none;
}

.btn-checkout:disabled[b-bxmqo9jexe] {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

/* Action right group */
.action-right[b-bxmqo9jexe] {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/* Paid notice */
.paid-notice[b-bxmqo9jexe] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-top: 1.5rem;
    padding: 0.75rem 1.25rem;
    background: #d4edda;
    border: 1px solid #c3e6cb;
    border-radius: 0.5rem;
    color: #155724;
    font-size: 0.9rem;
    font-weight: 500;
}

/* Paid badge variant */
.invoice-badge-paid[b-bxmqo9jexe] {
    background: rgba(40, 167, 69, 0.35);
    border-color: rgba(40, 167, 69, 0.5);
    color: #fff;
}

/* Print Styles */
@media print {
    /* Hide non-invoice chrome */
    .invoice-actions[b-bxmqo9jexe] {
        display: none !important;
    }

    .invoice-card[b-bxmqo9jexe] {
        box-shadow: none !important;
        border: none !important;
        border-radius: 0 !important;
        overflow: visible !important;
    }

    .invoice-header[b-bxmqo9jexe] {
        background: #015974 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
        border-radius: 0 !important;
        overflow: visible !important;
    }

    .invoice-body[b-bxmqo9jexe] {
        padding: 1.5rem !important;
        overflow: visible !important;
    }

    .line-item-group[b-bxmqo9jexe] {
        page-break-inside: avoid;
        break-inside: avoid;
    }

    .totals-section[b-bxmqo9jexe] {
        page-break-inside: avoid;
        break-inside: avoid;
    }

    .finalised-notice[b-bxmqo9jexe],
    .paid-notice[b-bxmqo9jexe] {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .invoice-badge[b-bxmqo9jexe] {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .line-item-icon[b-bxmqo9jexe] {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .line-item-subtotal[b-bxmqo9jexe] {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .totals-table .total-row td[b-bxmqo9jexe] {
        border-top: 2px solid #333 !important;
    }
}

/* Responsive */
@media (max-width: 1024px) {
    .invoice-header[b-bxmqo9jexe] { padding: 1.5rem 1.75rem; }
    .invoice-body[b-bxmqo9jexe] { padding: 1.5rem 1.75rem; }
    .invoice-actions[b-bxmqo9jexe] { padding: 1.25rem 1.75rem; }
    .invoice-title[b-bxmqo9jexe] { font-size: 1.5rem; }
}

@media (max-width: 768px) {
    .invoice-header[b-bxmqo9jexe] { padding: 1.25rem 1.5rem; }
    .invoice-title[b-bxmqo9jexe] { font-size: 1.3rem; }
    .invoice-body[b-bxmqo9jexe] { padding: 1.25rem 1.5rem; }
    .invoice-actions[b-bxmqo9jexe] { flex-direction: column; gap: 1rem; align-items: stretch; padding: 1.25rem 1.5rem; }
    .totals-section[b-bxmqo9jexe] { max-width: 100%; }
    .line-items-table td[b-bxmqo9jexe] { padding: 0.5rem 0.75rem; font-size: 0.85rem; }
}

@media (max-width: 576px) {
    .invoice-header[b-bxmqo9jexe] {
        padding: 1.5rem;
    }

    .invoice-header-content[b-bxmqo9jexe] {
        flex-direction: column;
        gap: 1rem;
    }

    .invoice-body[b-bxmqo9jexe] {
        padding: 1.5rem;
    }

    .invoice-meta[b-bxmqo9jexe] {
        flex-direction: column;
        gap: 0.5rem;
        text-align: center;
    }

    .invoice-actions[b-bxmqo9jexe] {
        flex-direction: column;
        gap: 1rem;
        padding: 1.25rem;
    }

    .invoice-actions > div[b-bxmqo9jexe] {
        width: 100%;
        display: flex;
        gap: 0.5rem;
    }

    .btn-checkout[b-bxmqo9jexe] {
        width: 100%;
        justify-content: center;
    }

    .totals-section[b-bxmqo9jexe] {
        max-width: 100%;
    }
}

@media (max-width: 480px) {
    .invoice-header[b-bxmqo9jexe] { padding: 1rem 1.1rem; }
    .invoice-title[b-bxmqo9jexe] { font-size: 1.1rem; }
    .invoice-body[b-bxmqo9jexe] { padding: 1rem 1.1rem; }
    .invoice-actions[b-bxmqo9jexe] { padding: 1rem; }
    .btn-finalise[b-bxmqo9jexe] { margin-right: 0; margin-bottom: 6px; width: 100%; justify-content: center; }
    .btn-checkout[b-bxmqo9jexe] { padding: 0.7rem 1rem; font-size: 0.92rem; }
    .action-right[b-bxmqo9jexe] { width: 100%; flex-direction: column; }
    .action-right > *[b-bxmqo9jexe] { width: 100%; }
    .totals-table .total-row .totals-value[b-bxmqo9jexe] { font-size: 1.1rem; }
    .line-item-name[b-bxmqo9jexe] { font-size: 0.95rem; }
    .section-title[b-bxmqo9jexe] { font-size: 0.7rem; }
}

/* Checklist Items in Invoice */
.checklist-section-label[b-bxmqo9jexe] {
    padding-top: 10px !important;
    padding-bottom: 4px !important;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    border-top: 1px dashed #e2e8f0;
}

.checklist-row td[b-bxmqo9jexe] {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
    color: #475569;
    font-size: 0.88rem;
}

.checklist-dot[b-bxmqo9jexe] {
    color: #015974;
    margin-right: 6px;
    font-weight: 700;
}

.checklist-included[b-bxmqo9jexe] {
    color: #94a3b8;
    font-size: 0.78rem;
    font-style: italic;
}
/* /Pages/UserDashboard/StaffManagement.razor.rz.scp.css */
/* ── Container ───────────────────────────────────────── */
.sm-container[b-xnkh5qtrz0] {
    padding: 20px;
    background-color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    max-width: 1400px;
    margin: 0 auto;
    border-radius: 20px;
}

/* ── Page Header ─────────────────────────────────────── */
.sm-header[b-xnkh5qtrz0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    padding: 20px 24px;
    background: linear-gradient(190deg, #015974, #9D6023);
    border-radius: 10px;
    box-shadow: 0 4px 15px rgba(1, 89, 116, 0.3);
    color: #fff;
}

.sm-header-left h2[b-xnkh5qtrz0] {
    margin: 0 0 4px 0;
    font-size: 1.8em;
    font-weight: 700;
    color: #fff;
}

.sm-header-left p[b-xnkh5qtrz0] {
    margin: 0;
    font-size: 0.95em;
    color: rgba(255,255,255,0.8);
}

/* ── Card ────────────────────────────────────────────── */
.sm-card[b-xnkh5qtrz0] {
    background-color: #ffffff;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    margin-bottom: 24px;
    overflow: hidden;
}

.sm-card-header[b-xnkh5qtrz0] {
    padding: 14px 22px;
    background: linear-gradient(190deg, #015974, #9D6023);
    color: #ffffff;
    font-size: 1em;
    font-weight: 600;
    letter-spacing: 0.3px;
}

.sm-card-header i[b-xnkh5qtrz0] {
    margin-right: 8px;
}

.sm-card-body[b-xnkh5qtrz0] {
    padding: 22px;
}

/* ── Info text ───────────────────────────────────────── */
.sm-info-text[b-xnkh5qtrz0] {
    margin: 0 0 18px 0;
    color: #555;
    font-size: 0.93em;
    line-height: 1.5;
}

/* ── Invite form row ─────────────────────────────────── */
.sm-form-row[b-xnkh5qtrz0] {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    flex-wrap: wrap;
}

.sm-form-group[b-xnkh5qtrz0] {
    flex: 1;
    min-width: 180px;
    display: flex;
    flex-direction: column;
}

.sm-form-btn-group[b-xnkh5qtrz0] {
    flex: 0 0 auto;
    min-width: 140px;
}

.sm-label[b-xnkh5qtrz0] {
    display: block;
    margin-bottom: 6px;
    color: #2c3e50;
    font-weight: 600;
    font-size: 0.88em;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.sm-required[b-xnkh5qtrz0] {
    color: #e74c3c;
}

.sm-input[b-xnkh5qtrz0] {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    font-size: 0.95em;
    color: #2c3e50;
    background: #f8f9fa;
    transition: border-color 0.2s, box-shadow 0.2s;
    box-sizing: border-box;
}

.sm-input:focus[b-xnkh5qtrz0] {
    border-color: #015974;
    outline: none;
    box-shadow: 0 0 0 3px rgba(1, 89, 116, 0.15);
    background: #fff;
}

/* ── Buttons ─────────────────────────────────────────── */
.sm-btn[b-xnkh5qtrz0] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.88em;
    font-weight: 600;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    transition: opacity 0.2s, transform 0.1s;
    white-space: nowrap;
}

.sm-btn:hover:not(:disabled)[b-xnkh5qtrz0] {
    opacity: 0.88;
    transform: translateY(-1px);
}

.sm-btn:disabled[b-xnkh5qtrz0] {
    opacity: 0.6;
    cursor: not-allowed;
}

.sm-btn-primary[b-xnkh5qtrz0] {
    background: linear-gradient(135deg, #015974, #9D6023);
    color: #fff;
    width: 100%;
    justify-content: center;
}

.sm-btn-success[b-xnkh5qtrz0] {
    background-color: #28a745;
    color: #fff;
}

.sm-btn-danger[b-xnkh5qtrz0] {
    background-color: #dc3545;
    color: #fff;
}

.sm-btn-sm[b-xnkh5qtrz0] {
    padding: 6px 14px;
    font-size: 0.82em;
}

/* ── Alerts ──────────────────────────────────────────── */
.sm-alert[b-xnkh5qtrz0] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 16px;
    padding: 12px 18px;
    border-radius: 6px;
    font-size: 0.93em;
    font-weight: 500;
}

.sm-alert-success[b-xnkh5qtrz0] {
    background-color: #d4edda;
    color: #155724;
    border-left: 4px solid #28a745;
}

.sm-alert-danger[b-xnkh5qtrz0] {
    background-color: #f8d7da;
    color: #721c24;
    border-left: 4px solid #dc3545;
}

/* ── Table ───────────────────────────────────────────── */
.sm-table-wrapper[b-xnkh5qtrz0] {
    overflow-x: auto;
}

.sm-table[b-xnkh5qtrz0] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.sm-table th[b-xnkh5qtrz0] {
    background-color: #f1f3f5;
    color: #2c3e50;
    font-weight: 700;
    font-size: 0.82em;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 12px 16px;
    border-bottom: 2px solid #dee2e6;
    white-space: nowrap;
}

.sm-table td[b-xnkh5qtrz0] {
    padding: 13px 16px;
    color: #34495e;
    font-size: 0.93em;
    border-bottom: 1px solid #eef2f7;
    vertical-align: middle;
}

.sm-table tbody tr:hover[b-xnkh5qtrz0] {
    background-color: #f8f9ff;
}

.sm-table tbody tr:last-child td[b-xnkh5qtrz0] {
    border-bottom: none;
}

/* ── Badges ──────────────────────────────────────────── */
.sm-badge[b-xnkh5qtrz0] {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.78em;
    font-weight: 700;
    letter-spacing: 0.4px;
    text-transform: uppercase;
}

.sm-badge-active[b-xnkh5qtrz0] {
    background-color: #d4edda;
    color: #155724;
}

.sm-badge-disabled[b-xnkh5qtrz0] {
    background-color: #f8d7da;
    color: #721c24;
}

.sm-badge-pending[b-xnkh5qtrz0] {
    background-color: #cce5ff;
    color: #004085;
}

.sm-badge-revoked[b-xnkh5qtrz0] {
    background-color: #e2e3e5;
    color: #383d41;
}

.sm-badge-expired[b-xnkh5qtrz0] {
    background-color: #fff3cd;
    color: #856404;
}

/* ── Footer / count ──────────────────────────────────── */
.sm-table-footer[b-xnkh5qtrz0] {
    margin-top: 10px;
    color: #888;
    font-size: 0.88em;
    padding: 0 4px;
}

.sm-no-action[b-xnkh5qtrz0] {
    color: #aaa;
    font-size: 1.1em;
}

/* ── Empty state ─────────────────────────────────────── */
.sm-empty[b-xnkh5qtrz0] {
    text-align: center;
    padding: 36px 20px;
    color: #aaa;
}

.sm-empty-icon[b-xnkh5qtrz0] {
    font-size: 2.4em;
    display: block;
    margin-bottom: 10px;
}

.sm-empty p[b-xnkh5qtrz0] {
    margin: 0;
    font-size: 0.95em;
}

/* ── Loading ─────────────────────────────────────────── */
.sm-loading[b-xnkh5qtrz0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px 20px;
    color: #888;
    gap: 12px;
}

/* ── Spinners ────────────────────────────────────────── */
.sm-spinner[b-xnkh5qtrz0] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255,255,255,0.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: sm-spin-b-xnkh5qtrz0 0.7s linear infinite;
}

.sm-spinner-lg[b-xnkh5qtrz0] {
    width: 36px;
    height: 36px;
    border: 3px solid #e0e0e0;
    border-top-color: #015974;
    border-radius: 50%;
    animation: sm-spin-b-xnkh5qtrz0 0.8s linear infinite;
}

@keyframes sm-spin-b-xnkh5qtrz0 {
    to { transform: rotate(360deg); }
}

/* ── Responsive ──────────────────────────────────────── */
@media (max-width: 1024px) {
    .sm-container[b-xnkh5qtrz0] { padding: 14px; }
    .sm-header-left h2[b-xnkh5qtrz0] { font-size: 1.5em; }
    .sm-table th[b-xnkh5qtrz0], .sm-table td[b-xnkh5qtrz0] { padding: 10px 12px; font-size: 0.85em; }
}

@media (max-width: 768px) {
    .sm-form-row[b-xnkh5qtrz0] {
        flex-direction: column;
    }

    .sm-form-group[b-xnkh5qtrz0],
    .sm-form-btn-group[b-xnkh5qtrz0] {
        min-width: 100%;
    }

    .sm-header[b-xnkh5qtrz0] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        padding: 16px 18px;
    }

    .sm-header-left h2[b-xnkh5qtrz0] { font-size: 1.3em; }
    .sm-card-body[b-xnkh5qtrz0] { padding: 16px; }
}

@media (max-width: 480px) {
    .sm-container[b-xnkh5qtrz0] { padding: 8px; }
    .sm-header[b-xnkh5qtrz0] { padding: 14px; }
    .sm-header-left h2[b-xnkh5qtrz0] { font-size: 1.15em; }
    .sm-card-header[b-xnkh5qtrz0] { padding: 12px 16px; font-size: 0.92em; }
    .sm-card-body[b-xnkh5qtrz0] { padding: 12px; }
    .sm-btn[b-xnkh5qtrz0] { padding: 8px 14px; font-size: 0.8em; width: 100%; }
    .sm-table th[b-xnkh5qtrz0], .sm-table td[b-xnkh5qtrz0] { padding: 8px 10px; font-size: 0.78em; }
    .sm-badge[b-xnkh5qtrz0] { padding: 3px 8px; font-size: 0.7em; }
}
/* /Pages/UserDashboard/StaffProjects.razor.rz.scp.css */
.sp-container[b-77u9g9jjar] {
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.sp-header[b-77u9g9jjar] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    padding: 18px 24px;
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.25);
}

.sp-header h2[b-77u9g9jjar] {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 600;
    color: #fff;
    letter-spacing: 0.3px;
}

.sp-actions-group[b-77u9g9jjar] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.sp-search-container[b-77u9g9jjar] { position: relative; }

.sp-search-input[b-77u9g9jjar] {
    padding: 8px 14px;
    border: 1.5px solid rgba(255,255,255,0.35);
    border-radius: 6px;
    width: 240px;
    max-width: 100%;
    font-size: 0.875rem;
    background: rgba(255,255,255,0.15);
    color: #fff;
    transition: all 0.2s;
}

.sp-search-input[b-77u9g9jjar]::placeholder { color: rgba(255,255,255,0.65); }

.sp-search-input:focus[b-77u9g9jjar] {
    outline: none;
    background: rgba(255,255,255,0.25);
    border-color: rgba(255,255,255,0.7);
    box-shadow: 0 0 0 3px rgba(255,255,255,0.15);
}

.sp-table-section[b-77u9g9jjar] {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    overflow: hidden;
    border: 1px solid #e9ecef;
}

.sp-table-wrapper[b-77u9g9jjar] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

table[b-77u9g9jjar] {
    width: 100%;
    min-width: 500px;
    border-collapse: collapse;
    table-layout: fixed;
}

thead tr[b-77u9g9jjar] {
    background: #f8f9fa;
    border-bottom: 2px solid #e2e8f0;
}

th[b-77u9g9jjar] {
    text-align: left;
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 11px 14px;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    white-space: nowrap;
    overflow: hidden;
}

tbody tr[b-77u9g9jjar] {
    border-bottom: 1px solid #f1f5f9;
    transition: background 0.15s;
}

tbody tr:last-child[b-77u9g9jjar] { border-bottom: none; }
tbody tr:hover[b-77u9g9jjar] { background: #f8fafc; }

td[b-77u9g9jjar] {
    padding: 12px 14px;
    color: #374151;
    vertical-align: middle;
    font-size: 0.855rem;
    overflow: hidden;
}

.sp-cell-truncate[b-77u9g9jjar] {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    cursor: default;
}

.sp-staff-name[b-77u9g9jjar] {
    color: #9D6023;
    font-weight: 600;
}

.sp-order-badge[b-77u9g9jjar] {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    color: #015974;
    background: #e0f2fe;
    padding: 2px 8px;
    border-radius: 4px;
    white-space: nowrap;
}

.sp-project-badge[b-77u9g9jjar] {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    color: #7c3aed;
    background: #ede9fe;
    padding: 2px 8px;
    border-radius: 4px;
    white-space: nowrap;
}

.sp-cost-cell[b-77u9g9jjar] {
    font-weight: 700;
    color: #015974;
    white-space: nowrap;
}

.sp-payment-badge[b-77u9g9jjar] {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 700;
    white-space: nowrap;
}

.sp-payment-unpaid[b-77u9g9jjar]  { background: #fef3c7; color: #92400e; }
.sp-payment-paid[b-77u9g9jjar]    { background: #d1fae5; color: #065f46; }
.sp-payment-pending[b-77u9g9jjar] { background: #dbeafe; color: #1e40af; }
.sp-payment-rejected[b-77u9g9jjar]{ background: #fee2e2; color: #991b1b; }

.sp-actions-cell[b-77u9g9jjar] { white-space: nowrap; }

.sp-btn[b-77u9g9jjar] {
    padding: 5px 12px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    color: #fff;
    font-size: 0.78rem;
    font-weight: 600;
    margin-right: 5px;
    transition: all 0.15s ease;
}

.sp-btn:last-child[b-77u9g9jjar] { margin-right: 0; }
.sp-btn:hover[b-77u9g9jjar] { opacity: 0.88; transform: translateY(-1px); }
.sp-btn-detail[b-77u9g9jjar] { background: #64748b; }

.sp-empty[b-77u9g9jjar] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 48px 0;
    color: #9ca3af;
    gap: 6px;
}

.sp-empty-icon[b-77u9g9jjar] { font-size: 2.5rem; }
.sp-empty p[b-77u9g9jjar]    { margin: 0; font-size: 0.95rem; }
.sp-empty small[b-77u9g9jjar] { font-size: 0.82rem; color: #b0b8c4; }

.sp-footer[b-77u9g9jjar] {
    padding: 10px 16px;
    color: #6c757d;
    font-size: 0.82rem;
    border-top: 1px solid #e9ecef;
    background: #fafafa;
}

.sp-pagination[b-77u9g9jjar] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 14px 20px;
    border-top: 1px solid #e9ecef;
    background: #f8f9fa;
    border-radius: 0 0 10px 10px;
}

.sp-page-info[b-77u9g9jjar] {
    color: #64748b;
    font-size: 0.845rem;
    font-weight: 500;
}

.sp-page-btns[b-77u9g9jjar] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
}

.sp-page-btn[b-77u9g9jjar] {
    min-width: 34px;
    height: 34px;
    padding: 0 8px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #dee2e6;
    background: #fff;
    color: #374151;
    cursor: pointer;
    border-radius: 6px;
    transition: all 0.18s ease;
    font-weight: 600;
    font-size: 0.875rem;
    user-select: none;
}

.sp-page-btn:hover:not(:disabled)[b-77u9g9jjar] {
    background: #e0f2fe;
    border-color: #015974;
    color: #015974;
}

.sp-page-btn.active[b-77u9g9jjar] {
    background: linear-gradient(135deg, #015974, #9D6023);
    color: #fff;
    border-color: transparent;
    box-shadow: 0 2px 6px rgba(1, 89, 116, 0.35);
}

.sp-page-btn:disabled[b-77u9g9jjar] {
    cursor: not-allowed;
    opacity: 0.4;
    background: #fff;
    color: #adb5bd;
}

.sp-loading[b-77u9g9jjar] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 0;
    gap: 14px;
    color: #6b7280;
    font-size: 0.9rem;
}

.sp-spinner[b-77u9g9jjar] {
    width: 36px;
    height: 36px;
    border: 3px solid #e5e7eb;
    border-top-color: #015974;
    border-radius: 50%;
    animation: sp-spin-b-77u9g9jjar 0.7s linear infinite;
}

@keyframes sp-spin-b-77u9g9jjar { to { transform: rotate(360deg); } }

/* ── Detail Modal ── */
.sp-detail-overlay[b-77u9g9jjar] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    animation: sp-fade-b-77u9g9jjar 0.2s ease;
}

@keyframes sp-fade-b-77u9g9jjar { from { opacity:0; } to { opacity:1; } }

.sp-detail-panel[b-77u9g9jjar] {
    background: #fff;
    border-radius: 14px;
    width: 100%;
    max-width: 560px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0,0,0,0.25);
    animation: sp-slideup-b-77u9g9jjar 0.22s ease;
    display: flex;
    flex-direction: column;
}

@keyframes sp-slideup-b-77u9g9jjar {
    from { transform: translateY(24px); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}

.sp-detail-header[b-77u9g9jjar] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 20px 24px 16px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 14px 14px 0 0;
    gap: 12px;
}

.sp-detail-order-tag[b-77u9g9jjar] {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    color: rgba(255,255,255,0.75);
    background: rgba(255,255,255,0.15);
    padding: 2px 8px;
    border-radius: 4px;
    margin-bottom: 4px;
}

.sp-detail-staff-tag[b-77u9g9jjar] {
    display: block;
    font-size: 0.76rem;
    color: rgba(255,255,255,0.8);
    margin-top: 4px;
}

.sp-detail-title[b-77u9g9jjar] {
    margin: 0;
    color: #fff;
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.3;
}

.sp-detail-x[b-77u9g9jjar] {
    background: rgba(255,255,255,0.15);
    border: none;
    color: #fff;
    font-size: 1.4rem;
    line-height: 1;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.15s;
}

.sp-detail-x:hover[b-77u9g9jjar] { background: rgba(255,255,255,0.3); }

.sp-detail-body[b-77u9g9jjar] { padding: 20px 24px; flex: 1; }

.sp-detail-cost-row[b-77u9g9jjar] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.sp-cost-big[b-77u9g9jjar] {
    font-size: 1.3rem;
    font-weight: 800;
    color: #015974;
}

.sp-urgency-pill[b-77u9g9jjar] {
    font-size: 0.8rem;
    color: #64748b;
    background: #f1f5f9;
    padding: 3px 9px;
    border-radius: 20px;
    font-weight: 500;
}

.sp-detail-grid[b-77u9g9jjar] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 20px;
}

.sp-detail-item[b-77u9g9jjar] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.sp-detail-full[b-77u9g9jjar] { grid-column: 1 / -1; }

.sp-detail-label[b-77u9g9jjar] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color: #94a3b8;
}

.sp-detail-value[b-77u9g9jjar] {
    font-size: 0.875rem;
    color: #1e293b;
    font-weight: 500;
    line-height: 1.45;
    word-break: break-word;
}

.sp-detail-comments[b-77u9g9jjar] {
    padding: 16px 24px;
    border-top: 1px solid #e9ecef;
}

.sp-comments-title[b-77u9g9jjar] {
    font-size: 0.88rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #64748b;
    margin: 0 0 12px;
}

.sp-comments-loading[b-77u9g9jjar], .sp-comments-empty[b-77u9g9jjar] {
    font-size: 0.855rem;
    color: #94a3b8;
    margin: 0 0 10px;
}

.sp-comments-list[b-77u9g9jjar] { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }

.sp-comment-item[b-77u9g9jjar] {
    background: #f8fafc;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 10px 14px;
}

.sp-comment-meta[b-77u9g9jjar] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 4px;
}

.sp-comment-author[b-77u9g9jjar] {
    font-size: 0.78rem;
    font-weight: 700;
    color: #9D6023;
}

.sp-comment-date[b-77u9g9jjar] {
    font-size: 0.74rem;
    color: #94a3b8;
}

.sp-comment-text[b-77u9g9jjar] {
    margin: 0;
    font-size: 0.855rem;
    color: #374151;
    line-height: 1.5;
}

.sp-comment-input-area[b-77u9g9jjar] { display: flex; flex-direction: column; gap: 8px; }

.sp-comment-input[b-77u9g9jjar] {
    width: 100%;
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    padding: 8px 12px;
    font-size: 0.855rem;
    resize: vertical;
    font-family: inherit;
    transition: border-color 0.15s;
    box-sizing: border-box;
}

.sp-comment-input:focus[b-77u9g9jjar] {
    outline: none;
    border-color: #015974;
    box-shadow: 0 0 0 3px rgba(1,89,116,0.1);
}

.sp-comment-submit-btn[b-77u9g9jjar] {
    align-self: flex-end;
    background: linear-gradient(135deg, #015974, #9D6023);
    color: #fff;
    border: none;
    padding: 7px 20px;
    border-radius: 6px;
    font-size: 0.845rem;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.15s;
}

.sp-comment-submit-btn:disabled[b-77u9g9jjar] { opacity: 0.6; cursor: not-allowed; }
.sp-comment-submit-btn:hover:not(:disabled)[b-77u9g9jjar] { opacity: 0.88; }

.sp-comment-error[b-77u9g9jjar] {
    margin: 0;
    font-size: 0.8rem;
    color: #dc2626;
}

.sp-detail-footer[b-77u9g9jjar] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 16px 24px;
    border-top: 1px solid #e9ecef;
    background: #f8f9fa;
    border-radius: 0 0 14px 14px;
}

.sp-detail-close-btn[b-77u9g9jjar] {
    background: none;
    border: 1.5px solid #cbd5e1;
    color: #64748b;
    padding: 5px 14px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.845rem;
    font-weight: 600;
    transition: all 0.15s;
}

.sp-detail-close-btn:hover[b-77u9g9jjar] {
    background: #f1f5f9;
    border-color: #94a3b8;
    color: #374151;
}

@media (max-width: 1024px) {
    .sp-header h2[b-77u9g9jjar] { font-size: 1.2rem; }
    .sp-search-input[b-77u9g9jjar] { width: 200px; }
    th[b-77u9g9jjar], td[b-77u9g9jjar] { padding: 10px; font-size: 0.8rem; }
    .sp-btn[b-77u9g9jjar] { padding: 5px 9px; font-size: 0.74rem; }
}

@media (max-width: 900px) {
    .sp-search-input[b-77u9g9jjar] { width: 180px; }
    .sp-detail-panel[b-77u9g9jjar] { max-width: 95%; }
}

@media (max-width: 640px) {
    .sp-container[b-77u9g9jjar] { padding: 12px; }
    .sp-header[b-77u9g9jjar] { flex-direction: column; align-items: stretch; padding: 14px 16px; }
    .sp-actions-group[b-77u9g9jjar] { flex-direction: column; align-items: stretch; }
    .sp-search-input[b-77u9g9jjar] { width: 100%; }
    table[b-77u9g9jjar], thead[b-77u9g9jjar], tbody[b-77u9g9jjar], th[b-77u9g9jjar], td[b-77u9g9jjar], tr[b-77u9g9jjar] { display: block; }
    thead tr[b-77u9g9jjar] { display: none; }
    tbody tr[b-77u9g9jjar] {
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        margin-bottom: 12px;
        padding: 4px 0;
        background: #fff;
        box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    }
    tbody tr:hover[b-77u9g9jjar] { background: #fff; }
    td[b-77u9g9jjar] {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        padding: 9px 14px;
        border-bottom: 1px solid #f1f5f9;
        max-width: 100% !important;
    }
    td:last-child[b-77u9g9jjar] { border-bottom: none; }
    td[b-77u9g9jjar]::before {
        content: attr(data-label);
        font-weight: 700;
        color: #64748b;
        font-size: 0.72rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        min-width: 90px;
        flex-shrink: 0;
        padding-top: 1px;
    }
    .sp-cell-truncate[b-77u9g9jjar] { white-space: normal; overflow: visible; text-overflow: unset; }
    .sp-pagination[b-77u9g9jjar] { flex-direction: column; align-items: center; text-align: center; }
    .sp-detail-grid[b-77u9g9jjar] { grid-template-columns: 1fr; }
    .sp-detail-full[b-77u9g9jjar] { grid-column: 1; }
}

@media (max-width: 480px) {
    .sp-container[b-77u9g9jjar] { padding: 8px; }
    .sp-header h2[b-77u9g9jjar] { font-size: 1.05rem; }
    .sp-detail-header[b-77u9g9jjar] { padding: 14px 16px 12px; }
    .sp-detail-title[b-77u9g9jjar] { font-size: 1rem; }
    .sp-detail-body[b-77u9g9jjar] { padding: 14px 16px; }
    .sp-detail-comments[b-77u9g9jjar] { padding: 12px 16px; }
    .sp-detail-footer[b-77u9g9jjar] { padding: 12px 16px; }
    .sp-cost-big[b-77u9g9jjar] { font-size: 1.1rem; }
    .sp-btn[b-77u9g9jjar] { width: auto; margin: 0 4px 4px 0; }
    .sp-actions-cell[b-77u9g9jjar] { display: flex; flex-direction: row; flex-wrap: wrap; gap: 4px; }
}
/* /Pages/UserDashboard/StripePaymentSuccess.razor.rz.scp.css */
.success-wrapper[b-t5eg232iiu] {
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 60vh;
        padding: 2rem;
    }

    .success-card[b-t5eg232iiu] {
        background: #fff;
        border-radius: 16px;
        box-shadow: 0 4px 24px rgba(0,0,0,0.10);
        padding: 3rem 2.5rem;
        max-width: 480px;
        width: 100%;
        text-align: center;
    }

    .success-card h2[b-t5eg232iiu] {
        font-weight: 700;
        color: #155724;
    }

    .success-icon-wrap[b-t5eg232iiu] {
        display: flex;
        justify-content: center;
    }

@media (max-width: 768px) {
    .success-wrapper[b-t5eg232iiu] { padding: 1.25rem; }
    .success-card[b-t5eg232iiu] { padding: 2rem 1.5rem; }
}

@media (max-width: 480px) {
    .success-wrapper[b-t5eg232iiu] { padding: 0.75rem; min-height: 50vh; }
    .success-card[b-t5eg232iiu] { padding: 1.5rem 1rem; border-radius: 12px; }
    .success-card h2[b-t5eg232iiu] { font-size: 1.2rem; }
}
/* /Pages/UserDashboard/UserProjects.razor.rz.scp.css */
/* ── Container ── */
.user-projects-container[b-w2yvg4aari] {
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ── Header ── */
.header-section[b-w2yvg4aari] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 20px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    padding: 18px 24px;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(1, 89, 116, 0.25);
}

.header-section h2[b-w2yvg4aari] {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: 0.3px;
}

.actions-group[b-w2yvg4aari] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.search-container[b-w2yvg4aari] {
    position: relative;
}

.search-input[b-w2yvg4aari] {
    padding: 8px 14px;
    border: 1.5px solid rgba(255,255,255,0.35);
    border-radius: 6px;
    width: 240px;
    max-width: 100%;
    font-size: 0.875rem;
    background: rgba(255,255,255,0.15);
    color: #fff;
    transition: all 0.2s;
}

.search-input[b-w2yvg4aari]::placeholder { color: rgba(255,255,255,0.65); }

.search-input:focus[b-w2yvg4aari] {
    outline: none;
    background: rgba(255,255,255,0.25);
    border-color: rgba(255,255,255,0.7);
    box-shadow: 0 0 0 3px rgba(255,255,255,0.15);
}

.add-btn[b-w2yvg4aari] {
    background: #fff;
    color: #015974;
    border: none;
    padding: 8px 18px;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 700;
    white-space: nowrap;
    font-size: 0.85rem;
    letter-spacing: 0.5px;
    transition: all 0.2s;
    box-shadow: 0 2px 6px rgba(0,0,0,0.12);
}

.add-btn:hover[b-w2yvg4aari] {
    background: #f0f9fc;
    box-shadow: 0 4px 10px rgba(0,0,0,0.18);
    transform: translateY(-1px);
}

/* ── Table section ── */
.table-section[b-w2yvg4aari] {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    overflow: hidden;
    border: 1px solid #e9ecef;
}

.table-wrapper[b-w2yvg4aari] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

table[b-w2yvg4aari] {
    width: 100%;
    min-width: 1100px;
    border-collapse: collapse;
    table-layout: fixed;
}

thead tr[b-w2yvg4aari] {
    background: #f8f9fa;
    border-bottom: 2px solid #e2e8f0;
}

th[b-w2yvg4aari] {
    text-align: left;
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 11px 12px;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    white-space: nowrap;
    overflow: hidden;
}

tbody tr[b-w2yvg4aari] {
    border-bottom: 1px solid #f1f5f9;
    transition: background 0.15s;
}

tbody tr:last-child[b-w2yvg4aari] {
    border-bottom: none;
}

tbody tr:hover[b-w2yvg4aari] {
    background: #f8fafc;
}

td[b-w2yvg4aari] {
    padding: 11px 12px;
    color: #374151;
    vertical-align: middle;
    font-size: 0.845rem;
    overflow: hidden;
}

/* ── Truncated cell text ── */
.cell-truncate[b-w2yvg4aari] {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    cursor: default;
}

/* ── Order badge ── */
.order-badge[b-w2yvg4aari] {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    color: #015974;
    background: #e0f2fe;
    padding: 2px 7px;
    border-radius: 4px;
    white-space: nowrap;
}

/* ── Project ID badge ── */
.project-id-badge[b-w2yvg4aari] {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    color: #9D6023;
    background: #fef3e2;
    padding: 2px 7px;
    border-radius: 4px;
    white-space: nowrap;
}

/* ── Project Status badge ── */
.proj-status-badge[b-w2yvg4aari] {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    padding: 3px 9px;
    border-radius: 20px;
    font-size: 0.74rem;
    font-weight: 600;
    letter-spacing: 0.2px;
    background: #e0f2fe;
    color: #0369a1;
}

/* ── Cost cell ── */
.cost-cell[b-w2yvg4aari] {
    font-weight: 700;
    color: #015974;
    white-space: nowrap;
}

/* ── Status badges ── */
.status-badge[b-w2yvg4aari] {
    display: inline-block;
    padding: 3px 9px;
    border-radius: 20px;
    font-size: 0.74rem;
    font-weight: 600;
    white-space: nowrap;
    letter-spacing: 0.3px;
}

.status-badge.status-paid[b-w2yvg4aari]      { background: #dcfce7; color: #166534; }
.status-badge.status-unpaid[b-w2yvg4aari]    { background: #fee2e2; color: #991b1b; }
.status-badge.status-pending[b-w2yvg4aari]   { background: #fef9c3; color: #854d0e; }
.status-badge.status-open[b-w2yvg4aari]      { background: #cceaf2; color: #015974; }

/* ── Action buttons ── */
.actions-cell[b-w2yvg4aari] {
    white-space: nowrap;
}

.action-btn[b-w2yvg4aari] {
    padding: 4px 11px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    color: white;
    font-size: 0.78rem;
    font-weight: 600;
    margin-right: 5px;
    transition: all 0.15s ease;
    letter-spacing: 0.2px;
}

.action-btn:last-child[b-w2yvg4aari] { margin-right: 0; }
.action-btn:hover[b-w2yvg4aari] { opacity: 0.88; transform: translateY(-1px); }

.action-btn.detail[b-w2yvg4aari]      { background: #015974; }
.action-btn.invoice[b-w2yvg4aari]     { background: #0f6f86; }
.action-btn.edit[b-w2yvg4aari]        { background: #16a34a; }
.action-btn.delete[b-w2yvg4aari]      { background: #dc2626; }
.action-btn.edit-locked[b-w2yvg4aari] { background: #94a3b8; cursor: not-allowed; opacity: 0.75; }

/* ── Empty state ── */
.empty-state[b-w2yvg4aari] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 48px 0;
    color: #9ca3af;
    gap: 8px;
}

.empty-icon[b-w2yvg4aari] { font-size: 2.5rem; }

.empty-state p[b-w2yvg4aari] {
    margin: 0;
    font-size: 0.95rem;
}

/* ── Table footer ── */
.table-footer[b-w2yvg4aari] {
    padding: 10px 16px;
    color: #6c757d;
    font-size: 0.82rem;
    border-top: 1px solid #e9ecef;
    background: #fafafa;
}

/* ── Pagination ── */
.pagination-section[b-w2yvg4aari] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 14px 20px;
    border-top: 1px solid #e9ecef;
    background: #f8f9fa;
    border-radius: 0 0 10px 10px;
}

.page-info[b-w2yvg4aari] {
    color: #64748b;
    font-size: 0.845rem;
    font-weight: 500;
}

.pagination-buttons[b-w2yvg4aari] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
}

.pagination-buttons .page-btn[b-w2yvg4aari] {
    min-width: 34px;
    height: 34px;
    padding: 0 8px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #dee2e6;
    background: #fff;
    color: #374151;
    cursor: pointer;
    border-radius: 6px;
    transition: all 0.18s ease;
    font-weight: 600;
    font-size: 0.875rem;
    user-select: none;
}

.pagination-buttons .page-btn:hover:not(:disabled)[b-w2yvg4aari] {
    background: #e0f2fe;
    border-color: #015974;
    color: #015974;
}

.pagination-buttons .page-btn.active[b-w2yvg4aari] {
    background: linear-gradient(135deg, #015974, #9D6023);
    color: #fff;
    border-color: transparent;
    box-shadow: 0 2px 6px rgba(1, 89, 116, 0.35);
}

.pagination-buttons .page-btn:disabled[b-w2yvg4aari] {
    cursor: not-allowed;
    opacity: 0.4;
    background: #fff;
    color: #adb5bd;
}

/* ── Loading Spinner ── */
.loading-container[b-w2yvg4aari] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 0;
    gap: 14px;
    color: #6b7280;
    font-size: 0.9rem;
}

.spinner[b-w2yvg4aari] {
    width: 36px;
    height: 36px;
    border: 3px solid #e5e7eb;
    border-top-color: #015974;
    border-radius: 50%;
    animation: spin-b-w2yvg4aari 0.7s linear infinite;
}

@keyframes spin-b-w2yvg4aari { to { transform: rotate(360deg); } }

/* ── Detail Modal ── */
.detail-overlay[b-w2yvg4aari] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    animation: fadeInOverlay-b-w2yvg4aari 0.2s ease;
}

@keyframes fadeInOverlay-b-w2yvg4aari {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.detail-panel[b-w2yvg4aari] {
    background: #fff;
    border-radius: 14px;
    width: 100%;
    max-width: 580px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0,0,0,0.25);
    animation: slideUp-b-w2yvg4aari 0.22s ease;
    display: flex;
    flex-direction: column;
}

@keyframes slideUp-b-w2yvg4aari {
    from { transform: translateY(24px); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}

.detail-header[b-w2yvg4aari] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 20px 24px 16px;
    background: linear-gradient(135deg, #015974 0%, #9D6023 100%);
    border-radius: 14px 14px 0 0;
    gap: 12px;
}

.detail-order[b-w2yvg4aari] {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    color: rgba(255,255,255,0.75);
    background: rgba(255,255,255,0.15);
    padding: 2px 8px;
    border-radius: 4px;
    margin-bottom: 6px;
    letter-spacing: 0.4px;
}

.detail-title[b-w2yvg4aari] {
    margin: 0;
    color: #fff;
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.3;
}

.detail-close[b-w2yvg4aari] {
    background: rgba(255,255,255,0.15);
    border: none;
    color: #fff;
    font-size: 1.4rem;
    line-height: 1;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.15s;
}

.detail-close:hover[b-w2yvg4aari] { background: rgba(255,255,255,0.3); }

.detail-body[b-w2yvg4aari] {
    padding: 20px 24px;
    flex: 1;
}

.detail-status-row[b-w2yvg4aari] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.detail-proj-status[b-w2yvg4aari] {
    font-size: 0.8rem;
    color: #64748b;
    background: #f1f5f9;
    padding: 3px 9px;
    border-radius: 20px;
    font-weight: 500;
}

.detail-cost-pill[b-w2yvg4aari] {
    margin-left: auto;
    font-size: 1.1rem;
    font-weight: 800;
    color: #015974;
}

.detail-grid[b-w2yvg4aari] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 20px;
}

.detail-item[b-w2yvg4aari] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.detail-item-full[b-w2yvg4aari] { grid-column: 1 / -1; }

.detail-label[b-w2yvg4aari] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    color: #94a3b8;
}

.detail-value[b-w2yvg4aari] {
    font-size: 0.875rem;
    color: #1e293b;
    font-weight: 500;
    line-height: 1.45;
    word-break: break-word;
}

.detail-link[b-w2yvg4aari] {
    color: #015974;
    text-decoration: underline;
}

.external-source-list[b-w2yvg4aari] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.external-source-link[b-w2yvg4aari] {
    align-items: center;
    background: #f1fbfd;
    border: 1px solid rgba(1, 89, 116, 0.16);
    border-radius: 6px;
    display: flex;
    justify-content: space-between;
    padding: 7px 10px;
    text-decoration: none;
    word-break: break-word;
}

.external-source-link:hover[b-w2yvg4aari] {
    background: #e0f2fe;
}

.external-source-link strong[b-w2yvg4aari] {
    color: #015974;
    font-size: 0.78rem;
    white-space: nowrap;
}

/* ── Comments ── */
.detail-comments[b-w2yvg4aari] {
    padding: 16px 24px;
    border-top: 1px solid #e9ecef;
}

.comments-title[b-w2yvg4aari] {
    font-size: 0.9rem;
    font-weight: 700;
    color: #374151;
    margin: 0 0 12px;
}

.comments-loading[b-w2yvg4aari], .comments-empty[b-w2yvg4aari] {
    font-size: 0.845rem;
    color: #94a3b8;
    margin: 0 0 12px;
}

.comments-list[b-w2yvg4aari] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-height: 180px;
    overflow-y: auto;
    margin-bottom: 12px;
}

.comment-item[b-w2yvg4aari] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 10px 14px;
}

.comment-meta[b-w2yvg4aari] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
    flex-wrap: wrap;
}

.comment-author[b-w2yvg4aari] {
    font-size: 0.78rem;
    font-weight: 700;
    color: #015974;
}

.comment-date[b-w2yvg4aari] {
    font-size: 0.73rem;
    color: #94a3b8;
}

.comment-status[b-w2yvg4aari] {
    font-size: 0.68rem;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 10px;
}

.comment-status.pending[b-w2yvg4aari]  { background: #fef9c3; color: #854d0e; }
.comment-status.approved[b-w2yvg4aari] { background: #dcfce7; color: #166534; }
.comment-status.rejected[b-w2yvg4aari] { background: #fee2e2; color: #991b1b; }

.comment-text[b-w2yvg4aari] {
    font-size: 0.845rem;
    color: #374151;
    margin: 0;
    line-height: 1.45;
}

.comment-input-area[b-w2yvg4aari] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.comment-input[b-w2yvg4aari] {
    width: 100%;
    padding: 8px 12px;
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    font-size: 0.845rem;
    resize: none;
    box-sizing: border-box;
    font-family: inherit;
    color: #374151;
    transition: border-color 0.15s;
}

.comment-input:focus[b-w2yvg4aari] {
    outline: none;
    border-color: #015974;
    box-shadow: 0 0 0 3px rgba(1, 89, 116, 0.1);
}

.comment-submit-btn[b-w2yvg4aari] {
    align-self: flex-end;
    background: linear-gradient(135deg, #015974, #9D6023);
    color: #fff;
    border: none;
    padding: 7px 20px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.845rem;
    font-weight: 600;
    transition: opacity 0.15s;
}

.comment-submit-btn:disabled[b-w2yvg4aari] {
    opacity: 0.6;
    cursor: not-allowed;
}

.comment-error[b-w2yvg4aari] {
    font-size: 0.8rem;
    color: #dc2626;
    margin: 0;
}

.detail-footer[b-w2yvg4aari] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px 24px;
    border-top: 1px solid #e9ecef;
    background: #f8f9fa;
    border-radius: 0 0 14px 14px;
    flex-wrap: wrap;
}

.detail-close-btn[b-w2yvg4aari] {
    margin-left: auto;
    background: none;
    border: 1.5px solid #cbd5e1;
    color: #64748b;
    padding: 5px 14px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.845rem;
    font-weight: 600;
    transition: all 0.15s;
}

.detail-close-btn:hover[b-w2yvg4aari] {
    background: #f1f5f9;
    border-color: #94a3b8;
    color: #374151;
}

/* ── Responsive: small desktop ── */
@media (max-width: 1024px) {
    .header-section h2[b-w2yvg4aari] { font-size: 1.2rem; }
    .search-input[b-w2yvg4aari] { width: 200px; }
    th[b-w2yvg4aari], td[b-w2yvg4aari] { padding: 9px 9px; font-size: 0.8rem; }
    .action-btn[b-w2yvg4aari] { padding: 4px 8px; font-size: 0.74rem; }
}

/* ── Responsive ── */
@media (max-width: 900px) {
    .search-input[b-w2yvg4aari] { width: 180px; }
    .detail-panel[b-w2yvg4aari] { max-width: 95%; }
}

@media (max-width: 640px) {
    .user-projects-container[b-w2yvg4aari] { padding: 12px; }

    .header-section[b-w2yvg4aari] {
        flex-direction: column;
        align-items: stretch;
        padding: 14px 16px;
    }

    .actions-group[b-w2yvg4aari] { flex-direction: column; align-items: stretch; }
    .search-input[b-w2yvg4aari]  { width: 100%; }
    .add-btn[b-w2yvg4aari]       { width: 100%; text-align: center; }

    table[b-w2yvg4aari], thead[b-w2yvg4aari], tbody[b-w2yvg4aari], th[b-w2yvg4aari], td[b-w2yvg4aari], tr[b-w2yvg4aari] { display: block; }
    thead tr[b-w2yvg4aari] { display: none; }

    tbody tr[b-w2yvg4aari] {
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        margin-bottom: 12px;
        padding: 4px 0;
        background: #fff;
        box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    }

    tbody tr:hover[b-w2yvg4aari] { background: #fff; }

    td[b-w2yvg4aari] {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        padding: 9px 14px;
        border-bottom: 1px solid #f1f5f9;
        max-width: 100% !important;
    }

    td:last-child[b-w2yvg4aari] { border-bottom: none; }

    td[b-w2yvg4aari]::before {
        content: attr(data-label);
        font-weight: 700;
        color: #64748b;
        font-size: 0.72rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        min-width: 110px;
        flex-shrink: 0;
        padding-top: 1px;
    }

    .cell-truncate[b-w2yvg4aari] {
        white-space: normal;
        overflow: visible;
        text-overflow: unset;
    }

    .actions-cell[b-w2yvg4aari] { flex-direction: row; flex-wrap: wrap; gap: 6px; }
    .action-btn[b-w2yvg4aari]   { margin-right: 0; }

    .pagination-section[b-w2yvg4aari] {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .detail-grid[b-w2yvg4aari] { grid-template-columns: 1fr; }
    .detail-item-full[b-w2yvg4aari] { grid-column: 1; }
    .detail-cost-pill[b-w2yvg4aari] { margin-left: 0; }
    .detail-footer[b-w2yvg4aari] { flex-direction: column; align-items: stretch; }
    .detail-close-btn[b-w2yvg4aari] { margin-left: 0; text-align: center; }
}

@media (max-width: 480px) {
    .user-projects-container[b-w2yvg4aari] { padding: 8px; }
    .header-section h2[b-w2yvg4aari] { font-size: 1.05rem; }
    .detail-header[b-w2yvg4aari] { padding: 14px 16px 12px; }
    .detail-title[b-w2yvg4aari] { font-size: 1rem; }
    .detail-body[b-w2yvg4aari] { padding: 14px 16px; }
    .detail-comments[b-w2yvg4aari] { padding: 12px 16px; }
    .detail-footer[b-w2yvg4aari] { padding: 12px 16px; }
    .detail-cost-pill[b-w2yvg4aari] { font-size: 1rem; }
    .action-btn[b-w2yvg4aari] { padding: 5px 10px; font-size: 0.74rem; width: auto; margin: 0 4px 4px 0; }
    .actions-cell[b-w2yvg4aari] { flex-direction: row; flex-wrap: wrap; gap: 4px; }
}
/* /Shared/DeleteConfirmationModal.razor.rz.scp.css */
.modal[b-xqc3y0baen] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 99999;
}

.modal-content[b-xqc3y0baen] {
    background-color: #ffffff;
    padding: 25px;
    border-radius: 10px;
    width: 500px;
    max-width: 90%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid #e9ecef;
}

.modal-content h3[b-xqc3y0baen] {
    margin-top: 0;
    color: #007bff;
    border-bottom: 2px solid #e9ecef;
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-size: 1.6em;
    font-weight: 600;
}

.modal-content p[b-xqc3y0baen] {
    font-size: 1.1em;
    color: #333;
    margin-bottom: 30px;
}

.button-group[b-xqc3y0baen] {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    padding-top: 15px;
    border-top: 1px solid #e9ecef;
}

button[b-xqc3y0baen] {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    font-size: 1em;
    cursor: pointer;
    transition: background-color 0.3s;
}

.btn-danger[b-xqc3y0baen] {
    background-color: #dc3545;
    color: white;
}

.btn-danger:hover[b-xqc3y0baen] {
    background-color: #c82333;
}

.btn-secondary[b-xqc3y0baen] {
    background-color: #6c757d;
    color: white;
}

.btn-secondary:hover[b-xqc3y0baen] {
    background-color: #5a6268;
}