/* _content/AccountingSystem.Web/Components/Layout/MainLayout.razor.rz.scp.css */
/* _content/AccountingSystem.Web/Components/Layout/MainNav.razor.rz.scp.css */
/* _content/AccountingSystem.Web/Components/Pages/AccessRight/AccessRightsPage.razor.rz.scp.css */
/* Dashboard Cards */
.dashboard-card[b-6utku6e8fm] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

    .dashboard-card:hover[b-6utku6e8fm] {
        transform: translateY(-5px);
        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    }

.card-icon[b-6utku6e8fm] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-6utku6e8fm] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-6utku6e8fm] {
    color: #212529;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.card-change[b-6utku6e8fm] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
}

/* Card Header Custom */
.card-header-custom[b-6utku6e8fm] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-6utku6e8fm] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-6utku6e8fm] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-6utku6e8fm] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Form Select Custom */
.form-select-custom[b-6utku6e8fm] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-select-custom:focus[b-6utku6e8fm] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

    .form-select-custom option[b-6utku6e8fm] {
        padding: 0.75rem;
    }

        .form-select-custom option:checked[b-6utku6e8fm] {
            background-color: var(--secondary-color) !important;
            color: var(--primary-color) !important;
            font-weight: 600;
        }

.form-control-custom[b-6utku6e8fm] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control-custom:focus[b-6utku6e8fm] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Role Icons */
.role-icon[b-6utku6e8fm] {
    width: 50px;
    height: 50px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.5rem;
}

/* Pages Container */
.pages-container[b-6utku6e8fm] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.page-badge[b-6utku6e8fm] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    color: #495057;
    padding: 0.4rem 0.75rem;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 500;
    display: inline-block;
    border: 1px solid #dee2e6;
    transition: all 0.3s ease;
}

    .page-badge:hover[b-6utku6e8fm] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        color: var(--primary-color);
        border-color: var(--secondary-color);
        transform: translateY(-2px);
    }

/* Selected Pages Preview */
.selected-pages-preview[b-6utku6e8fm] {
    background-color: #f8f9fa;
    border-radius: 8px;
    padding: 1rem;
    border: 2px dashed #dee2e6;
}

.preview-container[b-6utku6e8fm] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    min-height: 50px;
    align-items: center;
}

/* Keyboard shortcut styling */
kbd[b-6utku6e8fm] {
    background-color: #495057;
    color: white;
    padding: 0.2rem 0.4rem;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 600;
}

/* Enhanced button styles */
.btn-primary[b-6utku6e8fm] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-primary:hover[b-6utku6e8fm] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.btn-secondary[b-6utku6e8fm] {
    background-color: #6c757d;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-secondary:hover[b-6utku6e8fm] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

/* Action buttons */
.btn-action[b-6utku6e8fm] {
    padding: 0.5rem 0.75rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-edit[b-6utku6e8fm] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-6utku6e8fm] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

/* Toast notification */
.toast[b-6utku6e8fm] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .role-icon[b-6utku6e8fm] {
        width: 40px;
        height: 40px;
        font-size: 1.2rem;
    }

    .card-value[b-6utku6e8fm] {
        font-size: 1.5rem;
    }

    .pages-container[b-6utku6e8fm] {
        flex-direction: column;
    }

    .form-select-custom[multiple][b-6utku6e8fm] {
        font-size: 0.9rem;
    }

    .card-header-custom[b-6utku6e8fm] {
        padding-bottom: 1rem;
        margin-bottom: 1rem;
    }

    .card-title-custom[b-6utku6e8fm] {
        font-size: 1.1rem;
    }
}

/* Modal enhancements */
.modal-content[b-6utku6e8fm] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-6utku6e8fm] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-6utku6e8fm] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-6utku6e8fm] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-6utku6e8fm] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-6utku6e8fm] {
            opacity: 1;
        }

.modal-body[b-6utku6e8fm] {
    padding: 2rem;
}

.modal-footer[b-6utku6e8fm] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Form labels with icons */
.form-label[b-6utku6e8fm] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

    .form-label i[b-6utku6e8fm] {
        color: var(--secondary-color);
    }

/* Enhanced table styles */
.positions-table[b-6utku6e8fm] {
    width: 100%;
    margin-top: 1rem;
}

    .positions-table thead[b-6utku6e8fm] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .positions-table thead th[b-6utku6e8fm] {
            /*color: white;*/
            font-weight: 600;
            padding: 1rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.85rem;
            letter-spacing: 0.5px;
        }

    .positions-table tbody tr[b-6utku6e8fm] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .positions-table tbody tr:hover[b-6utku6e8fm] {
            background-color: #f8f9fa;
            transform: scale(1.01);
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
        }

    .positions-table tbody td[b-6utku6e8fm] {
        padding: 1rem;
        vertical-align: middle;
    }

.position-name[b-6utku6e8fm] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 1rem;
}

/* Search and filter bar */
.search-filter-bar[b-6utku6e8fm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-box[b-6utku6e8fm] {
    position: relative;
    flex: 1;
    min-width: 250px;
    max-width: 400px;
}

    .search-box input[b-6utku6e8fm] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-6utku6e8fm] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-6utku6e8fm] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.filter-group[b-6utku6e8fm] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.entries-select[b-6utku6e8fm] {
    padding: 0.5rem 1rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .entries-select:focus[b-6utku6e8fm] {
        outline: none;
        border-color: var(--secondary-color);
    }

/* Pagination */
.pagination-wrapper[b-6utku6e8fm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-6utku6e8fm] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-6utku6e8fm] {
    margin: 0;
}

.page-link[b-6utku6e8fm] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

    .page-link:hover[b-6utku6e8fm] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
    }

.page-item.active .page-link[b-6utku6e8fm] {
    color: #dee2e6;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Content card */
.content-card[b-6utku6e8fm] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Page header */
.page-header[b-6utku6e8fm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-6utku6e8fm] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-6utku6e8fm] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-6utku6e8fm] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-6utku6e8fm]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-6utku6e8fm] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-6utku6e8fm] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-6utku6e8fm] {
    color: #6c757d;
}

/* Alert styling */
.alert-info[b-6utku6e8fm] {
    background-color: #e3f2fd;
    border-color: #90caf9;
    color: #1565c0;
    border-radius: 8px;
}

/* Action buttons container */
.action-buttons[b-6utku6e8fm] {
    display: flex;
    gap: 0.5rem;
}
/* _content/AccountingSystem.Web/Components/Pages/AccessRight/EditAccessRightsModal.razor.rz.scp.css */
/* Dashboard Cards */
.dashboard-card[b-n1whq9laui] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

    .dashboard-card:hover[b-n1whq9laui] {
        transform: translateY(-5px);
        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    }

.card-icon[b-n1whq9laui] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-n1whq9laui] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-n1whq9laui] {
    color: #212529;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.card-change[b-n1whq9laui] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
}

/* Card Header Custom */
.card-header-custom[b-n1whq9laui] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-n1whq9laui] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-n1whq9laui] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-n1whq9laui] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Form Select Custom */
.form-select-custom[b-n1whq9laui] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-select-custom:focus[b-n1whq9laui] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

    .form-select-custom option[b-n1whq9laui] {
        padding: 0.75rem;
    }

        .form-select-custom option:checked[b-n1whq9laui] {
            background-color: var(--secondary-color) !important;
            color: var(--primary-color) !important;
            font-weight: 600;
        }

.form-control-custom[b-n1whq9laui] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control-custom:focus[b-n1whq9laui] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Role Icons */
.role-icon[b-n1whq9laui] {
    width: 50px;
    height: 50px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.5rem;
}

/* Pages Container */
.pages-container[b-n1whq9laui] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.page-badge[b-n1whq9laui] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    color: #495057;
    padding: 0.4rem 0.75rem;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 500;
    display: inline-block;
    border: 1px solid #dee2e6;
    transition: all 0.3s ease;
}

    .page-badge:hover[b-n1whq9laui] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        color: var(--primary-color);
        border-color: var(--secondary-color);
        transform: translateY(-2px);
    }

/* Selected Pages Preview */
.selected-pages-preview[b-n1whq9laui] {
    background-color: #f8f9fa;
    border-radius: 8px;
    padding: 1rem;
    border: 2px dashed #dee2e6;
}

.preview-container[b-n1whq9laui] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    min-height: 50px;
    align-items: center;
}

/* Keyboard shortcut styling */
kbd[b-n1whq9laui] {
    background-color: #495057;
    color: white;
    padding: 0.2rem 0.4rem;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 600;
}

/* Enhanced button styles */
.btn-primary[b-n1whq9laui] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-primary:hover[b-n1whq9laui] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.btn-secondary[b-n1whq9laui] {
    background-color: #6c757d;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-secondary:hover[b-n1whq9laui] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

/* Action buttons */
.btn-action[b-n1whq9laui] {
    padding: 0.5rem 0.75rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-edit[b-n1whq9laui] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-n1whq9laui] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

/* Toast notification */
.toast[b-n1whq9laui] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .role-icon[b-n1whq9laui] {
        width: 40px;
        height: 40px;
        font-size: 1.2rem;
    }

    .card-value[b-n1whq9laui] {
        font-size: 1.5rem;
    }

    .pages-container[b-n1whq9laui] {
        flex-direction: column;
    }

    .form-select-custom[multiple][b-n1whq9laui] {
        font-size: 0.9rem;
    }

    .card-header-custom[b-n1whq9laui] {
        padding-bottom: 1rem;
        margin-bottom: 1rem;
    }

    .card-title-custom[b-n1whq9laui] {
        font-size: 1.1rem;
    }
}

/* Modal enhancements */
.modal-content[b-n1whq9laui] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-n1whq9laui] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-n1whq9laui] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-n1whq9laui] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-n1whq9laui] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-n1whq9laui] {
            opacity: 1;
        }

.modal-body[b-n1whq9laui] {
    padding: 2rem;
}

.modal-footer[b-n1whq9laui] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Form labels with icons */
.form-label[b-n1whq9laui] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

    .form-label i[b-n1whq9laui] {
        color: var(--secondary-color);
    }

/* Enhanced table styles */
.positions-table[b-n1whq9laui] {
    width: 100%;
    margin-top: 1rem;
}

    .positions-table thead[b-n1whq9laui] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .positions-table thead th[b-n1whq9laui] {
            color: white;
            font-weight: 600;
            padding: 1rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.85rem;
            letter-spacing: 0.5px;
        }

    .positions-table tbody tr[b-n1whq9laui] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .positions-table tbody tr:hover[b-n1whq9laui] {
            background-color: #f8f9fa;
            transform: scale(1.01);
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
        }

    .positions-table tbody td[b-n1whq9laui] {
        padding: 1rem;
        vertical-align: middle;
    }

.position-name[b-n1whq9laui] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 1rem;
}

/* Search and filter bar */
.search-filter-bar[b-n1whq9laui] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-box[b-n1whq9laui] {
    position: relative;
    flex: 1;
    min-width: 250px;
    max-width: 400px;
}

    .search-box input[b-n1whq9laui] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-n1whq9laui] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-n1whq9laui] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.filter-group[b-n1whq9laui] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.entries-select[b-n1whq9laui] {
    padding: 0.5rem 1rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .entries-select:focus[b-n1whq9laui] {
        outline: none;
        border-color: var(--secondary-color);
    }

/* Pagination */
.pagination-wrapper[b-n1whq9laui] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-n1whq9laui] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-n1whq9laui] {
    margin: 0;
}

.page-link[b-n1whq9laui] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

    .page-link:hover[b-n1whq9laui] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
    }

.page-item.active .page-link[b-n1whq9laui] {
    color: #dee2e6;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Content card */
.content-card[b-n1whq9laui] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}



/* Alert styling */
.alert-info[b-n1whq9laui] {
    background-color: #e3f2fd;
    border-color: #90caf9;
    color: #1565c0;
    border-radius: 8px;
}

/* Action buttons container */
.action-buttons[b-n1whq9laui] {
    display: flex;
    gap: 0.5rem;
}
/* _content/AccountingSystem.Web/Components/Pages/Accountable/AccountManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-ew5gsjzzfi] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-ew5gsjzzfi] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-ew5gsjzzfi] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-ew5gsjzzfi] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-ew5gsjzzfi]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-ew5gsjzzfi] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-ew5gsjzzfi] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-ew5gsjzzfi] {
    color: #6c757d;
}

.add-new-btn[b-ew5gsjzzfi] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-ew5gsjzzfi] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-ew5gsjzzfi] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-ew5gsjzzfi] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-ew5gsjzzfi] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-ew5gsjzzfi] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-ew5gsjzzfi] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FILTER SECTION ==================== */
.filter-section[b-ew5gsjzzfi] {
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1.5rem;
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-ew5gsjzzfi] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-ew5gsjzzfi] {
    color: var(--secondary-color);
}

.form-control-custom[b-ew5gsjzzfi],
.form-select-custom[b-ew5gsjzzfi] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-ew5gsjzzfi],
.form-select-custom:focus[b-ew5gsjzzfi] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== SEARCH BOX ==================== */
.search-box[b-ew5gsjzzfi] {
    position: relative;
    width: 100%;
}

.search-box input[b-ew5gsjzzfi] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-ew5gsjzzfi] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.search-box i[b-ew5gsjzzfi] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

/* ==================== ACCOUNTABLES TABLE ==================== */
.accountables-table-container[b-ew5gsjzzfi] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.accountables-table[b-ew5gsjzzfi] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.accountables-table thead[b-ew5gsjzzfi] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.accountables-table thead th[b-ew5gsjzzfi] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.accountables-table thead th:first-child[b-ew5gsjzzfi] {
    border-top-left-radius: 12px;
}

.accountables-table thead th:last-child[b-ew5gsjzzfi] {
    border-top-right-radius: 12px;
}

.accountables-table tbody tr[b-ew5gsjzzfi] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.accountables-table tbody tr:hover[b-ew5gsjzzfi] {
    background-color: #f8f9fa;
}

.accountables-table tbody td[b-ew5gsjzzfi] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.accountable-name[b-ew5gsjzzfi] {
    font-weight: 600;
    color: var(--primary-color);
}

/* ==================== STATUS BADGES ==================== */
.badge[b-ew5gsjzzfi] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== PAGINATION ==================== */
.pagination-wrapper[b-ew5gsjzzfi] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
}

.showing-entries[b-ew5gsjzzfi] {
    font-size: 0.9rem;
    color: #495057;
}

.showing-entries strong[b-ew5gsjzzfi] {
    color: var(--primary-color);
}

.pagination[b-ew5gsjzzfi] {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

.page-item[b-ew5gsjzzfi] {
    margin: 0;
}

.page-link[b-ew5gsjzzfi] {
    padding: 0.5rem 0.75rem;
    border: 1px solid #dee2e6;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

.page-link:hover:not(:disabled)[b-ew5gsjzzfi] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

.page-item.active .page-link[b-ew5gsjzzfi] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

.page-item.disabled .page-link[b-ew5gsjzzfi] {
    opacity: 0.5;
    cursor: not-allowed;
}

.page-link:disabled[b-ew5gsjzzfi] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ==================== ALERTS ==================== */
.alert[b-ew5gsjzzfi] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-ew5gsjzzfi] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-ew5gsjzzfi] {
    color: var(--secondary-color);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-ew5gsjzzfi] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-ew5gsjzzfi] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-ew5gsjzzfi] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-ew5gsjzzfi] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-ew5gsjzzfi] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn-danger[b-ew5gsjzzfi] {
    background-color: #dc3545;
    color: white;
    border: none;
}

.btn-danger:hover[b-ew5gsjzzfi] {
    background-color: #bb2d3b;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
}

.btn:disabled[b-ew5gsjzzfi] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-ew5gsjzzfi] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-ew5gsjzzfi] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

.btn-action-icon:hover[b-ew5gsjzzfi] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-edit:hover[b-ew5gsjzzfi] {
    background: #0056b3;
    color: white;
}

.btn-action-icon.btn-delete:hover[b-ew5gsjzzfi] {
    background: #dc3545;
    color: white;
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-ew5gsjzzfi] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-ew5gsjzzfi] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-ew5gsjzzfi] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-ew5gsjzzfi] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
    .page-header[b-ew5gsjzzfi] {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }

    .page-title[b-ew5gsjzzfi] {
        font-size: 1.5rem;
    }

    .content-card[b-ew5gsjzzfi] {
        padding: 1.5rem;
    }

    .accountables-table thead th[b-ew5gsjzzfi],
    .accountables-table tbody td[b-ew5gsjzzfi] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .pagination-wrapper[b-ew5gsjzzfi] {
        flex-direction: column;
        gap: 1rem;
        justify-content: center;
    }

    .pagination[b-ew5gsjzzfi] {
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media (max-width: 576px) {
    .page-header .add-new-btn[b-ew5gsjzzfi] {
        width: 100%;
        justify-content: center;
    }

    .content-card[b-ew5gsjzzfi] {
        padding: 1rem;
    }

    .page-link[b-ew5gsjzzfi] {
        padding: 0.4rem 0.6rem;
        font-size: 0.8rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/AccountsPayable/AccountPayable.razor.rz.scp.css */
/* Content Card */
.content-card[b-pesr4l1zfs] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Card Header */
.card-header-custom[b-pesr4l1zfs] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-pesr4l1zfs] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-pesr4l1zfs] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-pesr4l1zfs] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Page Header */
.page-header[b-pesr4l1zfs] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-pesr4l1zfs] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-pesr4l1zfs] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-pesr4l1zfs] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-pesr4l1zfs]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-pesr4l1zfs] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-pesr4l1zfs] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-pesr4l1zfs] {
    color: #6c757d;
}

/* Summary Cards */
.summary-card[b-pesr4l1zfs] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1.5rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
}

    .summary-card:hover[b-pesr4l1zfs] {
        transform: translateY(-2px);
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
    }

    .summary-card .card-icon[b-pesr4l1zfs] {
        width: 64px;
        height: 64px;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
        flex-shrink: 0;
    }

        .summary-card .card-icon i[b-pesr4l1zfs] {
            font-size: 1.75rem;
            color: white;
        }

    .summary-card .card-content[b-pesr4l1zfs] {
        flex: 1;
    }

    .summary-card .card-title[b-pesr4l1zfs] {
        font-size: 0.875rem;
        font-weight: 600;
        color: #6c757d;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        margin-bottom: 0.5rem;
    }

    .summary-card .card-value[b-pesr4l1zfs] {
        font-size: 1.75rem;
        font-weight: 700;
        color: var(--primary-color);
        line-height: 1.2;
        margin-bottom: 0.25rem;
    }

    .summary-card .card-subtitle[b-pesr4l1zfs] {
        font-size: 0.85rem;
        color: #6c757d;
        font-weight: 500;
    }

/* Filter Section */
.filter-section[b-pesr4l1zfs] {
    margin-bottom: 1.5rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 12px;
    border: 2px solid #dee2e6;
}

.search-box[b-pesr4l1zfs] {
    position: relative;
    width: 100%;
}

    .search-box i[b-pesr4l1zfs] {
        position: absolute;
        left: 12px;
        top: 50%;
        transform: translateY(-50%);
        color: var(--secondary-color);
        pointer-events: none;
    }

    .search-box input[b-pesr4l1zfs] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.5rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-pesr4l1zfs] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

        .search-box input:disabled[b-pesr4l1zfs] {
            background-color: #f8f9fa;
            cursor: not-allowed;
        }

/* Buttons */
.btn[b-pesr4l1zfs] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-filter[b-pesr4l1zfs] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
    color: white;
    border: none;
}

    .btn-filter:hover:not(:disabled)[b-pesr4l1zfs] {
        background: linear-gradient(135deg, #a00000 0%, var(--primary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(139, 0, 0, 0.2);
    }

.btn-secondary[b-pesr4l1zfs] {
    background-color: #6c757d;
    border: none;
}

    .btn-secondary:hover[b-pesr4l1zfs] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

.btn-reset[b-pesr4l1zfs] {
    background-color: #6c757d;
    color: white;
    border: none;
}

    .btn-reset:hover:not(:disabled)[b-pesr4l1zfs] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

    .btn-filter:disabled[b-pesr4l1zfs],
    .btn-reset:disabled[b-pesr4l1zfs],
    .btn-secondary:disabled[b-pesr4l1zfs] {
        opacity: 0.6;
        cursor: not-allowed;
        transform: none;
    }

/* Active Filters Display */
.active-filters[b-pesr4l1zfs] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    background: white;
    border-radius: 8px;
    border: 2px solid #e9ecef;
}

.filter-label[b-pesr4l1zfs] {
    font-weight: 600;
    color: #495057;
    font-size: 0.9rem;
}

.filter-tag[b-pesr4l1zfs] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.85rem;
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
}

    .filter-tag i[b-pesr4l1zfs] {
        cursor: pointer;
        opacity: 0.8;
        transition: opacity 0.2s;
    }

        .filter-tag i:hover[b-pesr4l1zfs] {
            opacity: 1;
        }

/* Table Styles */
.ap-table-container[b-pesr4l1zfs] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.ap-table-modern[b-pesr4l1zfs] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

    .ap-table-modern thead[b-pesr4l1zfs] {
        background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
        color: white;
    }

        .ap-table-modern thead th[b-pesr4l1zfs] {
            padding: 1rem 0.75rem;
            font-weight: 600;
            text-align: left;
            border: none;
            white-space: nowrap;
            font-size: 0.9rem;
        }

            .ap-table-modern thead th:first-child[b-pesr4l1zfs] {
                border-top-left-radius: 12px;
            }

            .ap-table-modern thead th:last-child[b-pesr4l1zfs] {
                border-top-right-radius: 12px;
            }

    .ap-table-modern tbody tr.main-row[b-pesr4l1zfs] {
        background: white;
        transition: all 0.2s;
        border-bottom: 1px solid #e9ecef;
    }

        .ap-table-modern tbody tr.main-row:hover[b-pesr4l1zfs] {
            background: #f8f9fa;
            transform: scale(1.001);
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
        }

    .ap-table-modern tbody td[b-pesr4l1zfs] {
        padding: 0.875rem 0.75rem;
        vertical-align: middle;
        font-size: 0.9rem;
    }

/* Expandable Button */
.btn-expand[b-pesr4l1zfs] {
    background: none;
    border: none;
    padding: 0.25rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: transform 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .btn-expand i[b-pesr4l1zfs] {
        font-size: 1rem;
        transition: transform 0.2s;
    }

    .btn-expand.expanded i[b-pesr4l1zfs] {
        transform: rotate(90deg);
    }

    .btn-expand:hover[b-pesr4l1zfs] {
        background: rgba(212, 175, 55, 0.15);
        border-radius: 4px;
    }

/* AP Code Badge */
.ap-code[b-pesr4l1zfs] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 0.95rem;
    font-family: 'Courier New', monospace;
}

.ap-code-link[b-pesr4l1zfs] {
    text-decoration: none;
    cursor: pointer;
    display: inline-block;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    transition: all 0.2s;
}

    .ap-code-link:hover[b-pesr4l1zfs] {
        background: rgba(212, 175, 55, 0.15);
        text-decoration: underline;
        transform: translateX(2px);
    }

    .ap-code-link:active[b-pesr4l1zfs] {
        transform: translateX(0px);
    }

.ap-info-link[b-pesr4l1zfs] {
    text-decoration: none;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    transition: all 0.2s;
}

    .ap-info-link:hover[b-pesr4l1zfs] {
        opacity: 0.8;
    }

    .ap-info-link:active[b-pesr4l1zfs] {
        opacity: 1;
    }

/* Vendor Name */
.vendor-name[b-pesr4l1zfs] {
    font-weight: 500;
    color: #495057;
}

/* Date Display */
.date-wrapper[b-pesr4l1zfs] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

    .date-wrapper i[b-pesr4l1zfs] {
        font-size: 0.875rem;
        color: var(--secondary-color);
    }

/* Category Badge */
.category-badge[b-pesr4l1zfs] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.85rem;
    font-weight: 600;
}

.category-project[b-pesr4l1zfs] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, #e6c557 100%);
    color: var(--primary-color);
}

.category-non-project[b-pesr4l1zfs] {
    background: linear-gradient(135deg, #6c757d 0%, #5a6268 100%);
    color: white;
}

/* Amount Highlight */
.amount-highlight[b-pesr4l1zfs] {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1rem;
}

.paid-amount[b-pesr4l1zfs] {
    font-weight: 600;
    color: #28a745;
    font-size: 0.95rem;
}

.balance-amount[b-pesr4l1zfs] {
    font-weight: 700;
    color: #ffc107;
    font-size: 0.95rem;
}

/* Action Button */
.btn-action-icon[b-pesr4l1zfs] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

    .btn-action-icon:hover[b-pesr4l1zfs] {
        background: var(--primary-color);
        color: white;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
    }

/* Expandable Row Styles */
.expandable-row[b-pesr4l1zfs] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
}

    .expandable-row td[b-pesr4l1zfs] {
        padding: 0 !important;
    }

.expanded-content[b-pesr4l1zfs] {
    padding: 2rem;
    border-top: 2px solid var(--secondary-color);
}

.detail-section[b-pesr4l1zfs] {
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 2px dashed #dee2e6;
}

    .detail-section:last-child[b-pesr4l1zfs] {
        margin-bottom: 0;
        border-bottom: none;
    }

.section-title[b-pesr4l1zfs] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
}

    .section-title i[b-pesr4l1zfs] {
        color: var(--secondary-color);
    }

.detail-grid[b-pesr4l1zfs] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.detail-item[b-pesr4l1zfs] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    .detail-item label[b-pesr4l1zfs] {
        color: #495057;
        font-weight: 600;
        font-size: 0.9rem;
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

        .detail-item label i[b-pesr4l1zfs] {
            color: var(--secondary-color);
        }

    .detail-item span[b-pesr4l1zfs] {
        font-size: 0.95rem;
        color: #212529;
        font-weight: 500;
    }

/* Mobile Card View */
.ap-cards-container[b-pesr4l1zfs] {
    display: none;
}

.ap-card[b-pesr4l1zfs] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    margin-bottom: 1rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    cursor: pointer;
    border: 1px solid rgba(0,0,0,0.05);
}

    .ap-card:hover[b-pesr4l1zfs] {
        transform: translateY(-2px);
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    }

.card-header-row[b-pesr4l1zfs] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid #f1f3f5;
}

.ap-info[b-pesr4l1zfs] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.ap-code-mobile[b-pesr4l1zfs] {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1rem;
    font-family: 'Courier New', monospace;
}

.date-mobile[b-pesr4l1zfs] {
    font-size: 0.85rem;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

    .date-mobile i[b-pesr4l1zfs] {
        color: var(--secondary-color);
    }

.amount-mobile[b-pesr4l1zfs] {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1.1rem;
}

.card-body-row[b-pesr4l1zfs] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

.info-group[b-pesr4l1zfs] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

    .info-group i[b-pesr4l1zfs] {
        color: var(--secondary-color);
        font-size: 1.25rem;
        margin-top: 0.25rem;
    }

.info-content[b-pesr4l1zfs] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
}

    .info-content label[b-pesr4l1zfs] {
        font-size: 0.75rem;
        font-weight: 600;
        color: #6c757d;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .info-content span[b-pesr4l1zfs] {
        font-size: 0.9rem;
        font-weight: 500;
        color: #212529;
    }

.card-divider[b-pesr4l1zfs] {
    height: 2px;
    background: linear-gradient(90deg, transparent, #dee2e6, transparent);
    margin: 1rem 0;
}

.card-details-grid[b-pesr4l1zfs] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.detail-row[b-pesr4l1zfs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #495057;
}

    .detail-row i[b-pesr4l1zfs] {
        color: var(--secondary-color);
    }

.paid-badge[b-pesr4l1zfs] {
    color: #28a745;
    font-weight: 600;
}

.balance-badge[b-pesr4l1zfs] {
    color: #ffc107;
    font-weight: 600;
}

/* Pagination */
.pagination-wrapper[b-pesr4l1zfs] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
    border-top: 2px solid #dee2e6;
}

.showing-entries[b-pesr4l1zfs] {
    font-size: 0.9rem;
    color: #495057;
    font-weight: 500;
}

    .showing-entries span[b-pesr4l1zfs] {
        font-weight: 700;
        color: var(--primary-color);
    }

.pagination[b-pesr4l1zfs] {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

.page-item[b-pesr4l1zfs] {
    margin: 0;
}

.page-link[b-pesr4l1zfs] {
    padding: 0.65rem 1rem;
    border: 2px solid #e9ecef;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

    .page-link:hover:not(:disabled)[b-pesr4l1zfs] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        color: var(--primary-color);
        border-color: var(--secondary-color);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    }

.page-item.active .page-link[b-pesr4l1zfs] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
    color: white;
    border-color: var(--primary-color);
}

.page-item.disabled .page-link[b-pesr4l1zfs],
.page-link:disabled[b-pesr4l1zfs] {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

/* Filter Modal */
.filter-modal-label[b-pesr4l1zfs] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .filter-modal-label i[b-pesr4l1zfs] {
        color: var(--secondary-color);
    }

/* Form Controls in Modal */
.form-control-custom[b-pesr4l1zfs],
.form-select-custom[b-pesr4l1zfs] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control-custom:focus[b-pesr4l1zfs],
    .form-select-custom:focus[b-pesr4l1zfs] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

.btn-primary-filter[b-pesr4l1zfs] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    transition: all 0.3s ease;
}

    .btn-primary-filter:hover[b-pesr4l1zfs] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

/* Modal Styles */
.modal-content[b-pesr4l1zfs] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-pesr4l1zfs] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
    background: white;
}

.modal-title[b-pesr4l1zfs] {
    color: var(--primary-color);
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .modal-title i[b-pesr4l1zfs] {
        color: var(--secondary-color);
    }

.modal-footer[b-pesr4l1zfs] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Alert Styles */
.alert[b-pesr4l1zfs] {
    border-radius: 8px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    border: 2px solid;
}

.alert-info[b-pesr4l1zfs] {
    background: linear-gradient(135deg, #e7f3ff 0%, #cce5ff 100%);
    border-color: #b3d9ff;
    color: #004085;
}

    .alert-info i[b-pesr4l1zfs] {
        color: #0066cc;
    }

/* Responsive Design */
@media (max-width: 768px) {
    .page-title[b-pesr4l1zfs] {
        font-size: 1.5rem;
    }

        .page-title i[b-pesr4l1zfs] {
            font-size: 1.5rem;
        }

    .content-card[b-pesr4l1zfs] {
        padding: 1.5rem;
    }

    .filter-section[b-pesr4l1zfs] {
        padding: 1rem;
    }

    .summary-card[b-pesr4l1zfs] {
        padding: 1rem;
    }

        .summary-card .card-icon[b-pesr4l1zfs] {
            width: 48px;
            height: 48px;
        }

            .summary-card .card-icon i[b-pesr4l1zfs] {
                font-size: 1.25rem;
            }

        .summary-card .card-value[b-pesr4l1zfs] {
            font-size: 1.5rem;
        }

    .ap-table-container.desktop-view[b-pesr4l1zfs] {
        display: none;
    }

    .ap-cards-container.mobile-view[b-pesr4l1zfs] {
        display: block;
    }

    .pagination-wrapper[b-pesr4l1zfs] {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }

    .pagination[b-pesr4l1zfs] {
        justify-content: center;
        flex-wrap: wrap;
    }

    .btn-filter[b-pesr4l1zfs],
    .btn-reset[b-pesr4l1zfs],
    .btn-secondary[b-pesr4l1zfs] {
        font-size: 0.85rem;
        padding: 0.55rem 0.85rem;
    }

    .card-body-row[b-pesr4l1zfs] {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 769px) {
    .ap-table-container.desktop-view[b-pesr4l1zfs] {
        display: block;
    }

    .ap-cards-container.mobile-view[b-pesr4l1zfs] {
        display: none;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/AccountsPayable/APAging.razor.rz.scp.css */
/* ==================== Page Header ==================== */
.page-header[b-kpqwet6g7q] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-kpqwet6g7q] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-kpqwet6g7q] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-kpqwet6g7q] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-kpqwet6g7q]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-kpqwet6g7q] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-kpqwet6g7q] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-kpqwet6g7q] {
    color: #6c757d;
}

/* ==================== Content Card ==================== */
.content-card[b-kpqwet6g7q] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

/* Card Header */
.card-header-custom[b-kpqwet6g7q] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-kpqwet6g7q] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-kpqwet6g7q] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-kpqwet6g7q] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== Form Controls ==================== */
.form-label[b-kpqwet6g7q] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-kpqwet6g7q] {
    color: var(--secondary-color);
}

.form-control-custom[b-kpqwet6g7q], .form-select-custom[b-kpqwet6g7q] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-kpqwet6g7q], .form-select-custom:focus[b-kpqwet6g7q] {
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== Summary Cards ==================== */
.summary-card[b-kpqwet6g7q] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1.5rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.summary-card:hover[b-kpqwet6g7q] {
    transform: translateY(-4px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
}

.summary-card .card-icon[b-kpqwet6g7q] {
    width: 64px;
    height: 64px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    flex-shrink: 0;
}

.summary-card .card-icon i[b-kpqwet6g7q] {
    font-size: 1.75rem;
    color: var(--secondary-color);
}

.summary-card .card-content[b-kpqwet6g7q] {
    flex: 1;
}

.summary-card .card-title[b-kpqwet6g7q] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

.summary-card .card-value[b-kpqwet6g7q] {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--primary-color);
    line-height: 1.2;
    margin-bottom: 0.25rem;
}

.summary-card .card-subtitle[b-kpqwet6g7q] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 500;
}

/* ==================== Search and Filter Section ==================== */
.filter-section[b-kpqwet6g7q] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.search-box[b-kpqwet6g7q] {
    position: relative;
    width: 100%;
}

.search-box i[b-kpqwet6g7q] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box input[b-kpqwet6g7q] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-kpqwet6g7q] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.search-box input:disabled[b-kpqwet6g7q] {
    background-color: #e9ecef;
    cursor: not-allowed;
}

/* ==================== Button Styles ==================== */
.btn[b-kpqwet6g7q] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-kpqwet6g7q] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-kpqwet6g7q] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-kpqwet6g7q] {
    background-color: #6c757d;
    border: none;
}

.btn-secondary:hover[b-kpqwet6g7q] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn-filter[b-kpqwet6g7q] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
    border: none;
}

.btn-filter:hover:not(:disabled)[b-kpqwet6g7q] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    color: white;
}

.btn-reset[b-kpqwet6g7q] {
    background: #6c757d;
    color: white;
    border: none;
}

.btn-reset:hover:not(:disabled)[b-kpqwet6g7q] {
    background: #5c636a;
    transform: translateY(-2px);
}

.btn-filter:disabled[b-kpqwet6g7q],
.btn-reset:disabled[b-kpqwet6g7q] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Active Filters Display */
.active-filters[b-kpqwet6g7q] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem;
    background: white;
    border-radius: 8px;
    border: 1px solid #dee2e6;
}

.filter-label[b-kpqwet6g7q] {
    font-weight: 600;
    color: #495057;
}

.filter-tag[b-kpqwet6g7q] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.75rem;
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
}

.filter-tag i[b-kpqwet6g7q] {
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.2s;
}

.filter-tag i:hover[b-kpqwet6g7q] {
    opacity: 1;
}

/* ==================== Table Styles ==================== */
.aging-table-container[b-kpqwet6g7q] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.aging-table-modern[b-kpqwet6g7q] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.aging-table-modern thead[b-kpqwet6g7q] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.aging-table-modern thead th[b-kpqwet6g7q] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.aging-table-modern thead th:first-child[b-kpqwet6g7q] {
    border-top-left-radius: 12px;
}

.aging-table-modern thead th:last-child[b-kpqwet6g7q] {
    border-top-right-radius: 12px;
}

.aging-table-modern tbody tr.main-row[b-kpqwet6g7q] {
    background: white;
    transition: all 0.3s ease;
    border-bottom: 1px solid #e9ecef;
}

.aging-table-modern tbody tr.main-row:hover[b-kpqwet6g7q] {
    background: #f8f9fa;
    transform: scale(1.001);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.aging-table-modern tbody tr.main-row.overdue-row[b-kpqwet6g7q] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border-left: 4px solid var(--secondary-color);
}

.aging-table-modern tbody tr.main-row.overdue-row:hover[b-kpqwet6g7q] {
    background: linear-gradient(135deg, #fff3cd 0%, #ffeaa7 100%);
}

.aging-table-modern tbody td[b-kpqwet6g7q] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
}

/* Expandable Button */
.btn-expand[b-kpqwet6g7q] {
    background: none;
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: all 0.3s ease;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-expand i[b-kpqwet6g7q] {
    font-size: 1rem;
    transition: transform 0.3s ease;
}

.btn-expand.expanded i[b-kpqwet6g7q] {
    transform: rotate(90deg);
}

.btn-expand:hover[b-kpqwet6g7q] {
    background: rgba(139, 0, 0, 0.1);
}

/* AP Code Badge */
.ap-code[b-kpqwet6g7q] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 0.95rem;
    font-family: 'Courier New', monospace;
}

/* Vendor and Agent Names */
.vendor-name[b-kpqwet6g7q],
.agent-name[b-kpqwet6g7q] {
    font-weight: 500;
    color: #495057;
}

/* Project Name */
.project-name[b-kpqwet6g7q] {
    font-weight: 500;
    color: #6c757d;
    font-size: 0.875rem;
}

/* Date Display */
.date-wrapper[b-kpqwet6g7q] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.date-wrapper i[b-kpqwet6g7q] {
    font-size: 0.875rem;
}

/* Terms Badge */
.terms-badge[b-kpqwet6g7q] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-radius: 12px;
    font-size: 0.85rem;
    font-weight: 600;
}

/* Lapse Days Badge */
.lapse-badge[b-kpqwet6g7q] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.35rem 0.85rem;
    border-radius: 12px;
    font-size: 0.85rem;
    font-weight: 700;
}

.lapse-badge.overdue[b-kpqwet6g7q] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
}

.lapse-badge.current[b-kpqwet6g7q] {
    background: linear-gradient(135deg, #28a745 0%, #218838 100%);
    color: white;
}

.lapse-badge i[b-kpqwet6g7q] {
    font-size: 0.9rem;
}

/* Action Button */
.btn-action-icon[b-kpqwet6g7q] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

.btn-action-icon:hover[b-kpqwet6g7q] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

/* Amount Highlight */
.amount-highlight[b-kpqwet6g7q] {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1rem;
}

/* ==================== Expandable Row Styles ==================== */
.expandable-row[b-kpqwet6g7q] {
    background: #f8f9fa;
}

.expandable-row td[b-kpqwet6g7q] {
    padding: 0 !important;
}

.expanded-content[b-kpqwet6g7q] {
    padding: 1.5rem;
    border-top: 2px solid var(--secondary-color);
}

.detail-section[b-kpqwet6g7q] {
    margin-bottom: 1.5rem;
}

.detail-section:last-child[b-kpqwet6g7q] {
    margin-bottom: 0;
}

.section-title[b-kpqwet6g7q] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #dee2e6;
}

.section-title i[b-kpqwet6g7q] {
    color: var(--secondary-color);
}

.detail-grid[b-kpqwet6g7q] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.detail-item[b-kpqwet6g7q] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.detail-item label[b-kpqwet6g7q] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.detail-item label i[b-kpqwet6g7q] {
    color: var(--secondary-color);
}

.detail-item span[b-kpqwet6g7q] {
    font-size: 0.95rem;
    color: #212529;
    font-weight: 500;
}

/* ==================== Mobile Card View ==================== */
.aging-cards-container[b-kpqwet6g7q] {
    display: none;
}

.aging-card[b-kpqwet6g7q] {
    background: white;
    border-radius: 12px;
    padding: 1rem;
    margin-bottom: 1rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    cursor: pointer;
    border-left: 4px solid transparent;
}

.aging-card:hover[b-kpqwet6g7q] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.aging-card.overdue-card[b-kpqwet6g7q] {
    border-left-color: var(--secondary-color);
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
}

.card-header-row[b-kpqwet6g7q] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #e9ecef;
}

.ap-info[b-kpqwet6g7q] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.ap-code-mobile[b-kpqwet6g7q] {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1rem;
    font-family: 'Courier New', monospace;
}

.date-mobile[b-kpqwet6g7q] {
    font-size: 0.85rem;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.lapse-mobile[b-kpqwet6g7q] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.85rem;
    border-radius: 12px;
    font-size: 0.85rem;
    font-weight: 700;
}

.lapse-mobile.overdue[b-kpqwet6g7q] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
}

.lapse-mobile.current[b-kpqwet6g7q] {
    background: linear-gradient(135deg, #28a745 0%, #218838 100%);
    color: white;
}

.amount-mobile[b-kpqwet6g7q] {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1rem;
}

.card-body-row[b-kpqwet6g7q] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

.info-group[b-kpqwet6g7q] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.info-group i[b-kpqwet6g7q] {
    color: var(--secondary-color);
    font-size: 1.25rem;
    margin-top: 0.25rem;
}

.info-content[b-kpqwet6g7q] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
}

.info-content label[b-kpqwet6g7q] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.info-content span[b-kpqwet6g7q] {
    font-size: 0.9rem;
    font-weight: 500;
    color: #212529;
}

.card-divider[b-kpqwet6g7q] {
    height: 1px;
    background: #e9ecef;
    margin: 1rem 0;
}

.card-details-grid[b-kpqwet6g7q] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.detail-row[b-kpqwet6g7q] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #495057;
}

.detail-row i[b-kpqwet6g7q] {
    color: var(--secondary-color);
}

/* ==================== Pagination Styles ==================== */
.pagination-wrapper[b-kpqwet6g7q] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
}

.showing-entries[b-kpqwet6g7q] {
    font-size: 0.9rem;
    color: #495057;
}

.showing-entries span[b-kpqwet6g7q] {
    font-weight: 600;
    color: var(--primary-color);
}

.pagination[b-kpqwet6g7q] {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

.page-item[b-kpqwet6g7q] {
    margin: 0;
}

.page-link[b-kpqwet6g7q] {
    padding: 0.5rem 0.75rem;
    border: 1px solid #dee2e6;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

.page-link:hover:not(:disabled)[b-kpqwet6g7q] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

.page-item.active .page-link[b-kpqwet6g7q] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

.page-item.disabled .page-link[b-kpqwet6g7q] {
    opacity: 0.5;
    cursor: not-allowed;
}

.page-link:disabled[b-kpqwet6g7q] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ==================== Filter Modal Styles ==================== */
.filter-modal-label[b-kpqwet6g7q] {
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.filter-modal-label i[b-kpqwet6g7q] {
    color: var(--secondary-color);
}

/* Modal Styles */
.modal-content[b-kpqwet6g7q] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-kpqwet6g7q] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-kpqwet6g7q] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-kpqwet6g7q] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== Alert Styles ==================== */
.alert[b-kpqwet6g7q] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
}

.alert-info[b-kpqwet6g7q] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-kpqwet6g7q] {
    color: var(--secondary-color);
}

/* ==================== Responsive Design ==================== */
@media (max-width: 768px) {
    .page-title[b-kpqwet6g7q] {
        font-size: 1.5rem;
    }

    .content-card[b-kpqwet6g7q] {
        padding: 1.5rem;
    }

    .aging-table-container.desktop-view[b-kpqwet6g7q] {
        display: none;
    }

    .aging-cards-container.mobile-view[b-kpqwet6g7q] {
        display: block;
    }

    .pagination-wrapper[b-kpqwet6g7q] {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }

    .pagination[b-kpqwet6g7q] {
        justify-content: center;
        flex-wrap: wrap;
    }

    .filter-section[b-kpqwet6g7q] {
        padding: 0.75rem;
    }

    .btn-filter[b-kpqwet6g7q],
    .btn-reset[b-kpqwet6g7q],
    .btn-secondary[b-kpqwet6g7q] {
        font-size: 0.85rem;
        padding: 0.4rem 0.8rem;
    }

    /* Mobile Summary Cards */
    .summary-card[b-kpqwet6g7q] {
        padding: 1rem;
    }

    .summary-card .card-icon[b-kpqwet6g7q] {
        width: 48px;
        height: 48px;
    }

    .summary-card .card-icon i[b-kpqwet6g7q] {
        font-size: 1.25rem;
    }

    .summary-card .card-value[b-kpqwet6g7q] {
        font-size: 1.5rem;
    }
}

@media (min-width: 769px) {
    .aging-table-container.desktop-view[b-kpqwet6g7q] {
        display: block;
    }

    .aging-cards-container.mobile-view[b-kpqwet6g7q] {
        display: none;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/AccountsPayable/APDashboard.razor.rz.scp.css */
/* Dashboard Cards */
.dashboard-card[b-gbamx3lful] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

    .dashboard-card:hover[b-gbamx3lful] {
        transform: translateY(-5px);
        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    }

.card-icon[b-gbamx3lful] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-gbamx3lful] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-gbamx3lful] {
    color: #212529;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.card-change[b-gbamx3lful] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
}

    .card-change.positive[b-gbamx3lful] {
        color: #2E7D32;
    }

    .card-change i[b-gbamx3lful] {
        margin-right: 0.25rem;
    }

/* Content Card */
.content-card[b-gbamx3lful] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
    max-width: 100%; /* Ensure it doesn't exceed parent width */
    width: 100%;
    box-sizing: border-box;
}

.card-header-custom[b-gbamx3lful] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-gbamx3lful] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-gbamx3lful] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-gbamx3lful] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Page Header */
.page-header[b-gbamx3lful] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-gbamx3lful] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-gbamx3lful] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-gbamx3lful] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-gbamx3lful]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-gbamx3lful] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-gbamx3lful] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-gbamx3lful] {
    color: #6c757d;
}

.add-new-btn[b-gbamx3lful] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

    .add-new-btn:hover[b-gbamx3lful] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

/* Filter Section */
.filter-section[b-gbamx3lful] {
    margin-bottom: 1.5rem;
}

.filter-label[b-gbamx3lful] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
    margin-bottom: 0.25rem;
    display: block;
}

.search-box[b-gbamx3lful] {
    position: relative;
    width: 100%;
}

    .search-box input[b-gbamx3lful] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-gbamx3lful] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-gbamx3lful] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.form-select-custom[b-gbamx3lful], .form-control-custom[b-gbamx3lful] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-select-custom:focus[b-gbamx3lful], .form-control-custom:focus[b-gbamx3lful] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Table Styles */
.checks-table[b-gbamx3lful] {
    width: 100%;
    margin-top: 1rem;
}

    .checks-table thead[b-gbamx3lful] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .checks-table thead th[b-gbamx3lful] {
            <!-- color: white; -->
            font-weight: 600;
            padding: 1rem 0.75rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.8rem;
            letter-spacing: 0.5px;
            white-space: nowrap;
        }

    .checks-table tbody tr[b-gbamx3lful] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .checks-table tbody tr:hover[b-gbamx3lful] {
            background-color: #f8f5f0;
            box-shadow: inset 4px 0 0 var(--secondary-color), 0 2px 8px rgba(139, 0, 0, 0.1);
            transform: scale(1.01);
        }

            /* Extra visual indicator on hover */
            .checks-table tbody tr:hover td[b-gbamx3lful] {
                color: var(--primary-color);
                font-weight: 500;
            }

    .checks-table tbody td[b-gbamx3lful] {
        padding: 1rem 0.75rem;
        vertical-align: middle;
        font-size: 0.9rem;
    }

.voucher-number[b-gbamx3lful] {
    font-weight: 600;
    color: var(--primary-color);
}

.amount-value[b-gbamx3lful] {
    font-weight: 700;
    color: var(--primary-color);
}

/* Table Select Dropdowns */
.table-select[b-gbamx3lful] {
    border: 2px solid #e9ecef;
    border-radius: 6px;
    padding: 0.4rem 0.6rem;
    font-size: 0.85rem;
    transition: all 0.3s ease;
    cursor: pointer;
    width: 100%;
}

    .table-select:focus[b-gbamx3lful] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.15rem rgba(212, 175, 55, 0.15);
    }

    .table-select:hover[b-gbamx3lful] {
        border-color: var(--secondary-color);
    }

/* Picker Buttons */
.btn-picker[b-gbamx3lful] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 2px solid #e9ecef;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 500;
    transition: all 0.3s ease;
    cursor: pointer;
    background-color: white;
    text-align: left;
}

    .btn-picker:hover:not(:disabled)[b-gbamx3lful] {
        border-color: var(--secondary-color);
        background-color: #f8f5f0;
        transform: translateY(-1px);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.2);
    }

    .btn-picker:active:not(:disabled)[b-gbamx3lful] {
        transform: translateY(0);
        box-shadow: 0 1px 4px rgba(212, 175, 55, 0.15);
    }

    .btn-picker:disabled[b-gbamx3lful] {
        opacity: 0.6;
        cursor: not-allowed;
    }

    .btn-picker i:first-child[b-gbamx3lful] {
        color: var(--primary-color);
        font-size: 1.1rem;
        flex-shrink: 0;
    }

    .btn-picker i:last-child[b-gbamx3lful] {
        color: #6c757d;
        font-size: 0.9rem;
        flex-shrink: 0;
    }

    .btn-picker span[b-gbamx3lful] {
        flex: 1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.btn-picker-empty[b-gbamx3lful] {
    color: #6c757d;
    font-style: italic;
}

    .btn-picker-empty:hover:not(:disabled)[b-gbamx3lful] {
        color: #495057;
    }

.btn-picker-filled[b-gbamx3lful] {
    color: #212529;
    border-color: #d4af37;
    background-color: #fff8e6;
}

    .btn-picker-filled:hover:not(:disabled)[b-gbamx3lful] {
        border-color: var(--secondary-color);
        background-color: #fff3cd;
    }

    .btn-picker-filled i:first-child[b-gbamx3lful] {
        color: var(--secondary-color);
    }

/* Status Select Colors */
.status-select.status-pending[b-gbamx3lful] {
    background-color: #fff3cd;
    border-color: #ffc107;
    color: #856404;
    font-weight: 600;
}

.status-select.status-progress[b-gbamx3lful] {
    background-color: #cfe2ff;
    border-color: #0d6efd;
    color: #084298;
    font-weight: 600;
}

.status-select.status-completed[b-gbamx3lful] {
    background-color: #d1e7dd;
    border-color: #198754;
    color: #0f5132;
    font-weight: 600;
}

.status-select.status-cancelled[b-gbamx3lful] {
    background-color: #f8d7da;
    border-color: #dc3545;
    color: #842029;
    font-weight: 600;
}

/* Action Buttons */
.action-buttons[b-gbamx3lful] {
    display: flex;
    gap: 0.4rem;
    justify-content: center;
}

.btn-action[b-gbamx3lful] {
    padding: 0.4rem 0.6rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-view[b-gbamx3lful] {
    background-color: #0dcaf0;
    color: white;
}

    .btn-view:hover[b-gbamx3lful] {
        background-color: #0aa2c0;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 202, 240, 0.3);
    }

.btn-edit[b-gbamx3lful] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-gbamx3lful] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

.btn-print[b-gbamx3lful] {
    background-color: #6c757d;
    color: white;
}

    .btn-print:hover[b-gbamx3lful] {
        background-color: #5c636a;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(108, 117, 125, 0.3);
    }

/* Pagination */
.pagination-wrapper[b-gbamx3lful] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-gbamx3lful] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-gbamx3lful] {
    margin: 0;
}

.page-link[b-gbamx3lful] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

    .page-link:hover[b-gbamx3lful] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
    }

.page-item.active .page-link[b-gbamx3lful] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Modal Styles */
.modal-content[b-gbamx3lful] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-gbamx3lful] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-gbamx3lful] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-gbamx3lful] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-gbamx3lful] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-gbamx3lful] {
            opacity: 1;
        }

.modal-body[b-gbamx3lful] {
    padding: 2rem;
}

.modal-footer[b-gbamx3lful] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.detail-label[b-gbamx3lful] {
    font-weight: 600;
    color: #6c757d;
    font-size: 0.9rem;
    margin-bottom: 0.25rem;
}

.detail-value[b-gbamx3lful] {
    color: #212529;
    font-size: 1rem;
    margin-bottom: 1rem;
}

/* Buttons */
.btn[b-gbamx3lful] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-secondary[b-gbamx3lful] {
    background-color: #6c757d;
    border: none;
}

    .btn-secondary:hover[b-gbamx3lful] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

/* Toast */
.toast[b-gbamx3lful] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Filter Modal Styles */
.filter-modal-label[b-gbamx3lful] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .filter-modal-label i[b-gbamx3lful] {
        color: var(--primary-color);
        font-size: 1.1rem;
    }

/* Filter Button Styles */
.btn-filter[b-gbamx3lful] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-filter:hover[b-gbamx3lful] {
        background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(139, 0, 0, 0.4);
    }

    .btn-filter:active[b-gbamx3lful] {
        transform: translateY(0);
    }

.btn-reset[b-gbamx3lful] {
    background-color: #6c757d;
    color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-reset:hover[b-gbamx3lful] {
        background-color: #5c636a;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(108, 117, 125, 0.3);
    }

.btn-primary-filter[b-gbamx3lful] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 700;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-primary-filter:hover[b-gbamx3lful] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

/* Active Filters Display */
.active-filters[b-gbamx3lful] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    border-left: 4px solid var(--secondary-color);
}

.filter-tag[b-gbamx3lful] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.75rem;
    background-color: white;
    border: 1px solid var(--secondary-color);
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--primary-color);
    transition: all 0.2s ease;
}

    .filter-tag:hover[b-gbamx3lful] {
        background-color: #fff8e6;
        box-shadow: 0 2px 6px rgba(212, 175, 55, 0.2);
    }

    .filter-tag i[b-gbamx3lful] {
        cursor: pointer;
        font-size: 1rem;
        transition: transform 0.2s ease;
    }

        .filter-tag i:hover[b-gbamx3lful] {
            transform: scale(1.2);
            color: var(--primary-color);
        }

/* Modal Size Adjustments */
.modal-lg[b-gbamx3lful] {
    max-width: 900px;
}

/* ==================== MOBILE RESPONSIVE STYLES ==================== */

/* Tablet and below (768px) */
@media (max-width: 768px) {
    /* Prevent page overflow but allow table scrolling */
    body[b-gbamx3lful] {
        overflow-x: hidden;
    }

    /* Ensure main content container doesn't overflow */
    .main-content[b-gbamx3lful] {
        overflow-x: hidden;
        max-width: 100vw;
    }

    /* Ensure content card doesn't overflow */
    .content-card[b-gbamx3lful] {
        padding: 1.25rem;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* Keep table scrollable on all devices */
    .checks-table-container[b-gbamx3lful] {
        max-width: 100%;
        overflow-x: auto; /* Allow horizontal scrolling */
        border: 1px solid #e9ecef;
        border-radius: 8px;
    }

    /* Page Header */
    .page-header[b-gbamx3lful] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
        padding-bottom: 1rem;
        margin-bottom: 1.5rem;
    }

    .page-title[b-gbamx3lful] {
        font-size: 1.5rem;
    }

        .page-title i[b-gbamx3lful] {
            font-size: 1.5rem;
        }

    .breadcrumb[b-gbamx3lful] {
        font-size: 0.8rem;
    }

    .add-new-btn[b-gbamx3lful] {
        width: 100%;
        justify-content: center;
        padding: 0.65rem 1.25rem;
        font-size: 0.9rem;
    }

    /* Statistics Cards */
    .dashboard-card[b-gbamx3lful] {
        padding: 1.25rem;
    }

    .card-icon[b-gbamx3lful] {
        width: 50px;
        height: 50px;
        font-size: 1.5rem;
    }

    .card-value[b-gbamx3lful] {
        font-size: 1.5rem;
    }

    .card-title[b-gbamx3lful] {
        font-size: 0.85rem;
    }

    .card-change[b-gbamx3lful] {
        font-size: 0.8rem;
    }

    /* Card Header */
    .card-header-custom[b-gbamx3lful] {
        padding-bottom: 1rem;
        margin-bottom: 1rem;
    }

    .card-title-custom[b-gbamx3lful] {
        font-size: 1.1rem;
    }

        .card-title-custom i[b-gbamx3lful] {
            font-size: 1.25rem;
        }

    .card-subtitle-custom[b-gbamx3lful] {
        font-size: 0.85rem;
    }

    /* Search and Filter Bar */
    .filter-section[b-gbamx3lful] {
        margin-bottom: 1rem;
    }

    .search-box input[b-gbamx3lful] {
        padding: 0.6rem 1rem 0.6rem 2.5rem;
        font-size: 0.9rem;
    }

    .search-box i[b-gbamx3lful] {
        font-size: 1rem;
    }

    /* Filter Buttons */
    .btn-filter[b-gbamx3lful],
    .btn-reset[b-gbamx3lful],
    .btn-secondary[b-gbamx3lful] {
        padding: 0.6rem 1rem;
        font-size: 0.85rem;
        white-space: nowrap;
    }

    /* Active Filters */
    .active-filters[b-gbamx3lful] {
        padding: 0.6rem 0.75rem;
        gap: 0.4rem;
    }

    .filter-label[b-gbamx3lful] {
        font-size: 0.8rem;
        width: 100%;
        margin-bottom: 0.25rem;
    }

    .filter-tag[b-gbamx3lful] {
        font-size: 0.75rem;
        padding: 0.35rem 0.65rem;
    }

    /* Table */
    .checks-table[b-gbamx3lful] {
        font-size: 0.8rem;
    }

        .checks-table thead th[b-gbamx3lful],
        .checks-table tbody td[b-gbamx3lful] {
            padding: 0.75rem 0.5rem;
        }

    .action-buttons[b-gbamx3lful] {
        flex-direction: column;
        gap: 0.25rem;
    }

    .table-select[b-gbamx3lful] {
        font-size: 0.8rem;
        padding: 0.35rem 0.5rem;
    }

    .btn-picker[b-gbamx3lful] {
        font-size: 0.8rem;
        padding: 0.45rem 0.65rem;
    }

        .btn-picker i:first-child[b-gbamx3lful] {
            font-size: 1rem;
        }

        .btn-picker i:last-child[b-gbamx3lful] {
            font-size: 0.85rem;
        }

    /* Expandable Details */
    .expanded-content[b-gbamx3lful] {
        padding: 1.25rem;
    }

    .section-title[b-gbamx3lful] {
        font-size: 0.95rem;
    }

    .detail-grid[b-gbamx3lful] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .detail-item[b-gbamx3lful] {
        padding: 0.75rem;
    }

        .detail-item label[b-gbamx3lful] {
            font-size: 0.8rem;
        }

        .detail-item span[b-gbamx3lful] {
            font-size: 0.9rem;
        }

    /* Pagination */
    .pagination-wrapper[b-gbamx3lful] {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
        margin-top: 1rem;
        padding-top: 1rem;
    }

    .showing-entries[b-gbamx3lful] {
        font-size: 0.85rem;
        text-align: center;
    }

    .pagination[b-gbamx3lful] {
        justify-content: center;
    }

    .page-link[b-gbamx3lful] {
        padding: 0.4rem 0.6rem;
        font-size: 0.85rem;
    }

    /* Modal */
    .modal-lg[b-gbamx3lful] {
        max-width: 100%;
        margin: 0.5rem;
    }

    .modal-header[b-gbamx3lful] {
        padding: 1.25rem;
    }

        .modal-header .modal-title[b-gbamx3lful] {
            font-size: 1.1rem;
        }

            .modal-header .modal-title i[b-gbamx3lful] {
                font-size: 1.25rem;
            }

    .modal-body[b-gbamx3lful] {
        padding: 1.25rem;
    }

    .modal-footer[b-gbamx3lful] {
        padding: 1rem;
        flex-wrap: wrap;
        gap: 0.5rem;
    }

        .modal-footer .btn[b-gbamx3lful] {
            flex: 1 1 auto;
            min-width: 120px;
        }

    .filter-modal-label[b-gbamx3lful] {
        font-size: 0.85rem;
    }

        .filter-modal-label i[b-gbamx3lful] {
            font-size: 1rem;
        }

    .form-select-custom[b-gbamx3lful],
    .form-control-custom[b-gbamx3lful] {
        font-size: 0.9rem;
        padding: 0.6rem 0.85rem;
    }
}

/* Small Mobile (576px and below) */
@media (max-width: 576px) {
    /* Prevent page overflow but allow table scrolling */
    body[b-gbamx3lful], html[b-gbamx3lful] {
        overflow-x: hidden;
        max-width: 100vw;
    }

    .main-content[b-gbamx3lful] {
        overflow-x: hidden;
        max-width: 100vw;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    /* Page Header */
    .page-title[b-gbamx3lful] {
        font-size: 1.25rem;
    }

        .page-title i[b-gbamx3lful] {
            font-size: 1.25rem;
        }

    .breadcrumb[b-gbamx3lful] {
        font-size: 0.75rem;
    }

    /* Statistics Cards */
    .dashboard-card[b-gbamx3lful] {
        padding: 1rem;
    }

    .card-icon[b-gbamx3lful] {
        width: 45px;
        height: 45px;
        font-size: 1.25rem;
    }

    .card-value[b-gbamx3lful] {
        font-size: 1.25rem;
    }

    /* Content Card */
    .content-card[b-gbamx3lful] {
        padding: 1rem;
        border-radius: 8px;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* Table remains scrollable */
    .checks-table-container[b-gbamx3lful] {
        overflow-x: auto;
        padding: 0.5rem;
        position: relative;
    }

    /* Mobile scroll hint */
    .desktop-view .checks-table-container[b-gbamx3lful]::after {
        content: 'Swipe \2192';
        position: sticky;
        right: 5px;
        top: 15px;
        float: right;
        background: rgba(139, 0, 0, 0.9);
        color: white;
        padding: 0.4rem 0.8rem;
        border-radius: 15px;
        font-size: 0.75rem;
        font-weight: 700;
        z-index: 10;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
        animation: bounceHorizontal 2s ease-in-out infinite;
    }

    .checks-table-modern[b-gbamx3lful] {
        min-width: 800px; /* Slightly smaller for mobile but still readable */
    }

    @@keyframes bounceHorizontal {
        0%[b-gbamx3lful], 100%[b-gbamx3lful] {
            transform: translateX(0);
            opacity: 0.8;
        }

        50%[b-gbamx3lful] {
            transform: translateX(-5px);
            opacity: 1;
        }
    }

    .card-header-custom[b-gbamx3lful] {
        padding-bottom: 0.75rem;
        margin-bottom: 0.75rem;
    }

    /* Search and Filter */
    .search-box input[b-gbamx3lful] {
        padding: 0.55rem 0.85rem 0.55rem 2.25rem;
        font-size: 0.85rem;
    }

    .search-box i[b-gbamx3lful] {
        font-size: 0.9rem;
        left: 0.85rem;
    }

    /* Button Groups - Stack vertically */
    .d-flex.gap-2.justify-content-end[b-gbamx3lful] {
        flex-direction: column !important;
    }

        .d-flex.gap-2.justify-content-end .btn[b-gbamx3lful] {
            width: 100%;
        }

    .btn-filter[b-gbamx3lful],
    .btn-reset[b-gbamx3lful],
    .btn-secondary[b-gbamx3lful] {
        padding: 0.55rem 0.85rem;
        font-size: 0.8rem;
        justify-content: center;
    }

    /* Active Filters */
    .active-filters[b-gbamx3lful] {
        padding: 0.5rem;
    }

    .filter-tag[b-gbamx3lful] {
        font-size: 0.7rem;
        padding: 0.3rem 0.55rem;
    }

    /* Mobile Cards */
    .check-card[b-gbamx3lful] {
        padding: 1rem;
        margin-bottom: 0.75rem;
    }

    .card-body-row[b-gbamx3lful] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .voucher-badge-mobile[b-gbamx3lful] {
        font-size: 0.8rem;
        padding: 0.35rem 0.7rem;
    }

    .date-mobile[b-gbamx3lful] {
        font-size: 0.8rem;
    }

    .info-content label[b-gbamx3lful] {
        font-size: 0.7rem;
    }

    .info-content span[b-gbamx3lful] {
        font-size: 0.85rem;
    }

    .amount-mobile[b-gbamx3lful] {
        font-size: 0.95rem;
    }

    .detail-row[b-gbamx3lful] {
        font-size: 0.8rem;
    }

    .btn-action-mobile[b-gbamx3lful] {
        padding: 0.55rem 0.85rem;
        font-size: 0.8rem;
    }

    .badge[b-gbamx3lful] {
        padding: 0.4rem 0.8rem;
        font-size: 0.75rem;
    }

    /* Pagination - Compact version */
    .pagination[b-gbamx3lful] {
        flex-wrap: wrap;
        gap: 0.25rem;
    }

    .page-item[b-gbamx3lful] {
        flex: 0 0 auto;
    }

    .page-link[b-gbamx3lful] {
        padding: 0.35rem 0.5rem;
        font-size: 0.8rem;
        min-width: 36px;
        text-align: center;
    }

    /* Hide some page numbers on very small screens */
    .pagination .page-item:not(.active):not(:first-child):not(:last-child):nth-child(n+4)[b-gbamx3lful] {
        display: none;
    }

    /* Modal adjustments */
    .modal-dialog[b-gbamx3lful] {
        margin: 0.25rem;
    }

    .modal-header[b-gbamx3lful] {
        padding: 1rem;
    }

        .modal-header .modal-title[b-gbamx3lful] {
            font-size: 1rem;
        }

    .modal-body[b-gbamx3lful] {
        padding: 1rem;
    }

    .modal-footer[b-gbamx3lful] {
        padding: 0.75rem;
    }

        .modal-footer .btn[b-gbamx3lful] {
            padding: 0.5rem 0.75rem;
            font-size: 0.8rem;
        }

    /* Expanded content */
    .expanded-content[b-gbamx3lful] {
        padding: 1rem;
    }

    .section-title[b-gbamx3lful] {
        font-size: 0.9rem;
    }

    .detail-item[b-gbamx3lful] {
        padding: 0.65rem;
    }

    .btn-picker-compact[b-gbamx3lful] {
        font-size: 0.8rem;
        padding: 0.45rem 0.75rem;
    }

    .status-select[b-gbamx3lful] {
        font-size: 0.8rem;
        padding: 0.4rem;
    }

    .particulars-content[b-gbamx3lful] {
        padding: 0.75rem;
        font-size: 0.85rem;
    }
}

/* Extra Small Mobile (400px and below) */
@media (max-width: 400px) {
    /* Prevent page overflow while keeping table scrollable */
    body[b-gbamx3lful], html[b-gbamx3lful], .main-content[b-gbamx3lful] {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }

    .page-title[b-gbamx3lful] {
        font-size: 1.1rem;
        word-wrap: break-word;
    }

    .card-value[b-gbamx3lful] {
        font-size: 1.1rem;
    }

    .content-card[b-gbamx3lful] {
        padding: 0.85rem;
        max-width: 100%;
        box-sizing: border-box;
    }

    .check-card[b-gbamx3lful] {
        padding: 0.85rem;
    }

    .filter-tag[b-gbamx3lful] {
        font-size: 0.65rem;
        padding: 0.25rem 0.5rem;
    }

    /* Simplify pagination on very small screens */
    .showing-entries[b-gbamx3lful] {
        font-size: 0.75rem;
    }

    .pagination .page-item:not(.active):not(:first-child):not(:last-child):nth-child(n+4)[b-gbamx3lful] {
        display: none;
    }

    /* Ensure all text elements can wrap */
    .voucher-badge[b-gbamx3lful], .voucher-badge-mobile[b-gbamx3lful], .ar-code[b-gbamx3lful] {
        word-wrap: break-word;
        white-space: normal;
        max-width: 100%;
    }

    /* Keep table scrollable with reduced minimum width */
    .checks-table-modern[b-gbamx3lful] {
        min-width: 700px;
    }

    .checks-table-container[b-gbamx3lful] {
        padding: 0.25rem;
    }
}

/* ==================== RESPONSIVE TABLE STYLES ==================== */

/* Desktop View */
.desktop-view[b-gbamx3lful] {
    display: block;
}

.mobile-view[b-gbamx3lful] {
    display: none;
}

/* Table Container with Overflow Handling */
.checks-table-container[b-gbamx3lful] {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
    margin-bottom: 1rem;
    position: relative;
    /* Ensure scrolling works on all devices */
    max-width: 100%;
    box-sizing: border-box;
}

    /* Scrollbar styling */
    .checks-table-container[b-gbamx3lful]::-webkit-scrollbar {
        height: 10px;
    }

    .checks-table-container[b-gbamx3lful]::-webkit-scrollbar-track {
        background: #f1f3f5;
        border-radius: 5px;
        margin: 0 10px;
    }

    .checks-table-container[b-gbamx3lful]::-webkit-scrollbar-thumb {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        border-radius: 5px;
        border: 2px solid #f1f3f5;
    }

        .checks-table-container[b-gbamx3lful]::-webkit-scrollbar-thumb:hover {
            background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
        }

/* Scroll shadow indicator - shows when there's more content to the right */
.checks-table-container[b-gbamx3lful] {
    background: linear-gradient(to right, white 30%, rgba(255,255,255,0)) 0 0, linear-gradient(to right, rgba(255,255,255,0), white 70%) 100% 0, radial-gradient(farthest-side at 0 50%, rgba(139,0,0,.2), rgba(0,0,0,0)) 0 0, radial-gradient(farthest-side at 100% 50%, rgba(139,0,0,.2), rgba(0,0,0,0)) 100% 0;
    background-repeat: no-repeat;
    background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%;
    background-attachment: local, local, scroll, scroll;
}

/* Modern Table Styles */
.checks-table-modern[b-gbamx3lful] {
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    min-width: 900px; /* Minimum width to ensure all columns are readable */
    table-layout: auto;
}

    .checks-table-modern thead[b-gbamx3lful] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
    }

        .checks-table-modern thead th[b-gbamx3lful] {
            padding: 1rem;
            font-weight: 600;
            font-size: 0.9rem;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            border: none;
        }

            .checks-table-modern thead th:first-child[b-gbamx3lful] {
                border-radius: 10px 0 0 0;
            }

            .checks-table-modern thead th:last-child[b-gbamx3lful] {
                border-radius: 0 10px 0 0;
            }

    .checks-table-modern tbody .main-row[b-gbamx3lful] {
        background: white;
        transition: all 0.3s ease;
        border-bottom: 1px solid #e9ecef;
    }

        .checks-table-modern tbody .main-row:hover[b-gbamx3lful] {
            background: #f8f9fa;
            transform: translateX(2px);
            box-shadow: 0 2px 8px rgba(139, 0, 0, 0.1);
        }

        .checks-table-modern tbody .main-row td[b-gbamx3lful] {
            padding: 1rem;
            vertical-align: middle;
            cursor: pointer;
            white-space: nowrap; /* Prevent text wrapping that could break layout */
        }

            /* Allow AR Code cell to wrap if needed */
            .checks-table-modern tbody .main-row td:nth-child(4)[b-gbamx3lful] {
                white-space: normal; /* AR Code can wrap */
                min-width: 150px;
            }

/* Expand Button */
.btn-expand[b-gbamx3lful] {
    background: none;
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: all 0.3s ease;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .btn-expand:hover[b-gbamx3lful] {
        background: rgba(139, 0, 0, 0.1);
    }

    .btn-expand i[b-gbamx3lful] {
        transition: transform 0.3s ease;
        font-size: 1rem;
    }

    .btn-expand.expanded i[b-gbamx3lful] {
        transform: rotate(90deg);
    }

/* Cell Styles */
.date-wrapper[b-gbamx3lful] {
    display: flex;
    align-items: center;
    font-size: 0.9rem;
}

.voucher-badge[b-gbamx3lful] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.85rem;
    display: inline-block;
    letter-spacing: 0.5px;
}

.payee-info[b-gbamx3lful] {
    display: flex;
    align-items: center;
}

.payee-name[b-gbamx3lful] {
    font-weight: 600;
    color: #2c3e50;
}

.amount-highlight[b-gbamx3lful] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
    background: linear-gradient(135deg, rgba(139, 0, 0, 0.05) 0%, rgba(212, 175, 55, 0.05) 100%);
    padding: 0.5rem 0.8rem;
    border-radius: 6px;
    display: inline-block;
}

/* Status Badges */
.badge[b-gbamx3lful] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: capitalize;
}

.badge-cash[b-gbamx3lful] {
    background: linear-gradient(135deg, #2E7D32 0%, #43A047 100%);
    color: #fff;
}

.badge-check[b-gbamx3lful] {
    background: linear-gradient(135deg, #1976D2 0%, #42A5F5 100%);
    color: #fff;
}

.badge-online[b-gbamx3lful] {
    background: linear-gradient(135deg, #6A1B9A 0%, #AB47BC 100%);
    color: #fff;
}

.badge-project[b-gbamx3lful] {
    background: linear-gradient(135deg, #1976D2 0%, #42A5F5 100%);
    color: #fff;
}

.badge-non-project[b-gbamx3lful] {
    background: linear-gradient(135deg, #6A1B9A 0%, #AB47BC 100%);
    color: #fff;
}

.badge-na[b-gbamx3lful] {
    background: #e9ecef;
    color: #6c757d;
}

/* Positive/Negative badges for text color only */
.positive[b-gbamx3lful] {
    color: #2E7D32;
}

.neutral[b-gbamx3lful] {
    color: #1976D2;
}

/* Action Icon Button */
.btn-action-icon[b-gbamx3lful] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

    .btn-action-icon:hover[b-gbamx3lful] {
        background: var(--primary-color);
        color: white;
        transform: scale(1.1);
    }

/* Expandable Row */
.expandable-row[b-gbamx3lful] {
    background: #f8f9fa;
    border-bottom: 2px solid var(--secondary-color);
}

    .expandable-row td[b-gbamx3lful] {
        padding: 0 !important;
    }

.expanded-content[b-gbamx3lful] {
    padding: 2rem;
    animation: slideDown 0.3s ease-out;
}

@@keyframes slideDown {
    from[b-gbamx3lful] {
        opacity: 0;
        transform: translateY(-10px);
    }

    to[b-gbamx3lful] {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Detail Sections */
.detail-section[b-gbamx3lful] {
    margin-bottom: 1.5rem;
}

    .detail-section:last-child[b-gbamx3lful] {
        margin-bottom: 0;
    }

.section-title[b-gbamx3lful] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--secondary-color);
    display: flex;
    align-items: center;
}

.detail-grid[b-gbamx3lful] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.detail-item[b-gbamx3lful] {
    background: white;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

    .detail-item:hover[b-gbamx3lful] {
        border-color: var(--secondary-color);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.2);
    }

    .detail-item.full-width[b-gbamx3lful] {
        grid-column: 1 / -1;
    }

    .detail-item label[b-gbamx3lful] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 0.85rem;
        color: #6c757d;
        font-weight: 600;
        margin-bottom: 0.5rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .detail-item span[b-gbamx3lful] {
        color: #2c3e50;
        font-weight: 600;
        font-size: 0.95rem;
    }

.check-number[b-gbamx3lful] {
    font-family: 'Courier New', monospace;
    background: #f8f9fa;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
}

.project-name[b-gbamx3lful] {
    color: var(--primary-color);
    font-weight: 700;
}

/* Compact Picker Buttons */
.btn-picker-compact[b-gbamx3lful] {
    width: 100%;
    padding: 0.5rem 1rem;
    border-radius: 6px;
    border: 2px solid #e9ecef;
    background: white;
    color: #6c757d;
    font-size: 0.85rem;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5rem;
}

    .btn-picker-compact.btn-picker-empty[b-gbamx3lful] {
        border-color: var(--primary-color);
        color: var(--primary-color);
        border-style: dashed;
    }

    .btn-picker-compact.btn-picker-filled[b-gbamx3lful] {
        background: linear-gradient(135deg, rgba(139, 0, 0, 0.05) 0%, rgba(212, 175, 55, 0.05) 100%);
        border-color: var(--secondary-color);
        color: var(--primary-color);
    }

    .btn-picker-compact:hover[b-gbamx3lful] {
        background: var(--primary-color);
        color: white;
        border-color: var(--primary-color);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
    }

/* Status Select */
.status-select[b-gbamx3lful] {
    border: 2px solid #e9ecef;
    border-radius: 6px;
    font-weight: 600;
    padding: 0.5rem;
    background: white;
}

/* Particulars */
.particulars-content[b-gbamx3lful] {
    background: white;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    color: #2c3e50;
    line-height: 1.6;
}

/* ==================== MOBILE CARD STYLES ==================== */

.check-card[b-gbamx3lful] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    cursor: pointer;
    border: 2px solid transparent;
}

    .check-card:hover[b-gbamx3lful] {
        border-color: var(--secondary-color);
        box-shadow: 0 4px 16px rgba(212, 175, 55, 0.3);
        transform: translateY(-2px);
    }

.card-header-row[b-gbamx3lful] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.voucher-info[b-gbamx3lful] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.voucher-badge-mobile[b-gbamx3lful] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.85rem;
    display: inline-block;
    letter-spacing: 0.5px;
}

.date-mobile[b-gbamx3lful] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #6c757d;
    font-size: 0.85rem;
}

.card-body-row[b-gbamx3lful] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

.info-group[b-gbamx3lful] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

    .info-group i[b-gbamx3lful] {
        color: var(--primary-color);
        font-size: 1.25rem;
        margin-top: 0.25rem;
    }

.info-content[b-gbamx3lful] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    .info-content label[b-gbamx3lful] {
        font-size: 0.75rem;
        color: #6c757d;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .info-content span[b-gbamx3lful] {
        font-size: 0.9rem;
        color: #2c3e50;
        font-weight: 600;
    }

.amount-mobile[b-gbamx3lful] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
}

.card-divider[b-gbamx3lful] {
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, var(--secondary-color) 50%, transparent 100%);
    margin: 1rem 0;
}

.card-details-grid[b-gbamx3lful] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.detail-row[b-gbamx3lful] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.85rem;
    color: #2c3e50;
}

    .detail-row i[b-gbamx3lful] {
        color: #6c757d;
        width: 20px;
        text-align: center;
    }

.card-actions[b-gbamx3lful] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.btn-action-mobile[b-gbamx3lful] {
    background: white;
    border: 2px solid var(--secondary-color);
    color: var(--primary-color);
    padding: 0.6rem 1rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
}

    .btn-action-mobile:hover[b-gbamx3lful] {
        background: var(--primary-color);
        color: white;
        border-color: var(--primary-color);
    }

    .btn-action-mobile i[b-gbamx3lful] {
        font-size: 1rem;
    }

/* ==================== RESPONSIVE BREAKPOINTS ==================== */

/* Switch to mobile card view on tablets and smaller */
@@media (max-width: 992px) {
    .desktop-view[b-gbamx3lful] {
        display: none !important;
    }

    .mobile-view[b-gbamx3lful] {
        display: block !important;
    }
}

/* Tablet and below - Ensure horizontal scroll */
@@media (max-width: 992px) {
    .checks-table-container[b-gbamx3lful] {
        overflow-x: auto;
        border: 1px solid #e9ecef;
        border-radius: 8px;
        background: white;
    }

    .checks-table-modern[b-gbamx3lful] {
        min-width: 900px; /* Ensure minimum width for readability */
    }
    /* Visual scroll indicator on right edge */
    .desktop-view .checks-table-container[b-gbamx3lful]::after {
        content: '\21C4'; /* Left-right arrow symbol */
        position: sticky;
        right: 0;
        top: 50%;
        float: right;
        transform: translateY(-50%);
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
        padding: 0.5rem 0.75rem;
        border-radius: 20px 0 0 20px;
        font-size: 1rem;
        font-weight: 700;
        z-index: 10;
        box-shadow: -2px 2px 8px rgba(139, 0, 0, 0.3);
        animation: pulseScroll 2s ease-in-out infinite;
        pointer-events: none;
    }

    @@keyframes pulseScroll {
        0%[b-gbamx3lful], 100%[b-gbamx3lful] {
            opacity: 0.6;
            transform: translateY(-50%) scale(0.95);
        }

        50%[b-gbamx3lful] {
            opacity: 1;
            transform: translateY(-50%) scale(1.05);
        }
    }
}

/* Small mobile adjustments for cards */
@@media (max-width: 576px) {
    .card-body-row[b-gbamx3lful] {
        grid-template-columns: 1fr;
    }

    .check-card[b-gbamx3lful] {
        padding: 1rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/AccountsPayable/APLedger.razor.rz.scp.css */
/* ==================== Page Header ==================== */
[b-3b4qe77nw8] .page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

[b-3b4qe77nw8] .page-title {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

[b-3b4qe77nw8] .page-title i {
    color: var(--secondary-color);
    font-size: 2rem;
}

[b-3b4qe77nw8] .breadcrumb {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

[b-3b4qe77nw8] .breadcrumb-item + .breadcrumb-item::before {
    color: #6c757d;
}

[b-3b4qe77nw8] .breadcrumb-item a {
    color: var(--primary-color);
    text-decoration: none;
}

[b-3b4qe77nw8] .breadcrumb-item a:hover {
    color: var(--secondary-color);
}

[b-3b4qe77nw8] .breadcrumb-item.active {
    color: #6c757d;
}

/* ==================== Content Card ==================== */
[b-3b4qe77nw8] .content-card {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

/* Card Header */
[b-3b4qe77nw8] .card-header-custom {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

[b-3b4qe77nw8] .card-title-custom {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

[b-3b4qe77nw8] .card-title-custom i {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

[b-3b4qe77nw8] .card-subtitle-custom {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== Form Controls ==================== */
[b-3b4qe77nw8] .form-label {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

[b-3b4qe77nw8] .form-label i {
    color: var(--secondary-color);
}

[b-3b4qe77nw8] .form-control-custom, [b-3b4qe77nw8] .form-select-custom {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

[b-3b4qe77nw8] .form-control-custom:focus, [b-3b4qe77nw8] .form-select-custom:focus {
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== Summary Cards ==================== */
[b-3b4qe77nw8] .summary-card {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1.5rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0, 0, 0, 0.05);
    min-height: 140px;
}

[b-3b4qe77nw8] .summary-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
}

[b-3b4qe77nw8] .summary-card .card-icon {
    width: 64px;
    height: 64px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    flex-shrink: 0;
}

[b-3b4qe77nw8] .summary-card .card-icon i {
    font-size: 1.75rem;
    color: var(--secondary-color);
}

[b-3b4qe77nw8] .summary-card .card-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0;
    overflow: hidden;
}

[b-3b4qe77nw8] .summary-card .card-title {
    font-size: 0.875rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-3b4qe77nw8] .summary-card .card-value {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--primary-color);
    line-height: 1.2;
    margin-bottom: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-3b4qe77nw8] .summary-card .card-subtitle {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 500;
    margin-bottom: 0;
    line-height: 1.3;
}

/* ==================== Search and Filter Section ==================== */
[b-3b4qe77nw8] .filter-section {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

[b-3b4qe77nw8] .search-box {
    position: relative;
    width: 100%;
}

[b-3b4qe77nw8] .search-box i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

[b-3b4qe77nw8] .search-box input {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

[b-3b4qe77nw8] .search-box input:focus {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

[b-3b4qe77nw8] .search-box input:disabled {
    background-color: #e9ecef;
    cursor: not-allowed;
}

/* ==================== Button Styles ==================== */
[b-3b4qe77nw8] .btn {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

[b-3b4qe77nw8] .btn-primary {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

[b-3b4qe77nw8] .btn-primary:hover {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

[b-3b4qe77nw8] .btn-secondary {
    background-color: #6c757d;
    border: none;
}

[b-3b4qe77nw8] .btn-secondary:hover {
    background-color: #5c636a;
    transform: translateY(-2px);
}

[b-3b4qe77nw8] .btn-filter,
[b-3b4qe77nw8] .btn-reset {
    border: none;
    cursor: pointer;
}

[b-3b4qe77nw8] .btn-filter {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

[b-3b4qe77nw8] .btn-filter:hover:not(:disabled) {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    color: white;
}

[b-3b4qe77nw8] .btn-reset {
    background: #6c757d;
    color: white;
}

[b-3b4qe77nw8] .btn-reset:hover:not(:disabled) {
    background: #5c636a;
    transform: translateY(-2px);
}

[b-3b4qe77nw8] .btn-filter:disabled,
[b-3b4qe77nw8] .btn-reset:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Active Filters Display */
[b-3b4qe77nw8] .active-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem;
    background: white;
    border-radius: 8px;
    border: 1px solid #dee2e6;
}

[b-3b4qe77nw8] .filter-label {
    font-weight: 600;
    color: #495057;
}

[b-3b4qe77nw8] .filter-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.75rem;
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
}

[b-3b4qe77nw8] .filter-tag i {
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.2s;
}

[b-3b4qe77nw8] .filter-tag i:hover {
    opacity: 1;
}

/* ==================== Table Styles ==================== */
[b-3b4qe77nw8] .ledger-table-container {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

[b-3b4qe77nw8] .ledger-table-modern {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

[b-3b4qe77nw8] .ledger-table-modern thead {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

[b-3b4qe77nw8] .ledger-table-modern thead th {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

[b-3b4qe77nw8] .ledger-table-modern thead th:first-child {
    border-top-left-radius: 12px;
}

[b-3b4qe77nw8] .ledger-table-modern thead th:last-child {
    border-top-right-radius: 12px;
}

[b-3b4qe77nw8] .ledger-table-modern tbody tr.main-row {
    background: white;
    transition: all 0.3s ease;
    border-bottom: 1px solid #e9ecef;
}

[b-3b4qe77nw8] .ledger-table-modern tbody tr.main-row:hover {
    background: #f8f9fa;
    transform: scale(1.001);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

[b-3b4qe77nw8] .ledger-table-modern tbody tr.main-row.has-balance {
    border-left: 4px solid var(--secondary-color);
}

[b-3b4qe77nw8] .ledger-table-modern tbody td {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
}

/* Expandable Button */
[b-3b4qe77nw8] .btn-expand {
    background: none;
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: all 0.3s ease;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-3b4qe77nw8] .btn-expand i {
    font-size: 1rem;
    transition: transform 0.3s ease;
}

[b-3b4qe77nw8] .btn-expand.expanded i {
    transform: rotate(90deg);
}

[b-3b4qe77nw8] .btn-expand:hover {
    background: rgba(139, 0, 0, 0.1);
}

/* Reference Code */
[b-3b4qe77nw8] .reference-code {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 0.95rem;
    font-family: 'Courier New', monospace;
}

/* Project and Agent Names */
[b-3b4qe77nw8] .project-name,
[b-3b4qe77nw8] .agent-name {
    font-weight: 500;
    color: #495057;
}

/* Date Display */
[b-3b4qe77nw8] .date-wrapper {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

[b-3b4qe77nw8] .date-wrapper i {
    font-size: 0.875rem;
}

/* Action Button */
[b-3b4qe77nw8] .btn-action-icon {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

[b-3b4qe77nw8] .btn-action-icon:hover {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

/* Amount Highlight */
[b-3b4qe77nw8] .amount-highlight {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1rem;
}

/* Balance Highlight */
[b-3b4qe77nw8] .balance-highlight {
    font-weight: 700;
    font-size: 1rem;
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
}

[b-3b4qe77nw8] .balance-highlight.has-balance {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
}

[b-3b4qe77nw8] .balance-highlight.no-balance {
    background: linear-gradient(135deg, #28a745 0%, #218838 100%);
    color: white;
}

/* ==================== Expandable Row Styles ==================== */
[b-3b4qe77nw8] .expandable-row {
    background: #f8f9fa;
}

[b-3b4qe77nw8] .expandable-row td {
    padding: 0 !important;
}

[b-3b4qe77nw8] .expanded-content {
    padding: 1.5rem;
    border-top: 2px solid var(--secondary-color);
}

[b-3b4qe77nw8] .detail-section {
    margin-bottom: 1.5rem;
}

[b-3b4qe77nw8] .detail-section:last-child {
    margin-bottom: 0;
}

[b-3b4qe77nw8] .section-title {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #dee2e6;
}

[b-3b4qe77nw8] .section-title i {
    color: var(--secondary-color);
}

[b-3b4qe77nw8] .detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

[b-3b4qe77nw8] .detail-item {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

[b-3b4qe77nw8] .detail-item label {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

[b-3b4qe77nw8] .detail-item label i {
    color: var(--secondary-color);
}

[b-3b4qe77nw8] .detail-item span {
    font-size: 0.95rem;
    color: #212529;
    font-weight: 500;
}

/* ==================== Mobile Card View ==================== */
[b-3b4qe77nw8] .ledger-cards-container {
    display: none;
}

[b-3b4qe77nw8] .ledger-card {
    background: white;
    border-radius: 12px;
    padding: 1rem;
    margin-bottom: 1rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    cursor: pointer;
    border-left: 4px solid transparent;
}

[b-3b4qe77nw8] .ledger-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

[b-3b4qe77nw8] .ledger-card.has-balance-card {
    border-left-color: var(--secondary-color);
}

[b-3b4qe77nw8] .card-header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #e9ecef;
}

[b-3b4qe77nw8] .project-info {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

[b-3b4qe77nw8] .project-name-mobile {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1rem;
}

[b-3b4qe77nw8] .date-mobile {
    font-size: 0.85rem;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

[b-3b4qe77nw8] .status-badge {
    padding: 0.35rem 0.85rem;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 700;
}

[b-3b4qe77nw8] .status-badge.pending {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
}

[b-3b4qe77nw8] .status-badge.paid {
    background: linear-gradient(135deg, #28a745 0%, #218838 100%);
    color: white;
}

[b-3b4qe77nw8] .card-body-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

[b-3b4qe77nw8] .info-group {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

[b-3b4qe77nw8] .info-group i {
    color: var(--secondary-color);
    font-size: 1.25rem;
    margin-top: 0.25rem;
}

[b-3b4qe77nw8] .info-content {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
}

[b-3b4qe77nw8] .info-content label {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

[b-3b4qe77nw8] .info-content span {
    font-size: 0.9rem;
    font-weight: 500;
    color: #212529;
}

[b-3b4qe77nw8] .card-divider {
    height: 1px;
    background: #e9ecef;
    margin: 1rem 0;
}

[b-3b4qe77nw8] .card-financial-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
}

[b-3b4qe77nw8] .financial-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    padding: 0.5rem;
    background: #f8f9fa;
    border-radius: 6px;
}

[b-3b4qe77nw8] .financial-item label {
    font-size: 0.7rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

[b-3b4qe77nw8] .amount-mobile,
[b-3b4qe77nw8] .payment-mobile,
[b-3b4qe77nw8] .balance-mobile {
    font-weight: 700;
    font-size: 0.9rem;
}

[b-3b4qe77nw8] .amount-mobile {
    color: var(--primary-color);
}

[b-3b4qe77nw8] .payment-mobile {
    color: #28a745;
}

[b-3b4qe77nw8] .balance-mobile.has-balance {
    color: var(--secondary-color);
}

[b-3b4qe77nw8] .balance-mobile.no-balance {
    color: #28a745;
}

/* ==================== Pagination Styles ==================== */
[b-3b4qe77nw8] .pagination-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
}

[b-3b4qe77nw8] .showing-entries {
    font-size: 0.9rem;
    color: #495057;
}

[b-3b4qe77nw8] .showing-entries span {
    font-weight: 600;
    color: var(--primary-color);
}

[b-3b4qe77nw8] .pagination {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

[b-3b4qe77nw8] .page-item {
    margin: 0;
}

[b-3b4qe77nw8] .page-link {
    padding: 0.5rem 0.75rem;
    border: 1px solid #dee2e6;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

[b-3b4qe77nw8] .page-link:hover:not(:disabled) {
    background: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

[b-3b4qe77nw8] .page-item.active .page-link {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

[b-3b4qe77nw8] .page-item.disabled .page-link {
    opacity: 0.5;
    cursor: not-allowed;
}

[b-3b4qe77nw8] .page-link:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ==================== Filter Modal Styles ==================== */
[b-3b4qe77nw8] .filter-modal-label {
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

[b-3b4qe77nw8] .filter-modal-label i {
    color: var(--secondary-color);
}

/* Modal Styles */
[b-3b4qe77nw8] .modal-content {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

[b-3b4qe77nw8] .modal-header {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

[b-3b4qe77nw8] .modal-body {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

[b-3b4qe77nw8] .modal-footer {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== Alert Styles ==================== */
[b-3b4qe77nw8] .alert {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
}

[b-3b4qe77nw8] .alert-info {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

[b-3b4qe77nw8] .alert-info i {
    color: var(--secondary-color);
}

/* ==================== Responsive Design ==================== */
@media (max-width: 1400px) {
    [b-3b4qe77nw8] .summary-card {
        gap: 1rem;
        padding: 1.25rem;
        min-height: 130px;
    }

    [b-3b4qe77nw8] .summary-card .card-value {
        font-size: 1.5rem;
    }

    [b-3b4qe77nw8] .summary-card .card-subtitle {
        font-size: 0.8rem;
    }
}

@media (max-width: 1024px) {
    [b-3b4qe77nw8] .summary-card {
        gap: 0.75rem;
        padding: 1rem;
        min-height: auto;
    }

    [b-3b4qe77nw8] .summary-card .card-icon {
        width: 56px;
        height: 56px;
    }

    [b-3b4qe77nw8] .summary-card .card-icon i {
        font-size: 1.5rem;
    }

    [b-3b4qe77nw8] .summary-card .card-value {
        font-size: 1.35rem;
    }

    [b-3b4qe77nw8] .summary-card .card-title {
        font-size: 0.8rem;
    }

    [b-3b4qe77nw8] .summary-card .card-subtitle {
        font-size: 0.75rem;
    }
}

@media (max-width: 768px) {
    [b-3b4qe77nw8] .page-title {
        font-size: 1.5rem;
    }

    [b-3b4qe77nw8] .content-card {
        padding: 1.5rem;
    }

    [b-3b4qe77nw8] .ledger-table-container.desktop-view {
        display: none;
    }

    [b-3b4qe77nw8] .ledger-cards-container.mobile-view {
        display: block;
    }

    [b-3b4qe77nw8] .pagination-wrapper {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }

    [b-3b4qe77nw8] .pagination {
        justify-content: center;
        flex-wrap: wrap;
    }

    [b-3b4qe77nw8] .filter-section {
        padding: 0.75rem;
    }

    [b-3b4qe77nw8] .btn-filter,
    [b-3b4qe77nw8] .btn-reset,
    [b-3b4qe77nw8] .btn-secondary {
        font-size: 0.85rem;
        padding: 0.4rem 0.8rem;
    }

    /* Mobile Summary Cards */
    [b-3b4qe77nw8] .summary-card {
        padding: 0.875rem;
        gap: 0.75rem;
        min-height: auto;
    }

    [b-3b4qe77nw8] .summary-card .card-icon {
        width: 48px;
        height: 48px;
        flex-shrink: 0;
    }

    [b-3b4qe77nw8] .summary-card .card-icon i {
        font-size: 1.25rem;
    }

    [b-3b4qe77nw8] .summary-card .card-content {
        gap: 0.25rem;
    }

    [b-3b4qe77nw8] .summary-card .card-title {
        font-size: 0.75rem;
        letter-spacing: 0.3px;
    }

    [b-3b4qe77nw8] .summary-card .card-value {
        font-size: 1.1rem;
        line-height: 1;
    }

    [b-3b4qe77nw8] .summary-card .card-subtitle {
        font-size: 0.7rem;
        line-height: 1.2;
    }

    /* Mobile Financial Grid */
    [b-3b4qe77nw8] .card-financial-grid {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }

    [b-3b4qe77nw8] .financial-item {
        flex-direction: row;
        justify-content: space-between;
    }
}

@media (min-width: 769px) {
    [b-3b4qe77nw8] .ledger-table-container.desktop-view {
        display: block;
    }

    [b-3b4qe77nw8] .ledger-cards-container.mobile-view {
        display: none;
    }
}

/* ==================== Extra Small Devices (Phones) ==================== */
@media (max-width: 480px) {
    [b-3b4qe77nw8] .summary-card {
        padding: 0.75rem;
        gap: 0.5rem;
        min-height: auto;
    }

    [b-3b4qe77nw8] .summary-card .card-icon {
        width: 40px;
        height: 40px;
    }

    [b-3b4qe77nw8] .summary-card .card-icon i {
        font-size: 1rem;
    }

    [b-3b4qe77nw8] .summary-card .card-content {
        gap: 0.15rem;
    }

    [b-3b4qe77nw8] .summary-card .card-title {
        font-size: 0.65rem;
    }

    [b-3b4qe77nw8] .summary-card .card-value {
        font-size: 0.95rem;
        line-height: 1;
    }

    [b-3b4qe77nw8] .summary-card .card-subtitle {
        font-size: 0.65rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/AccountsPayable/APPayment.razor.rz.scp.css */
/* Content Card */
.content-card[b-767ri1ui2f] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Card Header */
.card-header-custom[b-767ri1ui2f] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-767ri1ui2f] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-767ri1ui2f] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-767ri1ui2f] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Form Controls */
.form-label[b-767ri1ui2f] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

    .form-label i[b-767ri1ui2f] {
        color: var(--secondary-color);
    }

.form-control-custom[b-767ri1ui2f], .form-select-custom[b-767ri1ui2f] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control-custom:focus[b-767ri1ui2f], .form-select-custom:focus[b-767ri1ui2f] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Section Divider */
.section-divider[b-767ri1ui2f] {
    margin: 2rem 0 1.5rem;
    padding-top: 1.5rem;
    border-top: 2px dashed #dee2e6;
}

.section-title[b-767ri1ui2f] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
}

    .section-title i[b-767ri1ui2f] {
        color: var(--secondary-color);
    }

/* Totals Display */
.totals-display[b-767ri1ui2f] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid var(--secondary-color);
    border-radius: 12px;
    padding: 1.25rem;
    margin-top: 1.85rem;
}

.total-item[b-767ri1ui2f] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
}

    .total-item.balance[b-767ri1ui2f] {
        border-top: 2px solid var(--primary-color);
        padding-top: 1rem;
        margin-top: 0.5rem;
    }

.total-label[b-767ri1ui2f] {
    font-weight: 600;
    color: #495057;
    font-size: 0.95rem;
}

.total-value[b-767ri1ui2f] {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--primary-color);
}

/* Sales Reference Panel */
.sales-reference-panel[b-767ri1ui2f] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid rgba(212, 175, 55, 0.4);
    border-left: 4px solid var(--secondary-color);
    border-radius: 10px;
    padding: 1.25rem 1.5rem;
}

.sales-ref-label[b-767ri1ui2f] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--primary-color);
    margin-bottom: 0.6rem;
}

    .sales-ref-label i[b-767ri1ui2f] {
        color: var(--secondary-color);
        font-size: 1.1rem;
    }

.sales-ref-input[b-767ri1ui2f] {
    font-weight: 600;
    background: white !important;
}


.btn-search-ref[b-767ri1ui2f] {
    background: var(--primary-color);
    color: white;
    border: none;
    border-radius: 8px;
    padding: 0 1.25rem;
    font-weight: 600;
    font-size: 0.9rem;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    transition: all 0.2s ease;
}

    .btn-search-ref:hover[b-767ri1ui2f] {
        background: var(--primary-color);
        opacity: 0.85;
        color: white;
        transform: translateY(-1px);
    }

/* Action Buttons */
.action-buttons-container[b-767ri1ui2f] {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 2px solid #f1f3f5;
}

.btn[b-767ri1ui2f] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-767ri1ui2f] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

    .btn-primary:hover[b-767ri1ui2f] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.btn-secondary[b-767ri1ui2f] {
    background-color: #6c757d;
    border: none;
}

    .btn-secondary:hover[b-767ri1ui2f] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

.btn-warning[b-767ri1ui2f] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #495057;
    border: none;
}

    .btn-warning:hover[b-767ri1ui2f] {
        background: linear-gradient(135deg, #e0a800 0%, #ffc107 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(255, 193, 7, 0.4);
        color: #495057;
    }

.btn-info[b-767ri1ui2f] {
    background: linear-gradient(135deg, #0dcaf0 0%, #0aa2c0 100%);
    color: white;
    border: none;
}

    .btn-info:hover[b-767ri1ui2f] {
        background: linear-gradient(135deg, #0aa2c0 0%, #0dcaf0 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(13, 202, 240, 0.4);
        color: white;
    }

/* Page Header */
.page-header[b-767ri1ui2f] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-767ri1ui2f] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-767ri1ui2f] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-767ri1ui2f] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-767ri1ui2f]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-767ri1ui2f] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-767ri1ui2f] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-767ri1ui2f] {
    color: #6c757d;
}

/* Alert Styles */
.alert[b-767ri1ui2f] {
    border-radius: 8px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    border: 2px solid;
}

.alert-info[b-767ri1ui2f] {
    background: linear-gradient(135deg, #e7f3ff 0%, #cce5ff 100%);
    border-color: #b3d9ff;
    color: #004085;
}

    .alert-info i[b-767ri1ui2f] {
        color: #0066cc;
    }

/* Print Voucher Styles */
.print-voucher[b-767ri1ui2f] {
    padding: 40px;
    background: #e8f0f8;
    font-family: Arial, sans-serif;
}

.voucher-header[b-767ri1ui2f] {
    text-align: center;
    margin-bottom: 10px;
}

.company-name[b-767ri1ui2f] {
    font-size: 24px;
    font-weight: bold;
    margin: 0;
    color: #000;
}

.company-address[b-767ri1ui2f] {
    font-size: 16px;
    margin: 5px 0 0;
    color: #000;
}

.document-title[b-767ri1ui2f] {
    text-align: center;
    margin: 20px 0;
}

    .document-title h4[b-767ri1ui2f] {
        font-size: 20px;
        font-weight: bold;
        margin: 0;
        color: #000;
    }

.voucher-divider[b-767ri1ui2f] {
    border: none;
    border-top: 2px solid #000;
    margin: 20px 0;
}

.voucher-details[b-767ri1ui2f] {
    margin: 25px 0;
}

.detail-row[b-767ri1ui2f] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
}

.detail-item[b-767ri1ui2f] {
    flex: 1;
    display: flex;
    gap: 10px;
}

    .detail-item.full-width[b-767ri1ui2f] {
        flex: 2;
    }

.detail-label[b-767ri1ui2f] {
    font-weight: bold;
    min-width: 80px;
    color: #000;
}

.detail-value[b-767ri1ui2f] {
    color: #000;
}

.particulars-section[b-767ri1ui2f] {
    margin: 25px 0;
}

.section-heading[b-767ri1ui2f] {
    font-weight: bold;
    margin-bottom: 15px;
    color: #000;
    font-size: 16px;
}

.particulars-table[b-767ri1ui2f] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
    background: white;
}

    .particulars-table th[b-767ri1ui2f],
    .particulars-table td[b-767ri1ui2f] {
        border: 1px solid #000;
        padding: 10px;
        text-align: left;
        color: #000;
    }

    .particulars-table th[b-767ri1ui2f] {
        background-color: #d0d0d0;
        font-weight: bold;
    }

    .particulars-table .text-end[b-767ri1ui2f] {
        text-align: right;
    }

.signatures-section[b-767ri1ui2f] {
    display: flex;
    justify-content: space-between;
    margin-top: 50px;
    gap: 20px;
}

.signature-box[b-767ri1ui2f] {
    flex: 1;
    text-align: center;
}

.signature-label[b-767ri1ui2f] {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 40px;
    color: #000;
}

.signature-line[b-767ri1ui2f] {
    margin: 0 10px 8px;
}

.signature-name[b-767ri1ui2f] {
    font-size: 13px;
    color: #000;
}

.signature-subtitle[b-767ri1ui2f] {
    font-size: 11px;
    font-style: italic;
    margin-top: 5px;
    color: #000;
}

/* Modal Styles */
.modal-content[b-767ri1ui2f] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-xl[b-767ri1ui2f] {
    max-width: 900px;
}

.modal-header[b-767ri1ui2f] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
    background: white;
}

.modal-title[b-767ri1ui2f] {
    color: var(--primary-color);
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .modal-title i[b-767ri1ui2f] {
        color: var(--secondary-color);
    }

.modal-body[b-767ri1ui2f] {
    padding: 0;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-767ri1ui2f] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Toast */
.toast[b-767ri1ui2f] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Accounting Entries Styles */
.accounting-entries-container[b-767ri1ui2f] {
    background: white;
    border: 2px solid #e9ecef;
    border-radius: 12px;
    padding: 1.25rem;
    height: 100%;
    transition: all 0.3s ease;
}

    .accounting-entries-container:hover[b-767ri1ui2f] {
        border-color: var(--secondary-color);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.1);
    }

.entries-header[b-767ri1ui2f] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #f1f3f5;
}

.entries-title[b-767ri1ui2f] {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
}

    .entries-title i[b-767ri1ui2f] {
        color: var(--secondary-color);
    }

.btn-add-entry[b-767ri1ui2f] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.4rem 0.8rem;
    font-size: 0.85rem;
    font-weight: 600;
    border-radius: 6px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

    .btn-add-entry:hover[b-767ri1ui2f] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-1px);
        box-shadow: 0 3px 8px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.entry-row[b-767ri1ui2f] {
    margin-bottom: 0.75rem;
}

.entry-fields[b-767ri1ui2f] {
    display: grid;
    grid-template-columns: 2fr 1fr auto;
    gap: 0.5rem;
    align-items: start;
}

.entry-account input[b-767ri1ui2f],
.entry-amount input[b-767ri1ui2f] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.5rem;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

    .entry-account input:focus[b-767ri1ui2f],
    .entry-amount input:focus[b-767ri1ui2f] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.15rem rgba(212, 175, 55, 0.15);
        outline: none;
    }

.btn-remove-entry[b-767ri1ui2f] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
    border: none;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    transition: all 0.3s ease;
    font-size: 0.9rem;
}

    .btn-remove-entry:hover[b-767ri1ui2f] {
        background: linear-gradient(135deg, #c82333 0%, #bd2130 100%);
        transform: scale(1.05);
        box-shadow: 0 2px 6px rgba(220, 53, 69, 0.4);
    }

.empty-entries-message[b-767ri1ui2f] {
    text-align: center;
    padding: 2rem 1rem;
    color: #6c757d;
    font-size: 0.9rem;
    font-style: italic;
}

.entries-total[b-767ri1ui2f] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 2px solid var(--primary-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .entries-total .total-label[b-767ri1ui2f] {
        font-weight: 700;
        color: #495057;
        font-size: 1rem;
    }

    .entries-total .total-value[b-767ri1ui2f] {
        font-weight: 700;
        font-size: 1.15rem;
        color: var(--primary-color);
    }

/* Validation Summary */
.validation-summary[b-767ri1ui2f] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid #dee2e6;
    border-radius: 12px;
    padding: 1.25rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    transition: all 0.3s ease;
}

    .validation-summary.balanced[b-767ri1ui2f] {
        border-color: #28a745;
        background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
    }

    .validation-summary.unbalanced[b-767ri1ui2f] {
        border-color: #dc3545;
        background: linear-gradient(135deg, #f8d7da 0%, #f5c6cb 100%);
    }

    .validation-summary.warning[b-767ri1ui2f] {
        border-color: #ffc107;
        background: linear-gradient(135deg, #fff3cd 0%, #ffeaa7 100%);
    }

.validation-item[b-767ri1ui2f] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    .validation-item.validation-status[b-767ri1ui2f] {
        grid-column: 1 / -1;
        border-top: 2px solid rgba(0,0,0,0.1);
        padding-top: 1rem;
        margin-top: 0.5rem;
    }

.validation-label[b-767ri1ui2f] {
    font-weight: 600;
    color: #495057;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.validation-value[b-767ri1ui2f] {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--primary-color);
}

    .validation-item.validation-status .validation-value[b-767ri1ui2f] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 1rem;
    }

/* Print Preview Updates */
.particulars-section p[b-767ri1ui2f] {
    margin: 0.5rem 0;
    font-size: 14px;
}

    .particulars-section p strong[b-767ri1ui2f] {
        color: #000;
        font-weight: bold;
    }

.total-row[b-767ri1ui2f] {
    background-color: #f0f0f0;
    font-weight: bold;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-title[b-767ri1ui2f] {
        font-size: 1.5rem;
    }

        .page-title i[b-767ri1ui2f] {
            font-size: 1.5rem;
        }

    .content-card[b-767ri1ui2f] {
        padding: 1.5rem;
    }

    .action-buttons-container[b-767ri1ui2f] {
        flex-direction: column;
    }

        .action-buttons-container .btn[b-767ri1ui2f] {
            width: 100%;
        }

    .totals-display[b-767ri1ui2f] {
        margin-top: 0;
    }

    .signatures-section[b-767ri1ui2f] {
        flex-wrap: wrap;
        gap: 30px;
    }

    .signature-box[b-767ri1ui2f] {
        flex: 0 0 calc(50% - 15px);
    }

    .print-voucher[b-767ri1ui2f] {
        padding: 20px;
    }

    .detail-row[b-767ri1ui2f] {
        flex-direction: column;
        gap: 8px;
    }

    .entry-fields[b-767ri1ui2f] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .btn-remove-entry[b-767ri1ui2f] {
        width: 100%;
    }

    .validation-summary[b-767ri1ui2f] {
        grid-template-columns: 1fr;
    }

    .entries-header[b-767ri1ui2f] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .btn-add-entry[b-767ri1ui2f] {
        width: 100%;
        justify-content: center;
    }
}

@media print {
    body *[b-767ri1ui2f] {
        visibility: hidden;
    }

    .print-voucher[b-767ri1ui2f], .print-voucher *[b-767ri1ui2f] {
        visibility: visible;
    }

    .print-voucher[b-767ri1ui2f] {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        background: white;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/AccountsPayable/PrintAPPayment.razor.rz.scp.css */
/* Add New Button */
.add-new-btn[b-8vo7mjly8e] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-8vo7mjly8e] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .add-new-btn i[b-8vo7mjly8e] {
        font-size: 1.1rem;
    }
/* Search Section Styles */
.search-section[b-8vo7mjly8e] {
    background: white;
    padding: 1.5rem;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.08);
    margin-bottom: 1.5rem;
}

    .search-section h5[b-8vo7mjly8e] {
        color: var(--primary-color);
        margin-bottom: 1rem;
        font-weight: 600;
    }

.search-btn[b-8vo7mjly8e] {
    background-color: var(--primary-color);
    color: white;
    border: none;
    padding: 0.5rem 1.5rem;
    border-radius: 6px;
    transition: all 0.3s ease;
}

    .search-btn:hover[b-8vo7mjly8e] {
        background-color: var(--accent-color);
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(139, 0, 0, 0.3);
    }

.reset-btn[b-8vo7mjly8e] {
    background-color: #6c757d;
    color: white;
    border: none;
    padding: 0.5rem 1.5rem;
    border-radius: 6px;
    transition: all 0.3s ease;
}

    .reset-btn:hover[b-8vo7mjly8e] {
        background-color: #5a6268;
    }

/* Table Styles */
.voucher-table-section[b-8vo7mjly8e] {
    background: white;
    padding: 1.5rem;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.08);
}

.table-responsive[b-8vo7mjly8e] {
    border-radius: 8px;
    /*overflow: hidden;*/
}

.voucher-table[b-8vo7mjly8e] {
    margin-bottom: 0;
}

    .voucher-table thead[b-8vo7mjly8e] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
    }

        .voucher-table thead th[b-8vo7mjly8e] {
            font-weight: 600;
            padding: 1rem;
            border: none;
            white-space: nowrap;
        }

    .voucher-table tbody tr[b-8vo7mjly8e] {
        transition: all 0.2s ease;
    }

        .voucher-table tbody tr:hover[b-8vo7mjly8e] {
            background-color: rgba(139, 0, 0, 0.05);
        }

    .voucher-table tbody td[b-8vo7mjly8e] {
        padding: 0.875rem 1rem;
        vertical-align: middle;
    }

.status-badge[b-8vo7mjly8e] {
    padding: 0.375rem 0.75rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    display: inline-block;
}

.status-completed[b-8vo7mjly8e] {
    background-color: #d4edda;
    color: #155724;
}

.status-pending[b-8vo7mjly8e] {
    background-color: #fff3cd;
    color: #856404;
}

.status-progress[b-8vo7mjly8e] {
    background-color: #d1ecf1;
    color: #0c5460;
}

.status-cancelled[b-8vo7mjly8e] {
    background-color: #f8d7da;
    color: #721c24;
}

.preview-btn[b-8vo7mjly8e] {
    background-color: var(--secondary-color);
    color: var(--primary-color);
    border: none;
    padding: 0.375rem 0.875rem;
    border-radius: 5px;
    font-size: 0.85rem;
    font-weight: 600;
    transition: all 0.2s ease;
    cursor: pointer;
}

    .preview-btn:hover[b-8vo7mjly8e] {
        background-color: var(--secondary-color);
        transform: translateY(-2px);
        box-shadow: 0 3px 6px rgba(212, 175, 55, 0.3);
    }

/* Modal Styles */
.modal-header[b-8vo7mjly8e] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
}

    .modal-header .btn-close[b-8vo7mjly8e] {
        filter: brightness(0) invert(1);
    }

.modal-xl[b-8vo7mjly8e] {
    max-width: 1000px;
}

/* Voucher Print Preview */
.voucher-preview[b-8vo7mjly8e] {
    width: 8.5in;
    min-height: 11in;
    margin: 0 auto;
    padding: 0.75in;
    background: white;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    position: relative;
}

.voucher-header[b-8vo7mjly8e] {
    text-align: center;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 3px solid var(--primary-color);
}

    .voucher-header h2[b-8vo7mjly8e] {
        color: var(--primary-color);
        font-weight: 700;
        margin-bottom: 0.5rem;
        font-size: 1.75rem;
    }

    .voucher-header .voucher-number[b-8vo7mjly8e] {
        color: var(--secondary-color);
        font-weight: 600;
        font-size: 1.1rem;
    }

.voucher-info-grid[b-8vo7mjly8e] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.voucher-info-item[b-8vo7mjly8e] {
    display: flex;
    padding: 0.5rem 0;
    border-bottom: 1px solid #e9ecef;
}

.voucher-info-label[b-8vo7mjly8e] {
    font-weight: 600;
    color: var(--primary-color);
    width: 120px;
    flex-shrink: 0;
}

.voucher-info-value[b-8vo7mjly8e] {
    color: #333;
    flex: 1;
}

.voucher-details-section[b-8vo7mjly8e] {
    margin: 1.5rem 0;
}

    .voucher-details-section h4[b-8vo7mjly8e] {
        color: var(--primary-color);
        font-size: 1.1rem;
        font-weight: 600;
        margin-bottom: 1rem;
        padding-bottom: 0.5rem;
        border-bottom: 2px solid var(--secondary-color);
    }

.amount-section[b-8vo7mjly8e] {
    background: #f8f9fa;
    padding: 1rem;
    border-radius: 6px;
    margin: 1rem 0;
    border-left: 4px solid var(--secondary-color);
}

    .amount-section .amount-label[b-8vo7mjly8e] {
        font-weight: 600;
        color: var(--primary-color);
        font-size: 0.95rem;
    }

    .amount-section .amount-value[b-8vo7mjly8e] {
        font-size: 1.5rem;
        font-weight: 700;
        color: var(--primary-color);
        margin-top: 0.25rem;
    }

.voucher-footer[b-8vo7mjly8e] {
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 2px solid #dee2e6;
}

.signature-section[b-8vo7mjly8e] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    margin-top: 1.5rem;
}

.signature-block[b-8vo7mjly8e] {
    text-align: center;
}

.signature-line[b-8vo7mjly8e] {
    border-top: 2px solid #333;
    margin-top: 3rem;
    padding-top: 0.5rem;
    font-weight: 600;
    color: #333;
}

.signature-title[b-8vo7mjly8e] {
    font-size: 0.85rem;
    color: #6c757d;
    margin-top: 0.25rem;
}

.print-btn[b-8vo7mjly8e] {
    background-color: var(--primary-color);
    color: white;
    border: none;
    padding: 0.5rem 1.5rem;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
}

    .print-btn:hover[b-8vo7mjly8e] {
        background-color: var(--accent-color);
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(139, 0, 0, 0.3);
    }


/* Print Voucher Styles */
.print-voucher[b-8vo7mjly8e] {
    padding: 40px;
    background: #e8f0f8;
    font-family: Arial, sans-serif;
}

.voucher-header[b-8vo7mjly8e] {
    text-align: center;
    margin-bottom: 10px;
}

.company-name[b-8vo7mjly8e] {
    font-size: 24px;
    font-weight: bold;
    margin: 0;
    color: #000;
}

.company-address[b-8vo7mjly8e] {
    font-size: 16px;
    margin: 5px 0 0;
    color: #000;
}

.document-title[b-8vo7mjly8e] {
    text-align: center;
    margin: 20px 0;
}

    .document-title h4[b-8vo7mjly8e] {
        font-size: 20px;
        font-weight: bold;
        margin: 0;
        color: #000;
    }

.voucher-divider[b-8vo7mjly8e] {
    border: none;
    border-top: 2px solid #000;
    margin: 20px 0;
}

.voucher-details[b-8vo7mjly8e] {
    margin: 25px 0;
}

.detail-row[b-8vo7mjly8e] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
}

.detail-item[b-8vo7mjly8e] {
    flex: 1;
    display: flex;
    gap: 10px;
}

    .detail-item.full-width[b-8vo7mjly8e] {
        flex: 2;
    }

.detail-label[b-8vo7mjly8e] {
    font-weight: bold;
    min-width: 80px;
    color: #000;
}

.detail-value[b-8vo7mjly8e] {
    color: #000;
}

.particulars-section[b-8vo7mjly8e] {
    margin: 25px 0;
}

.section-heading[b-8vo7mjly8e] {
    font-weight: bold;
    margin-bottom: 15px;
    color: #000;
    font-size: 16px;
}

.particulars-table[b-8vo7mjly8e] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
    background: white;
}

    .particulars-table th[b-8vo7mjly8e],
    .particulars-table td[b-8vo7mjly8e] {
        border: 1px solid #000;
        padding: 10px;
        text-align: left;
        color: #000;
    }

    .particulars-table th[b-8vo7mjly8e] {
        background-color: #d0d0d0;
        font-weight: bold;
    }

    .particulars-table .text-end[b-8vo7mjly8e] {
        text-align: right;
    }

.signatures-section[b-8vo7mjly8e] {
    display: flex;
    justify-content: space-between;
    margin-top: 50px;
    gap: 20px;
}

.signature-box[b-8vo7mjly8e] {
    flex: 1;
    text-align: center;
}

.signature-label[b-8vo7mjly8e] {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 40px;
    color: #000;
}

.signature-line[b-8vo7mjly8e] {
    /*border-bottom: 2px solid #000;*/
    margin: 0 10px 8px;
}

.signature-name[b-8vo7mjly8e] {
    font-size: 13px;
    color: #000;
}

.signature-subtitle[b-8vo7mjly8e] {
    font-size: 11px;
    font-style: italic;
    margin-top: 5px;
    color: #000;
}

/* Modal Styles */
.modal-content[b-8vo7mjly8e] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-xl[b-8vo7mjly8e] {
    max-width: 900px;
}

.modal-header[b-8vo7mjly8e] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-8vo7mjly8e] {
    padding: 0;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-8vo7mjly8e] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-title[b-8vo7mjly8e] {
        font-size: 1.5rem;
    }

    .content-card[b-8vo7mjly8e] {
        padding: 1.5rem;
    }

    .action-buttons-container[b-8vo7mjly8e] {
        flex-direction: column;
    }

        .action-buttons-container .btn[b-8vo7mjly8e] {
            width: 100%;
        }

    .totals-display[b-8vo7mjly8e] {
        margin-top: 0;
    }

    .signatures-section[b-8vo7mjly8e] {
        flex-wrap: wrap;
        gap: 30px;
    }

    .signature-box[b-8vo7mjly8e] {
        flex: 0 0 calc(50% - 15px);
    }

    .print-voucher[b-8vo7mjly8e] {
        padding: 20px;
    }

    .detail-row[b-8vo7mjly8e] {
        flex-direction: column;
        gap: 8px;
    }
}


/* Print Styles */
@media print {
    body *[b-8vo7mjly8e] {
        visibility: hidden;
    }

    .print-voucher[b-8vo7mjly8e], .print-voucher *[b-8vo7mjly8e] {
        visibility: visible;
    }

    .print-voucher[b-8vo7mjly8e] {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        background: white;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/AccoutsReceivable/AccountReceivable.razor.rz.scp.css */
/* Content Card */
.content-card[b-tqe2l9et4s] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Card Header */
.card-header-custom[b-tqe2l9et4s] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-tqe2l9et4s] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-tqe2l9et4s] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-tqe2l9et4s] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Page Header */
.page-header[b-tqe2l9et4s] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-tqe2l9et4s] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-tqe2l9et4s] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-tqe2l9et4s] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-tqe2l9et4s]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-tqe2l9et4s] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-tqe2l9et4s] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-tqe2l9et4s] {
    color: #6c757d;
}

/* Summary Cards */
[b-tqe2l9et4s] .summary-card {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1.5rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
}

[b-tqe2l9et4s] .summary-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

[b-tqe2l9et4s] .summary-card .card-icon {
    width: 64px;
    height: 64px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
    flex-shrink: 0;
}

[b-tqe2l9et4s] .summary-card .card-icon i {
    font-size: 1.75rem;
    color: white;
}

[b-tqe2l9et4s] .summary-card .card-content {
    flex: 1;
}

[b-tqe2l9et4s] .summary-card .card-title {
    font-size: 0.875rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

[b-tqe2l9et4s] .summary-card .card-value {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--primary-color);
    line-height: 1.2;
    margin-bottom: 0.25rem;
}

[b-tqe2l9et4s] .summary-card .card-subtitle {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 500;
}

/* Filter Section */
[b-tqe2l9et4s] .filter-section {
    margin-bottom: 1.5rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 12px;
    border: 2px solid #dee2e6;
}

[b-tqe2l9et4s] .search-box {
    position: relative;
    width: 100%;
}

[b-tqe2l9et4s] .search-box i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--secondary-color);
    pointer-events: none;
}

[b-tqe2l9et4s] .search-box input {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

[b-tqe2l9et4s] .search-box input:focus {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

[b-tqe2l9et4s] .search-box input:disabled {
    background-color: #f8f9fa;
    cursor: not-allowed;
}

/* Buttons */
.btn[b-tqe2l9et4s] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

[b-tqe2l9et4s] .btn-filter {
    background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
    color: white;
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
}

[b-tqe2l9et4s] .btn-filter:hover:not(:disabled) {
    background: linear-gradient(135deg, #a00000 0%, var(--primary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.2);
    color: white;
}

.btn-secondary[b-tqe2l9et4s] {
    background-color: #6c757d;
    border: none;
}

    .btn-secondary:hover[b-tqe2l9et4s] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

[b-tqe2l9et4s] .btn-reset {
    background-color: #6c757d;
    color: white;
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
}

[b-tqe2l9et4s] .btn-reset:hover:not(:disabled) {
    background-color: #5c636a;
    transform: translateY(-2px);
    color: white;
}

[b-tqe2l9et4s] .btn-filter:disabled,
[b-tqe2l9et4s] .btn-reset:disabled,
.btn-secondary:disabled[b-tqe2l9et4s] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

/* Active Filters */
[b-tqe2l9et4s] .active-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    background: white;
    border-radius: 8px;
    border: 2px solid #e9ecef;
}

[b-tqe2l9et4s] .filter-label {
    font-weight: 600;
    color: #495057;
    font-size: 0.9rem;
}

[b-tqe2l9et4s] .filter-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.85rem;
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
}

[b-tqe2l9et4s] .filter-tag i {
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.2s;
}

[b-tqe2l9et4s] .filter-tag i:hover {
    opacity: 1;
}

/* Table Styles */
[b-tqe2l9et4s] .ar-table-container {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

[b-tqe2l9et4s] .ar-table-modern {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

[b-tqe2l9et4s] .ar-table-modern thead {
    background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
    color: white;
}

[b-tqe2l9et4s] .ar-table-modern thead th {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

[b-tqe2l9et4s] .ar-table-modern thead th:first-child {
    border-top-left-radius: 12px;
}

[b-tqe2l9et4s] .ar-table-modern thead th:last-child {
    border-top-right-radius: 12px;
}

[b-tqe2l9et4s] .ar-table-modern tbody tr.main-row {
    background: white;
    transition: all 0.2s;
    border-bottom: 1px solid #e9ecef;
}

[b-tqe2l9et4s] .ar-table-modern tbody tr.main-row:hover {
    background: #f8f9fa;
    transform: scale(1.001);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

[b-tqe2l9et4s] .ar-table-modern tbody td {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
}

/* Expandable Button */
[b-tqe2l9et4s] .btn-expand {
    background: none;
    border: none;
    padding: 0.25rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: transform 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-tqe2l9et4s] .btn-expand i {
    font-size: 1rem;
    transition: transform 0.2s;
}

[b-tqe2l9et4s] .btn-expand.expanded i {
    transform: rotate(90deg);
}

[b-tqe2l9et4s] .btn-expand:hover {
    background: rgba(212, 175, 55, 0.15);
    border-radius: 4px;
}

/* AR Code Styling */
[b-tqe2l9et4s] .ar-code {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 0.95rem;
    font-family: 'Courier New', monospace;
}

[b-tqe2l9et4s] .ar-code-link {
    text-decoration: none;
    cursor: pointer;
    display: inline-block;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    transition: all 0.2s;
}

[b-tqe2l9et4s] .ar-code-link:hover {
    background: rgba(212, 175, 55, 0.15);
    text-decoration: underline;
    transform: translateX(2px);
}

/* Names and Amounts */
[b-tqe2l9et4s] .accountable-name,
[b-tqe2l9et4s] .agent-name {
    font-weight: 500;
    color: #495057;
}

[b-tqe2l9et4s] .amount-highlight {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1rem;
}

[b-tqe2l9et4s] .paid-amount {
    font-weight: 600;
    color: #28a745;
    font-size: 0.95rem;
}

[b-tqe2l9et4s] .balance-amount {
    font-weight: 700;
    color: #ffc107;
    font-size: 0.95rem;
}

[b-tqe2l9et4s] .balance-cell {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Action Button */
[b-tqe2l9et4s] .btn-action-icon {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

[b-tqe2l9et4s] .btn-action-icon:hover {
    background: var(--primary-color);
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
}

/* Expandable Row Styles */
[b-tqe2l9et4s] .expandable-row {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
}

[b-tqe2l9et4s] .expandable-row td {
    padding: 0 !important;
}

[b-tqe2l9et4s] .expanded-content {
    padding: 2rem;
    border-top: 2px solid var(--secondary-color);
}

[b-tqe2l9et4s] .detail-section {
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 2px dashed #dee2e6;
}

[b-tqe2l9et4s] .detail-section:last-child {
    margin-bottom: 0;
    border-bottom: none;
}

[b-tqe2l9et4s] .section-title {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
}

    [b-tqe2l9et4s] .section-title i {
        color: var(--secondary-color);
    }

[b-tqe2l9et4s] .detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

[b-tqe2l9et4s] .detail-item {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

[b-tqe2l9et4s] .detail-item label {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    [b-tqe2l9et4s] .detail-item label i {
        color: var(--secondary-color);
    }

[b-tqe2l9et4s] .detail-item span {
    font-size: 0.95rem;
    color: #212529;
    font-weight: 500;
}

/* Mobile Card View */
[b-tqe2l9et4s] .ar-cards-container {
    display: none;
}

[b-tqe2l9et4s] .ar-card {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    margin-bottom: 1rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    cursor: pointer;
    border: 1px solid rgba(0,0,0,0.05);
}

[b-tqe2l9et4s] .ar-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

[b-tqe2l9et4s] .card-header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid #f1f3f5;
}

[b-tqe2l9et4s] .ar-info {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

[b-tqe2l9et4s] .ar-info-link {
    text-decoration: none;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    transition: all 0.2s;
}

[b-tqe2l9et4s] .ar-code-mobile {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1rem;
    font-family: 'Courier New', monospace;
}

[b-tqe2l9et4s] .date-mobile {
    font-size: 0.85rem;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

    [b-tqe2l9et4s] .date-mobile i {
        color: var(--secondary-color);
    }

[b-tqe2l9et4s] .amount-mobile {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1.1rem;
}

[b-tqe2l9et4s] .card-body-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

[b-tqe2l9et4s] .info-group {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

[b-tqe2l9et4s] .info-group i {
    color: var(--secondary-color);
    font-size: 1.25rem;
    margin-top: 0.25rem;
}

[b-tqe2l9et4s] .info-content {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
}

[b-tqe2l9et4s] .info-content label {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

[b-tqe2l9et4s] .info-content span {
    font-size: 0.9rem;
    font-weight: 500;
    color: #212529;
}

[b-tqe2l9et4s] .card-divider {
    height: 2px;
    background: linear-gradient(90deg, transparent, #dee2e6, transparent);
    margin: 1rem 0;
}

[b-tqe2l9et4s] .card-details-grid {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

[b-tqe2l9et4s] .detail-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #495057;
}

    [b-tqe2l9et4s] .detail-row i {
        color: var(--secondary-color);
    }

[b-tqe2l9et4s] .terms-badge {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    background: linear-gradient(135deg, var(--secondary-color) 0%, #e6c557 100%);
    color: var(--primary-color);
    border-radius: 12px;
    font-size: 0.85rem;
    font-weight: 600;
}

/* Pagination */
[b-tqe2l9et4s] .pagination-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
    border-top: 2px solid #dee2e6;
}

[b-tqe2l9et4s] .showing-entries {
    font-size: 0.9rem;
    color: #495057;
    font-weight: 500;
}

[b-tqe2l9et4s] .showing-entries span {
    font-weight: 700;
    color: var(--primary-color);
}

[b-tqe2l9et4s] .pagination {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

[b-tqe2l9et4s] .page-item {
    margin: 0;
}

[b-tqe2l9et4s] .page-link {
    padding: 0.65rem 1rem;
    border: 2px solid #e9ecef;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

[b-tqe2l9et4s] .page-link:hover:not(:disabled) {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

[b-tqe2l9et4s] .page-item.active .page-link {
    background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
    color: white;
    border-color: var(--primary-color);
}

[b-tqe2l9et4s] .page-item.disabled .page-link,
[b-tqe2l9et4s] .page-link:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

/* Filter Modal */
[b-tqe2l9et4s] .filter-modal-label {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    [b-tqe2l9et4s] .filter-modal-label i {
        color: var(--secondary-color);
    }

/* Form Controls in Modal */
.form-control-custom[b-tqe2l9et4s],
.form-select-custom[b-tqe2l9et4s] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control-custom:focus[b-tqe2l9et4s],
    .form-select-custom:focus[b-tqe2l9et4s] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

[b-tqe2l9et4s] .btn-primary-filter {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    transition: all 0.3s ease;
}

[b-tqe2l9et4s] .btn-primary-filter:hover {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* Modal Styles */
.modal-content[b-tqe2l9et4s] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-tqe2l9et4s] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
    background: white;
}

.modal-title[b-tqe2l9et4s] {
    color: var(--primary-color);
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .modal-title i[b-tqe2l9et4s] {
        color: var(--secondary-color);
    }

.modal-footer[b-tqe2l9et4s] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Alert Styles */
[b-tqe2l9et4s] .alert {
    border-radius: 8px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    border: 2px solid;
}

[b-tqe2l9et4s] .alert-info {
    background: linear-gradient(135deg, #e7f3ff 0%, #cce5ff 100%);
    border-color: #b3d9ff;
    color: #004085;
}

    [b-tqe2l9et4s] .alert-info i {
        color: #0066cc;
    }

/* Responsive Design */
@media (max-width: 768px) {
    .page-title[b-tqe2l9et4s] {
        font-size: 1.5rem;
    }

        .page-title i[b-tqe2l9et4s] {
            font-size: 1.5rem;
        }

    .content-card[b-tqe2l9et4s] {
        padding: 1.5rem;
    }

    [b-tqe2l9et4s] .filter-section {
        padding: 1rem;
    }

    [b-tqe2l9et4s] .ar-table-container.desktop-view {
        display: none;
    }

    [b-tqe2l9et4s] .ar-cards-container.mobile-view {
        display: block;
    }

    [b-tqe2l9et4s] .pagination-wrapper {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }

    [b-tqe2l9et4s] .pagination {
        justify-content: center;
        flex-wrap: wrap;
    }

    [b-tqe2l9et4s] .summary-card {
        padding: 1rem;
    }

    [b-tqe2l9et4s] .summary-card .card-icon {
        width: 48px;
        height: 48px;
    }

    [b-tqe2l9et4s] .summary-card .card-icon i {
        font-size: 1.25rem;
    }

    [b-tqe2l9et4s] .summary-card .card-value {
        font-size: 1.5rem;
    }
}

@media (min-width: 769px) {
    [b-tqe2l9et4s] .ar-table-container.desktop-view {
        display: block;
    }

    [b-tqe2l9et4s] .ar-cards-container.mobile-view {
        display: none;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/AccoutsReceivable/Aging.razor.rz.scp.css */
/* Content Card */
.content-card[b-qf6jqnmaew] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Card Header */
.card-header-custom[b-qf6jqnmaew] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-qf6jqnmaew] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-qf6jqnmaew] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-qf6jqnmaew] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Page Header */
.page-header[b-qf6jqnmaew] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-qf6jqnmaew] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-qf6jqnmaew] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-qf6jqnmaew] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-qf6jqnmaew]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-qf6jqnmaew] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-qf6jqnmaew] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-qf6jqnmaew] {
    color: #6c757d;
}

/* Summary Cards */
[b-qf6jqnmaew] .summary-card {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1.5rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
}

[b-qf6jqnmaew] .summary-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

[b-qf6jqnmaew] .summary-card .card-icon {
    width: 64px;
    height: 64px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
    flex-shrink: 0;
}

[b-qf6jqnmaew] .summary-card .card-icon i {
    font-size: 1.75rem;
    color: white;
}

[b-qf6jqnmaew] .summary-card .card-content {
    flex: 1;
}

[b-qf6jqnmaew] .summary-card .card-title {
    font-size: 0.875rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

[b-qf6jqnmaew] .summary-card .card-value {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--primary-color);
    line-height: 1.2;
    margin-bottom: 0.25rem;
}

[b-qf6jqnmaew] .summary-card .card-subtitle {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 500;
}

/* Filter Section */
[b-qf6jqnmaew] .filter-section {
    margin-bottom: 1.5rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 12px;
    border: 2px solid #dee2e6;
}

[b-qf6jqnmaew] .search-box {
    position: relative;
    width: 100%;
}

[b-qf6jqnmaew] .search-box i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--secondary-color);
    pointer-events: none;
}

[b-qf6jqnmaew] .search-box input {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

[b-qf6jqnmaew] .search-box input:focus {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

[b-qf6jqnmaew] .search-box input:disabled {
    background-color: #f8f9fa;
    cursor: not-allowed;
}

/* Buttons */
.btn[b-qf6jqnmaew] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

[b-qf6jqnmaew] .btn-filter {
    background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
    color: white;
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
}

[b-qf6jqnmaew] .btn-filter:hover:not(:disabled) {
    background: linear-gradient(135deg, #a00000 0%, var(--primary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.2);
    color: white;
}

.btn-secondary[b-qf6jqnmaew] {
    background-color: #6c757d;
    border: none;
}

    .btn-secondary:hover[b-qf6jqnmaew] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

[b-qf6jqnmaew] .btn-reset {
    background-color: #6c757d;
    color: white;
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
}

[b-qf6jqnmaew] .btn-reset:hover:not(:disabled) {
    background-color: #5c636a;
    transform: translateY(-2px);
    color: white;
}

[b-qf6jqnmaew] .btn-filter:disabled,
[b-qf6jqnmaew] .btn-reset:disabled,
.btn-secondary:disabled[b-qf6jqnmaew] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

/* Active Filters */
[b-qf6jqnmaew] .active-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    background: white;
    border-radius: 8px;
    border: 2px solid #e9ecef;
}

[b-qf6jqnmaew] .filter-label {
    font-weight: 600;
    color: #495057;
    font-size: 0.9rem;
}

[b-qf6jqnmaew] .filter-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.85rem;
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
}

[b-qf6jqnmaew] .filter-tag i {
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.2s;
}

[b-qf6jqnmaew] .filter-tag i:hover {
    opacity: 1;
}

/* Table Styles */
[b-qf6jqnmaew] .aging-table-container {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

[b-qf6jqnmaew] .aging-table-modern {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

[b-qf6jqnmaew] .aging-table-modern thead {
    background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
    color: white;
}

[b-qf6jqnmaew] .aging-table-modern thead th {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

[b-qf6jqnmaew] .aging-table-modern thead th:first-child {
    border-top-left-radius: 12px;
}

[b-qf6jqnmaew] .aging-table-modern thead th:last-child {
    border-top-right-radius: 12px;
}

[b-qf6jqnmaew] .aging-table-modern tbody tr.main-row {
    background: white;
    transition: all 0.2s;
    border-bottom: 1px solid #e9ecef;
}

[b-qf6jqnmaew] .aging-table-modern tbody tr.main-row:hover {
    background: #f8f9fa;
    transform: scale(1.001);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

[b-qf6jqnmaew] .aging-table-modern tbody tr.main-row.overdue-row {
    background: #fff5f5;
    border-left: 4px solid #dc3545;
}

[b-qf6jqnmaew] .aging-table-modern tbody tr.main-row.overdue-row:hover {
    background: #ffe5e5;
}

[b-qf6jqnmaew] .aging-table-modern tbody td {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
}

/* Expandable Button */
[b-qf6jqnmaew] .btn-expand {
    background: none;
    border: none;
    padding: 0.25rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: transform 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-qf6jqnmaew] .btn-expand i {
    font-size: 1rem;
    transition: transform 0.2s;
}

[b-qf6jqnmaew] .btn-expand.expanded i {
    transform: rotate(90deg);
}

[b-qf6jqnmaew] .btn-expand:hover {
    background: rgba(212, 175, 55, 0.15);
    border-radius: 4px;
}

/* AR Code Badge */
[b-qf6jqnmaew] .ar-code {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 0.95rem;
    font-family: 'Courier New', monospace;
}

/* Accountable, Agent, and Project Names */
[b-qf6jqnmaew] .accountable-name,
[b-qf6jqnmaew] .agent-name {
    font-weight: 500;
    color: #495057;
}

[b-qf6jqnmaew] .project-name {
    font-weight: 500;
    color: #6c757d;
    font-size: 0.875rem;
}

/* Date Display */
[b-qf6jqnmaew] .date-wrapper {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

[b-qf6jqnmaew] .date-wrapper i {
    font-size: 0.875rem;
    color: var(--secondary-color);
}

/* Terms Badge */
[b-qf6jqnmaew] .terms-badge {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    background: linear-gradient(135deg, var(--secondary-color) 0%, #e6c557 100%);
    color: var(--primary-color);
    border-radius: 12px;
    font-size: 0.85rem;
    font-weight: 600;
}

/* Lapse Days Badge */
[b-qf6jqnmaew] .lapse-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.35rem 0.85rem;
    border-radius: 12px;
    font-size: 0.85rem;
    font-weight: 700;
}

[b-qf6jqnmaew] .lapse-badge.overdue {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
}

[b-qf6jqnmaew] .lapse-badge.current {
    background: linear-gradient(135deg, #28a745 0%, #218838 100%);
    color: white;
}

[b-qf6jqnmaew] .lapse-badge i {
    font-size: 0.9rem;
}

/* Amount Styling */
[b-qf6jqnmaew] .amount-highlight {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1rem;
}

/* Action Button */
[b-qf6jqnmaew] .btn-action-icon {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

[b-qf6jqnmaew] .btn-action-icon:hover {
    background: var(--primary-color);
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
}

[b-qf6jqnmaew] .paid-amount {
    font-weight: 600;
    color: #28a745;
    font-size: 0.95rem;
}

[b-qf6jqnmaew] .balance-amount {
    font-weight: 700;
    font-size: 0.95rem;
}

[b-qf6jqnmaew] .balance-amount.pending {
    color: #ffc107;
}

[b-qf6jqnmaew] .balance-amount.paid {
    color: #28a745;
}

/* Expandable Row Styles */
[b-qf6jqnmaew] .expandable-row {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
}

[b-qf6jqnmaew] .expandable-row td {
    padding: 0 !important;
}

[b-qf6jqnmaew] .expanded-content {
    padding: 2rem;
    border-top: 2px solid var(--secondary-color);
}

[b-qf6jqnmaew] .detail-section {
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 2px dashed #dee2e6;
}

[b-qf6jqnmaew] .detail-section:last-child {
    margin-bottom: 0;
    border-bottom: none;
}

[b-qf6jqnmaew] .section-title {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
}

    [b-qf6jqnmaew] .section-title i {
        color: var(--secondary-color);
    }

[b-qf6jqnmaew] .detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

[b-qf6jqnmaew] .detail-item {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

[b-qf6jqnmaew] .detail-item label {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    [b-qf6jqnmaew] .detail-item label i {
        color: var(--secondary-color);
    }

[b-qf6jqnmaew] .detail-item span {
    font-size: 0.95rem;
    color: #212529;
    font-weight: 500;
}

/* Mobile Card View */
[b-qf6jqnmaew] .aging-cards-container {
    display: none;
}

[b-qf6jqnmaew] .aging-card {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    margin-bottom: 1rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    cursor: pointer;
    border: 1px solid rgba(0,0,0,0.05);
    border-left: 4px solid transparent;
}

[b-qf6jqnmaew] .aging-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

[b-qf6jqnmaew] .aging-card.overdue-card {
    border-left-color: #dc3545;
    background: #fff5f5;
}

[b-qf6jqnmaew] .card-header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid #f1f3f5;
}

[b-qf6jqnmaew] .ar-info {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

[b-qf6jqnmaew] .ar-code-mobile {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1rem;
    font-family: 'Courier New', monospace;
}

[b-qf6jqnmaew] .date-mobile {
    font-size: 0.85rem;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

    [b-qf6jqnmaew] .date-mobile i {
        color: var(--secondary-color);
    }

[b-qf6jqnmaew] .lapse-mobile {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.85rem;
    border-radius: 12px;
    font-size: 0.85rem;
    font-weight: 700;
}

[b-qf6jqnmaew] .lapse-mobile.overdue {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
}

[b-qf6jqnmaew] .lapse-mobile.current {
    background: linear-gradient(135deg, #28a745 0%, #218838 100%);
    color: white;
}

[b-qf6jqnmaew] .amount-mobile {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1.1rem;
}

[b-qf6jqnmaew] .card-body-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

[b-qf6jqnmaew] .info-group {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

[b-qf6jqnmaew] .info-group i {
    color: var(--secondary-color);
    font-size: 1.25rem;
    margin-top: 0.25rem;
}

[b-qf6jqnmaew] .info-content {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
}

[b-qf6jqnmaew] .info-content label {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

[b-qf6jqnmaew] .info-content span {
    font-size: 0.9rem;
    font-weight: 500;
    color: #212529;
}

[b-qf6jqnmaew] .card-divider {
    height: 2px;
    background: linear-gradient(90deg, transparent, #dee2e6, transparent);
    margin: 1rem 0;
}

[b-qf6jqnmaew] .card-details-grid {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

[b-qf6jqnmaew] .detail-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #495057;
}

    [b-qf6jqnmaew] .detail-row i {
        color: var(--secondary-color);
    }

/* Pagination */
[b-qf6jqnmaew] .pagination-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
    border-top: 2px solid #dee2e6;
}

[b-qf6jqnmaew] .showing-entries {
    font-size: 0.9rem;
    color: #495057;
    font-weight: 500;
}

[b-qf6jqnmaew] .showing-entries span {
    font-weight: 700;
    color: var(--primary-color);
}

[b-qf6jqnmaew] .pagination {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

[b-qf6jqnmaew] .page-item {
    margin: 0;
}

[b-qf6jqnmaew] .page-link {
    padding: 0.65rem 1rem;
    border: 2px solid #e9ecef;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

[b-qf6jqnmaew] .page-link:hover:not(:disabled) {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

[b-qf6jqnmaew] .page-item.active .page-link {
    background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
    color: white;
    border-color: var(--primary-color);
}

[b-qf6jqnmaew] .page-item.disabled .page-link,
[b-qf6jqnmaew] .page-link:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

/* Filter Modal */
[b-qf6jqnmaew] .filter-modal-label {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    [b-qf6jqnmaew] .filter-modal-label i {
        color: var(--secondary-color);
    }

/* Form Controls in Modal */
.form-control-custom[b-qf6jqnmaew],
.form-select-custom[b-qf6jqnmaew] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control-custom:focus[b-qf6jqnmaew],
    .form-select-custom:focus[b-qf6jqnmaew] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

[b-qf6jqnmaew] .btn-primary-filter {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    transition: all 0.3s ease;
}

[b-qf6jqnmaew] .btn-primary-filter:hover {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* Modal Styles */
.modal-content[b-qf6jqnmaew] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-qf6jqnmaew] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
    background: white;
}

.modal-title[b-qf6jqnmaew] {
    color: var(--primary-color);
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .modal-title i[b-qf6jqnmaew] {
        color: var(--secondary-color);
    }

.modal-footer[b-qf6jqnmaew] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Alert Styles */
[b-qf6jqnmaew] .alert {
    border-radius: 8px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    border: 2px solid;
}

[b-qf6jqnmaew] .alert-info {
    background: linear-gradient(135deg, #e7f3ff 0%, #cce5ff 100%);
    border-color: #b3d9ff;
    color: #004085;
}

    [b-qf6jqnmaew] .alert-info i {
        color: #0066cc;
    }

/* Responsive Design */
@media (max-width: 768px) {
    .page-title[b-qf6jqnmaew] {
        font-size: 1.5rem;
    }

        .page-title i[b-qf6jqnmaew] {
            font-size: 1.5rem;
        }

    .content-card[b-qf6jqnmaew] {
        padding: 1.5rem;
    }

    [b-qf6jqnmaew] .filter-section {
        padding: 1rem;
    }

    [b-qf6jqnmaew] .aging-table-container.desktop-view {
        display: none;
    }

    [b-qf6jqnmaew] .aging-cards-container.mobile-view {
        display: block;
    }

    [b-qf6jqnmaew] .pagination-wrapper {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }

    [b-qf6jqnmaew] .pagination {
        justify-content: center;
        flex-wrap: wrap;
    }

    [b-qf6jqnmaew] .summary-card {
        padding: 1rem;
    }

    [b-qf6jqnmaew] .summary-card .card-icon {
        width: 48px;
        height: 48px;
    }

    [b-qf6jqnmaew] .summary-card .card-icon i {
        font-size: 1.25rem;
    }

    [b-qf6jqnmaew] .summary-card .card-value {
        font-size: 1.5rem;
    }
}

@media (min-width: 769px) {
    [b-qf6jqnmaew] .aging-table-container.desktop-view {
        display: block;
    }

    [b-qf6jqnmaew] .aging-cards-container.mobile-view {
        display: none;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/AccoutsReceivable/ARDashboard.razor.rz.scp.css */
/* Dashboard Cards */
.dashboard-card[b-gb32pcqz6k] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

    .dashboard-card:hover[b-gb32pcqz6k] {
        transform: translateY(-5px);
        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    }

.card-icon[b-gb32pcqz6k] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-gb32pcqz6k] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-gb32pcqz6k] {
    color: #212529;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.card-change[b-gb32pcqz6k] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
}

    .card-change.positive[b-gb32pcqz6k] {
        color: #2E7D32;
    }

    .card-change i[b-gb32pcqz6k] {
        margin-right: 0.25rem;
    }

/* Content Card */
.content-card[b-gb32pcqz6k] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
    max-width: 100%; /* Ensure it doesn't exceed parent width */
    width: 100%;
    box-sizing: border-box;
}

.card-header-custom[b-gb32pcqz6k] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-gb32pcqz6k] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-gb32pcqz6k] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-gb32pcqz6k] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Page Header */
.page-header[b-gb32pcqz6k] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-gb32pcqz6k] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-gb32pcqz6k] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-gb32pcqz6k] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-gb32pcqz6k]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-gb32pcqz6k] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-gb32pcqz6k] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-gb32pcqz6k] {
    color: #6c757d;
}

.add-new-btn[b-gb32pcqz6k] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration:none;
}

    .add-new-btn:hover[b-gb32pcqz6k] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

/* Filter Section */
.filter-section[b-gb32pcqz6k] {
    margin-bottom: 1.5rem;
}

.filter-label[b-gb32pcqz6k] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
    margin-bottom: 0.25rem;
    display: block;
}

.search-box[b-gb32pcqz6k] {
    position: relative;
    width: 100%;
}

    .search-box input[b-gb32pcqz6k] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-gb32pcqz6k] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-gb32pcqz6k] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.form-select-custom[b-gb32pcqz6k], .form-control-custom[b-gb32pcqz6k] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-select-custom:focus[b-gb32pcqz6k], .form-control-custom:focus[b-gb32pcqz6k] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Table Styles */
.checks-table[b-gb32pcqz6k] {
    width: 100%;
    margin-top: 1rem;
}

    .checks-table thead[b-gb32pcqz6k] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .checks-table thead th[b-gb32pcqz6k] {
            <!-- color: white; -->
            font-weight: 600;
            padding: 1rem 0.75rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.8rem;
            letter-spacing: 0.5px;
            white-space: nowrap;
        }

    .checks-table tbody tr[b-gb32pcqz6k] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .checks-table tbody tr:hover[b-gb32pcqz6k] {
            background-color: #f8f5f0;
            box-shadow: inset 4px 0 0 var(--secondary-color), 0 2px 8px rgba(139, 0, 0, 0.1);
            transform: scale(1.01);
        }

        /* Extra visual indicator on hover */
        .checks-table tbody tr:hover td[b-gb32pcqz6k] {
 color: var(--primary-color);
     font-weight: 500;
        }

    .checks-table tbody td[b-gb32pcqz6k] {
        padding: 1rem 0.75rem;
        vertical-align: middle;
        font-size: 0.9rem;
    }

.voucher-number[b-gb32pcqz6k] {
    font-weight: 600;
    color: var(--primary-color);
}

.amount-value[b-gb32pcqz6k] {
    font-weight: 700;
    color: var(--primary-color);
}

/* Table Select Dropdowns */
.table-select[b-gb32pcqz6k] {
    border: 2px solid #e9ecef;
    border-radius: 6px;
    padding: 0.4rem 0.6rem;
    font-size: 0.85rem;
    transition: all 0.3s ease;
    cursor: pointer;
    width: 100%;
}

    .table-select:focus[b-gb32pcqz6k] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.15rem rgba(212, 175, 55, 0.15);
    }

    .table-select:hover[b-gb32pcqz6k] {
        border-color: var(--secondary-color);
    }

/* Picker Buttons */
.btn-picker[b-gb32pcqz6k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 2px solid #e9ecef;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 500;
    transition: all 0.3s ease;
    cursor: pointer;
    background-color: white;
    text-align: left;
}

    .btn-picker:hover:not(:disabled)[b-gb32pcqz6k] {
        border-color: var(--secondary-color);
        background-color: #f8f5f0;
        transform: translateY(-1px);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.2);
    }

    .btn-picker:active:not(:disabled)[b-gb32pcqz6k] {
        transform: translateY(0);
        box-shadow: 0 1px 4px rgba(212, 175, 55, 0.15);
    }

    .btn-picker:disabled[b-gb32pcqz6k] {
        opacity: 0.6;
        cursor: not-allowed;
    }

    .btn-picker i:first-child[b-gb32pcqz6k] {
        color: var(--primary-color);
        font-size: 1.1rem;
        flex-shrink: 0;
    }

    .btn-picker i:last-child[b-gb32pcqz6k] {
        color: #6c757d;
        font-size: 0.9rem;
        flex-shrink: 0;
    }

    .btn-picker span[b-gb32pcqz6k] {
        flex: 1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.btn-picker-empty[b-gb32pcqz6k] {
    color: #6c757d;
    font-style: italic;
}

    .btn-picker-empty:hover:not(:disabled)[b-gb32pcqz6k] {
        color: #495057;
    }

.btn-picker-filled[b-gb32pcqz6k] {
    color: #212529;
    border-color: #d4af37;
    background-color: #fff8e6;
}

    .btn-picker-filled:hover:not(:disabled)[b-gb32pcqz6k] {
        border-color: var(--secondary-color);
        background-color: #fff3cd;
    }

    .btn-picker-filled i:first-child[b-gb32pcqz6k] {
        color: var(--secondary-color);
    }

/* Status Select Colors */
.status-select.status-pending[b-gb32pcqz6k] {
    background-color: #fff3cd;
    border-color: #ffc107;
    color: #856404;
    font-weight: 600;
}

.status-select.status-progress[b-gb32pcqz6k] {
    background-color: #cfe2ff;
    border-color: #0d6efd;
    color: #084298;
    font-weight: 600;
}

.status-select.status-completed[b-gb32pcqz6k] {
    background-color: #d1e7dd;
    border-color: #198754;
    color: #0f5132;
    font-weight: 600;
}

.status-select.status-cancelled[b-gb32pcqz6k] {
    background-color: #f8d7da;
    border-color: #dc3545;
    color: #842029;
    font-weight: 600;
}

/* Action Buttons */
.action-buttons[b-gb32pcqz6k] {
    display: flex;
    gap: 0.4rem;
    justify-content: center;
}

.btn-action[b-gb32pcqz6k] {
    padding: 0.4rem 0.6rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-view[b-gb32pcqz6k] {
    background-color: #0dcaf0;
    color: white;
}

    .btn-view:hover[b-gb32pcqz6k] {
        background-color: #0aa2c0;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 202, 240, 0.3);
    }

.btn-edit[b-gb32pcqz6k] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-gb32pcqz6k] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

.btn-print[b-gb32pcqz6k] {
    background-color: #6c757d;
    color: white;
}

    .btn-print:hover[b-gb32pcqz6k] {
        background-color: #5c636a;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(108, 117, 125, 0.3);
    }

/* Pagination */
.pagination-wrapper[b-gb32pcqz6k] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-gb32pcqz6k] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-gb32pcqz6k] {
    margin: 0;
}

.page-link[b-gb32pcqz6k] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

    .page-link:hover[b-gb32pcqz6k] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
    }

.page-item.active .page-link[b-gb32pcqz6k] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Modal Styles */
.modal-content[b-gb32pcqz6k] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-gb32pcqz6k] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-gb32pcqz6k] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-gb32pcqz6k] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-gb32pcqz6k] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-gb32pcqz6k] {
            opacity: 1;
        }

.modal-body[b-gb32pcqz6k] {
    padding: 2rem;
}

.modal-footer[b-gb32pcqz6k] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.detail-label[b-gb32pcqz6k] {
    font-weight: 600;
    color: #6c757d;
    font-size: 0.9rem;
    margin-bottom: 0.25rem;
}

.detail-value[b-gb32pcqz6k] {
    color: #212529;
    font-size: 1rem;
    margin-bottom: 1rem;
}

/* Buttons */
.btn[b-gb32pcqz6k] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-secondary[b-gb32pcqz6k] {
    background-color: #6c757d;
    border: none;
}

    .btn-secondary:hover[b-gb32pcqz6k] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

/* Toast */
.toast[b-gb32pcqz6k] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Filter Modal Styles */
.filter-modal-label[b-gb32pcqz6k] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .filter-modal-label i[b-gb32pcqz6k] {
        color: var(--primary-color);
        font-size: 1.1rem;
    }

/* Filter Button Styles */
.btn-filter[b-gb32pcqz6k] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-filter:hover[b-gb32pcqz6k] {
        background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(139, 0, 0, 0.4);
    }

    .btn-filter:active[b-gb32pcqz6k] {
        transform: translateY(0);
    }

.btn-reset[b-gb32pcqz6k] {
    background-color: #6c757d;
    color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-reset:hover[b-gb32pcqz6k] {
        background-color: #5c636a;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(108, 117, 125, 0.3);
    }

.btn-primary-filter[b-gb32pcqz6k] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 700;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-primary-filter:hover[b-gb32pcqz6k] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

/* Active Filters Display */
.active-filters[b-gb32pcqz6k] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    border-left: 4px solid var(--secondary-color);
}

.filter-tag[b-gb32pcqz6k] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.75rem;
    background-color: white;
    border: 1px solid var(--secondary-color);
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--primary-color);
    transition: all 0.2s ease;
}

    .filter-tag:hover[b-gb32pcqz6k] {
        background-color: #fff8e6;
        box-shadow: 0 2px 6px rgba(212, 175, 55, 0.2);
    }

    .filter-tag i[b-gb32pcqz6k] {
        cursor: pointer;
        font-size: 1rem;
        transition: transform 0.2s ease;
    }

        .filter-tag i:hover[b-gb32pcqz6k] {
            transform: scale(1.2);
            color: var(--primary-color);
        }

/* Modal Size Adjustments */
.modal-lg[b-gb32pcqz6k] {
    max-width: 900px;
}

/* ==================== MOBILE RESPONSIVE STYLES ==================== */

/* Tablet and below (768px) */
@media (max-width: 768px) {
    /* Prevent page overflow but allow table scrolling */
    body[b-gb32pcqz6k] {
        overflow-x: hidden;
    }

    /* Ensure main content container doesn't overflow */
    .main-content[b-gb32pcqz6k] {
        overflow-x: hidden;
        max-width: 100vw;
    }

    /* Ensure content card doesn't overflow */
    .content-card[b-gb32pcqz6k] {
        padding: 1.25rem;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* Keep table scrollable on all devices */
    .checks-table-container[b-gb32pcqz6k] {
        max-width: 100%;
        overflow-x: auto; /* Allow horizontal scrolling */
        border: 1px solid #e9ecef;
        border-radius: 8px;
    }

    /* Page Header */
    .page-header[b-gb32pcqz6k] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
        padding-bottom: 1rem;
        margin-bottom: 1.5rem;
    }

    .page-title[b-gb32pcqz6k] {
        font-size: 1.5rem;
    }

        .page-title i[b-gb32pcqz6k] {
            font-size: 1.5rem;
        }

    .breadcrumb[b-gb32pcqz6k] {
        font-size: 0.8rem;
    }

    .add-new-btn[b-gb32pcqz6k] {
        width: 100%;
        justify-content: center;
        padding: 0.65rem 1.25rem;
        font-size: 0.9rem;
    }

    /* Statistics Cards */
    .dashboard-card[b-gb32pcqz6k] {
        padding: 1.25rem;
    }

    .card-icon[b-gb32pcqz6k] {
        width: 50px;
        height: 50px;
        font-size: 1.5rem;
    }

    .card-value[b-gb32pcqz6k] {
        font-size: 1.5rem;
    }

    .card-title[b-gb32pcqz6k] {
        font-size: 0.85rem;
    }

    .card-change[b-gb32pcqz6k] {
        font-size: 0.8rem;
    }

    /* Card Header */
    .card-header-custom[b-gb32pcqz6k] {
        padding-bottom: 1rem;
        margin-bottom: 1rem;
    }

    .card-title-custom[b-gb32pcqz6k] {
        font-size: 1.1rem;
    }

        .card-title-custom i[b-gb32pcqz6k] {
            font-size: 1.25rem;
        }

    .card-subtitle-custom[b-gb32pcqz6k] {
        font-size: 0.85rem;
    }

    /* Search and Filter Bar */
    .filter-section[b-gb32pcqz6k] {
        margin-bottom: 1rem;
    }

    .search-box input[b-gb32pcqz6k] {
        padding: 0.6rem 1rem 0.6rem 2.5rem;
        font-size: 0.9rem;
    }

    .search-box i[b-gb32pcqz6k] {
        font-size: 1rem;
    }

    /* Filter Buttons */
    .btn-filter[b-gb32pcqz6k],
    .btn-reset[b-gb32pcqz6k],
    .btn-secondary[b-gb32pcqz6k] {
        padding: 0.6rem 1rem;
        font-size: 0.85rem;
        white-space: nowrap;
    }

    /* Active Filters */
    .active-filters[b-gb32pcqz6k] {
        padding: 0.6rem 0.75rem;
        gap: 0.4rem;
    }

    .filter-label[b-gb32pcqz6k] {
        font-size: 0.8rem;
        width: 100%;
        margin-bottom: 0.25rem;
    }

    .filter-tag[b-gb32pcqz6k] {
        font-size: 0.75rem;
        padding: 0.35rem 0.65rem;
    }

    /* Table */
    .checks-table[b-gb32pcqz6k] {
        font-size: 0.8rem;
    }

        .checks-table thead th[b-gb32pcqz6k],
        .checks-table tbody td[b-gb32pcqz6k] {
            padding: 0.75rem 0.5rem;
        }

    .action-buttons[b-gb32pcqz6k] {
        flex-direction: column;
        gap: 0.25rem;
    }

    .table-select[b-gb32pcqz6k] {
        font-size: 0.8rem;
        padding: 0.35rem 0.5rem;
    }

    .btn-picker[b-gb32pcqz6k] {
        font-size: 0.8rem;
        padding: 0.45rem 0.65rem;
    }

        .btn-picker i:first-child[b-gb32pcqz6k] {
            font-size: 1rem;
        }

        .btn-picker i:last-child[b-gb32pcqz6k] {
            font-size: 0.85rem;
        }

    /* Expandable Details */
    .expanded-content[b-gb32pcqz6k] {
        padding: 1.25rem;
    }

    .section-title[b-gb32pcqz6k] {
        font-size: 0.95rem;
    }

    .detail-grid[b-gb32pcqz6k] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .detail-item[b-gb32pcqz6k] {
        padding: 0.75rem;
    }

        .detail-item label[b-gb32pcqz6k] {
            font-size: 0.8rem;
        }

        .detail-item span[b-gb32pcqz6k] {
            font-size: 0.9rem;
        }

    /* Pagination */
    .pagination-wrapper[b-gb32pcqz6k] {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
        margin-top: 1rem;
        padding-top: 1rem;
    }

    .showing-entries[b-gb32pcqz6k] {
        font-size: 0.85rem;
        text-align: center;
    }

    .pagination[b-gb32pcqz6k] {
        justify-content: center;
    }

    .page-link[b-gb32pcqz6k] {
        padding: 0.4rem 0.6rem;
        font-size: 0.85rem;
    }

    /* Modal */
    .modal-lg[b-gb32pcqz6k] {
        max-width: 100%;
        margin: 0.5rem;
    }

    .modal-header[b-gb32pcqz6k] {
        padding: 1.25rem;
    }

        .modal-header .modal-title[b-gb32pcqz6k] {
            font-size: 1.1rem;
        }

            .modal-header .modal-title i[b-gb32pcqz6k] {
                font-size: 1.25rem;
            }

    .modal-body[b-gb32pcqz6k] {
        padding: 1.25rem;
    }

    .modal-footer[b-gb32pcqz6k] {
        padding: 1rem;
        flex-wrap: wrap;
        gap: 0.5rem;
    }

        .modal-footer .btn[b-gb32pcqz6k] {
            flex: 1 1 auto;
            min-width: 120px;
        }

    .filter-modal-label[b-gb32pcqz6k] {
        font-size: 0.85rem;
    }

        .filter-modal-label i[b-gb32pcqz6k] {
            font-size: 1rem;
        }

    .form-select-custom[b-gb32pcqz6k],
    .form-control-custom[b-gb32pcqz6k] {
        font-size: 0.9rem;
        padding: 0.6rem 0.85rem;
    }
}

/* Small Mobile (576px and below) */
@media (max-width: 576px) {
    /* Prevent page overflow but allow table scrolling */
    body[b-gb32pcqz6k], html[b-gb32pcqz6k] {
        overflow-x: hidden;
        max-width: 100vw;
    }

    .main-content[b-gb32pcqz6k] {
        overflow-x: hidden;
        max-width: 100vw;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    /* Page Header */
    .page-title[b-gb32pcqz6k] {
        font-size: 1.25rem;
    }

        .page-title i[b-gb32pcqz6k] {
            font-size: 1.25rem;
        }

    .breadcrumb[b-gb32pcqz6k] {
        font-size: 0.75rem;
    }

    /* Statistics Cards */
    .dashboard-card[b-gb32pcqz6k] {
        padding: 1rem;
    }

    .card-icon[b-gb32pcqz6k] {
        width: 45px;
        height: 45px;
        font-size: 1.25rem;
    }

    .card-value[b-gb32pcqz6k] {
        font-size: 1.25rem;
    }

    /* Content Card */
    .content-card[b-gb32pcqz6k] {
        padding: 1rem;
        border-radius: 8px;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* Table remains scrollable */
    .checks-table-container[b-gb32pcqz6k] {
        overflow-x: auto;
        padding: 0.5rem;
        position: relative;
    }

        /* Mobile scroll hint */
        .desktop-view .checks-table-container[b-gb32pcqz6k]::after {
            content: 'Swipe \2192';
            position: sticky;
            right: 5px;
            top: 15px;
            float: right;
            background: rgba(139, 0, 0, 0.9);
            color: white;
            padding: 0.4rem 0.8rem;
            border-radius: 15px;
            font-size: 0.75rem;
            font-weight: 700;
            z-index: 10;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
            animation: bounceHorizontal 2s ease-in-out infinite;
        }

    .checks-table-modern[b-gb32pcqz6k] {
        min-width: 800px; /* Slightly smaller for mobile but still readable */
    }

    @@keyframes bounceHorizontal {
        0%[b-gb32pcqz6k], 100%[b-gb32pcqz6k] {
            transform: translateX(0);
            opacity: 0.8;
        }
        50%[b-gb32pcqz6k] {
            transform: translateX(-5px);
            opacity: 1;
        }
    }

    .card-header-custom[b-gb32pcqz6k] {
        padding-bottom: 0.75rem;
        margin-bottom: 0.75rem;
    }

    /* Search and Filter */
    .search-box input[b-gb32pcqz6k] {
        padding: 0.55rem 0.85rem 0.55rem 2.25rem;
        font-size: 0.85rem;
    }

    .search-box i[b-gb32pcqz6k] {
        font-size: 0.9rem;
        left: 0.85rem;
    }

    /* Button Groups - Stack vertically */
    .d-flex.gap-2.justify-content-end[b-gb32pcqz6k] {
        flex-direction: column !important;
    }

        .d-flex.gap-2.justify-content-end .btn[b-gb32pcqz6k] {
            width: 100%;
        }

    .btn-filter[b-gb32pcqz6k],
    .btn-reset[b-gb32pcqz6k],
    .btn-secondary[b-gb32pcqz6k] {
        padding: 0.55rem 0.85rem;
        font-size: 0.8rem;
        justify-content: center;
    }

    /* Active Filters */
    .active-filters[b-gb32pcqz6k] {
        padding: 0.5rem;
    }

    .filter-tag[b-gb32pcqz6k] {
        font-size: 0.7rem;
        padding: 0.3rem 0.55rem;
    }

    /* Mobile Cards */
    .check-card[b-gb32pcqz6k] {
        padding: 1rem;
        margin-bottom: 0.75rem;
    }

    .card-body-row[b-gb32pcqz6k] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .voucher-badge-mobile[b-gb32pcqz6k] {
        font-size: 0.8rem;
        padding: 0.35rem 0.7rem;
    }

    .date-mobile[b-gb32pcqz6k] {
        font-size: 0.8rem;
    }

    .info-content label[b-gb32pcqz6k] {
        font-size: 0.7rem;
    }

    .info-content span[b-gb32pcqz6k] {
        font-size: 0.85rem;
    }

    .amount-mobile[b-gb32pcqz6k] {
        font-size: 0.95rem;
    }

    .detail-row[b-gb32pcqz6k] {
        font-size: 0.8rem;
    }

    .btn-action-mobile[b-gb32pcqz6k] {
        padding: 0.55rem 0.85rem;
        font-size: 0.8rem;
    }

    .badge[b-gb32pcqz6k] {
        padding: 0.4rem 0.8rem;
        font-size: 0.75rem;
    }

    /* Pagination - Compact version */
    .pagination[b-gb32pcqz6k] {
        flex-wrap: wrap;
        gap: 0.25rem;
    }

    .page-item[b-gb32pcqz6k] {
        flex: 0 0 auto;
    }

    .page-link[b-gb32pcqz6k] {
        padding: 0.35rem 0.5rem;
        font-size: 0.8rem;
        min-width: 36px;
        text-align: center;
    }

    /* Hide some page numbers on very small screens */
    .pagination .page-item:not(.active):not(:first-child):not(:last-child):nth-child(n+6)[b-gb32pcqz6k] {
        display: none;
    }

    /* Modal adjustments */
    .modal-dialog[b-gb32pcqz6k] {
        margin: 0.25rem;
    }

    .modal-header[b-gb32pcqz6k] {
        padding: 1rem;
    }

        .modal-header .modal-title[b-gb32pcqz6k] {
            font-size: 1rem;
        }

    .modal-body[b-gb32pcqz6k] {
        padding: 1rem;
    }

    .modal-footer[b-gb32pcqz6k] {
        padding: 0.75rem;
    }

        .modal-footer .btn[b-gb32pcqz6k] {
            padding: 0.5rem 0.75rem;
            font-size: 0.8rem;
        }

    /* Expanded content */
    .expanded-content[b-gb32pcqz6k] {
        padding: 1rem;
    }

    .section-title[b-gb32pcqz6k] {
        font-size: 0.9rem;
    }

    .detail-item[b-gb32pcqz6k] {
        padding: 0.65rem;
    }

    .btn-picker-compact[b-gb32pcqz6k] {
        font-size: 0.8rem;
        padding: 0.45rem 0.75rem;
    }

    .status-select[b-gb32pcqz6k] {
        font-size: 0.8rem;
        padding: 0.4rem;
    }

    .particulars-content[b-gb32pcqz6k] {
        padding: 0.75rem;
        font-size: 0.85rem;
    }
}

/* Extra Small Mobile (400px and below) */
@media (max-width: 400px) {
    /* Prevent page overflow while keeping table scrollable */
    body[b-gb32pcqz6k], html[b-gb32pcqz6k], .main-content[b-gb32pcqz6k] {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }

    .page-title[b-gb32pcqz6k] {
        font-size: 1.1rem;
        word-wrap: break-word;
    }

    .card-value[b-gb32pcqz6k] {
        font-size: 1.1rem;
    }

    .content-card[b-gb32pcqz6k] {
        padding: 0.85rem;
        max-width: 100%;
        box-sizing: border-box;
    }

    .check-card[b-gb32pcqz6k] {
        padding: 0.85rem;
    }

    .filter-tag[b-gb32pcqz6k] {
        font-size: 0.65rem;
        padding: 0.25rem 0.5rem;
    }

    /* Simplify pagination on very small screens */
    .showing-entries[b-gb32pcqz6k] {
        font-size: 0.75rem;
    }

    .pagination .page-item:not(.active):not(:first-child):not(:last-child):nth-child(n+4)[b-gb32pcqz6k] {
        display: none;
    }

    /* Ensure all text elements can wrap */
    .voucher-badge[b-gb32pcqz6k], .voucher-badge-mobile[b-gb32pcqz6k], .ar-code[b-gb32pcqz6k] {
        word-wrap: break-word;
        white-space: normal;
        max-width: 100%;
    }

    /* Keep table scrollable with reduced minimum width */
    .checks-table-modern[b-gb32pcqz6k] {
        min-width: 700px;
    }

    .checks-table-container[b-gb32pcqz6k] {
        padding: 0.25rem;
    }
}

/* ==================== RESPONSIVE TABLE STYLES ==================== */

/* Desktop View */
.desktop-view[b-gb32pcqz6k] {
    display: block;
}

.mobile-view[b-gb32pcqz6k] {
    display: none;
}

/* Table Container with Overflow Handling */
.checks-table-container[b-gb32pcqz6k] {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
    margin-bottom: 1rem;
    position: relative;
    /* Ensure scrolling works on all devices */
    max-width: 100%;
    box-sizing: border-box;
}

    /* Scrollbar styling */
    .checks-table-container[b-gb32pcqz6k]::-webkit-scrollbar {
        height: 10px;
    }

    .checks-table-container[b-gb32pcqz6k]::-webkit-scrollbar-track {
        background: #f1f3f5;
        border-radius: 5px;
        margin: 0 10px;
    }

    .checks-table-container[b-gb32pcqz6k]::-webkit-scrollbar-thumb {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        border-radius: 5px;
        border: 2px solid #f1f3f5;
    }

        .checks-table-container[b-gb32pcqz6k]::-webkit-scrollbar-thumb:hover {
            background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
        }

    /* Scroll shadow indicator - shows when there's more content to the right */
    .checks-table-container[b-gb32pcqz6k] {
        background:
            linear-gradient(to right, white 30%, rgba(255,255,255,0)) 0 0,
            linear-gradient(to right, rgba(255,255,255,0), white 70%) 100% 0,
            radial-gradient(farthest-side at 0 50%, rgba(139,0,0,.2), rgba(0,0,0,0)) 0 0,
            radial-gradient(farthest-side at 100% 50%, rgba(139,0,0,.2), rgba(0,0,0,0)) 100% 0;
        background-repeat: no-repeat;
        background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%;
        background-attachment: local, local, scroll, scroll;
    }

/* Modern Table Styles */
.checks-table-modern[b-gb32pcqz6k] {
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    min-width: 900px; /* Minimum width to ensure all columns are readable */
    table-layout: auto;
}

    .checks-table-modern thead[b-gb32pcqz6k] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
    }

        .checks-table-modern thead th[b-gb32pcqz6k] {
            padding: 1rem;
            font-weight: 600;
            font-size: 0.9rem;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            border: none;
        }

            .checks-table-modern thead th:first-child[b-gb32pcqz6k] {
                border-radius: 10px 0 0 0;
            }

            .checks-table-modern thead th:last-child[b-gb32pcqz6k] {
                border-radius: 0 10px 0 0;
            }

    .checks-table-modern tbody .main-row[b-gb32pcqz6k] {
        background: white;
        transition: all 0.3s ease;
        border-bottom: 1px solid #e9ecef;
    }

        .checks-table-modern tbody .main-row:hover[b-gb32pcqz6k] {
            background: #f8f9fa;
            transform: translateX(2px);
            box-shadow: 0 2px 8px rgba(139, 0, 0, 0.1);
        }

        .checks-table-modern tbody .main-row td[b-gb32pcqz6k] {
            padding: 1rem;
            vertical-align: middle;
            cursor: pointer;
            white-space: nowrap; /* Prevent text wrapping that could break layout */
        }

            /* Allow AR Code cell to wrap if needed */
            .checks-table-modern tbody .main-row td:nth-child(4)[b-gb32pcqz6k] {
                white-space: normal; /* AR Code can wrap */
                min-width: 150px;
            }

/* Expand Button */
.btn-expand[b-gb32pcqz6k] {
    background: none;
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: all 0.3s ease;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .btn-expand:hover[b-gb32pcqz6k] {
        background: rgba(139, 0, 0, 0.1);
    }

    .btn-expand i[b-gb32pcqz6k] {
        transition: transform 0.3s ease;
        font-size: 1rem;
    }

    .btn-expand.expanded i[b-gb32pcqz6k] {
        transform: rotate(90deg);
    }

/* Cell Styles */
.date-wrapper[b-gb32pcqz6k] {
    display: flex;
    align-items: center;
    font-size: 0.9rem;
}

.voucher-badge[b-gb32pcqz6k] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.85rem;
    display: inline-block;
    letter-spacing: 0.5px;
}

.payee-info[b-gb32pcqz6k] {
    display: flex;
    align-items: center;
}

.payee-name[b-gb32pcqz6k] {
    font-weight: 600;
    color: #2c3e50;
}

.amount-highlight[b-gb32pcqz6k] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
    background: linear-gradient(135deg, rgba(139, 0, 0, 0.05) 0%, rgba(212, 175, 55, 0.05) 100%);
    padding: 0.5rem 0.8rem;
    border-radius: 6px;
    display: inline-block;
}

/* Status Badges */
.badge[b-gb32pcqz6k] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: capitalize;
}

.badge-na[b-gb32pcqz6k] {
    background: #e9ecef;
    color: #6c757d;
}

.badge-pending[b-gb32pcqz6k] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #fff;
}

.badge-in-progress[b-gb32pcqz6k] {
    background: linear-gradient(135deg, #17a2b8 0%, #138496 100%);
    color: #fff;
}

.badge-completed[b-gb32pcqz6k] {
    background: linear-gradient(135deg, #2E7D32 0%, #43A047 100%);
    color: #fff;
}

.badge-cancelled[b-gb32pcqz6k] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: #fff;
}

/* ✅ NEW: Mode of Payment Badge Styles */
.badge-cash[b-gb32pcqz6k] {
    background: linear-gradient(135deg, #2E7D32 0%, #43A047 100%);
    color: #fff;
}

.badge-check[b-gb32pcqz6k] {
    background: linear-gradient(135deg, #1976D2 0%, #42A5F5 100%);
    color: #fff;
}

.badge-online[b-gb32pcqz6k] {
    background: linear-gradient(135deg, #6A1B9A 0%, #AB47BC 100%);
  color: #fff;
}

/* Positive/Negative badges for text color only */
.positive[b-gb32pcqz6k] {
    color: #2E7D32;
}

.neutral[b-gb32pcqz6k] {
    color: #1976D2;
}

/* Action Icon Button */
.btn-action-icon[b-gb32pcqz6k] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

    .btn-action-icon:hover[b-gb32pcqz6k] {
        background: var(--primary-color);
        color: white;
        transform: scale(1.1);
    }

/* Expandable Row */
.expandable-row[b-gb32pcqz6k] {
    background: #f8f9fa;
    border-bottom: 2px solid var(--secondary-color);
}

    .expandable-row td[b-gb32pcqz6k] {
        padding: 0 !important;
    }

.expanded-content[b-gb32pcqz6k] {
    padding: 2rem;
    animation: slideDown 0.3s ease-out;
}

@@keyframes slideDown {
    from[b-gb32pcqz6k] {
        opacity: 0;
        transform: translateY(-10px);
    }

    to[b-gb32pcqz6k] {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Detail Sections */
.detail-section[b-gb32pcqz6k] {
    margin-bottom: 1.5rem;
}

    .detail-section:last-child[b-gb32pcqz6k] {
        margin-bottom: 0;
    }

.section-title[b-gb32pcqz6k] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--secondary-color);
    display: flex;
    align-items: center;
}

.detail-grid[b-gb32pcqz6k] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.detail-item[b-gb32pcqz6k] {
    background: white;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

    .detail-item:hover[b-gb32pcqz6k] {
        border-color: var(--secondary-color);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.2);
    }

    .detail-item.full-width[b-gb32pcqz6k] {
        grid-column: 1 / -1;
    }

    .detail-item label[b-gb32pcqz6k] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 0.85rem;
        color: #6c757d;
        font-weight: 600;
        margin-bottom: 0.5rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .detail-item span[b-gb32pcqz6k] {
        color: #2c3e50;
        font-weight: 600;
        font-size: 0.95rem;
    }

.check-number[b-gb32pcqz6k] {
    font-family: 'Courier New', monospace;
    background: #f8f9fa;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
}

.project-name[b-gb32pcqz6k] {
    color: var(--primary-color);
    font-weight: 700;
}

/* Compact Picker Buttons */
.btn-picker-compact[b-gb32pcqz6k] {
    width: 100%;
    padding: 0.5rem 1rem;
    border-radius: 6px;
    border: 2px solid #e9ecef;
    background: white;
    color: #6c757d;
    font-size: 0.85rem;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5rem;
}

    .btn-picker-compact.btn-picker-empty[b-gb32pcqz6k] {
        border-color: var(--primary-color);
        color: var(--primary-color);
        border-style: dashed;
    }

    .btn-picker-compact.btn-picker-filled[b-gb32pcqz6k] {
        background: linear-gradient(135deg, rgba(139, 0, 0, 0.05) 0%, rgba(212, 175, 55, 0.05) 100%);
        border-color: var(--secondary-color);
        color: var(--primary-color);
    }

    .btn-picker-compact:hover[b-gb32pcqz6k] {
        background: var(--primary-color);
        color: white;
        border-color: var(--primary-color);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
    }

/* Status Select */
.status-select[b-gb32pcqz6k] {
    border: 2px solid #e9ecef;
    border-radius: 6px;
    font-weight: 600;
    padding: 0.5rem;
    background: white;
}

/* Particulars */
.particulars-content[b-gb32pcqz6k] {
    background: white;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    color: #2c3e50;
    line-height: 1.6;
}

/* ==================== MOBILE CARD STYLES ==================== */

.check-card[b-gb32pcqz6k] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    cursor: pointer;
    border: 2px solid transparent;
}

    .check-card:hover[b-gb32pcqz6k] {
        border-color: var(--secondary-color);
        box-shadow: 0 4px 16px rgba(212, 175, 55, 0.3);
        transform: translateY(-2px);
    }

.card-header-row[b-gb32pcqz6k] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.voucher-info[b-gb32pcqz6k] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.voucher-badge-mobile[b-gb32pcqz6k] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.85rem;
    display: inline-block;
    letter-spacing: 0.5px;
}

.date-mobile[b-gb32pcqz6k] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #6c757d;
    font-size: 0.85rem;
}

.card-body-row[b-gb32pcqz6k] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

.info-group[b-gb32pcqz6k] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

    .info-group i[b-gb32pcqz6k] {
        color: var(--primary-color);
        font-size: 1.25rem;
        margin-top: 0.25rem;
    }

.info-content[b-gb32pcqz6k] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    .info-content label[b-gb32pcqz6k] {
        font-size: 0.75rem;
        color: #6c757d;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .info-content span[b-gb32pcqz6k] {
        font-size: 0.9rem;
        color: #2c3e50;
        font-weight: 600;
    }

.amount-mobile[b-gb32pcqz6k] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
}

.card-divider[b-gb32pcqz6k] {
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, var(--secondary-color) 50%, transparent 100%);
    margin: 1rem 0;
}

.card-details-grid[b-gb32pcqz6k] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.detail-row[b-gb32pcqz6k] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.85rem;
    color: #2c3e50;
}

    .detail-row i[b-gb32pcqz6k] {
        color: #6c757d;
        width: 20px;
        text-align: center;
    }

.card-actions[b-gb32pcqz6k] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.btn-action-mobile[b-gb32pcqz6k] {
    background: white;
    border: 2px solid var(--secondary-color);
    color: var(--primary-color);
    padding: 0.6rem 1rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
}

    .btn-action-mobile:hover[b-gb32pcqz6k] {
        background: var(--primary-color);
        color: white;
        border-color: var(--primary-color);
    }

    .btn-action-mobile i[b-gb32pcqz6k] {
        font-size: 1rem;
    }

/* ==================== RESPONSIVE BREAKPOINTS ==================== */

/* Switch to mobile card view on tablets and smaller */
@@media (max-width: 992px) {
    .desktop-view[b-gb32pcqz6k] {
        display: none !important;
    }

    .mobile-view[b-gb32pcqz6k] {
        display: block !important;
    }
}

/* Tablet and below - Ensure horizontal scroll */
@@media (max-width: 992px) {
    .checks-table-container[b-gb32pcqz6k] {
        overflow-x: auto;
        border: 1px solid #e9ecef;
        border-radius: 8px;
        background: white;
    }

    .checks-table-modern[b-gb32pcqz6k] {
        min-width: 900px; /* Ensure minimum width for readability */
    }
    /* Visual scroll indicator on right edge */
    .desktop-view .checks-table-container[b-gb32pcqz6k]::after {
        content: '\21C4'; /* Left-right arrow symbol */
        position: sticky;
        right: 0;
        top: 50%;
        float: right;
        transform: translateY(-50%);
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
        padding: 0.5rem 0.75rem;
        border-radius: 20px 0 0 20px;
        font-size: 1rem;
        font-weight: 700;
        z-index: 10;
        box-shadow: -2px 2px 8px rgba(139, 0, 0, 0.3);
        animation: pulseScroll 2s ease-in-out infinite;
        pointer-events: none;
    }

    @@keyframes pulseScroll {
        0%[b-gb32pcqz6k], 100%[b-gb32pcqz6k] {
            opacity: 0.6;
            transform: translateY(-50%) scale(0.95);
        }

        50%[b-gb32pcqz6k] {
            opacity: 1;
            transform: translateY(-50%) scale(1.05);
        }
    }
}

/* Small mobile adjustments for cards */
@@media (max-width: 576px) {
    .card-body-row[b-gb32pcqz6k] {
        grid-template-columns: 1fr;
    }

    .check-card[b-gb32pcqz6k] {
        padding: 1rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/AccoutsReceivable/Ledger.razor.rz.scp.css */
/* Content Card */
.content-card[b-mbjka84blo] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Card Header */
.card-header-custom[b-mbjka84blo] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-mbjka84blo] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-mbjka84blo] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-mbjka84blo] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Page Header */
.page-header[b-mbjka84blo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-mbjka84blo] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-mbjka84blo] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-mbjka84blo] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-mbjka84blo]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-mbjka84blo] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-mbjka84blo] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-mbjka84blo] {
    color: #6c757d;
}

/* Summary Cards */
[b-mbjka84blo] .summary-card {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1.5rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
}

[b-mbjka84blo] .summary-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

[b-mbjka84blo] .summary-card .card-icon {
    width: 64px;
    height: 64px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
    flex-shrink: 0;
}

[b-mbjka84blo] .summary-card .card-icon i {
    font-size: 1.75rem;
    color: white;
}

[b-mbjka84blo] .summary-card .card-content {
    flex: 1;
}

[b-mbjka84blo] .summary-card .card-title {
    font-size: 0.875rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

[b-mbjka84blo] .summary-card .card-value {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--primary-color);
    line-height: 1.2;
    margin-bottom: 0.25rem;
}

[b-mbjka84blo] .summary-card .card-subtitle {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 500;
}

/* Filter Section */
[b-mbjka84blo] .filter-section {
    margin-bottom: 1.5rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 12px;
    border: 2px solid #dee2e6;
}

[b-mbjka84blo] .search-box {
    position: relative;
    width: 100%;
}

[b-mbjka84blo] .search-box i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--secondary-color);
    pointer-events: none;
}

[b-mbjka84blo] .search-box input {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

[b-mbjka84blo] .search-box input:focus {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

[b-mbjka84blo] .search-box input:disabled {
    background-color: #f8f9fa;
    cursor: not-allowed;
}

/* Buttons */
.btn[b-mbjka84blo] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-mbjka84blo] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

    .btn-primary:hover[b-mbjka84blo] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

[b-mbjka84blo] .btn-filter {
    background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
    color: white;
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
}

[b-mbjka84blo] .btn-filter:hover:not(:disabled) {
    background: linear-gradient(135deg, #a00000 0%, var(--primary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.2);
    color: white;
}

.btn-secondary[b-mbjka84blo] {
    background-color: #6c757d;
    border: none;
}

    .btn-secondary:hover[b-mbjka84blo] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

[b-mbjka84blo] .btn-reset {
    background-color: #6c757d;
    color: white;
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
}

[b-mbjka84blo] .btn-reset:hover:not(:disabled) {
    background-color: #5c636a;
    transform: translateY(-2px);
    color: white;
}

[b-mbjka84blo] .btn-filter:disabled,
[b-mbjka84blo] .btn-reset:disabled,
.btn-secondary:disabled[b-mbjka84blo] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

/* Active Filters */
[b-mbjka84blo] .active-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    background: white;
    border-radius: 8px;
    border: 2px solid #e9ecef;
}

[b-mbjka84blo] .filter-label {
    font-weight: 600;
    color: #495057;
    font-size: 0.9rem;
}

[b-mbjka84blo] .filter-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.85rem;
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
}

[b-mbjka84blo] .filter-tag i {
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.2s;
}

[b-mbjka84blo] .filter-tag i:hover {
    opacity: 1;
}

/* Table Styles */
[b-mbjka84blo] .ledger-table-container {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

[b-mbjka84blo] .ledger-table-modern {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

[b-mbjka84blo] .ledger-table-modern thead {
    background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
    color: white;
}

[b-mbjka84blo] .ledger-table-modern thead th {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

[b-mbjka84blo] .ledger-table-modern thead th:first-child {
    border-top-left-radius: 12px;
}

[b-mbjka84blo] .ledger-table-modern thead th:last-child {
    border-top-right-radius: 12px;
}

[b-mbjka84blo] .ledger-table-modern tbody tr.main-row {
    background: white;
    transition: all 0.2s;
    border-bottom: 1px solid #e9ecef;
}

[b-mbjka84blo] .ledger-table-modern tbody tr.main-row:hover {
    background: #f8f9fa;
    transform: scale(1.001);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

[b-mbjka84blo] .ledger-table-modern tbody tr.main-row.transaction-payment-row {
    border-left: 4px solid #28a745;
}

[b-mbjka84blo] .ledger-table-modern tbody tr.main-row.transaction-invoice-row {
    border-left: 4px solid var(--secondary-color);
}

[b-mbjka84blo] .ledger-table-modern tbody td {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
}

/* Expandable Button */
[b-mbjka84blo] .btn-expand {
    background: none;
    border: none;
    padding: 0.25rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: transform 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-mbjka84blo] .btn-expand i {
    font-size: 1rem;
    transition: transform 0.2s;
}

[b-mbjka84blo] .btn-expand.expanded i {
    transform: rotate(90deg);
}

[b-mbjka84blo] .btn-expand:hover {
    background: rgba(212, 175, 55, 0.15);
    border-radius: 4px;
}

/* Reference Code */
[b-mbjka84blo] .reference-code {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 0.95rem;
    font-family: 'Courier New', monospace;
}

/* Date Display */
[b-mbjka84blo] .date-wrapper {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

[b-mbjka84blo] .date-wrapper i {
    font-size: 0.875rem;
    color: var(--secondary-color);
}

/* Action Button */
[b-mbjka84blo] .btn-action-icon {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

[b-mbjka84blo] .btn-action-icon:hover {
    background: var(--primary-color);
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
}

/* Amount Highlight */
[b-mbjka84blo] .amount-highlight {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1rem;
}

/* Balance Highlight */
[b-mbjka84blo] .balance-highlight {
    font-weight: 700;
    font-size: 1rem;
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
}

[b-mbjka84blo] .balance-highlight.has-balance {
    background: linear-gradient(135deg, var(--secondary-color) 0%, #e6c557 100%);
    color: var(--primary-color);
}

[b-mbjka84blo] .balance-highlight.no-balance {
    background: linear-gradient(135deg, #28a745 0%, #218838 100%);
    color: white;
}

/* Expandable Row Styles */
[b-mbjka84blo] .expandable-row {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
}

[b-mbjka84blo] .expandable-row td {
    padding: 0 !important;
}

[b-mbjka84blo] .expanded-content {
    padding: 2rem;
    border-top: 2px solid var(--secondary-color);
}

[b-mbjka84blo] .detail-section {
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 2px dashed #dee2e6;
}

[b-mbjka84blo] .detail-section:last-child {
    margin-bottom: 0;
    border-bottom: none;
}

[b-mbjka84blo] .section-title {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
}

    [b-mbjka84blo] .section-title i {
        color: var(--secondary-color);
    }

[b-mbjka84blo] .detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

[b-mbjka84blo] .detail-item {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

[b-mbjka84blo] .detail-item label {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    [b-mbjka84blo] .detail-item label i {
        color: var(--secondary-color);
    }

[b-mbjka84blo] .detail-item span {
    font-size: 0.95rem;
    color: #212529;
    font-weight: 500;
}

/* Mobile Card View */
[b-mbjka84blo] .ledger-cards-container {
    display: none;
}

[b-mbjka84blo] .ledger-card {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    margin-bottom: 1rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    cursor: pointer;
    border: 1px solid rgba(0,0,0,0.05);
    border-left: 4px solid transparent;
}

[b-mbjka84blo] .ledger-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

[b-mbjka84blo] .ledger-card.payment-card {
    border-left-color: #28a745;
}

[b-mbjka84blo] .ledger-card.invoice-card {
    border-left-color: var(--secondary-color);
}

[b-mbjka84blo] .card-header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid #f1f3f5;
}

[b-mbjka84blo] .transaction-info {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

[b-mbjka84blo] .date-mobile {
    font-size: 0.85rem;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

    [b-mbjka84blo] .date-mobile i {
        color: var(--secondary-color);
    }

[b-mbjka84blo] .type-badge {
    font-size: 0.8rem;
    font-weight: 700;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
}

[b-mbjka84blo] .balance-status {
    font-weight: 700;
    font-size: 1.1rem;
}

[b-mbjka84blo] .balance-status.outstanding {
    color: var(--secondary-color);
}

[b-mbjka84blo] .balance-status.settled {
    color: #28a745;
}

[b-mbjka84blo] .card-body-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

[b-mbjka84blo] .info-group {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

[b-mbjka84blo] .info-group i {
    color: var(--secondary-color);
    font-size: 1.25rem;
    margin-top: 0.25rem;
}

[b-mbjka84blo] .info-content {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
}

[b-mbjka84blo] .info-content label {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

[b-mbjka84blo] .info-content span {
    font-size: 0.9rem;
    font-weight: 500;
    color: #212529;
}

[b-mbjka84blo] .card-divider {
    height: 2px;
    background: linear-gradient(90deg, transparent, #dee2e6, transparent);
    margin: 1rem 0;
}

[b-mbjka84blo] .card-financial-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

[b-mbjka84blo] .financial-item {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.75rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 8px;
}

[b-mbjka84blo] .financial-item label {
    font-size: 0.7rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

[b-mbjka84blo] .amount-mobile {
    font-weight: 700;
    font-size: 0.95rem;
}

[b-mbjka84blo] .balance-mobile {
    font-weight: 700;
    font-size: 0.95rem;
}

[b-mbjka84blo] .balance-mobile.outstanding {
    color: var(--secondary-color);
}

[b-mbjka84blo] .balance-mobile.settled {
    color: #28a745;
}

/* Pagination */
[b-mbjka84blo] .pagination-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
    border-top: 2px solid #dee2e6;
}

[b-mbjka84blo] .showing-entries {
    font-size: 0.9rem;
    color: #495057;
    font-weight: 500;
}

[b-mbjka84blo] .showing-entries span {
    font-weight: 700;
    color: var(--primary-color);
}

[b-mbjka84blo] .pagination {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

[b-mbjka84blo] .page-item {
    margin: 0;
}

[b-mbjka84blo] .page-link {
    padding: 0.65rem 1rem;
    border: 2px solid #e9ecef;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

[b-mbjka84blo] .page-link:hover:not(:disabled) {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

[b-mbjka84blo] .page-item.active .page-link {
    background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
    color: white;
    border-color: var(--primary-color);
}

[b-mbjka84blo] .page-item.disabled .page-link,
[b-mbjka84blo] .page-link:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

/* Filter Modal */
[b-mbjka84blo] .filter-modal-label {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    [b-mbjka84blo] .filter-modal-label i {
        color: var(--secondary-color);
    }

/* Form Controls in Modal */
.form-control-custom[b-mbjka84blo],
.form-select-custom[b-mbjka84blo] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control-custom:focus[b-mbjka84blo],
    .form-select-custom:focus[b-mbjka84blo] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

[b-mbjka84blo] .btn-primary-filter {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    transition: all 0.3s ease;
}

[b-mbjka84blo] .btn-primary-filter:hover {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* Modal Styles */
.modal-content[b-mbjka84blo] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-mbjka84blo] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
    background: white;
}

.modal-title[b-mbjka84blo] {
    color: var(--primary-color);
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .modal-title i[b-mbjka84blo] {
        color: var(--secondary-color);
    }

.modal-footer[b-mbjka84blo] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Alert Styles */
[b-mbjka84blo] .alert {
    border-radius: 8px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    border: 2px solid;
}

[b-mbjka84blo] .alert-info {
    background: linear-gradient(135deg, #e7f3ff 0%, #cce5ff 100%);
    border-color: #b3d9ff;
    color: #004085;
}

    [b-mbjka84blo] .alert-info i {
        color: #0066cc;
    }

/* Responsive Design */
@media (max-width: 768px) {
    .page-title[b-mbjka84blo] {
        font-size: 1.5rem;
    }

        .page-title i[b-mbjka84blo] {
            font-size: 1.5rem;
        }

    .content-card[b-mbjka84blo] {
        padding: 1.5rem;
    }

    [b-mbjka84blo] .filter-section {
        padding: 1rem;
    }

    [b-mbjka84blo] .ledger-table-container.desktop-view {
        display: none;
    }

    [b-mbjka84blo] .ledger-cards-container.mobile-view {
        display: block;
    }

    [b-mbjka84blo] .pagination-wrapper {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }

    [b-mbjka84blo] .pagination {
        justify-content: center;
        flex-wrap: wrap;
    }

    [b-mbjka84blo] .summary-card {
        padding: 1rem;
    }

    [b-mbjka84blo] .summary-card .card-icon {
        width: 48px;
        height: 48px;
    }

    [b-mbjka84blo] .summary-card .card-icon i {
        font-size: 1.25rem;
    }

    [b-mbjka84blo] .summary-card .card-value {
        font-size: 1.5rem;
    }

    [b-mbjka84blo] .card-financial-grid {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 769px) {
    [b-mbjka84blo] .ledger-table-container.desktop-view {
        display: block;
    }

    [b-mbjka84blo] .ledger-cards-container.mobile-view {
        display: none;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/AccoutsReceivable/Payment.razor.rz.scp.css */
/* Content Card */
.content-card[b-5lwbuumcz8] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Card Header */
.card-header-custom[b-5lwbuumcz8] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-5lwbuumcz8] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-5lwbuumcz8] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-5lwbuumcz8] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Form Controls */
.form-label[b-5lwbuumcz8] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

    .form-label i[b-5lwbuumcz8] {
        color: var(--secondary-color);
    }

.form-control-custom[b-5lwbuumcz8], .form-select-custom[b-5lwbuumcz8] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control-custom:focus[b-5lwbuumcz8], .form-select-custom:focus[b-5lwbuumcz8] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Sales Reference Panel */
.sales-reference-panel[b-5lwbuumcz8] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid rgba(212, 175, 55, 0.4);
    border-left: 4px solid var(--secondary-color);
    border-radius: 10px;
    padding: 1.25rem 1.5rem;
}

.sales-ref-label[b-5lwbuumcz8] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--primary-color);
    margin-bottom: 0.6rem;
}

    .sales-ref-label i[b-5lwbuumcz8] {
        color: var(--secondary-color);
        font-size: 1.1rem;
    }

.sales-ref-input[b-5lwbuumcz8] {
    font-weight: 600;
    background: white !important;
}

.btn-search-ref[b-5lwbuumcz8] {
    background: var(--primary-color);
    color: white;
    border: none;
    border-radius: 8px;
    padding: 0 1.25rem;
    font-weight: 600;
    font-size: 0.9rem;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    transition: all 0.2s ease;
}

    .btn-search-ref:hover[b-5lwbuumcz8] {
        background: var(--primary-color);
        opacity: 0.85;
        color: white;
        transform: translateY(-1px);
    }

/* Section Divider */
.section-divider[b-5lwbuumcz8] {
    margin: 2rem 0 1.5rem;
    padding-top: 1.5rem;
    border-top: 2px dashed #dee2e6;
}

.section-title[b-5lwbuumcz8] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
}

    .section-title i[b-5lwbuumcz8] {
        color: var(--secondary-color);
    }

/* Totals Display */
.totals-display[b-5lwbuumcz8] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid var(--secondary-color);
    border-radius: 12px;
    padding: 1.25rem;
    margin-top: 1.85rem;
}

.total-item[b-5lwbuumcz8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
}

    .total-item.balance[b-5lwbuumcz8] {
        border-top: 2px solid var(--primary-color);
        padding-top: 1rem;
        margin-top: 0.5rem;
    }

.total-label[b-5lwbuumcz8] {
    font-weight: 600;
    color: #495057;
    font-size: 0.95rem;
}

.total-value[b-5lwbuumcz8] {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--primary-color);
}

/* Action Buttons */
.action-buttons-container[b-5lwbuumcz8] {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 2px solid #f1f3f5;
}

.btn[b-5lwbuumcz8] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-5lwbuumcz8] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

    .btn-primary:hover[b-5lwbuumcz8] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.btn-secondary[b-5lwbuumcz8] {
    background-color: #6c757d;
    border: none;
}

    .btn-secondary:hover[b-5lwbuumcz8] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

.btn-warning[b-5lwbuumcz8] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #495057;
    border: none;
}

    .btn-warning:hover[b-5lwbuumcz8] {
        background: linear-gradient(135deg, #e0a800 0%, #ffc107 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(255, 193, 7, 0.4);
        color: #495057;
    }

.btn-info[b-5lwbuumcz8] {
    background: linear-gradient(135deg, #0dcaf0 0%, #0aa2c0 100%);
    color: white;
    border: none;
}

    .btn-info:hover[b-5lwbuumcz8] {
        background: linear-gradient(135deg, #0aa2c0 0%, #0dcaf0 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(13, 202, 240, 0.4);
        color: white;
    }

/* Page Header */
.page-header[b-5lwbuumcz8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-5lwbuumcz8] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-5lwbuumcz8] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-5lwbuumcz8] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-5lwbuumcz8]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-5lwbuumcz8] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-5lwbuumcz8] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-5lwbuumcz8] {
    color: #6c757d;
}

/* Print Voucher Styles */
.print-voucher[b-5lwbuumcz8] {
    padding: 40px;
    background: #e8f0f8;
    font-family: Arial, sans-serif;
}

.voucher-header[b-5lwbuumcz8] {
    text-align: center;
    margin-bottom: 10px;
}

.company-name[b-5lwbuumcz8] {
    font-size: 24px;
    font-weight: bold;
    margin: 0;
    color: #000;
}

.company-address[b-5lwbuumcz8] {
    font-size: 16px;
    margin: 5px 0 0;
    color: #000;
}

.document-title[b-5lwbuumcz8] {
    text-align: center;
    margin: 20px 0;
}

    .document-title h4[b-5lwbuumcz8] {
        font-size: 20px;
        font-weight: bold;
        margin: 0;
        color: #000;
    }

.voucher-divider[b-5lwbuumcz8] {
    border: none;
    border-top: 2px solid #000;
    margin: 20px 0;
}

.voucher-details[b-5lwbuumcz8] {
    margin: 25px 0;
}

.detail-row[b-5lwbuumcz8] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
}

.detail-item[b-5lwbuumcz8] {
    flex: 1;
    display: flex;
    gap: 10px;
}

    .detail-item.full-width[b-5lwbuumcz8] {
        flex: 2;
    }

.detail-label[b-5lwbuumcz8] {
    font-weight: bold;
    min-width: 80px;
    color: #000;
}

.detail-value[b-5lwbuumcz8] {
    color: #000;
}

.particulars-section[b-5lwbuumcz8] {
    margin: 25px 0;
}

.section-heading[b-5lwbuumcz8] {
    font-weight: bold;
    margin-bottom: 15px;
    color: #000;
    font-size: 16px;
}

.particulars-table[b-5lwbuumcz8] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
    background: white;
}

    .particulars-table th[b-5lwbuumcz8],
    .particulars-table td[b-5lwbuumcz8] {
        border: 1px solid #000;
        padding: 10px;
        text-align: left;
        color: #000;
    }

    .particulars-table th[b-5lwbuumcz8] {
        background-color: #d0d0d0;
        font-weight: bold;
    }

    .particulars-table .text-end[b-5lwbuumcz8] {
        text-align: right;
    }

.signatures-section[b-5lwbuumcz8] {
    display: flex;
    justify-content: space-between;
    margin-top: 50px;
    gap: 20px;
}

.signature-box[b-5lwbuumcz8] {
    flex: 1;
    text-align: center;
}

.signature-label[b-5lwbuumcz8] {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 40px;
    color: #000;
}

.signature-line[b-5lwbuumcz8] {
    /*border-bottom: 2px solid #000;*/
    margin: 0 10px 8px;
}

.signature-name[b-5lwbuumcz8] {
    font-size: 13px;
    color: #000;
}

.signature-subtitle[b-5lwbuumcz8] {
    font-size: 11px;
    font-style: italic;
    margin-top: 5px;
    color: #000;
}

/* Modal Styles */
.modal-content[b-5lwbuumcz8] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-xl[b-5lwbuumcz8] {
    max-width: 900px;
}

.modal-header[b-5lwbuumcz8] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-5lwbuumcz8] {
    padding: 0;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-5lwbuumcz8] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Toast */
.toast[b-5lwbuumcz8] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Accounting Entries Styles */
.accounting-entries-container[b-5lwbuumcz8] {
    background: white;
    border: 2px solid #e9ecef;
    border-radius: 12px;
    padding: 1.25rem;
    height: 100%;
    transition: all 0.3s ease;
}

    .accounting-entries-container:hover[b-5lwbuumcz8] {
        border-color: var(--secondary-color);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.1);
    }

.entries-header[b-5lwbuumcz8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #f1f3f5;
}

.entries-title[b-5lwbuumcz8] {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
}

    .entries-title i[b-5lwbuumcz8] {
        color: var(--secondary-color);
    }

.btn-add-entry[b-5lwbuumcz8] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.4rem 0.8rem;
    font-size: 0.85rem;
    font-weight: 600;
    border-radius: 6px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

    .btn-add-entry:hover[b-5lwbuumcz8] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-1px);
        box-shadow: 0 3px 8px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.entry-row[b-5lwbuumcz8] {
    margin-bottom: 0.75rem;
}

.entry-fields[b-5lwbuumcz8] {
    display: grid;
    grid-template-columns: 2fr 1fr auto;
    gap: 0.5rem;
    align-items: start;
}

.entry-account input[b-5lwbuumcz8],
.entry-amount input[b-5lwbuumcz8] {
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 0.5rem;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

    .entry-account input:focus[b-5lwbuumcz8],
    .entry-amount input:focus[b-5lwbuumcz8] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.15rem rgba(212, 175, 55, 0.15);
        outline: none;
    }

.btn-remove-entry[b-5lwbuumcz8] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
    border: none;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    transition: all 0.3s ease;
    font-size: 0.9rem;
}

    .btn-remove-entry:hover[b-5lwbuumcz8] {
        background: linear-gradient(135deg, #c82333 0%, #bd2130 100%);
        transform: scale(1.05);
        box-shadow: 0 2px 6px rgba(220, 53, 69, 0.4);
    }

.empty-entries-message[b-5lwbuumcz8] {
    text-align: center;
    padding: 2rem 1rem;
    color: #6c757d;
    font-size: 0.9rem;
    font-style: italic;
}

.entries-total[b-5lwbuumcz8] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 2px solid var(--primary-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .entries-total .total-label[b-5lwbuumcz8] {
        font-weight: 700;
        color: #495057;
        font-size: 1rem;
    }

    .entries-total .total-value[b-5lwbuumcz8] {
        font-weight: 700;
        font-size: 1.15rem;
        color: var(--primary-color);
    }

/* Validation Summary */
.validation-summary[b-5lwbuumcz8] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid #dee2e6;
    border-radius: 12px;
    padding: 1.25rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    transition: all 0.3s ease;
}

    .validation-summary.balanced[b-5lwbuumcz8] {
        border-color: #28a745;
        background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
    }

    .validation-summary.unbalanced[b-5lwbuumcz8] {
        border-color: #dc3545;
        background: linear-gradient(135deg, #f8d7da 0%, #f5c6cb 100%);
    }

    .validation-summary.warning[b-5lwbuumcz8] {
        border-color: #ffc107;
        background: linear-gradient(135deg, #fff3cd 0%, #ffeaa7 100%);
    }

.validation-item[b-5lwbuumcz8] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    .validation-item.validation-status[b-5lwbuumcz8] {
        grid-column: 1 / -1;
        border-top: 2px solid rgba(0,0,0,0.1);
        padding-top: 1rem;
        margin-top: 0.5rem;
    }

.validation-label[b-5lwbuumcz8] {
    font-weight: 600;
    color: #495057;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.validation-value[b-5lwbuumcz8] {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--primary-color);
}

    .validation-item.validation-status .validation-value[b-5lwbuumcz8] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 1rem;
    }

/* Print Preview Updates */
.particulars-section p[b-5lwbuumcz8] {
    margin: 0.5rem 0;
    font-size: 14px;
}

    .particulars-section p strong[b-5lwbuumcz8] {
        color: #000;
        font-weight: bold;
    }

.total-row[b-5lwbuumcz8] {
    background-color: #f0f0f0;
    font-weight: bold;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-title[b-5lwbuumcz8] {
        font-size: 1.5rem;
    }

    .content-card[b-5lwbuumcz8] {
        padding: 1.5rem;
    }

    .action-buttons-container[b-5lwbuumcz8] {
        flex-direction: column;
    }

        .action-buttons-container .btn[b-5lwbuumcz8] {
            width: 100%;
        }

    .totals-display[b-5lwbuumcz8] {
        margin-top: 0;
    }

    .signatures-section[b-5lwbuumcz8] {
        flex-wrap: wrap;
        gap: 30px;
    }

    .signature-box[b-5lwbuumcz8] {
        flex: 0 0 calc(50% - 15px);
    }

    .print-voucher[b-5lwbuumcz8] {
        padding: 20px;
    }

    .detail-row[b-5lwbuumcz8] {
        flex-direction: column;
        gap: 8px;
    }

    /* Mobile adjustments for accounting entries */
    .entry-fields[b-5lwbuumcz8] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .btn-remove-entry[b-5lwbuumcz8] {
        width: 100%;
    }

    .validation-summary[b-5lwbuumcz8] {
        grid-template-columns: 1fr;
    }

    .entries-header[b-5lwbuumcz8] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .btn-add-entry[b-5lwbuumcz8] {
        width: 100%;
        justify-content: center;
    }
}

@media print {
    body *[b-5lwbuumcz8] {
        visibility: hidden;
    }

    .print-voucher[b-5lwbuumcz8], .print-voucher *[b-5lwbuumcz8] {
        visibility: visible;
    }

    .print-voucher[b-5lwbuumcz8] {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        background: white;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/AccoutsReceivable/PrintAR.razor.rz.scp.css */
/* Add New Button */
.add-new-btn[b-dr7nz0uac6] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-dr7nz0uac6] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .add-new-btn i[b-dr7nz0uac6] {
        font-size: 1.1rem;
    }
/* Search Section Styles */
.search-section[b-dr7nz0uac6] {
    background: white;
    padding: 1.5rem;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.08);
    margin-bottom: 1.5rem;
}

    .search-section h5[b-dr7nz0uac6] {
        color: var(--primary-color);
        margin-bottom: 1rem;
        font-weight: 600;
    }

.search-btn[b-dr7nz0uac6] {
    background-color: var(--primary-color);
    color: white;
    border: none;
    padding: 0.5rem 1.5rem;
    border-radius: 6px;
    transition: all 0.3s ease;
}

    .search-btn:hover[b-dr7nz0uac6] {
        background-color: var(--accent-color);
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(139, 0, 0, 0.3);
    }

.reset-btn[b-dr7nz0uac6] {
    background-color: #6c757d;
    color: white;
    border: none;
    padding: 0.5rem 1.5rem;
    border-radius: 6px;
    transition: all 0.3s ease;
}

    .reset-btn:hover[b-dr7nz0uac6] {
        background-color: #5a6268;
    }

/* Table Styles */
.voucher-table-section[b-dr7nz0uac6] {
    background: white;
    padding: 1.5rem;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.08);
}

.table-responsive[b-dr7nz0uac6] {
    border-radius: 8px;
    /*overflow: hidden;*/
}

.voucher-table[b-dr7nz0uac6] {
    margin-bottom: 0;
}

    .voucher-table thead[b-dr7nz0uac6] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
    }

.voucher-table thead th[b-dr7nz0uac6] {
    font-weight: 600;
    padding: 1rem;
    border: none;
    white-space: nowrap;
}

.voucher-table tbody tr[b-dr7nz0uac6] {
    transition: all 0.2s ease;
}

.voucher-table tbody tr:hover[b-dr7nz0uac6] {
    background-color: rgba(139, 0, 0, 0.05);
}

.voucher-table tbody td[b-dr7nz0uac6] {
padding: 0.875rem 1rem;
vertical-align: middle;
}

.status-badge[b-dr7nz0uac6] {
    padding: 0.375rem 0.75rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    display: inline-block;
}

.status-completed[b-dr7nz0uac6] {
    background-color: #d4edda;
    color: #155724;
}

.status-pending[b-dr7nz0uac6] {
    background-color: #fff3cd;
    color: #856404;
}

.status-progress[b-dr7nz0uac6] {
    background-color: #d1ecf1;
    color: #0c5460;
}

.status-cancelled[b-dr7nz0uac6] {
    background-color: #f8d7da;
    color: #721c24;
}

.preview-btn[b-dr7nz0uac6] {
    background-color: var(--secondary-color);
    color: var(--primary-color);
    border: none;
    padding: 0.375rem 0.875rem;
    border-radius: 5px;
    font-size: 0.85rem;
    font-weight: 600;
    transition: all 0.2s ease;
    cursor: pointer;
}

    .preview-btn:hover[b-dr7nz0uac6] {
        background-color: var(--secondary-color);
        transform: translateY(-2px);
        box-shadow: 0 3px 6px rgba(212, 175, 55, 0.3);
    }

/* Modal Styles */
.modal-header[b-dr7nz0uac6] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
}

    .modal-header .btn-close[b-dr7nz0uac6] {
        filter: brightness(0) invert(1);
    }

.modal-xl[b-dr7nz0uac6] {
    max-width: 1000px;
}

/* Voucher Print Preview */
.voucher-preview[b-dr7nz0uac6] {
    width: 8.5in;
    min-height: 11in;
    margin: 0 auto;
    padding: 0.75in;
    background: white;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    position: relative;
}

.voucher-header[b-dr7nz0uac6] {
    text-align: center;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 3px solid var(--primary-color);
}

    .voucher-header h2[b-dr7nz0uac6] {
        color: var(--primary-color);
        font-weight: 700;
        margin-bottom: 0.5rem;
        font-size: 1.75rem;
    }

    .voucher-header .voucher-number[b-dr7nz0uac6] {
        color: var(--secondary-color);
        font-weight: 600;
        font-size: 1.1rem;
    }

.voucher-info-grid[b-dr7nz0uac6] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.voucher-info-item[b-dr7nz0uac6] {
    display: flex;
    padding: 0.5rem 0;
    border-bottom: 1px solid #e9ecef;
}

.voucher-info-label[b-dr7nz0uac6] {
    font-weight: 600;
    color: var(--primary-color);
    width: 120px;
    flex-shrink: 0;
}

.voucher-info-value[b-dr7nz0uac6] {
    color: #333;
    flex: 1;
}

.voucher-details-section[b-dr7nz0uac6] {
    margin: 1.5rem 0;
}

    .voucher-details-section h4[b-dr7nz0uac6] {
        color: var(--primary-color);
        font-size: 1.1rem;
        font-weight: 600;
        margin-bottom: 1rem;
        padding-bottom: 0.5rem;
        border-bottom: 2px solid var(--secondary-color);
    }

.amount-section[b-dr7nz0uac6] {
    background: #f8f9fa;
    padding: 1rem;
    border-radius: 6px;
    margin: 1rem 0;
    border-left: 4px solid var(--secondary-color);
}

    .amount-section .amount-label[b-dr7nz0uac6] {
        font-weight: 600;
        color: var(--primary-color);
        font-size: 0.95rem;
    }

    .amount-section .amount-value[b-dr7nz0uac6] {
        font-size: 1.5rem;
        font-weight: 700;
        color: var(--primary-color);
        margin-top: 0.25rem;
    }

.voucher-footer[b-dr7nz0uac6] {
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 2px solid #dee2e6;
}

.signature-section[b-dr7nz0uac6] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    margin-top: 1.5rem;
}

.signature-block[b-dr7nz0uac6] {
    text-align: center;
}

.signature-line[b-dr7nz0uac6] {
    border-top: 2px solid #333;
    margin-top: 3rem;
    padding-top: 0.5rem;
    font-weight: 600;
    color: #333;
}

.signature-title[b-dr7nz0uac6] {
    font-size: 0.85rem;
    color: #6c757d;
    margin-top: 0.25rem;
}

.print-btn[b-dr7nz0uac6] {
    background-color: var(--primary-color);
    color: white;
    border: none;
    padding: 0.5rem 1.5rem;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
}

    .print-btn:hover[b-dr7nz0uac6] {
        background-color: var(--accent-color);
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(139, 0, 0, 0.3);
    }


/* Print Voucher Styles */
.print-voucher[b-dr7nz0uac6] {
    padding: 40px;
    background: #e8f0f8;
    font-family: Arial, sans-serif;
}

.voucher-header[b-dr7nz0uac6] {
    text-align: center;
    margin-bottom: 10px;
}

.company-name[b-dr7nz0uac6] {
    font-size: 24px;
    font-weight: bold;
    margin: 0;
    color: #000;
}

.company-address[b-dr7nz0uac6] {
    font-size: 16px;
    margin: 5px 0 0;
    color: #000;
}

.document-title[b-dr7nz0uac6] {
    text-align: center;
    margin: 20px 0;
}

    .document-title h4[b-dr7nz0uac6] {
        font-size: 20px;
        font-weight: bold;
        margin: 0;
        color: #000;
    }

.voucher-divider[b-dr7nz0uac6] {
    border: none;
    border-top: 2px solid #000;
    margin: 20px 0;
}

.voucher-details[b-dr7nz0uac6] {
    margin: 25px 0;
}

.detail-row[b-dr7nz0uac6] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
}

.detail-item[b-dr7nz0uac6] {
    flex: 1;
    display: flex;
    gap: 10px;
}

    .detail-item.full-width[b-dr7nz0uac6] {
        flex: 2;
    }

.detail-label[b-dr7nz0uac6] {
    font-weight: bold;
    min-width: 80px;
    color: #000;
}

.detail-value[b-dr7nz0uac6] {
    color: #000;
}

.particulars-section[b-dr7nz0uac6] {
    margin: 25px 0;
}

.section-heading[b-dr7nz0uac6] {
    font-weight: bold;
    margin-bottom: 15px;
    color: #000;
    font-size: 16px;
}

.particulars-table[b-dr7nz0uac6] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
    background: white;
}

    .particulars-table th[b-dr7nz0uac6],
    .particulars-table td[b-dr7nz0uac6] {
        border: 1px solid #000;
        padding: 10px;
        text-align: left;
        color: #000;
    }

    .particulars-table th[b-dr7nz0uac6] {
        background-color: #d0d0d0;
        font-weight: bold;
    }

    .particulars-table .text-end[b-dr7nz0uac6] {
        text-align: right;
    }

.signatures-section[b-dr7nz0uac6] {
    display: flex;
    justify-content: space-between;
    margin-top: 50px;
    gap: 20px;
}

.signature-box[b-dr7nz0uac6] {
    flex: 1;
    text-align: center;
}

.signature-label[b-dr7nz0uac6] {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 40px;
    color: #000;
}

.signature-line[b-dr7nz0uac6] {
    /*border-bottom: 2px solid #000;*/
    margin: 0 10px 8px;
}

.signature-name[b-dr7nz0uac6] {
    font-size: 13px;
    color: #000;
}

.signature-subtitle[b-dr7nz0uac6] {
    font-size: 11px;
    font-style: italic;
    margin-top: 5px;
    color: #000;
}

/* Modal Styles */
.modal-content[b-dr7nz0uac6] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-xl[b-dr7nz0uac6] {
    max-width: 900px;
}

.modal-header[b-dr7nz0uac6] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-dr7nz0uac6] {
    padding: 0;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-dr7nz0uac6] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-title[b-dr7nz0uac6] {
        font-size: 1.5rem;
    }

    .content-card[b-dr7nz0uac6] {
        padding: 1.5rem;
    }

    .action-buttons-container[b-dr7nz0uac6] {
        flex-direction: column;
    }

        .action-buttons-container .btn[b-dr7nz0uac6] {
            width: 100%;
        }

    .totals-display[b-dr7nz0uac6] {
        margin-top: 0;
    }

    .signatures-section[b-dr7nz0uac6] {
        flex-wrap: wrap;
        gap: 30px;
    }

    .signature-box[b-dr7nz0uac6] {
        flex: 0 0 calc(50% - 15px);
    }

    .print-voucher[b-dr7nz0uac6] {
        padding: 20px;
    }

    .detail-row[b-dr7nz0uac6] {
        flex-direction: column;
        gap: 8px;
    }
}


/* Print Styles */
@media print {
    body *[b-dr7nz0uac6] {
        visibility: hidden;
    }

    .print-voucher[b-dr7nz0uac6], .print-voucher *[b-dr7nz0uac6] {
        visibility: visible;
    }

    .print-voucher[b-dr7nz0uac6] {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        background: white;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/AccoutsReceivable/SearchPickerModal.razor.rz.scp.css */
/* Search Picker Input */
.search-picker-input-wrapper[b-ou1ijl8cj1] {
    position: relative;
    margin-bottom: 1.5rem;
}

    .search-picker-input-wrapper i.bi-search[b-ou1ijl8cj1] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
        pointer-events: none;
    }

.search-picker-input[b-ou1ijl8cj1] {
    padding: 0.75rem 3rem 0.75rem 2.75rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    width: 100%;
}

    .search-picker-input:focus[b-ou1ijl8cj1] {
        outline: none;
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

.clear-search-btn[b-ou1ijl8cj1] {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #6c757d;
    font-size: 1.2rem;
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
    transition: color 0.3s ease;
}

    .clear-search-btn:hover[b-ou1ijl8cj1] {
        color: var(--primary-color);
    }

/* Search Results */
.search-picker-results[b-ou1ijl8cj1] {
    max-height: 400px;
    overflow-y: auto;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    background-color: #f8f9fa;
}

    .search-picker-results[b-ou1ijl8cj1]::-webkit-scrollbar {
        width: 8px;
    }

    .search-picker-results[b-ou1ijl8cj1]::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 4px;
    }

    .search-picker-results[b-ou1ijl8cj1]::-webkit-scrollbar-thumb {
        background: #888;
        border-radius: 4px;
    }

        .search-picker-results[b-ou1ijl8cj1]::-webkit-scrollbar-thumb:hover {
            background: #555;
        }

.search-picker-item[b-ou1ijl8cj1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    border-bottom: 1px solid #e9ecef;
    cursor: pointer;
    transition: all 0.3s ease;
    background-color: white;
}

    .search-picker-item:last-child[b-ou1ijl8cj1] {
        border-bottom: none;
    }

    .search-picker-item:hover[b-ou1ijl8cj1] {
        background-color: #f8f5f0;
        transform: translateX(4px);
        box-shadow: inset 4px 0 0 var(--secondary-color);
    }

    .search-picker-item.selected[b-ou1ijl8cj1] {
        background-color: #fff8e6;
        border-left: 4px solid var(--secondary-color);
        font-weight: 600;
    }

        .search-picker-item.selected:hover[b-ou1ijl8cj1] {
            background-color: #fff3cd;
        }

.search-picker-item-content[b-ou1ijl8cj1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .search-picker-item-content i[b-ou1ijl8cj1] {
        color: var(--primary-color);
        font-size: 1.5rem;
    }

    .search-picker-item-content span[b-ou1ijl8cj1] {
        color: #212529;
        font-size: 0.95rem;
    }

.search-picker-item .bi-check-circle-fill[b-ou1ijl8cj1] {
    font-size: 1.25rem;
}

/* No Results */
.search-picker-no-results[b-ou1ijl8cj1] {
    padding: 3rem 2rem;
    text-align: center;
    color: #6c757d;
}

    .search-picker-no-results i[b-ou1ijl8cj1] {
        font-size: 3rem;
        color: #dee2e6;
        margin-bottom: 1rem;
    }

    .search-picker-no-results p[b-ou1ijl8cj1] {
        margin: 0.5rem 0;
        font-size: 1rem;
        font-weight: 500;
        color: #495057;
    }

    .search-picker-no-results small[b-ou1ijl8cj1] {
        font-size: 0.85rem;
    }

/* Modal Customization */
.modal-content[b-ou1ijl8cj1] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-ou1ijl8cj1] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-ou1ijl8cj1] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-ou1ijl8cj1] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-ou1ijl8cj1] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-ou1ijl8cj1] {
            opacity: 1;
        }

.modal-body[b-ou1ijl8cj1] {
    padding: 2rem;
}

.modal-footer[b-ou1ijl8cj1] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

    .modal-footer .btn[b-ou1ijl8cj1] {
        padding: 0.65rem 1.5rem;
        font-weight: 600;
        border-radius: 8px;
        transition: all 0.3s ease;
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
    }

    .modal-footer .btn-primary[b-ou1ijl8cj1] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        color: var(--primary-color);
        border: none;
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    }

        .modal-footer .btn-primary:hover:not(:disabled)[b-ou1ijl8cj1] {
            background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
            transform: translateY(-2px);
            box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
        }

        .modal-footer .btn-primary:disabled[b-ou1ijl8cj1] {
            opacity: 0.6;
            cursor: not-allowed;
        }

    .modal-footer .btn-secondary[b-ou1ijl8cj1] {
        background-color: #6c757d;
        border: none;
    }

        .modal-footer .btn-secondary:hover[b-ou1ijl8cj1] {
            background-color: #5c636a;
            transform: translateY(-2px);
        }

/* Responsive */
@media (max-width: 768px) {
    .search-picker-results[b-ou1ijl8cj1] {
        max-height: 300px;
    }

    .search-picker-input[b-ou1ijl8cj1] {
        font-size: 0.9rem;
        padding: 0.65rem 3rem 0.65rem 2.5rem;
    }

    .search-picker-item[b-ou1ijl8cj1] {
        padding: 0.85rem;
    }

    .search-picker-item-content span[b-ou1ijl8cj1] {
        font-size: 0.9rem;
    }

    .modal-body[b-ou1ijl8cj1] {
        padding: 1.5rem;
    }

    .modal-footer[b-ou1ijl8cj1] {
        padding: 1rem;
    }

        .modal-footer .btn[b-ou1ijl8cj1] {
            padding: 0.5rem 1rem;
            font-size: 0.9rem;
        }
}
/* _content/AccountingSystem.Web/Components/Pages/AssetType/AssetTypeRegistration.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-iucu363i3j] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-iucu363i3j] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-iucu363i3j] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-iucu363i3j] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-iucu363i3j]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-iucu363i3j] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-iucu363i3j] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-iucu363i3j] {
    color: #6c757d;
}

.add-new-btn[b-iucu363i3j] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.add-new-btn:hover[b-iucu363i3j] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-iucu363i3j] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-iucu363i3j] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-iucu363i3j] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-iucu363i3j] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-iucu363i3j] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-iucu363i3j] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-iucu363i3j] {
    color: var(--secondary-color);
}

.form-control-custom[b-iucu363i3j],
.form-select-custom[b-iucu363i3j] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-iucu363i3j],
.form-select-custom:focus[b-iucu363i3j] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-iucu363i3j] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.search-box[b-iucu363i3j] {
    position: relative;
    width: 100%;
}

.search-box i[b-iucu363i3j] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box input[b-iucu363i3j] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-iucu363i3j] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.search-box input:disabled[b-iucu363i3j] {
    background-color: #e9ecef;
    cursor: not-allowed;
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-iucu363i3j] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-iucu363i3j] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-iucu363i3j] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-iucu363i3j] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-iucu363i3j] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn:disabled[b-iucu363i3j] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== TABLE STYLES ==================== */
.asset-types-table-container[b-iucu363i3j] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.asset-types-table[b-iucu363i3j] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.asset-types-table thead[b-iucu363i3j] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.asset-types-table thead th[b-iucu363i3j] {
    font-weight: 600;
    padding: 1rem 0.75rem;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.asset-types-table thead th:first-child[b-iucu363i3j] {
    border-top-left-radius: 12px;
}

.asset-types-table thead th:last-child[b-iucu363i3j] {
    border-top-right-radius: 12px;
}

.asset-types-table tbody tr[b-iucu363i3j] {
    transition: all 0.3s ease;
    border-bottom: 1px solid #e9ecef;
}

.asset-types-table tbody tr:hover[b-iucu363i3j] {
    background-color: #f8f9fa;
}

.asset-types-table tbody td[b-iucu363i3j] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.asset-type-name[b-iucu363i3j] {
    font-weight: 600;
    color: var(--primary-color);
    display: block;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-iucu363i3j] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-iucu363i3j] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

.btn-action-icon:hover[b-iucu363i3j] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

/* ==================== STATUS BADGE ==================== */
.badge[b-iucu363i3j] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== SUMMARY SECTION ==================== */
.table-summary[b-iucu363i3j] {
    display: flex;
    gap: 2rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    flex-wrap: wrap;
    margin-top: 1rem;
}

.summary-item[b-iucu363i3j] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.95rem;
    color: #495057;
}

.summary-item i[b-iucu363i3j] {
    font-size: 1.2rem;
}

.summary-item strong[b-iucu363i3j] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
}

/* ==================== ALERTS ==================== */
.alert[b-iucu363i3j] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-iucu363i3j] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-iucu363i3j] {
    color: var(--secondary-color);
}

.alert-info a[b-iucu363i3j] {
    color: var(--primary-color);
    font-weight: 600;
    text-decoration: underline;
}

.alert-info a:hover[b-iucu363i3j] {
    color: var(--secondary-color);
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-iucu363i3j] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-iucu363i3j] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-iucu363i3j] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-iucu363i3j] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 992px) {
    .action-buttons[b-iucu363i3j] {
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .page-title[b-iucu363i3j] {
        font-size: 1.5rem;
    }

    .content-card[b-iucu363i3j] {
        padding: 1.5rem;
    }

    .filter-section[b-iucu363i3j] {
        padding: 0.75rem;
    }

    .table-summary[b-iucu363i3j] {
        flex-direction: column;
        gap: 1rem;
    }

    .btn-action-icon[b-iucu363i3j] {
        width: 32px;
        height: 32px;
        font-size: 0.9rem;
    }

    .asset-types-table thead th[b-iucu363i3j] {
        padding: 0.75rem 0.5rem;
        font-size: 0.85rem;
    }

    .asset-types-table tbody td[b-iucu363i3j] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }
}

@media (max-width: 576px) {
    .page-header[b-iucu363i3j] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-iucu363i3j] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Auth/Login.razor.rz.scp.css */
/* ========================================
   Login.razor.css (CORRECTED VERSION)
   Scoped styles for the Login component only
   ======================================== */

/* ========================================
   Login Page Wrapper
   Full-screen gradient background container
   ======================================== */
.login-page-wrapper[b-fdms3gpir6] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 50%, var(--accent-color) 100%);
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
}

    .login-page-wrapper[b-fdms3gpir6]::before {
        content: '';
        position: absolute;
        top: -50%;
        right: -50%;
        width: 100%;
        height: 100%;
        background: radial-gradient(circle, rgba(212, 175, 55, 0.1) 0%, transparent 70%);
        animation: pulse-b-fdms3gpir6 15s ease-in-out infinite;
    }

    .login-page-wrapper[b-fdms3gpir6]::after {
        content: '';
        position: absolute;
        bottom: -50%;
        left: -50%;
        width: 100%;
        height: 100%;
        background: radial-gradient(circle, rgba(212, 175, 55, 0.08) 0%, transparent 70%);
        animation: pulse-b-fdms3gpir6 15s ease-in-out infinite reverse;
    }

@keyframes pulse-b-fdms3gpir6 {
    0%, 100% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.1);
        opacity: 0.8;
    }
}



/* ========================================
   Login Header
   ======================================== */
.login-header[b-fdms3gpir6] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    padding: 3rem 2rem 2.5rem;
    text-align: center;
    position: relative;
}

.login-header[b-fdms3gpir6]::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 30px;
    background: white;
    border-radius: 50% 50% 0 0 / 100% 100% 0 0;
}

.logo-container[b-fdms3gpir6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.5rem;
    background: var(--secondary-color);
    padding: 1rem;
    border-radius: 16px;
    box-shadow: 0 8px 20px rgba(212, 175, 55, 0.3);
    animation: iconFloat-b-fdms3gpir6 3s ease-in-out infinite;
}

@keyframes iconFloat-b-fdms3gpir6 {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-10px);
    }
}

.logo-image[b-fdms3gpir6] {
    width: 211px;
    height: 89px;
    object-fit: contain;
}

.system-title[b-fdms3gpir6] {
    color: white;
    font-size: 1.75rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

.system-title:focus[b-fdms3gpir6] {
    outline: none;
    box-shadow: none;
}

.system-subtitle[b-fdms3gpir6] {
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.95rem;
    font-weight: 400;
}










/* ========================================
   Additional Links
   ======================================== */
.additional-links[b-fdms3gpir6] {
    text-align: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

    .additional-links p[b-fdms3gpir6] {
        color: #6c757d;
        font-size: 0.9rem;
        margin: 0;
    }

    .additional-links a[b-fdms3gpir6] {
        color: var(--primary-color);
        text-decoration: none;
        font-weight: 600;
        transition: color 0.3s ease;
    }

        .additional-links a:hover[b-fdms3gpir6] {
            color: var(--accent-color);
            text-decoration: underline;
        }

/* ========================================
   Login Footer
   ======================================== */
.login-footer[b-fdms3gpir6] {
    background: linear-gradient(to bottom, #f8f9fa 0%, #e9ecef 100%);
    padding: 1.5rem 2rem;
    text-align: center;
    border-top: 1px solid #dee2e6;
}

.copyright[b-fdms3gpir6] {
    color: #6c757d;
    font-size: 0.85rem;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
}

    .copyright > i.bi[b-fdms3gpir6] {
        font-size: 0.8rem;
    }

/* ========================================
   Alert Messages
   ======================================== */
.alert-custom[b-fdms3gpir6] {
    display: none;
    border-radius: 10px;
    animation: slideDown-b-fdms3gpir6 0.3s ease-out;
}

.alert-custom.show[b-fdms3gpir6] {
    display: block;
}

.alert-custom i.bi[b-fdms3gpir6] {
    vertical-align: middle;
}

@keyframes slideDown-b-fdms3gpir6 {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ========================================
   Responsive Design
   ======================================== */
@media (max-width: 576px) {
    .login-header[b-fdms3gpir6] {
        padding: 2.5rem 1.5rem 2rem;
    }

    .system-title[b-fdms3gpir6] {
        font-size: 1.5rem;
    }

    .logo-container[b-fdms3gpir6] {
        padding: 0.85rem;
        border-radius: 14px;
    }

    .logo-image[b-fdms3gpir6] {
        width: 169px;
        height: 71px;
    }

    .login-body[b-fdms3gpir6] {
        padding: 2rem 1.5rem 1.5rem;
    }

    .form-options[b-fdms3gpir6] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
}

@media (max-width: 380px) {
    .login-page-wrapper[b-fdms3gpir6] {
        padding: 0.5rem;
    }

    .login-card[b-fdms3gpir6] {
        border-radius: 15px;
    }

    .login-header[b-fdms3gpir6] {
        padding: 2rem 1rem 1.5rem;
    }

    .login-body[b-fdms3gpir6] {
        padding: 1.5rem 1rem;
    }

    .logo-container[b-fdms3gpir6] {
        margin-bottom: 1rem;
        padding: 0.65rem;
        border-radius: 12px;
    }

    .logo-image[b-fdms3gpir6] {
        width: 127px;
        height: 54px;
    }

    .system-title[b-fdms3gpir6] {
        font-size: 1.25rem;
    }

    .system-subtitle[b-fdms3gpir6] {
        font-size: 0.85rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Auth/Logout.razor.rz.scp.css */
/* Full Screen Light Overlay */
.logout-overlay[b-36emhfeu3k] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(248, 249, 250, 0.5);
    backdrop-filter: blur(4px);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: fadeIn-b-36emhfeu3k 0.3s ease-in forwards;
    overflow: hidden;
    -webkit-font-smoothing: antialiased;
    -webkit-touch-callout: none;
    user-select: none;
}

@keyframes fadeIn-b-36emhfeu3k {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Content Container */
.logout-content[b-36emhfeu3k] {
    text-align: center;
    padding: 2rem;
    animation: slideUp-b-36emhfeu3k 0.4s ease-out forwards;
    max-width: 90vw;
    width: 100%;
    max-height: 90vh;
    overflow: auto;
    -webkit-user-select: none;
    user-select: none;
}

@keyframes slideUp-b-36emhfeu3k {
    from {
        transform: translateY(30px);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Circular Spinner Container */
.logout-spinner-container[b-36emhfeu3k] {
    position: relative;
    width: 120px;
    height: 120px;
    margin: 0 auto 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* Circular Progress Spinner - Main */
.logout-spinner[b-36emhfeu3k] {
    width: 120px;
    height: 120px;
    border: 8px solid rgba(212, 175, 55, 0.15);
    border-top: 8px solid var(--secondary-color);
    border-right: 8px solid var(--secondary-color);
    border-bottom: 8px solid rgba(212, 175, 55, 0.4);
    border-radius: 50%;
    animation: spin-b-36emhfeu3k 0.8s linear infinite;
    box-shadow: 0 4px 20px rgba(212, 175, 55, 0.3), inset 0 0 20px rgba(212, 175, 55, 0.1);
    will-change: transform;
    flex-shrink: 0;
}

@keyframes spin-b-36emhfeu3k {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* Optional: Secondary rotating element for enhanced effect */
.logout-spinner[b-36emhfeu3k]::before {
    content: '';
    position: absolute;
    width: 100px;
    height: 100px;
    border: 3px solid transparent;
    border-top: 3px solid rgba(212, 175, 55, 0.6);
    border-radius: 50%;
    animation: spinReverse-b-36emhfeu3k 1.2s linear infinite;
}

@keyframes spinReverse-b-36emhfeu3k {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(-360deg);
    }
}

/* Title Styling */
.logout-title[b-36emhfeu3k] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
    letter-spacing: 0.5px;
    margin-top: 0;
    animation: fadeInText-b-36emhfeu3k 0.6s ease-out 0.2s forwards;
    opacity: 0;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

@keyframes fadeInText-b-36emhfeu3k {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Message Text */
.logout-message[b-36emhfeu3k] {
    color: #6c757d;
    font-size: 1.1rem;
    font-weight: 500;
    margin: 0;
    animation: fadeInText-b-36emhfeu3k 0.6s ease-out 0.4s forwards;
    opacity: 0;
    word-wrap: break-word;
    overflow-wrap: break-word;
    line-height: 1.5;
}

/* Responsive Design - Tablet (768px and below) */
@media (max-width: 768px) {
    .logout-overlay[b-36emhfeu3k] {
        padding: 1rem;
    }

    .logout-content[b-36emhfeu3k] {
        padding: 1.5rem;
        max-width: 100%;
    }

    .logout-spinner-container[b-36emhfeu3k] {
        width: 100px;
        height: 100px;
        margin: 0 auto 1.5rem;
    }

    .logout-spinner[b-36emhfeu3k] {
        width: 100px;
        height: 100px;
        border-width: 6px;
        box-shadow: 0 2px 15px rgba(212, 175, 55, 0.25), inset 0 0 15px rgba(212, 175, 55, 0.08);
    }

    .logout-spinner[b-36emhfeu3k]::before {
        width: 80px;
        height: 80px;
        border-width: 2px;
    }

    .logout-title[b-36emhfeu3k] {
        font-size: 1.5rem;
        margin-bottom: 0.5rem;
    }

    .logout-message[b-36emhfeu3k] {
        font-size: 0.95rem;
    }
}

/* Responsive Design - Mobile (480px and below) */
@media (max-width: 480px) {
    .logout-overlay[b-36emhfeu3k] {
        padding: 0;
    }

    .logout-content[b-36emhfeu3k] {
        padding: 1.5rem 1rem;
        max-width: 100%;
        width: 100%;
    }

    .logout-spinner-container[b-36emhfeu3k] {
        width: 80px;
        height: 80px;
        margin: 1rem auto 1.25rem;
    }

    .logout-spinner[b-36emhfeu3k] {
        width: 80px;
        height: 80px;
        border-width: 5px;
    }

    .logout-spinner[b-36emhfeu3k]::before {
        width: 60px;
        height: 60px;
        border-width: 2px;
    }

    .logout-title[b-36emhfeu3k] {
        font-size: 1.15rem;
        margin-bottom: 0.5rem;
        margin-top: 0;
    }

    .logout-message[b-36emhfeu3k] {
        font-size: 0.85rem;
        margin: 0;
    }
}

/* Ultra Small Devices (below 360px) */
@media (max-width: 360px) {
    .logout-content[b-36emhfeu3k] {
        padding: 1rem 0.75rem;
    }

    .logout-spinner-container[b-36emhfeu3k] {
        width: 70px;
        height: 70px;
        margin: 0.75rem auto 1rem;
    }

    .logout-spinner[b-36emhfeu3k] {
        width: 70px;
        height: 70px;
        border-width: 4px;
    }

    .logout-spinner[b-36emhfeu3k]::before {
        width: 50px;
        height: 50px;
        border-width: 2px;
    }

    .logout-title[b-36emhfeu3k] {
        font-size: 1rem;
    }

    .logout-message[b-36emhfeu3k] {
        font-size: 0.8rem;
    }
}

/* Landscape Orientation - Mobile (max-height: 500px) */
@media (max-height: 500px) and (orientation: landscape) {
    .logout-overlay[b-36emhfeu3k] {
        padding: 0.5rem;
    }

    .logout-content[b-36emhfeu3k] {
        padding: 0.75rem;
        max-height: 95vh;
    }

    .logout-spinner-container[b-36emhfeu3k] {
        width: 60px;
        height: 60px;
        margin: 0 auto 0.75rem;
    }

    .logout-spinner[b-36emhfeu3k] {
        width: 60px;
        height: 60px;
        border-width: 4px;
        box-shadow: 0 1px 10px rgba(212, 175, 55, 0.2);
    }

    .logout-spinner[b-36emhfeu3k]::before {
        width: 45px;
        height: 45px;
        border-width: 2px;
    }

    .logout-title[b-36emhfeu3k] {
        font-size: 1rem;
        margin-bottom: 0.25rem;
    }

    .logout-message[b-36emhfeu3k] {
        font-size: 0.8rem;
    }
}

/* High DPI Devices (Retina Displays) */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logout-spinner[b-36emhfeu3k] {
        border-width: 7px;
    }

    .logout-spinner[b-36emhfeu3k]::before {
        border-width: 2px;
    }
}

/* Prefers reduced motion - Accessibility */
@media (prefers-reduced-motion: reduce) {
    .logout-overlay[b-36emhfeu3k],
    .logout-content[b-36emhfeu3k],
    .logout-spinner[b-36emhfeu3k],
    .logout-spinner[b-36emhfeu3k]::before,
    .logout-title[b-36emhfeu3k],
    .logout-message[b-36emhfeu3k] {
        animation: none !important;
        transition: none !important;
    }

    .logout-spinner[b-36emhfeu3k] {
        opacity: 0.7;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Bank/BankManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-5o107xrc1f] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-5o107xrc1f] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-5o107xrc1f] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-5o107xrc1f] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-5o107xrc1f]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-5o107xrc1f] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-5o107xrc1f] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-5o107xrc1f] {
    color: #6c757d;
}

.add-new-btn[b-5o107xrc1f] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-5o107xrc1f] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-5o107xrc1f] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-5o107xrc1f] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-5o107xrc1f] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-5o107xrc1f] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-5o107xrc1f] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FILTER SECTION ==================== */
.filter-section[b-5o107xrc1f] {
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1.5rem;
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-5o107xrc1f] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-5o107xrc1f] {
    color: var(--secondary-color);
}

.form-control-custom[b-5o107xrc1f],
.form-select-custom[b-5o107xrc1f] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-5o107xrc1f],
.form-select-custom:focus[b-5o107xrc1f] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== SEARCH BOX ==================== */
.search-box[b-5o107xrc1f] {
    position: relative;
    width: 100%;
}

.search-box input[b-5o107xrc1f] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-5o107xrc1f] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.search-box i[b-5o107xrc1f] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

/* ==================== BANKS TABLE ==================== */
.banks-table-container[b-5o107xrc1f] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.banks-table[b-5o107xrc1f] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.banks-table thead[b-5o107xrc1f] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.banks-table thead th[b-5o107xrc1f] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.banks-table thead th:first-child[b-5o107xrc1f] {
    border-top-left-radius: 12px;
}

.banks-table thead th:last-child[b-5o107xrc1f] {
    border-top-right-radius: 12px;
}

.banks-table tbody tr[b-5o107xrc1f] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.banks-table tbody tr:hover[b-5o107xrc1f] {
    background-color: #f8f9fa;
}

.banks-table tbody td[b-5o107xrc1f] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.bank-info[b-5o107xrc1f] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.bank-icon[b-5o107xrc1f] {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.25rem;
}

.bank-name[b-5o107xrc1f] {
    font-weight: 600;
    color: var(--primary-color);
}

/* ==================== STATUS BADGES ==================== */
.badge[b-5o107xrc1f] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== TABLE SUMMARY ==================== */
.table-summary[b-5o107xrc1f] {
    display: flex;
    align-items: center;
    gap: 2rem;
    margin-top: 1.5rem;
    padding: 1.25rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
}

.summary-item[b-5o107xrc1f] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.95rem;
    color: #495057;
}

.summary-item i[b-5o107xrc1f] {
    font-size: 1.5rem;
}

.summary-item strong[b-5o107xrc1f] {
    color: var(--primary-color);
    font-size: 1.1rem;
}

/* ==================== ALERTS ==================== */
.alert[b-5o107xrc1f] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-5o107xrc1f] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-5o107xrc1f] {
    color: var(--secondary-color);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-5o107xrc1f] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-5o107xrc1f] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-5o107xrc1f] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-5o107xrc1f] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-5o107xrc1f] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn:disabled[b-5o107xrc1f] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-5o107xrc1f] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-5o107xrc1f] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

.btn-action-icon:hover[b-5o107xrc1f] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-edit:hover[b-5o107xrc1f] {
    background: #0056b3;
    color: white;
}

.btn-action-icon.btn-delete:hover[b-5o107xrc1f] {
    background: #dc3545;
    color: white;
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-5o107xrc1f] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-5o107xrc1f] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-5o107xrc1f] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-5o107xrc1f] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== TOAST ==================== */
.toast[b-5o107xrc1f] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
    .page-header[b-5o107xrc1f] {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }

    .page-title[b-5o107xrc1f] {
        font-size: 1.5rem;
    }

    .content-card[b-5o107xrc1f] {
        padding: 1.5rem;
    }

    .banks-table thead th[b-5o107xrc1f],
    .banks-table tbody td[b-5o107xrc1f] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .bank-icon[b-5o107xrc1f] {
        width: 35px;
        height: 35px;
        font-size: 1.1rem;
    }

    .table-summary[b-5o107xrc1f] {
        flex-direction: column;
        gap: 1rem;
    }

    .summary-item[b-5o107xrc1f] {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 576px) {
    .page-header .add-new-btn[b-5o107xrc1f] {
        width: 100%;
        justify-content: center;
    }

    .content-card[b-5o107xrc1f] {
        padding: 1rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Bank/BankManagementWithModal.razor.rz.scp.css */
/* ========================================
   Bank Management Component Styles
   ======================================== */

/* Content Cards */
.content-card[b-dns63pxf75] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    padding: 1.5rem;
    transition: all 0.3s ease;
}

    .content-card:hover[b-dns63pxf75] {
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    }

/* Card Header */
.card-header-custom[b-dns63pxf75] {
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid #f0f0f0;
}

.card-title-custom[b-dns63pxf75] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #1a1a2e;
    margin-bottom: 0.25rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.card-subtitle-custom[b-dns63pxf75] {
    color: #6c757d;
    font-size: 0.875rem;
    margin-bottom: 0;
}

/* Custom Form Controls */
.form-control-custom[b-dns63pxf75],
.form-select-custom[b-dns63pxf75] {
    border: 2px solid #e0e0e0;
    border-radius: 8px;
    padding: 0.625rem 1rem;
    transition: all 0.3s ease;
}

    .form-control-custom:focus[b-dns63pxf75],
    .form-select-custom:focus[b-dns63pxf75] {
        border-color: #d4af37;
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Form Labels */
.form-label[b-dns63pxf75] {
    font-weight: 500;
    color: #495057;
    margin-bottom: 0.5rem;
}

/* Action Buttons Container */
.action-buttons-container[b-dns63pxf75] {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 2px solid #f0f0f0;
}

/* Button Styles */
.btn-primary[b-dns63pxf75] {
    background: linear-gradient(135deg, #d4af37 0%, #f4d03f 100%);
    border: none;
    color: #1a1a2e;
    font-weight: 600;
    padding: 0.625rem 1.5rem;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-primary:hover[b-dns63pxf75] {
        background: linear-gradient(135deg, #c19b2a 0%, #e0bb2d 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    }

.btn-secondary[b-dns63pxf75] {
    background: #6c757d;
    border: none;
    color: white;
    font-weight: 500;
    padding: 0.625rem 1.5rem;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-secondary:hover[b-dns63pxf75] {
        background: #5a6268;
        transform: translateY(-2px);
    }

.btn-warning[b-dns63pxf75] {
    background: linear-gradient(135deg, #ffc107 0%, #ffb300 100%);
    border: none;
    color: #1a1a2e;
    font-weight: 500;
    padding: 0.625rem 1.5rem;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-warning:hover[b-dns63pxf75] {
        background: linear-gradient(135deg, #e0a800 0%, #e09f00 100%);
        transform: translateY(-2px);
    }

/* Info Card */
.info-title[b-dns63pxf75] {
    font-weight: 600;
    color: #1a1a2e;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
}

.info-list[b-dns63pxf75] {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
}

    .info-list li[b-dns63pxf75] {
        padding: 0.5rem 0;
        color: #495057;
        display: flex;
        align-items: center;
        font-size: 0.9rem;
    }

/* Filter Section */
.filter-section[b-dns63pxf75] {
    background: #f8f9fa;
    padding: 1rem;
    border-radius: 8px;
}

/* Search Box */
.search-box[b-dns63pxf75] {
    position: relative;
    display: flex;
    align-items: center;
}

    .search-box i[b-dns63pxf75] {
        position: absolute;
        left: 1rem;
        color: #6c757d;
        font-size: 1rem;
    }

    .search-box input[b-dns63pxf75] {
        width: 100%;
        padding: 0.625rem 1rem 0.625rem 2.75rem;
        border: 2px solid #e0e0e0;
        border-radius: 8px;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-dns63pxf75] {
            outline: none;
            border-color: #d4af37;
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

/* Table Styles */
.banks-table[b-dns63pxf75] {
    margin-bottom: 0;
}

    .banks-table thead[b-dns63pxf75] {
        background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
        color: white;
    }

        .banks-table thead th[b-dns63pxf75] {
            font-weight: 600;
            padding: 1rem;
            border: none;
            font-size: 0.875rem;
            letter-spacing: 0.5px;
            text-transform: uppercase;
        }

    .banks-table tbody tr[b-dns63pxf75] {
        transition: all 0.3s ease;
        border-bottom: 1px solid #e9ecef;
    }

        .banks-table tbody tr:hover[b-dns63pxf75] {
            background-color: #f8f9fa;
            transform: scale(1.01);
        }

    .banks-table tbody td[b-dns63pxf75] {
        padding: 1rem;
        vertical-align: middle;
        color: #495057;
    }

/* Bank Info Display */
.bank-info[b-dns63pxf75] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.bank-icon[b-dns63pxf75] {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #007bff 0%, #0056b3 100%);
    color: white;
    font-size: 1.25rem;
}

.bank-name[b-dns63pxf75] {
    font-weight: 600;
    color: #1a1a2e;
}

/* Action Buttons in Table */
.btn-action[b-dns63pxf75] {
    background: none;
    border: none;
    padding: 0.5rem;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.3s ease;
    margin: 0 0.25rem;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .btn-action:hover[b-dns63pxf75] {
        transform: translateY(-2px);
    }

    .btn-action.btn-edit[b-dns63pxf75] {
        background: linear-gradient(135deg, #ffc107 0%, #ffb300 100%);
        color: #1a1a2e;
    }

        .btn-action.btn-edit:hover[b-dns63pxf75] {
            background: linear-gradient(135deg, #e0a800 0%, #e09f00 100%);
            box-shadow: 0 4px 8px rgba(255, 193, 7, 0.3);
        }

    .btn-action.btn-info[b-dns63pxf75] {
        background: linear-gradient(135deg, #17a2b8 0%, #138496 100%);
        color: white;
    }

        .btn-action.btn-info:hover[b-dns63pxf75] {
            background: linear-gradient(135deg, #138496 0%, #117a8b 100%);
            box-shadow: 0 4px 8px rgba(23, 162, 184, 0.3);
        }

    .btn-action.btn-danger[b-dns63pxf75] {
        background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
        color: white;
    }

        .btn-action.btn-danger:hover[b-dns63pxf75] {
            background: linear-gradient(135deg, #c82333 0%, #bd2130 100%);
            box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
        }

/* Badge Styles */
.badge[b-dns63pxf75] {
    padding: 0.5rem 1rem;
    border-radius: 6px;
    font-weight: 500;
    font-size: 0.813rem;
    letter-spacing: 0.3px;
}

/* Table Summary */
.table-summary[b-dns63pxf75] {
    display: flex;
    gap: 2rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 8px;
    margin-top: 1.5rem;
    flex-wrap: wrap;
}

.summary-item[b-dns63pxf75] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .summary-item i[b-dns63pxf75] {
        font-size: 1.5rem;
    }

    .summary-item span[b-dns63pxf75] {
        font-size: 0.938rem;
        color: #495057;
    }

    .summary-item strong[b-dns63pxf75] {
        color: #1a1a2e;
        font-size: 1.125rem;
    }

/* Page Header */
.page-header[b-dns63pxf75] {
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 2px solid #e9ecef;
}

.page-title[b-dns63pxf75] {
    font-size: 1.875rem;
    font-weight: 700;
    color: #1a1a2e;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.breadcrumb[b-dns63pxf75] {
    background: none;
    padding: 0;
    margin-bottom: 0;
}

.breadcrumb-item a[b-dns63pxf75] {
    color: #6c757d;
    text-decoration: none;
    transition: color 0.3s ease;
}

    .breadcrumb-item a:hover[b-dns63pxf75] {
        color: #d4af37;
    }

.breadcrumb-item.active[b-dns63pxf75] {
    color: #495057;
}

/* Modal Styles */
.modal-content[b-dns63pxf75] {
    border: none;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-dns63pxf75] {
    border-bottom: none;
    padding: 1.5rem;
}

.modal-body[b-dns63pxf75] {
    padding: 2rem;
}

.modal-footer[b-dns63pxf75] {
    border-top: none;
    padding: 1.5rem;
    background: #f8f9fa;
}

.bank-icon-large[b-dns63pxf75] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.detail-card[b-dns63pxf75] {
    transition: all 0.3s ease;
}

    .detail-card:hover[b-dns63pxf75] {
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    }

/* Validation Messages */
.validation-message[b-dns63pxf75] {
    color: #dc3545;
    font-size: 0.813rem;
    margin-top: 0.25rem;
    display: block;
}

/* Responsive Adjustments */
@media (max-width: 991px) {
    .action-buttons-container[b-dns63pxf75] {
        flex-direction: column;
    }

        .action-buttons-container .btn[b-dns63pxf75] {
            width: 100%;
        }

    .table-summary[b-dns63pxf75] {
        flex-direction: column;
        gap: 1rem;
    }
}

@media (max-width: 768px) {
    .page-title[b-dns63pxf75] {
        font-size: 1.5rem;
    }

    .card-title-custom[b-dns63pxf75] {
        font-size: 1.125rem;
    }

    .banks-table[b-dns63pxf75] {
        font-size: 0.875rem;
    }

        .banks-table thead th[b-dns63pxf75],
        .banks-table tbody td[b-dns63pxf75] {
            padding: 0.75rem 0.5rem;
        }

    .bank-icon[b-dns63pxf75] {
        width: 32px;
        height: 32px;
        font-size: 1rem;
    }
}

/* Animation Classes */
@keyframes fadeIn-b-dns63pxf75 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-in[b-dns63pxf75] {
    animation: fadeIn-b-dns63pxf75 0.3s ease-in-out;
}

/* Loading State */
.loading-spinner[b-dns63pxf75] {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    border: 2px solid #f3f3f3;
    border-top: 2px solid #d4af37;
    border-radius: 50%;
    animation: spin-b-dns63pxf75 1s linear infinite;
}

@keyframes spin-b-dns63pxf75 {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* Utility Classes */
.text-muted-custom[b-dns63pxf75] {
    color: #6c757d !important;
}

.fw-semibold[b-dns63pxf75] {
    font-weight: 600 !important;
}

.cursor-pointer[b-dns63pxf75] {
    cursor: pointer;
}

/* Dark Mode Support (Optional) */
@media (prefers-color-scheme: dark) {
    .content-card[b-dns63pxf75] {
        background: #2d3748;
        color: #e2e8f0;
    }

    .card-title-custom[b-dns63pxf75],
    .bank-name[b-dns63pxf75],
    .page-title[b-dns63pxf75] {
        color: #e2e8f0;
    }

    .form-control-custom[b-dns63pxf75],
    .form-select-custom[b-dns63pxf75] {
        background: #1a202c;
        border-color: #4a5568;
        color: #e2e8f0;
    }

    .banks-table tbody tr:hover[b-dns63pxf75] {
        background-color: #374151;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Branch/BranchManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-4d0la90ous] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-4d0la90ous] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-4d0la90ous] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-4d0la90ous] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-4d0la90ous]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-4d0la90ous] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-4d0la90ous] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-4d0la90ous] {
    color: #6c757d;
}

.add-new-btn[b-4d0la90ous] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-4d0la90ous] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-4d0la90ous] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-4d0la90ous] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-4d0la90ous] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-4d0la90ous] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-4d0la90ous] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FILTER SECTION ==================== */
.filter-section[b-4d0la90ous] {
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1.5rem;
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-4d0la90ous] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-4d0la90ous] {
    color: var(--secondary-color);
}

.form-control-custom[b-4d0la90ous],
.form-select-custom[b-4d0la90ous] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-4d0la90ous],
.form-select-custom:focus[b-4d0la90ous] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== SEARCH BOX ==================== */
.search-box[b-4d0la90ous] {
    position: relative;
    width: 100%;
}

.search-box input[b-4d0la90ous] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-4d0la90ous] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.search-box i[b-4d0la90ous] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

/* ==================== DATA TABLE ==================== */
.table-container[b-4d0la90ous] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.data-table[b-4d0la90ous] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

    .data-table thead[b-4d0la90ous] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
        color: white;
    }

        .data-table thead th[b-4d0la90ous] {
            padding: 1rem 0.75rem;
            font-weight: 600;
            text-align: left;
            border: none;
            white-space: nowrap;
            font-size: 0.9rem;
        }

            .data-table thead th:first-child[b-4d0la90ous] {
                border-top-left-radius: 12px;
            }

            .data-table thead th:last-child[b-4d0la90ous] {
                border-top-right-radius: 12px;
            }

    .data-table tbody tr[b-4d0la90ous] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .data-table tbody tr:hover[b-4d0la90ous] {
            background-color: #f8f9fa;
        }

    .data-table tbody td[b-4d0la90ous] {
        padding: 0.875rem 0.75rem;
        vertical-align: middle;
        font-size: 0.9rem;
        color: #495057;
    }

.code-label[b-4d0la90ous] {
    font-weight: 600;
    color: var(--primary-color);
    font-family: monospace;
    font-size: 0.9rem;
}

/* ==================== STATUS BADGES ==================== */
.badge[b-4d0la90ous] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== ALERTS ==================== */
.alert[b-4d0la90ous] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-4d0la90ous] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-4d0la90ous] {
    color: var(--secondary-color);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-4d0la90ous] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-4d0la90ous] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-4d0la90ous] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-4d0la90ous] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-4d0la90ous] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn-danger[b-4d0la90ous] {
    background-color: #dc3545;
    color: white;
    border: none;
}

.btn-danger:hover[b-4d0la90ous] {
    background-color: #bb2d3b;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
}

.btn:disabled[b-4d0la90ous] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-4d0la90ous] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-4d0la90ous] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

    .btn-action-icon:hover[b-4d0la90ous] {
        background: var(--primary-color);
        color: white;
        transform: scale(1.1);
    }

    .btn-action-icon.btn-edit:hover[b-4d0la90ous] {
        background: #0056b3;
        color: white;
    }

    .btn-action-icon.btn-delete:hover[b-4d0la90ous] {
        background: #dc3545;
        color: white;
    }

/* ==================== PAGINATION ==================== */
.pagination-wrapper[b-4d0la90ous] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    gap: 2rem;
    margin-top: 1rem;
}

.showing-entries[b-4d0la90ous] {
    font-size: 0.9rem;
    color: #495057;
}

.showing-entries strong[b-4d0la90ous] {
    color: var(--primary-color);
}

.pagination[b-4d0la90ous] {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

.page-item[b-4d0la90ous] {
    margin: 0;
}

.page-link[b-4d0la90ous] {
    padding: 0.5rem 0.75rem;
    border: 1px solid #dee2e6;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

.page-link:hover:not(:disabled)[b-4d0la90ous] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

.page-item.active .page-link[b-4d0la90ous] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

.page-item.disabled .page-link[b-4d0la90ous] {
    opacity: 0.5;
    cursor: not-allowed;
}

.page-link:disabled[b-4d0la90ous] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-4d0la90ous] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-4d0la90ous] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-4d0la90ous] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-4d0la90ous] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
    .page-header[b-4d0la90ous] {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }

    .page-title[b-4d0la90ous] {
        font-size: 1.5rem;
    }

    .content-card[b-4d0la90ous] {
        padding: 1.5rem;
    }

    .branches-table-container[b-4d0la90ous] {
        overflow-x: auto;
    }

    .branches-table thead th[b-4d0la90ous],
    .branches-table tbody td[b-4d0la90ous] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .btn-action-icon.btn-delete[b-4d0la90ous] {
        transform: none;
        box-shadow: none;
    }

    .pagination-wrapper[b-4d0la90ous] {
        flex-direction: column;
        gap: 1rem;
        justify-content: center;
    }

    .pagination[b-4d0la90ous] {
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media (max-width: 576px) {
    .page-header .add-new-btn[b-4d0la90ous] {
        width: 100%;
        justify-content: center;
    }

    .content-card[b-4d0la90ous] {
        padding: 1rem;
    }

    .page-link[b-4d0la90ous] {
        padding: 0.4rem 0.6rem;
        font-size: 0.8rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Category/CategoryManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-bqxfcso6gz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-bqxfcso6gz] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-bqxfcso6gz] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-bqxfcso6gz] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-bqxfcso6gz]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-bqxfcso6gz] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-bqxfcso6gz] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-bqxfcso6gz] {
    color: #6c757d;
}

.add-new-btn[b-bqxfcso6gz] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-bqxfcso6gz] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-bqxfcso6gz] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-bqxfcso6gz] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-bqxfcso6gz] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-bqxfcso6gz] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-bqxfcso6gz] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FILTER SECTION ==================== */
.filter-section[b-bqxfcso6gz] {
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1.5rem;
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-bqxfcso6gz] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-bqxfcso6gz] {
    color: var(--secondary-color);
}

.form-control-custom[b-bqxfcso6gz],
.form-select-custom[b-bqxfcso6gz] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-bqxfcso6gz],
.form-select-custom:focus[b-bqxfcso6gz] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== SEARCH BOX ==================== */
.search-box[b-bqxfcso6gz] {
    position: relative;
    width: 100%;
}

.search-box input[b-bqxfcso6gz] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-bqxfcso6gz] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.search-box i[b-bqxfcso6gz] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

/* ==================== CATEGORIES TABLE ==================== */
.categories-table-container[b-bqxfcso6gz] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.categories-table[b-bqxfcso6gz] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.categories-table thead[b-bqxfcso6gz] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.categories-table thead th[b-bqxfcso6gz] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.categories-table thead th:first-child[b-bqxfcso6gz] {
    border-top-left-radius: 12px;
}

.categories-table thead th:last-child[b-bqxfcso6gz] {
    border-top-right-radius: 12px;
}

.categories-table tbody tr[b-bqxfcso6gz] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.categories-table tbody tr:hover[b-bqxfcso6gz] {
    background-color: #f8f9fa;
}

.categories-table tbody td[b-bqxfcso6gz] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

/* ==================== STATUS BADGES ==================== */
.badge[b-bqxfcso6gz] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== PAGINATION ==================== */
.pagination-wrapper[b-bqxfcso6gz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
}

.showing-entries[b-bqxfcso6gz] {
    font-size: 0.9rem;
    color: #495057;
}

.showing-entries strong[b-bqxfcso6gz] {
    color: var(--primary-color);
}

.pagination[b-bqxfcso6gz] {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

.page-item[b-bqxfcso6gz] {
    margin: 0;
}

.page-link[b-bqxfcso6gz] {
    padding: 0.5rem 0.75rem;
    border: 1px solid #dee2e6;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

.page-link:hover:not(:disabled)[b-bqxfcso6gz] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

.page-item.active .page-link[b-bqxfcso6gz] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

.page-item.disabled .page-link[b-bqxfcso6gz] {
    opacity: 0.5;
    cursor: not-allowed;
}

.page-link:disabled[b-bqxfcso6gz] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ==================== ALERTS ==================== */
.alert[b-bqxfcso6gz] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-bqxfcso6gz] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-bqxfcso6gz] {
    color: var(--secondary-color);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-bqxfcso6gz] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-bqxfcso6gz] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-bqxfcso6gz] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-bqxfcso6gz] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-bqxfcso6gz] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn-danger[b-bqxfcso6gz] {
    background-color: #dc3545;
    color: white;
    border: none;
}

.btn-danger:hover[b-bqxfcso6gz] {
    background-color: #bb2d3b;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
}

.btn:disabled[b-bqxfcso6gz] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-bqxfcso6gz] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-bqxfcso6gz] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

.btn-action-icon:hover[b-bqxfcso6gz] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-edit:hover[b-bqxfcso6gz] {
    background: #0056b3;
    color: white;
}

.btn-action-icon.btn-delete:hover[b-bqxfcso6gz] {
    background: #dc3545;
    color: white;
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-bqxfcso6gz] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-bqxfcso6gz] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-bqxfcso6gz] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-bqxfcso6gz] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
    .page-header[b-bqxfcso6gz] {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }

    .page-title[b-bqxfcso6gz] {
        font-size: 1.5rem;
    }

    .content-card[b-bqxfcso6gz] {
        padding: 1.5rem;
    }

    .categories-table thead th[b-bqxfcso6gz],
    .categories-table tbody td[b-bqxfcso6gz] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .pagination-wrapper[b-bqxfcso6gz] {
        flex-direction: column;
        gap: 1rem;
        justify-content: center;
    }

    .pagination[b-bqxfcso6gz] {
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media (max-width: 576px) {
    .page-header .add-new-btn[b-bqxfcso6gz] {
        width: 100%;
        justify-content: center;
    }

    .content-card[b-bqxfcso6gz] {
        padding: 1rem;
    }

    .page-link[b-bqxfcso6gz] {
        padding: 0.4rem 0.6rem;
        font-size: 0.8rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/ChangePassword/ChangePassword.razor.rz.scp.css */
/* Dashboard Cards */
.dashboard-card[b-8wv9l1728x] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

/* Content Card */
.content-card[b-8wv9l1728x] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Card Header Custom */
.card-header-custom[b-8wv9l1728x] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-8wv9l1728x] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-8wv9l1728x] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-8wv9l1728x] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* User Info Card */
.user-info-card[b-8wv9l1728x] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid var(--secondary-color);
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
    animation: slideIn-b-8wv9l1728x 0.3s ease-out;
}

@keyframes slideIn-b-8wv9l1728x {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* NOTE: Form control styles moved to global css/forms.css for reusability */

/* Password Strength Indicator */
.password-strength-indicator[b-8wv9l1728x] {
    margin-top: 0.75rem;
}

.strength-bar[b-8wv9l1728x] {
    height: 6px;
    background-color: #e9ecef;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 0.5rem;
}

.strength-bar-fill[b-8wv9l1728x] {
    height: 100%;
    width: 0%;
    transition: all 0.3s ease;
    border-radius: 10px;
}

    .strength-bar-fill.weak[b-8wv9l1728x] {
        background: linear-gradient(90deg, #dc3545 0%, #c82333 100%);
    }

    .strength-bar-fill.medium[b-8wv9l1728x] {
        background: linear-gradient(90deg, #ffc107 0%, #e0a800 100%);
    }

    .strength-bar-fill.good[b-8wv9l1728x] {
   background: linear-gradient(90deg, #17a2b8 0%, #138496 100%);
    }

    .strength-bar-fill.strong[b-8wv9l1728x] {
        background: linear-gradient(90deg, #28a745 0%, #218838 100%);
    }

.strength-text[b-8wv9l1728x] {
    color: #6c757d;
    font-size: 0.85rem;
}

#strengthLabel[b-8wv9l1728x] {
    font-weight: 700;
}

/* Default Password Box */
.default-password-box[b-8wv9l1728x] {
    background-color: #fff;
    border: 2px dashed #ffc107;
 border-radius: 8px;
    padding: 0.75rem 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0.5rem;
}

    .default-password-box code[b-8wv9l1728x] {
        font-size: 1.1rem;
        font-weight: 700;
        color: var(--primary-color);
        background-color: transparent;
    }

.copy-btn[b-8wv9l1728x] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border: none;
    border-radius: 6px;
    padding: 0.4rem 0.6rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .copy-btn:hover[b-8wv9l1728x] {
        background: var(--secondary-color);
        transform: scale(1.1);
    }

/* Selected User Display */
.selected-user-display[b-8wv9l1728x] {
    background-color: #f8f9fa;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 1rem;
    display: flex;
    align-items: center;
  gap: 0.75rem;
    min-height: 70px;
}

    .selected-user-display img[b-8wv9l1728x] {
 flex-shrink: 0;
    }

 .selected-user-display i[b-8wv9l1728x] {
        font-size: 2rem;
  }

/* Security Tips List */
.security-tips-list[b-8wv9l1728x] {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .security-tips-list li[b-8wv9l1728x] {
        padding: 0.5rem 0;
        font-size: 0.9rem;
        color: #495057;
display: flex;
        align-items: center;
    }

/* Enhanced Button Styles */
.btn-primary[b-8wv9l1728x] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-primary:hover[b-8wv9l1728x] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
     color: var(--primary-color);
    }

.btn-secondary[b-8wv9l1728x] {
    background-color: #6c757d;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-secondary:hover[b-8wv9l1728x] {
        background-color: #5c636a;
   transform: translateY(-2px);
    }

.btn-warning[b-8wv9l1728x] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #495057;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 700;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-warning:hover[b-8wv9l1728x] {
        background: linear-gradient(135deg, #e0a800 0%, #ffc107 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(255, 193, 7, 0.4);
color: #495057;
    }

    .btn-warning:disabled[b-8wv9l1728x] {
    opacity: 0.5;
        cursor: not-allowed;
        transform: none;
  }

/* Action Buttons */
.btn-action[b-8wv9l1728x] {
    padding: 0.4rem 0.65rem;
    border: none;
    border-radius: 6px;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

.btn-edit[b-8wv9l1728x] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-8wv9l1728x] {
     background-color: #0b5ed7;
     transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

/* Table Styles */
.positions-table[b-8wv9l1728x] {
    width: 100%;
    margin-top: 1rem;
}

    .positions-table thead[b-8wv9l1728x] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

.positions-table thead th[b-8wv9l1728x] {
        /*color: white;*/
        font-weight: 600;
        padding: 1rem;
        border: none;
        text-transform: uppercase;
     font-size: 0.85rem;
        letter-spacing: 0.5px;
    }

    .positions-table tbody tr[b-8wv9l1728x] {
border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
    }

.positions-table tbody tr:hover[b-8wv9l1728x] {
            background-color: #f8f9fa;
   transform: scale(1.01);
        box-shadow: 0 2px 8px rgba(0,0,0,0.05);
        }

    .positions-table tbody td[b-8wv9l1728x] {
  padding: 1rem;
        vertical-align: middle;
    }

.position-name[b-8wv9l1728x] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 1rem;
}

/* Page Header */
.page-header[b-8wv9l1728x] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-8wv9l1728x] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
align-items: center;
    gap: 1rem;
}

    .page-title i[b-8wv9l1728x] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-8wv9l1728x] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-8wv9l1728x]::before {
 color: #6c757d;
}

.breadcrumb-item a[b-8wv9l1728x] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-8wv9l1728x] {
     color: var(--secondary-color);
    }

.breadcrumb-item.active[b-8wv9l1728x] {
    color: #6c757d;
}

/* Modal Styles */
.modal-content[b-8wv9l1728x] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-8wv9l1728x] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-8wv9l1728x] {
        font-weight: 700;
display: flex;
        align-items: center;
        gap: 0.75rem;
    }

  .modal-header .modal-title i[b-8wv9l1728x] {
    color: var(--secondary-color);
  font-size: 1.5rem;
        }

  .modal-header .btn-close[b-8wv9l1728x] {
      filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-8wv9l1728x] {
            opacity: 1;
        }

.modal-body[b-8wv9l1728x] {
    padding: 2rem;
}

.modal-footer[b-8wv9l1728x] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Alert Styles */
.alert[b-8wv9l1728x] {
    border-radius: 8px;
}

.alert-info[b-8wv9l1728x] {
    background-color: #e3f2fd;
    border-color: #90caf9;
    color: #1565c0;
}

.alert-warning[b-8wv9l1728x] {
    background-color: #fff3cd;
    border-color: #ffc107;
    color: #856404;
}

.alert-heading[b-8wv9l1728x] {
    font-weight: 700;
}

/* Toast Notification */
.toast[b-8wv9l1728x] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-title[b-8wv9l1728x] {
        font-size: 1.5rem;
    }

    .content-card[b-8wv9l1728x] {
        padding: 1.5rem;
  }

    .card-title-custom[b-8wv9l1728x] {
        font-size: 1.1rem;
    }

    .user-info-card[b-8wv9l1728x] {
        padding: 1rem;
    }

    .security-tips-list li[b-8wv9l1728x] {
        font-size: 0.85rem;
    }

    .positions-table thead th[b-8wv9l1728x],
    .positions-table tbody td[b-8wv9l1728x] {
        padding: 0.75rem 0.5rem;
      font-size: 0.85rem;
    }

    .btn-action[b-8wv9l1728x] {
      padding: 0.35rem 0.5rem;
        font-size: 0.8rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/ChangePassword/ResetPasswordModal.razor.rz.scp.css */
/* Dashboard Cards */
.dashboard-card[b-jkw42ntkim] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

/* Content Card */
.content-card[b-jkw42ntkim] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Card Header Custom */
.card-header-custom[b-jkw42ntkim] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-jkw42ntkim] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-jkw42ntkim] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-jkw42ntkim] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* User Info Card */
.user-info-card[b-jkw42ntkim] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid var(--secondary-color);
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
    animation: slideIn-b-jkw42ntkim 0.3s ease-out;
}

@keyframes slideIn-b-jkw42ntkim {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* Password Input Wrapper */
.password-input-wrapper[b-jkw42ntkim] {
    position: relative;
}

.password-toggle-icon[b-jkw42ntkim] {
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    color: #6c757d;
    font-size: 1.2rem;
    transition: color 0.3s ease;
}

    .password-toggle-icon:hover[b-jkw42ntkim] {
        color: var(--secondary-color);
    }

/* Password Strength Indicator */
.password-strength-indicator[b-jkw42ntkim] {
    margin-top: 0.75rem;
}

.strength-bar[b-jkw42ntkim] {
    height: 6px;
    background-color: #e9ecef;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 0.5rem;
}

.strength-bar-fill[b-jkw42ntkim] {
    height: 100%;
    width: 0%;
    transition: all 0.3s ease;
    border-radius: 10px;
}

    .strength-bar-fill.weak[b-jkw42ntkim] {
        background: linear-gradient(90deg, #dc3545 0%, #c82333 100%);
    }

    .strength-bar-fill.medium[b-jkw42ntkim] {
        background: linear-gradient(90deg, #ffc107 0%, #e0a800 100%);
    }

    .strength-bar-fill.good[b-jkw42ntkim] {
        background: linear-gradient(90deg, #17a2b8 0%, #138496 100%);
    }

    .strength-bar-fill.strong[b-jkw42ntkim] {
        background: linear-gradient(90deg, #28a745 0%, #218838 100%);
    }

.strength-text[b-jkw42ntkim] {
    color: #6c757d;
    font-size: 0.85rem;
}

#strengthLabel[b-jkw42ntkim] {
    font-weight: 700;
}

/* Default Password Box */
.default-password-box[b-jkw42ntkim] {
    background-color: #fff;
    border: 2px dashed #ffc107;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0.5rem;
}

    .default-password-box code[b-jkw42ntkim] {
        font-size: 1.1rem;
        font-weight: 700;
        color: var(--primary-color);
        background-color: transparent;
    }

.copy-btn[b-jkw42ntkim] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border: none;
    border-radius: 6px;
    padding: 0.4rem 0.6rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .copy-btn:hover[b-jkw42ntkim] {
        background: var(--secondary-color);
        transform: scale(1.1);
    }

/* Selected User Display */
.selected-user-display[b-jkw42ntkim] {
    background-color: #f8f9fa;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 70px;
}

    .selected-user-display img[b-jkw42ntkim] {
        flex-shrink: 0;
    }

    .selected-user-display i[b-jkw42ntkim] {
        font-size: 2rem;
    }

/* Security Tips List */
.security-tips-list[b-jkw42ntkim] {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .security-tips-list li[b-jkw42ntkim] {
        padding: 0.5rem 0;
        font-size: 0.9rem;
        color: #495057;
        display: flex;
        align-items: center;
    }

/* Form Labels with Icons */
.form-label[b-jkw42ntkim] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

    .form-label i[b-jkw42ntkim] {
        color: var(--secondary-color);
    }

/* Enhanced Button Styles */
.btn-primary[b-jkw42ntkim] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-primary:hover[b-jkw42ntkim] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.btn-secondary[b-jkw42ntkim] {
    background-color: #6c757d;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-secondary:hover[b-jkw42ntkim] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

.btn-warning[b-jkw42ntkim] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #495057;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 700;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-warning:hover[b-jkw42ntkim] {
        background: linear-gradient(135deg, #e0a800 0%, #ffc107 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(255, 193, 7, 0.4);
        color: #495057;
    }

    .btn-warning:disabled[b-jkw42ntkim] {
        opacity: 0.5;
        cursor: not-allowed;
        transform: none;
    }

/* Action Buttons */
.btn-action[b-jkw42ntkim] {
    padding: 0.4rem 0.65rem;
    border: none;
    border-radius: 6px;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

.btn-edit[b-jkw42ntkim] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-jkw42ntkim] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

/* Table Styles */
.positions-table[b-jkw42ntkim] {
    width: 100%;
    margin-top: 1rem;
}

    .positions-table thead[b-jkw42ntkim] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .positions-table thead th[b-jkw42ntkim] {
            /*color: white;*/
            font-weight: 600;
            padding: 1rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.85rem;
            letter-spacing: 0.5px;
        }

    .positions-table tbody tr[b-jkw42ntkim] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .positions-table tbody tr:hover[b-jkw42ntkim] {
            background-color: #f8f9fa;
            transform: scale(1.01);
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
        }

    .positions-table tbody td[b-jkw42ntkim] {
        padding: 1rem;
        vertical-align: middle;
    }

.position-name[b-jkw42ntkim] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 1rem;
}

/* Page Header */
.page-header[b-jkw42ntkim] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-jkw42ntkim] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-jkw42ntkim] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-jkw42ntkim] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-jkw42ntkim]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-jkw42ntkim] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-jkw42ntkim] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-jkw42ntkim] {
    color: #6c757d;
}

/* Modal Styles */
.modal-content[b-jkw42ntkim] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-jkw42ntkim] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-jkw42ntkim] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-jkw42ntkim] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-jkw42ntkim] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-jkw42ntkim] {
            opacity: 1;
        }

.modal-body[b-jkw42ntkim] {
    padding: 2rem;
}

.modal-footer[b-jkw42ntkim] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Alert Styles */
.alert[b-jkw42ntkim] {
    border-radius: 8px;
}

.alert-info[b-jkw42ntkim] {
    background-color: #e3f2fd;
    border-color: #90caf9;
    color: #1565c0;
}

.alert-warning[b-jkw42ntkim] {
    background-color: #fff3cd;
    border-color: #ffc107;
    color: #856404;
}

.alert-heading[b-jkw42ntkim] {
    font-weight: 700;
}

/* Toast Notification */
.toast[b-jkw42ntkim] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-title[b-jkw42ntkim] {
        font-size: 1.5rem;
    }

    .content-card[b-jkw42ntkim] {
        padding: 1.5rem;
    }

    .card-title-custom[b-jkw42ntkim] {
        font-size: 1.1rem;
    }

    .user-info-card[b-jkw42ntkim] {
        padding: 1rem;
    }

    .security-tips-list li[b-jkw42ntkim] {
        font-size: 0.85rem;
    }

    .positions-table thead th[b-jkw42ntkim],
    .positions-table tbody td[b-jkw42ntkim] {
        padding: 0.75rem 0.5rem;
        font-size: 0.85rem;
    }

    .btn-action[b-jkw42ntkim] {
        padding: 0.35rem 0.5rem;
        font-size: 0.8rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/ChangePassword/SuccessToast.razor.rz.scp.css */
/* Dashboard Cards */
.dashboard-card[b-pp408pjo43] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

/* Content Card */
.content-card[b-pp408pjo43] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Card Header Custom */
.card-header-custom[b-pp408pjo43] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-pp408pjo43] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-pp408pjo43] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-pp408pjo43] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* User Info Card */
.user-info-card[b-pp408pjo43] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid var(--secondary-color);
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
    animation: slideIn-b-pp408pjo43 0.3s ease-out;
}

@keyframes slideIn-b-pp408pjo43 {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Password Input Wrapper */
.password-input-wrapper[b-pp408pjo43] {
    position: relative;
}

.password-toggle-icon[b-pp408pjo43] {
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    color: #6c757d;
    font-size: 1.2rem;
    transition: color 0.3s ease;
}

    .password-toggle-icon:hover[b-pp408pjo43] {
        color: var(--secondary-color);
    }

/* Password Strength Indicator */
.password-strength-indicator[b-pp408pjo43] {
    margin-top: 0.75rem;
}

.strength-bar[b-pp408pjo43] {
    height: 6px;
    background-color: #e9ecef;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 0.5rem;
}

.strength-bar-fill[b-pp408pjo43] {
    height: 100%;
    width: 0%;
    transition: all 0.3s ease;
    border-radius: 10px;
}

    .strength-bar-fill.weak[b-pp408pjo43] {
        background: linear-gradient(90deg, #dc3545 0%, #c82333 100%);
    }

    .strength-bar-fill.medium[b-pp408pjo43] {
        background: linear-gradient(90deg, #ffc107 0%, #e0a800 100%);
    }

    .strength-bar-fill.good[b-pp408pjo43] {
        background: linear-gradient(90deg, #17a2b8 0%, #138496 100%);
    }

    .strength-bar-fill.strong[b-pp408pjo43] {
        background: linear-gradient(90deg, #28a745 0%, #218838 100%);
    }

.strength-text[b-pp408pjo43] {
    color: #6c757d;
    font-size: 0.85rem;
}

#strengthLabel[b-pp408pjo43] {
    font-weight: 700;
}

/* Default Password Box */
.default-password-box[b-pp408pjo43] {
    background-color: #fff;
    border: 2px dashed #ffc107;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0.5rem;
}

    .default-password-box code[b-pp408pjo43] {
        font-size: 1.1rem;
        font-weight: 700;
        color: var(--primary-color);
        background-color: transparent;
    }

.copy-btn[b-pp408pjo43] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border: none;
    border-radius: 6px;
    padding: 0.4rem 0.6rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .copy-btn:hover[b-pp408pjo43] {
        background: var(--secondary-color);
        transform: scale(1.1);
    }

/* Selected User Display */
.selected-user-display[b-pp408pjo43] {
    background-color: #f8f9fa;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 70px;
}

    .selected-user-display img[b-pp408pjo43] {
        flex-shrink: 0;
    }

    .selected-user-display i[b-pp408pjo43] {
        font-size: 2rem;
    }

/* Security Tips List */
.security-tips-list[b-pp408pjo43] {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .security-tips-list li[b-pp408pjo43] {
        padding: 0.5rem 0;
        font-size: 0.9rem;
        color: #495057;
        display: flex;
        align-items: center;
    }

/* Form Labels with Icons */
.form-label[b-pp408pjo43] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

    .form-label i[b-pp408pjo43] {
        color: var(--secondary-color);
    }

/* Enhanced Button Styles */
.btn-primary[b-pp408pjo43] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-primary:hover[b-pp408pjo43] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.btn-secondary[b-pp408pjo43] {
    background-color: #6c757d;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-secondary:hover[b-pp408pjo43] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

.btn-warning[b-pp408pjo43] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #495057;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 700;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-warning:hover[b-pp408pjo43] {
        background: linear-gradient(135deg, #e0a800 0%, #ffc107 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(255, 193, 7, 0.4);
        color: #495057;
    }

    .btn-warning:disabled[b-pp408pjo43] {
        opacity: 0.5;
        cursor: not-allowed;
        transform: none;
    }

/* Action Buttons */
.btn-action[b-pp408pjo43] {
    padding: 0.4rem 0.65rem;
    border: none;
    border-radius: 6px;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

.btn-edit[b-pp408pjo43] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-pp408pjo43] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

/* Table Styles */
.positions-table[b-pp408pjo43] {
    width: 100%;
    margin-top: 1rem;
}

    .positions-table thead[b-pp408pjo43] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .positions-table thead th[b-pp408pjo43] {
            /*color: white;*/
            font-weight: 600;
            padding: 1rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.85rem;
            letter-spacing: 0.5px;
        }

    .positions-table tbody tr[b-pp408pjo43] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .positions-table tbody tr:hover[b-pp408pjo43] {
            background-color: #f8f9fa;
            transform: scale(1.01);
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
        }

    .positions-table tbody td[b-pp408pjo43] {
        padding: 1rem;
        vertical-align: middle;
    }

.position-name[b-pp408pjo43] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 1rem;
}

/* Page Header */
.page-header[b-pp408pjo43] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-pp408pjo43] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-pp408pjo43] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-pp408pjo43] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-pp408pjo43]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-pp408pjo43] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-pp408pjo43] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-pp408pjo43] {
    color: #6c757d;
}

/* Modal Styles */
.modal-content[b-pp408pjo43] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-pp408pjo43] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-pp408pjo43] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-pp408pjo43] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-pp408pjo43] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-pp408pjo43] {
            opacity: 1;
        }

.modal-body[b-pp408pjo43] {
    padding: 2rem;
}

.modal-footer[b-pp408pjo43] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Alert Styles */
.alert[b-pp408pjo43] {
    border-radius: 8px;
}

.alert-info[b-pp408pjo43] {
    background-color: #e3f2fd;
    border-color: #90caf9;
    color: #1565c0;
}

.alert-warning[b-pp408pjo43] {
    background-color: #fff3cd;
    border-color: #ffc107;
    color: #856404;
}

.alert-heading[b-pp408pjo43] {
    font-weight: 700;
}

/* Toast Notification */
.toast[b-pp408pjo43] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-title[b-pp408pjo43] {
        font-size: 1.5rem;
    }

    .content-card[b-pp408pjo43] {
        padding: 1.5rem;
    }

    .card-title-custom[b-pp408pjo43] {
        font-size: 1.1rem;
    }

    .user-info-card[b-pp408pjo43] {
        padding: 1rem;
    }

    .security-tips-list li[b-pp408pjo43] {
        font-size: 0.85rem;
    }

    .positions-table thead th[b-pp408pjo43],
    .positions-table tbody td[b-pp408pjo43] {
        padding: 0.75rem 0.5rem;
        font-size: 0.85rem;
    }

    .btn-action[b-pp408pjo43] {
        padding: 0.35rem 0.5rem;
        font-size: 0.8rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/ChartOfAccounts/AccountManagement.razor.rz.scp.css */
/* Add New Button */
.add-new-btn[b-2lkhl3xg1w] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-2lkhl3xg1w] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .add-new-btn i[b-2lkhl3xg1w] {
        font-size: 1.1rem;
    }

/* Content Card */
.content-card[b-2lkhl3xg1w] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Search and Filter Bar */
.search-filter-bar[b-2lkhl3xg1w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-box[b-2lkhl3xg1w] {
    position: relative;
    flex: 1;
    min-width: 250px;
    max-width: 400px;
}

    .search-box input[b-2lkhl3xg1w] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-2lkhl3xg1w] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-2lkhl3xg1w] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.filter-group[b-2lkhl3xg1w] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.entries-select[b-2lkhl3xg1w] {
    padding: 0.5rem 1rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .entries-select:focus[b-2lkhl3xg1w] {
        outline: none;
        border-color: var(--secondary-color);
    }

/* Table Styles */
.positions-table[b-2lkhl3xg1w] {
    width: 100%;
    margin-top: 1rem;
}

    .positions-table thead[b-2lkhl3xg1w] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

.positions-table thead th[b-2lkhl3xg1w] {
    /*color: white;*/
    font-weight: 600;
    padding: 1rem;
    border: none;
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 0.5px;
}

.positions-table tbody tr[b-2lkhl3xg1w] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

    .positions-table tbody tr:hover[b-2lkhl3xg1w] {
        background-color: #f8f9fa;
        transform: scale(1.01);
        box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    }

.positions-table tbody td[b-2lkhl3xg1w] {
    padding: 1rem;
    vertical-align: middle;
}

.position-name[b-2lkhl3xg1w] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 1rem;
}

.position-description[b-2lkhl3xg1w] {
    color: #6c757d;
    font-size: 0.9rem;
    line-height: 1.5;
}

/* Action Buttons */
.action-buttons[b-2lkhl3xg1w] {
    display: flex;
    gap: 0.5rem;
}

.btn-action[b-2lkhl3xg1w] {
    padding: 0.5rem 0.75rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-edit[b-2lkhl3xg1w] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-2lkhl3xg1w] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

.btn-delete[b-2lkhl3xg1w] {
    background-color: #dc3545;
    color: white;
}

    .btn-delete:hover[b-2lkhl3xg1w] {
        background-color: #bb2d3b;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
    }

/* Modal Styles */
.modal-content[b-2lkhl3xg1w] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-2lkhl3xg1w] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-2lkhl3xg1w] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-2lkhl3xg1w] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-2lkhl3xg1w] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-2lkhl3xg1w] {
            opacity: 1;
        }

.modal-body[b-2lkhl3xg1w] {
    padding: 2rem;
}

.modal-footer[b-2lkhl3xg1w] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.form-label[b-2lkhl3xg1w] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.form-control[b-2lkhl3xg1w], .form-select[b-2lkhl3xg1w] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control:focus[b-2lkhl3xg1w], .form-select:focus[b-2lkhl3xg1w] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

.btn-primary[b-2lkhl3xg1w] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-primary:hover[b-2lkhl3xg1w] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    }

.btn-secondary[b-2lkhl3xg1w] {
    background-color: #6c757d;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-secondary:hover[b-2lkhl3xg1w] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

/* Pagination */
.pagination-wrapper[b-2lkhl3xg1w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-2lkhl3xg1w] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-2lkhl3xg1w] {
    margin: 0;
}

.page-link[b-2lkhl3xg1w] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

    .page-link:hover[b-2lkhl3xg1w] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
    }

.page-item.active .page-link[b-2lkhl3xg1w] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Empty State */
.empty-state[b-2lkhl3xg1w] {
    text-align: center;
    padding: 3rem 2rem;
    color: #6c757d;
}

    .empty-state i[b-2lkhl3xg1w] {
        font-size: 4rem;
        color: #dee2e6;
        margin-bottom: 1rem;
    }

/* Responsive Design */
@media (max-width: 768px) {
    .sidebar[b-2lkhl3xg1w] {
        left: calc(-1 * var(--sidebar-width));
    }

        .sidebar.mobile-open[b-2lkhl3xg1w] {
            left: 0;
        }

    .main-content[b-2lkhl3xg1w] {
        margin-left: 0;
    }

    .toggle-sidebar-btn[b-2lkhl3xg1w] {
        left: -20px;
    }

        .toggle-sidebar-btn.mobile-open[b-2lkhl3xg1w] {
            left: calc(var(--sidebar-width) - 20px);
        }

    .header[b-2lkhl3xg1w] {
        padding: 0 1rem;
    }

    .header-brand[b-2lkhl3xg1w] {
        font-size: 1.2rem;
    }

    .user-name[b-2lkhl3xg1w] {
        display: none;
    }

    .page-title[b-2lkhl3xg1w] {
        font-size: 1.5rem;
    }

    .page-header[b-2lkhl3xg1w] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .search-filter-bar[b-2lkhl3xg1w] {
        flex-direction: column;
    }

    .search-box[b-2lkhl3xg1w] {
        max-width: 100%;
    }

    .action-buttons[b-2lkhl3xg1w] {
        flex-wrap: wrap;
    }

    .positions-table[b-2lkhl3xg1w] {
        font-size: 0.85rem;
    }

        .positions-table thead th[b-2lkhl3xg1w],
        .positions-table tbody td[b-2lkhl3xg1w] {
            padding: 0.75rem 0.5rem;
        }
}
/* _content/AccountingSystem.Web/Components/Pages/ChartOfAccounts/ChartOfAccounts.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-p0gjwhjlgz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-p0gjwhjlgz] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-p0gjwhjlgz] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-p0gjwhjlgz] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-p0gjwhjlgz]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-p0gjwhjlgz] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-p0gjwhjlgz] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-p0gjwhjlgz] {
    color: #6c757d;
}

.add-new-btn[b-p0gjwhjlgz] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-p0gjwhjlgz] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-p0gjwhjlgz] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-p0gjwhjlgz] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-p0gjwhjlgz] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-p0gjwhjlgz] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-p0gjwhjlgz] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FILTER SECTION ==================== */
.filter-section[b-p0gjwhjlgz] {
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1.5rem;
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-p0gjwhjlgz] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-p0gjwhjlgz] {
    color: var(--secondary-color);
}

.form-control-custom[b-p0gjwhjlgz],
.form-select-custom[b-p0gjwhjlgz] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-p0gjwhjlgz],
.form-select-custom:focus[b-p0gjwhjlgz] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== SEARCH BOX ==================== */
.search-box[b-p0gjwhjlgz] {
    position: relative;
    width: 100%;
}

.search-box input[b-p0gjwhjlgz] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-p0gjwhjlgz] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.search-box i[b-p0gjwhjlgz] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

/* ==================== ACCOUNTS TABLE ==================== */
.accounts-table-container[b-p0gjwhjlgz] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.accounts-table[b-p0gjwhjlgz] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.accounts-table thead[b-p0gjwhjlgz] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.accounts-table thead th[b-p0gjwhjlgz] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.accounts-table thead th:first-child[b-p0gjwhjlgz] {
    border-top-left-radius: 12px;
}

.accounts-table thead th:last-child[b-p0gjwhjlgz] {
    border-top-right-radius: 12px;
}

.accounts-table tbody tr[b-p0gjwhjlgz] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.accounts-table tbody tr:hover[b-p0gjwhjlgz] {
    background-color: #f8f9fa;
}

.accounts-table tbody td[b-p0gjwhjlgz] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.account-code-name[b-p0gjwhjlgz] {
    font-weight: 600;
    color: var(--primary-color);
}

/* ==================== STATUS BADGES ==================== */
.badge[b-p0gjwhjlgz] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== PAGINATION ==================== */
.pagination-wrapper[b-p0gjwhjlgz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
}

.showing-entries[b-p0gjwhjlgz] {
    font-size: 0.9rem;
    color: #495057;
}

.showing-entries strong[b-p0gjwhjlgz] {
    color: var(--primary-color);
}

.pagination[b-p0gjwhjlgz] {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

.page-item[b-p0gjwhjlgz] {
    margin: 0;
}

.page-link[b-p0gjwhjlgz] {
    padding: 0.5rem 0.75rem;
    border: 1px solid #dee2e6;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

.page-link:hover:not(:disabled)[b-p0gjwhjlgz] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

.page-item.active .page-link[b-p0gjwhjlgz] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

.page-item.disabled .page-link[b-p0gjwhjlgz] {
    opacity: 0.5;
    cursor: not-allowed;
}

.page-link:disabled[b-p0gjwhjlgz] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ==================== ALERTS ==================== */
.alert[b-p0gjwhjlgz] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-p0gjwhjlgz] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-p0gjwhjlgz] {
    color: var(--secondary-color);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-p0gjwhjlgz] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-p0gjwhjlgz] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-p0gjwhjlgz] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-p0gjwhjlgz] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-p0gjwhjlgz] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn-danger[b-p0gjwhjlgz] {
    background-color: #dc3545;
    color: white;
    border: none;
}

.btn-danger:hover[b-p0gjwhjlgz] {
    background-color: #bb2d3b;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
}

.btn:disabled[b-p0gjwhjlgz] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-p0gjwhjlgz] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-p0gjwhjlgz] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

.btn-action-icon:hover[b-p0gjwhjlgz] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-edit:hover[b-p0gjwhjlgz] {
    background: #0056b3;
    color: white;
}

.btn-action-icon.btn-delete:hover[b-p0gjwhjlgz] {
    background: #dc3545;
    color: white;
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-p0gjwhjlgz] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-p0gjwhjlgz] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-p0gjwhjlgz] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-p0gjwhjlgz] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
    .page-header[b-p0gjwhjlgz] {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }

    .page-title[b-p0gjwhjlgz] {
        font-size: 1.5rem;
    }

    .content-card[b-p0gjwhjlgz] {
        padding: 1.5rem;
    }

    .accounts-table thead th[b-p0gjwhjlgz],
    .accounts-table tbody td[b-p0gjwhjlgz] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .pagination-wrapper[b-p0gjwhjlgz] {
        flex-direction: column;
        gap: 1rem;
        justify-content: center;
    }

    .pagination[b-p0gjwhjlgz] {
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media (max-width: 576px) {
    .page-header .add-new-btn[b-p0gjwhjlgz] {
        width: 100%;
        justify-content: center;
    }

    .content-card[b-p0gjwhjlgz] {
        padding: 1rem;
    }

    .page-link[b-p0gjwhjlgz] {
        padding: 0.4rem 0.6rem;
        font-size: 0.8rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/CheckIssuance/CheckIssuanceDashboard.razor.rz.scp.css */
/* Dashboard Cards */
.dashboard-card[b-8jg3pgrbvt] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

    .dashboard-card:hover[b-8jg3pgrbvt] {
        transform: translateY(-5px);
        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    }

.card-icon[b-8jg3pgrbvt] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-8jg3pgrbvt] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-8jg3pgrbvt] {
    color: #212529;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.card-change[b-8jg3pgrbvt] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
}

    .card-change.positive[b-8jg3pgrbvt] {
        color: #2E7D32;
    }

    .card-change i[b-8jg3pgrbvt] {
        margin-right: 0.25rem;
    }

/* Content Card */
.content-card[b-8jg3pgrbvt] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
    max-width: 100%; /* Ensure it doesn't exceed parent width */
    width: 100%;
    box-sizing: border-box;
}

.card-header-custom[b-8jg3pgrbvt] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-8jg3pgrbvt] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-8jg3pgrbvt] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-8jg3pgrbvt] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Page Header */
.page-header[b-8jg3pgrbvt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-8jg3pgrbvt] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-8jg3pgrbvt] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-8jg3pgrbvt] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-8jg3pgrbvt]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-8jg3pgrbvt] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-8jg3pgrbvt] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-8jg3pgrbvt] {
    color: #6c757d;
}

.add-new-btn[b-8jg3pgrbvt] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration:none;
}

    .add-new-btn:hover[b-8jg3pgrbvt] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

/* Filter Section */
.filter-section[b-8jg3pgrbvt] {
    margin-bottom: 1.5rem;
}

.filter-label[b-8jg3pgrbvt] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
    margin-bottom: 0.25rem;
    display: block;
}

.search-box[b-8jg3pgrbvt] {
    position: relative;
    width: 100%;
}

    .search-box input[b-8jg3pgrbvt] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-8jg3pgrbvt] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-8jg3pgrbvt] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.form-select-custom[b-8jg3pgrbvt], .form-control-custom[b-8jg3pgrbvt] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-select-custom:focus[b-8jg3pgrbvt], .form-control-custom:focus[b-8jg3pgrbvt] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Table Styles */
.checks-table[b-8jg3pgrbvt] {
    width: 100%;
    margin-top: 1rem;
}

    .checks-table thead[b-8jg3pgrbvt] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .checks-table thead th[b-8jg3pgrbvt] {
            <!-- color: white; -->
            font-weight: 600;
            padding: 1rem 0.75rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.8rem;
            letter-spacing: 0.5px;
            white-space: nowrap;
        }

    .checks-table tbody tr[b-8jg3pgrbvt] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .checks-table tbody tr:hover[b-8jg3pgrbvt] {
            background-color: #f8f5f0;
            box-shadow: inset 4px 0 0 var(--secondary-color), 0 2px 8px rgba(139, 0, 0, 0.1);
            transform: scale(1.01);
        }

        /* Extra visual indicator on hover */
        .checks-table tbody tr:hover td[b-8jg3pgrbvt] {
 color: var(--primary-color);
     font-weight: 500;
        }

    .checks-table tbody td[b-8jg3pgrbvt] {
        padding: 1rem 0.75rem;
        vertical-align: middle;
        font-size: 0.9rem;
    }

.voucher-number[b-8jg3pgrbvt] {
    font-weight: 600;
    color: var(--primary-color);
}

.amount-value[b-8jg3pgrbvt] {
    font-weight: 700;
    color: var(--primary-color);
}

/* Table Select Dropdowns */
.table-select[b-8jg3pgrbvt] {
    border: 2px solid #e9ecef;
    border-radius: 6px;
    padding: 0.4rem 0.6rem;
    font-size: 0.85rem;
    transition: all 0.3s ease;
    cursor: pointer;
    width: 100%;
}

    .table-select:focus[b-8jg3pgrbvt] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.15rem rgba(212, 175, 55, 0.15);
    }

    .table-select:hover[b-8jg3pgrbvt] {
        border-color: var(--secondary-color);
    }

/* Picker Buttons */
.btn-picker[b-8jg3pgrbvt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 2px solid #e9ecef;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 500;
    transition: all 0.3s ease;
    cursor: pointer;
    background-color: white;
    text-align: left;
}

    .btn-picker:hover:not(:disabled)[b-8jg3pgrbvt] {
        border-color: var(--secondary-color);
        background-color: #f8f5f0;
        transform: translateY(-1px);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.2);
    }

    .btn-picker:active:not(:disabled)[b-8jg3pgrbvt] {
        transform: translateY(0);
        box-shadow: 0 1px 4px rgba(212, 175, 55, 0.15);
    }

    .btn-picker:disabled[b-8jg3pgrbvt] {
        opacity: 0.6;
        cursor: not-allowed;
    }

    .btn-picker i:first-child[b-8jg3pgrbvt] {
        color: var(--primary-color);
        font-size: 1.1rem;
        flex-shrink: 0;
    }

    .btn-picker i:last-child[b-8jg3pgrbvt] {
        color: #6c757d;
        font-size: 0.9rem;
        flex-shrink: 0;
    }

    .btn-picker span[b-8jg3pgrbvt] {
        flex: 1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.btn-picker-empty[b-8jg3pgrbvt] {
    color: #6c757d;
    font-style: italic;
}

    .btn-picker-empty:hover:not(:disabled)[b-8jg3pgrbvt] {
        color: #495057;
    }

.btn-picker-filled[b-8jg3pgrbvt] {
    color: #212529;
    border-color: #d4af37;
    background-color: #fff8e6;
}

    .btn-picker-filled:hover:not(:disabled)[b-8jg3pgrbvt] {
        border-color: var(--secondary-color);
        background-color: #fff3cd;
    }

    .btn-picker-filled i:first-child[b-8jg3pgrbvt] {
        color: var(--secondary-color);
    }

/* Status Select Colors */
.status-select.status-pending[b-8jg3pgrbvt] {
    background-color: #fff3cd;
    border-color: #ffc107;
    color: #856404;
    font-weight: 600;
}

.status-select.status-progress[b-8jg3pgrbvt] {
    background-color: #cfe2ff;
    border-color: #0d6efd;
    color: #084298;
    font-weight: 600;
}

.status-select.status-completed[b-8jg3pgrbvt] {
    background-color: #d1e7dd;
    border-color: #198754;
    color: #0f5132;
    font-weight: 600;
}

.status-select.status-cancelled[b-8jg3pgrbvt] {
    background-color: #f8d7da;
    border-color: #dc3545;
    color: #842029;
    font-weight: 600;
}

/* Action Buttons */
.action-buttons[b-8jg3pgrbvt] {
    display: flex;
    gap: 0.4rem;
    justify-content: center;
}

.btn-action[b-8jg3pgrbvt] {
    padding: 0.4rem 0.6rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-view[b-8jg3pgrbvt] {
    background-color: #0dcaf0;
    color: white;
}

    .btn-view:hover[b-8jg3pgrbvt] {
        background-color: #0aa2c0;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 202, 240, 0.3);
    }

.btn-edit[b-8jg3pgrbvt] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-8jg3pgrbvt] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

.btn-print[b-8jg3pgrbvt] {
    background-color: #6c757d;
    color: white;
}

    .btn-print:hover[b-8jg3pgrbvt] {
        background-color: #5c636a;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(108, 117, 125, 0.3);
    }

/* Pagination */
.pagination-wrapper[b-8jg3pgrbvt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-8jg3pgrbvt] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-8jg3pgrbvt] {
    margin: 0;
}

.page-link[b-8jg3pgrbvt] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

    .page-link:hover[b-8jg3pgrbvt] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
    }

.page-item.active .page-link[b-8jg3pgrbvt] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Modal Styles */
.modal-content[b-8jg3pgrbvt] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-8jg3pgrbvt] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-8jg3pgrbvt] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-8jg3pgrbvt] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-8jg3pgrbvt] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-8jg3pgrbvt] {
            opacity: 1;
        }

.modal-body[b-8jg3pgrbvt] {
    padding: 2rem;
}

.modal-footer[b-8jg3pgrbvt] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.detail-label[b-8jg3pgrbvt] {
    font-weight: 600;
    color: #6c757d;
    font-size: 0.9rem;
    margin-bottom: 0.25rem;
}

.detail-value[b-8jg3pgrbvt] {
    color: #212529;
    font-size: 1rem;
    margin-bottom: 1rem;
}

/* Buttons */
.btn[b-8jg3pgrbvt] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-secondary[b-8jg3pgrbvt] {
    background-color: #6c757d;
    border: none;
}

    .btn-secondary:hover[b-8jg3pgrbvt] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

/* Toast */
.toast[b-8jg3pgrbvt] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Filter Modal Styles */
.filter-modal-label[b-8jg3pgrbvt] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .filter-modal-label i[b-8jg3pgrbvt] {
        color: var(--primary-color);
        font-size: 1.1rem;
    }

/* Filter Button Styles */
.btn-filter[b-8jg3pgrbvt] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-filter:hover[b-8jg3pgrbvt] {
        background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(139, 0, 0, 0.4);
    }

    .btn-filter:active[b-8jg3pgrbvt] {
        transform: translateY(0);
    }

.btn-reset[b-8jg3pgrbvt] {
    background-color: #6c757d;
    color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-reset:hover[b-8jg3pgrbvt] {
        background-color: #5c636a;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(108, 117, 125, 0.3);
    }

.btn-primary-filter[b-8jg3pgrbvt] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 700;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-primary-filter:hover[b-8jg3pgrbvt] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

/* Active Filters Display */
.active-filters[b-8jg3pgrbvt] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    border-left: 4px solid var(--secondary-color);
}

.filter-tag[b-8jg3pgrbvt] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.75rem;
    background-color: white;
    border: 1px solid var(--secondary-color);
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--primary-color);
    transition: all 0.2s ease;
}

    .filter-tag:hover[b-8jg3pgrbvt] {
        background-color: #fff8e6;
        box-shadow: 0 2px 6px rgba(212, 175, 55, 0.2);
    }

    .filter-tag i[b-8jg3pgrbvt] {
        cursor: pointer;
        font-size: 1rem;
        transition: transform 0.2s ease;
    }

        .filter-tag i:hover[b-8jg3pgrbvt] {
            transform: scale(1.2);
            color: var(--primary-color);
        }

/* Modal Size Adjustments */
.modal-lg[b-8jg3pgrbvt] {
    max-width: 900px;
}

/* ==================== MOBILE RESPONSIVE STYLES ==================== */

/* Tablet and below (768px) */
@media (max-width: 768px) {
    /* Prevent horizontal overflow on entire page */
    body[b-8jg3pgrbvt] {
        overflow-x: hidden;
    }

    /* Ensure main content container doesn't overflow */
    .main-content[b-8jg3pgrbvt] {
        overflow-x: hidden;
        max-width: 100vw;
    }

    /* Ensure content card doesn't overflow */
    .content-card[b-8jg3pgrbvt] {
        padding: 1.25rem;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* Keep table scrollable on all devices */
    .checks-table-container[b-8jg3pgrbvt] {
        max-width: 100%;
        overflow-x: auto; /* Allow horizontal scrolling */
        border: 1px solid #e9ecef;
        border-radius: 8px;
    }

    /* Page Header */
    .page-header[b-8jg3pgrbvt] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
        padding-bottom: 1rem;
        margin-bottom: 1.5rem;
    }

    .page-title[b-8jg3pgrbvt] {
        font-size: 1.5rem;
    }

        .page-title i[b-8jg3pgrbvt] {
            font-size: 1.5rem;
        }

    .breadcrumb[b-8jg3pgrbvt] {
        font-size: 0.8rem;
    }

    .add-new-btn[b-8jg3pgrbvt] {
        width: 100%;
        justify-content: center;
        padding: 0.65rem 1.25rem;
        font-size: 0.9rem;
    }

    /* Statistics Cards */
    .dashboard-card[b-8jg3pgrbvt] {
        padding: 1.25rem;
    }

    .card-icon[b-8jg3pgrbvt] {
        width: 50px;
        height: 50px;
        font-size: 1.5rem;
    }

    .card-value[b-8jg3pgrbvt] {
        font-size: 1.5rem;
    }

    .card-title[b-8jg3pgrbvt] {
        font-size: 0.85rem;
    }

    .card-change[b-8jg3pgrbvt] {
        font-size: 0.8rem;
    }

    /* Content Card */
    .content-card[b-8jg3pgrbvt] {
        padding: 1.25rem;
    }

    .card-header-custom[b-8jg3pgrbvt] {
        padding-bottom: 1rem;
        margin-bottom: 1rem;
    }

    .card-title-custom[b-8jg3pgrbvt] {
        font-size: 1.1rem;
    }

        .card-title-custom i[b-8jg3pgrbvt] {
            font-size: 1.25rem;
        }

    .card-subtitle-custom[b-8jg3pgrbvt] {
        font-size: 0.85rem;
    }

    /* Search and Filter Bar */
    .filter-section[b-8jg3pgrbvt] {
        margin-bottom: 1rem;
    }

    .search-box input[b-8jg3pgrbvt] {
        padding: 0.6rem 1rem 0.6rem 2.5rem;
        font-size: 0.9rem;
    }

    .search-box i[b-8jg3pgrbvt] {
        font-size: 1rem;
    }

    /* Filter Buttons */
    .btn-filter[b-8jg3pgrbvt],
    .btn-reset[b-8jg3pgrbvt],
    .btn-secondary[b-8jg3pgrbvt] {
        padding: 0.6rem 1rem;
        font-size: 0.85rem;
        white-space: nowrap;
    }

    /* Active Filters */
    .active-filters[b-8jg3pgrbvt] {
        padding: 0.6rem 0.75rem;
        gap: 0.4rem;
    }

    .filter-label[b-8jg3pgrbvt] {
        font-size: 0.8rem;
        width: 100%;
        margin-bottom: 0.25rem;
    }

    .filter-tag[b-8jg3pgrbvt] {
        font-size: 0.75rem;
        padding: 0.35rem 0.65rem;
    }

    /* Table */
    .checks-table[b-8jg3pgrbvt] {
        font-size: 0.8rem;
    }

        .checks-table thead th[b-8jg3pgrbvt],
        .checks-table tbody td[b-8jg3pgrbvt] {
            padding: 0.75rem 0.5rem;
        }

    .action-buttons[b-8jg3pgrbvt] {
        flex-direction: column;
        gap: 0.25rem;
    }

    .table-select[b-8jg3pgrbvt] {
        font-size: 0.8rem;
        padding: 0.35rem 0.5rem;
    }

    .btn-picker[b-8jg3pgrbvt] {
        font-size: 0.8rem;
        padding: 0.45rem 0.65rem;
    }

        .btn-picker i:first-child[b-8jg3pgrbvt] {
            font-size: 1rem;
        }

        .btn-picker i:last-child[b-8jg3pgrbvt] {
            font-size: 0.85rem;
        }

    /* Expandable Details */
    .expanded-content[b-8jg3pgrbvt] {
        padding: 1.25rem;
    }

    .section-title[b-8jg3pgrbvt] {
        font-size: 0.95rem;
    }

    .detail-grid[b-8jg3pgrbvt] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .detail-item[b-8jg3pgrbvt] {
        padding: 0.75rem;
    }

        .detail-item label[b-8jg3pgrbvt] {
            font-size: 0.8rem;
        }

        .detail-item span[b-8jg3pgrbvt] {
            font-size: 0.9rem;
        }

    /* Pagination */
    .pagination-wrapper[b-8jg3pgrbvt] {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
        margin-top: 1rem;
        padding-top: 1rem;
    }

    .showing-entries[b-8jg3pgrbvt] {
        font-size: 0.85rem;
        text-align: center;
    }

    .pagination[b-8jg3pgrbvt] {
        justify-content: center;
    }

    .page-link[b-8jg3pgrbvt] {
        padding: 0.4rem 0.6rem;
        font-size: 0.85rem;
    }

    /* Modal */
    .modal-lg[b-8jg3pgrbvt] {
        max-width: 100%;
        margin: 0.5rem;
    }

    .modal-header[b-8jg3pgrbvt] {
        padding: 1.25rem;
    }

        .modal-header .modal-title[b-8jg3pgrbvt] {
            font-size: 1.1rem;
        }

            .modal-header .modal-title i[b-8jg3pgrbvt] {
                font-size: 1.25rem;
            }

    .modal-body[b-8jg3pgrbvt] {
        padding: 1.25rem;
    }

    .modal-footer[b-8jg3pgrbvt] {
        padding: 1rem;
        flex-wrap: wrap;
        gap: 0.5rem;
    }

        .modal-footer .btn[b-8jg3pgrbvt] {
            flex: 1 1 auto;
            min-width: 120px;
        }

    .filter-modal-label[b-8jg3pgrbvt] {
        font-size: 0.85rem;
    }

        .filter-modal-label i[b-8jg3pgrbvt] {
            font-size: 1rem;
        }

    .form-select-custom[b-8jg3pgrbvt],
    .form-control-custom[b-8jg3pgrbvt] {
        font-size: 0.9rem;
        padding: 0.6rem 0.85rem;
    }
}

/* Small Mobile (576px and below) */
@media (max-width: 576px) {
    /* Prevent page overflow but allow table scrolling */
    body[b-8jg3pgrbvt], html[b-8jg3pgrbvt] {
        overflow-x: hidden;
        max-width: 100vw;
    }

    .main-content[b-8jg3pgrbvt] {
        overflow-x: hidden;
        max-width: 100vw;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    /* Page Header */
    .page-title[b-8jg3pgrbvt] {
        font-size: 1.25rem;
    }

        .page-title i[b-8jg3pgrbvt] {
            font-size: 1.25rem;
        }

    .breadcrumb[b-8jg3pgrbvt] {
        font-size: 0.75rem;
    }

    /* Statistics Cards */
    .dashboard-card[b-8jg3pgrbvt] {
        padding: 1rem;
    }

    .card-icon[b-8jg3pgrbvt] {
        width: 45px;
        height: 45px;
        font-size: 1.25rem;
    }

    .card-value[b-8jg3pgrbvt] {
        font-size: 1.25rem;
    }

    /* Content Card */
    .content-card[b-8jg3pgrbvt] {
        padding: 1rem;
        border-radius: 8px;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* Table remains scrollable */
    .checks-table-container[b-8jg3pgrbvt] {
        overflow-x: auto;
        padding: 0.5rem;
        position: relative;
    }

        /* Mobile scroll hint */
        .desktop-view .checks-table-container[b-8jg3pgrbvt]::after {
            content: 'Swipe \2192';
            position: sticky;
            right: 5px;
            top: 15px;
            float: right;
            background: rgba(139, 0, 0, 0.9);
            color: white;
            padding: 0.4rem 0.8rem;
            border-radius: 15px;
            font-size: 0.75rem;
            font-weight: 700;
            z-index: 10;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
            animation: bounceHorizontal 2s ease-in-out infinite;
        }

    .checks-table-modern[b-8jg3pgrbvt] {
        min-width: 800px; /* Slightly smaller for mobile but still readable */
    }

    @@keyframes bounceHorizontal {
        0%[b-8jg3pgrbvt], 100%[b-8jg3pgrbvt] {
            transform: translateX(0);
            opacity: 0.8;
        }
        50%[b-8jg3pgrbvt] {
            transform: translateX(-5px);
            opacity: 1;
        }
    }

    .card-header-custom[b-8jg3pgrbvt] {
        padding-bottom: 0.75rem;
        margin-bottom: 0.75rem;
    }

    /* Search and Filter */
    .search-box input[b-8jg3pgrbvt] {
        padding: 0.55rem 0.85rem 0.55rem 2.25rem;
        font-size: 0.85rem;
    }

    .search-box i[b-8jg3pgrbvt] {
        font-size: 0.9rem;
        left: 0.85rem;
    }

    /* Button Groups - Stack vertically */
    .d-flex.gap-2.justify-content-end[b-8jg3pgrbvt] {
        flex-direction: column !important;
    }

        .d-flex.gap-2.justify-content-end .btn[b-8jg3pgrbvt] {
            width: 100%;
        }

    .btn-filter[b-8jg3pgrbvt],
    .btn-reset[b-8jg3pgrbvt],
    .btn-secondary[b-8jg3pgrbvt] {
        padding: 0.55rem 0.85rem;
        font-size: 0.8rem;
        justify-content: center;
    }

    /* Active Filters */
    .active-filters[b-8jg3pgrbvt] {
        padding: 0.5rem;
    }

    .filter-tag[b-8jg3pgrbvt] {
        font-size: 0.7rem;
        padding: 0.3rem 0.55rem;
    }

    /* Mobile Cards */
    .check-card[b-8jg3pgrbvt] {
        padding: 1rem;
        margin-bottom: 0.75rem;
    }

    .card-body-row[b-8jg3pgrbvt] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .voucher-badge-mobile[b-8jg3pgrbvt] {
        font-size: 0.8rem;
        padding: 0.35rem 0.7rem;
    }

    .date-mobile[b-8jg3pgrbvt] {
        font-size: 0.8rem;
    }

    .info-content label[b-8jg3pgrbvt] {
        font-size: 0.7rem;
    }

    .info-content span[b-8jg3pgrbvt] {
        font-size: 0.85rem;
    }

    .amount-mobile[b-8jg3pgrbvt] {
        font-size: 0.95rem;
    }

    .detail-row[b-8jg3pgrbvt] {
        font-size: 0.8rem;
    }

    .btn-action-mobile[b-8jg3pgrbvt] {
        padding: 0.55rem 0.85rem;
        font-size: 0.8rem;
    }

    .badge[b-8jg3pgrbvt] {
        padding: 0.4rem 0.8rem;
        font-size: 0.75rem;
    }

    /* Pagination - Compact version */
    .pagination[b-8jg3pgrbvt] {
        flex-wrap: wrap;
        gap: 0.25rem;
    }

    .page-item[b-8jg3pgrbvt] {
        flex: 0 0 auto;
    }

    .page-link[b-8jg3pgrbvt] {
        padding: 0.35rem 0.5rem;
        font-size: 0.8rem;
        min-width: 36px;
        text-align: center;
    }

    /* Hide some page numbers on very small screens */
    .pagination .page-item:not(.active):not(:first-child):not(:last-child):nth-child(n+6)[b-8jg3pgrbvt] {
        display: none;
    }

    /* Modal adjustments */
    .modal-dialog[b-8jg3pgrbvt] {
        margin: 0.25rem;
    }

    .modal-header[b-8jg3pgrbvt] {
        padding: 1rem;
    }

        .modal-header .modal-title[b-8jg3pgrbvt] {
            font-size: 1rem;
        }

    .modal-body[b-8jg3pgrbvt] {
        padding: 1rem;
    }

    .modal-footer[b-8jg3pgrbvt] {
        padding: 0.75rem;
    }

        .modal-footer .btn[b-8jg3pgrbvt] {
            padding: 0.5rem 0.75rem;
            font-size: 0.8rem;
        }

    /* Expanded content */
    .expanded-content[b-8jg3pgrbvt] {
        padding: 1rem;
    }

    .section-title[b-8jg3pgrbvt] {
        font-size: 0.9rem;
    }

    .detail-item[b-8jg3pgrbvt] {
        padding: 0.65rem;
    }

    .btn-picker-compact[b-8jg3pgrbvt] {
        font-size: 0.8rem;
        padding: 0.45rem 0.75rem;
    }

    .status-select[b-8jg3pgrbvt] {
        font-size: 0.8rem;
        padding: 0.4rem;
    }

    .particulars-content[b-8jg3pgrbvt] {
        padding: 0.75rem;
        font-size: 0.85rem;
    }
}

/* Extra Small Mobile (400px and below) */
@media (max-width: 400px) {
    /* Prevent page overflow while keeping table scrollable */
    body[b-8jg3pgrbvt], html[b-8jg3pgrbvt], .main-content[b-8jg3pgrbvt] {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }

    .page-title[b-8jg3pgrbvt] {
        font-size: 1.1rem;
        word-wrap: break-word;
    }

    .card-value[b-8jg3pgrbvt] {
        font-size: 1.1rem;
    }

    .content-card[b-8jg3pgrbvt] {
        padding: 0.85rem;
        max-width: 100%;
        box-sizing: border-box;
    }

    .check-card[b-8jg3pgrbvt] {
        padding: 0.85rem;
    }

    .filter-tag[b-8jg3pgrbvt] {
        font-size: 0.65rem;
        padding: 0.25rem 0.5rem;
    }

    /* Simplify pagination on very small screens */
    .showing-entries[b-8jg3pgrbvt] {
        font-size: 0.75rem;
    }

    .pagination .page-item:not(.active):not(:first-child):not(:last-child):nth-child(n+4)[b-8jg3pgrbvt] {
        display: none;
    }

    /* Ensure all text elements can wrap */
    .voucher-badge[b-8jg3pgrbvt], .voucher-badge-mobile[b-8jg3pgrbvt], .payee-name[b-8jg3pgrbvt] {
        word-wrap: break-word;
        white-space: normal;
        max-width: 100%;
    }

    /* Keep table scrollable with reduced minimum width */
    .checks-table-modern[b-8jg3pgrbvt] {
        min-width: 700px;
    }

    .checks-table-container[b-8jg3pgrbvt] {
        padding: 0.25rem;
    }
}

/* ==================== RESPONSIVE TABLE STYLES ==================== */

/* Desktop View */
.desktop-view[b-8jg3pgrbvt] {
    display: block;
}

.mobile-view[b-8jg3pgrbvt] {
    display: none;
}

/* Table Container with Overflow Handling */
.checks-table-container[b-8jg3pgrbvt] {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
    margin-bottom: 1rem;
    position: relative;
    /* Ensure scrolling works on all devices */
    max-width: 100%;
    box-sizing: border-box;
}

    /* Scrollbar styling */
    .checks-table-container[b-8jg3pgrbvt]::-webkit-scrollbar {
        height: 10px;
    }

    .checks-table-container[b-8jg3pgrbvt]::-webkit-scrollbar-track {
        background: #f1f3f5;
        border-radius: 5px;
        margin: 0 10px;
    }

    .checks-table-container[b-8jg3pgrbvt]::-webkit-scrollbar-thumb {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        border-radius: 5px;
        border: 2px solid #f1f3f5;
    }

        .checks-table-container[b-8jg3pgrbvt]::-webkit-scrollbar-thumb:hover {
            background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
        }

    /* Scroll shadow indicator - shows when there's more content to the right */
    .checks-table-container[b-8jg3pgrbvt] {
        background:
            linear-gradient(to right, white 30%, rgba(255,255,255,0)) 0 0,
            linear-gradient(to right, rgba(255,255,255,0), white 70%) 100% 0,
            radial-gradient(farthest-side at 0 50%, rgba(139,0,0,.2), rgba(0,0,0,0)) 0 0,
            radial-gradient(farthest-side at 100% 50%, rgba(139,0,0,.2), rgba(0,0,0,0)) 100% 0;
        background-repeat: no-repeat;
        background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%;
        background-attachment: local, local, scroll, scroll;
    }

/* Modern Table Styles */
.checks-table-modern[b-8jg3pgrbvt] {
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    min-width: 900px; /* Minimum width to ensure all columns are readable */
    table-layout: auto;
}

    .checks-table-modern thead[b-8jg3pgrbvt] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
    }

        .checks-table-modern thead th[b-8jg3pgrbvt] {
            padding: 1rem;
            font-weight: 600;
            font-size: 0.9rem;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            border: none;
        }

            .checks-table-modern thead th:first-child[b-8jg3pgrbvt] {
                border-radius: 10px 0 0 0;
            }

            .checks-table-modern thead th:last-child[b-8jg3pgrbvt] {
                border-radius: 0 10px 0 0;
            }

    .checks-table-modern tbody .main-row[b-8jg3pgrbvt] {
        background: white;
        transition: all 0.3s ease;
        border-bottom: 1px solid #e9ecef;
    }

        .checks-table-modern tbody .main-row:hover[b-8jg3pgrbvt] {
            background: #f8f9fa;
            transform: translateX(2px);
            box-shadow: 0 2px 8px rgba(139, 0, 0, 0.1);
        }

        .checks-table-modern tbody .main-row td[b-8jg3pgrbvt] {
            padding: 1rem;
            vertical-align: middle;
            cursor: pointer;
            white-space: nowrap; /* Prevent text wrapping that could break layout */
        }

            /* Allow certain cells to wrap if needed */
            .checks-table-modern tbody .main-row td:nth-child(4)[b-8jg3pgrbvt] {
                white-space: normal; /* Payee name can wrap */
                min-width: 150px;
            }

/* Expand Button */
.btn-expand[b-8jg3pgrbvt] {
    background: none;
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: all 0.3s ease;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .btn-expand:hover[b-8jg3pgrbvt] {
        background: rgba(139, 0, 0, 0.1);
    }

    .btn-expand i[b-8jg3pgrbvt] {
        transition: transform 0.3s ease;
        font-size: 1rem;
    }

    .btn-expand.expanded i[b-8jg3pgrbvt] {
        transform: rotate(90deg);
    }

/* Cell Styles */
.date-wrapper[b-8jg3pgrbvt] {
    display: flex;
    align-items: center;
    font-size: 0.9rem;
}

.voucher-badge[b-8jg3pgrbvt] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.85rem;
    display: inline-block;
    letter-spacing: 0.5px;
}

.payee-info[b-8jg3pgrbvt] {
    display: flex;
    align-items: center;
}

.payee-name[b-8jg3pgrbvt] {
    font-weight: 600;
    color: #2c3e50;
}

.amount-highlight[b-8jg3pgrbvt] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
    background: linear-gradient(135deg, rgba(139, 0, 0, 0.05) 0%, rgba(212, 175, 55, 0.05) 100%);
    padding: 0.5rem 0.8rem;
    border-radius: 6px;
    display: inline-block;
}

/* Status Badges */
.badge[b-8jg3pgrbvt] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: capitalize;
}

.badge-na[b-8jg3pgrbvt] {
    background: #e9ecef;
    color: #6c757d;
}

.badge-pending[b-8jg3pgrbvt] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #fff;
}

.badge-in-progress[b-8jg3pgrbvt] {
    background: linear-gradient(135deg, #17a2b8 0%, #138496 100%);
    color: #fff;
}

.badge-completed[b-8jg3pgrbvt] {
    background: linear-gradient(135deg, #2E7D32 0%, #43A047 100%);
    color: #fff;
}

.badge-cancelled[b-8jg3pgrbvt] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: #fff;
}

/* Action Icon Button */
.btn-action-icon[b-8jg3pgrbvt] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

    .btn-action-icon:hover[b-8jg3pgrbvt] {
        background: var(--primary-color);
        color: white;
        transform: scale(1.1);
    }

/* Expandable Row */
.expandable-row[b-8jg3pgrbvt] {
    background: #f8f9fa;
    border-bottom: 2px solid var(--secondary-color);
}

    .expandable-row td[b-8jg3pgrbvt] {
        padding: 0 !important;
    }

.expanded-content[b-8jg3pgrbvt] {
    padding: 2rem;
    animation: slideDown 0.3s ease-out;
}

@@keyframes slideDown {
    from[b-8jg3pgrbvt] {
        opacity: 0;
        transform: translateY(-10px);
    }

    to[b-8jg3pgrbvt] {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Detail Sections */
.detail-section[b-8jg3pgrbvt] {
    margin-bottom: 1.5rem;
}

    .detail-section:last-child[b-8jg3pgrbvt] {
        margin-bottom: 0;
    }

.section-title[b-8jg3pgrbvt] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--secondary-color);
    display: flex;
    align-items: center;
}

.detail-grid[b-8jg3pgrbvt] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.detail-item[b-8jg3pgrbvt] {
    background: white;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

    .detail-item:hover[b-8jg3pgrbvt] {
        border-color: var(--secondary-color);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.2);
    }

    .detail-item.full-width[b-8jg3pgrbvt] {
        grid-column: 1 / -1;
    }

    .detail-item label[b-8jg3pgrbvt] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 0.85rem;
        color: #6c757d;
        font-weight: 600;
        margin-bottom: 0.5rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .detail-item span[b-8jg3pgrbvt] {
        color: #2c3e50;
        font-weight: 600;
        font-size: 0.95rem;
    }

.check-number[b-8jg3pgrbvt] {
    font-family: 'Courier New', monospace;
    background: #f8f9fa;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
}

.project-name[b-8jg3pgrbvt] {
    color: var(--primary-color);
    font-weight: 700;
}

/* Compact Picker Buttons */
.btn-picker-compact[b-8jg3pgrbvt] {
    width: 100%;
    padding: 0.5rem 1rem;
    border-radius: 6px;
    border: 2px solid #e9ecef;
    background: white;
    color: #6c757d;
    font-size: 0.85rem;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5rem;
}

    .btn-picker-compact.btn-picker-empty[b-8jg3pgrbvt] {
        border-color: var(--primary-color);
        color: var(--primary-color);
        border-style: dashed;
    }

    .btn-picker-compact.btn-picker-filled[b-8jg3pgrbvt] {
        background: linear-gradient(135deg, rgba(139, 0, 0, 0.05) 0%, rgba(212, 175, 55, 0.05) 100%);
        border-color: var(--secondary-color);
        color: var(--primary-color);
    }

    .btn-picker-compact:hover[b-8jg3pgrbvt] {
        background: var(--primary-color);
        color: white;
        border-color: var(--primary-color);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
    }

/* Status Select */
.status-select[b-8jg3pgrbvt] {
    border: 2px solid #e9ecef;
    border-radius: 6px;
    font-weight: 600;
    padding: 0.5rem;
    background: white;
}

/* Particulars */
.particulars-content[b-8jg3pgrbvt] {
    background: white;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    color: #2c3e50;
    line-height: 1.6;
}

/* ==================== MOBILE CARD STYLES ==================== */

.check-card[b-8jg3pgrbvt] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    cursor: pointer;
    border: 2px solid transparent;
}

    .check-card:hover[b-8jg3pgrbvt] {
        border-color: var(--secondary-color);
        box-shadow: 0 4px 16px rgba(212, 175, 55, 0.3);
        transform: translateY(-2px);
    }

.card-header-row[b-8jg3pgrbvt] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.voucher-info[b-8jg3pgrbvt] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.voucher-badge-mobile[b-8jg3pgrbvt] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.85rem;
    display: inline-block;
    letter-spacing: 0.5px;
}

.date-mobile[b-8jg3pgrbvt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #6c757d;
    font-size: 0.85rem;
}

.card-body-row[b-8jg3pgrbvt] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

.info-group[b-8jg3pgrbvt] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

    .info-group i[b-8jg3pgrbvt] {
        color: var(--primary-color);
        font-size: 1.25rem;
        margin-top: 0.25rem;
    }

.info-content[b-8jg3pgrbvt] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    .info-content label[b-8jg3pgrbvt] {
        font-size: 0.75rem;
        color: #6c757d;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .info-content span[b-8jg3pgrbvt] {
        font-size: 0.9rem;
        color: #2c3e50;
        font-weight: 600;
    }

.amount-mobile[b-8jg3pgrbvt] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
}

.card-divider[b-8jg3pgrbvt] {
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, var(--secondary-color) 50%, transparent 100%);
    margin: 1rem 0;
}

.card-details-grid[b-8jg3pgrbvt] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.detail-row[b-8jg3pgrbvt] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.85rem;
    color: #2c3e50;
}

    .detail-row i[b-8jg3pgrbvt] {
        color: #6c757d;
        width: 20px;
        text-align: center;
    }

.card-actions[b-8jg3pgrbvt] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.btn-action-mobile[b-8jg3pgrbvt] {
    background: white;
    border: 2px solid var(--secondary-color);
    color: var(--primary-color);
    padding: 0.6rem 1rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
}

    .btn-action-mobile:hover[b-8jg3pgrbvt] {
        background: var(--primary-color);
        color: white;
        border-color: var(--primary-color);
    }

    .btn-action-mobile i[b-8jg3pgrbvt] {
        font-size: 1rem;
    }

/* ==================== RESPONSIVE BREAKPOINTS ==================== */

/* Switch to mobile card view on tablets and smaller */
@@media (max-width: 992px) {
    .desktop-view[b-8jg3pgrbvt] {
        display: none !important;
    }

    .mobile-view[b-8jg3pgrbvt] {
        display: block !important;
    }
}

/* Tablet and below - Ensure horizontal scroll */
@@media (max-width: 992px) {
    .checks-table-container[b-8jg3pgrbvt] {
        overflow-x: auto;
        border: 1px solid #e9ecef;
        border-radius: 8px;
        background: white;
    }

    .checks-table-modern[b-8jg3pgrbvt] {
        min-width: 900px; /* Ensure minimum width for readability */
    }
    /* Visual scroll indicator on right edge */
    .desktop-view .checks-table-container[b-8jg3pgrbvt]::after {
        content: '\21C4'; /* Left-right arrow symbol */
        position: sticky;
        right: 0;
        top: 50%;
        float: right;
        transform: translateY(-50%);
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
        padding: 0.5rem 0.75rem;
        border-radius: 20px 0 0 20px;
        font-size: 1rem;
        font-weight: 700;
        z-index: 10;
        box-shadow: -2px 2px 8px rgba(139, 0, 0, 0.3);
        animation: pulseScroll 2s ease-in-out infinite;
        pointer-events: none;
    }

    @@keyframes pulseScroll {
        0%[b-8jg3pgrbvt], 100%[b-8jg3pgrbvt] {
            opacity: 0.6;
            transform: translateY(-50%) scale(0.95);
        }

        50%[b-8jg3pgrbvt] {
            opacity: 1;
            transform: translateY(-50%) scale(1.05);
        }
    }
}

/* Small mobile adjustments for cards */
@@media (max-width: 576px) {
    .card-body-row[b-8jg3pgrbvt] {
        grid-template-columns: 1fr;
    }

    .check-card[b-8jg3pgrbvt] {
        padding: 1rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/CheckIssuance/CheckIssuanceManagement.razor.rz.scp.css */
/* Content Card */
.content-card[b-yrnmp5agbu] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Card Header */
.card-header-custom[b-yrnmp5agbu] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-yrnmp5agbu] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-yrnmp5agbu] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-yrnmp5agbu] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Form Controls */
.form-label[b-yrnmp5agbu] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

    .form-label i[b-yrnmp5agbu] {
        color: var(--secondary-color);
    }

.form-control-custom[b-yrnmp5agbu], .form-select-custom[b-yrnmp5agbu] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control-custom:focus[b-yrnmp5agbu], .form-select-custom:focus[b-yrnmp5agbu] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Section Divider */
.section-divider[b-yrnmp5agbu] {
    margin: 2rem 0 1.5rem;
    padding-top: 1.5rem;
    border-top: 2px dashed #dee2e6;
}

.section-title[b-yrnmp5agbu] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
}

    .section-title i[b-yrnmp5agbu] {
        color: var(--secondary-color);
    }

/* Totals Display */
.totals-display[b-yrnmp5agbu] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid var(--secondary-color);
    border-radius: 12px;
    padding: 1.25rem;
    margin-top: 1.85rem;
}

.total-item[b-yrnmp5agbu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
}

    .total-item.balance[b-yrnmp5agbu] {
        border-top: 2px solid var(--primary-color);
        padding-top: 1rem;
        margin-top: 0.5rem;
    }

.total-label[b-yrnmp5agbu] {
    font-weight: 600;
    color: #495057;
    font-size: 0.95rem;
}

.total-value[b-yrnmp5agbu] {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--primary-color);
}

/* Action Buttons */
.action-buttons-container[b-yrnmp5agbu] {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 2px solid #f1f3f5;
}

.btn[b-yrnmp5agbu] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-yrnmp5agbu] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

    .btn-primary:hover[b-yrnmp5agbu] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.btn-secondary[b-yrnmp5agbu] {
    background-color: #6c757d;
    border: none;
}

    .btn-secondary:hover[b-yrnmp5agbu] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

.btn-warning[b-yrnmp5agbu] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #495057;
    border: none;
}

    .btn-warning:hover[b-yrnmp5agbu] {
        background: linear-gradient(135deg, #e0a800 0%, #ffc107 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(255, 193, 7, 0.4);
        color: #495057;
    }

.btn-info[b-yrnmp5agbu] {
    background: linear-gradient(135deg, #0dcaf0 0%, #0aa2c0 100%);
    color: white;
    border: none;
}

    .btn-info:hover[b-yrnmp5agbu] {
        background: linear-gradient(135deg, #0aa2c0 0%, #0dcaf0 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(13, 202, 240, 0.4);
        color: white;
    }

/* Page Header */
.page-header[b-yrnmp5agbu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-yrnmp5agbu] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-yrnmp5agbu] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-yrnmp5agbu] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-yrnmp5agbu]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-yrnmp5agbu] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-yrnmp5agbu] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-yrnmp5agbu] {
    color: #6c757d;
}

/* Print Voucher Styles */
.print-voucher[b-yrnmp5agbu] {
    padding: 40px;
    background: #e8f0f8;
    font-family: Arial, sans-serif;
}

.voucher-header[b-yrnmp5agbu] {
    text-align: center;
    margin-bottom: 10px;
}

.company-name[b-yrnmp5agbu] {
    font-size: 24px;
    font-weight: bold;
    margin: 0;
    color: #000;
}

.company-address[b-yrnmp5agbu] {
    font-size: 16px;
    margin: 5px 0 0;
    color: #000;
}

.document-title[b-yrnmp5agbu] {
    text-align: center;
    margin: 20px 0;
}

    .document-title h4[b-yrnmp5agbu] {
        font-size: 20px;
        font-weight: bold;
        margin: 0;
        color: #000;
    }

.voucher-divider[b-yrnmp5agbu] {
    border: none;
    border-top: 2px solid #000;
    margin: 20px 0;
}

.voucher-details[b-yrnmp5agbu] {
    margin: 25px 0;
}

.detail-row[b-yrnmp5agbu] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
}

.detail-item[b-yrnmp5agbu] {
    flex: 1;
    display: flex;
    gap: 10px;
}

    .detail-item.full-width[b-yrnmp5agbu] {
        flex: 2;
    }

.detail-label[b-yrnmp5agbu] {
    font-weight: bold;
    min-width: 80px;
    color: #000;
}

.detail-value[b-yrnmp5agbu] {
    color: #000;
}

.particulars-section[b-yrnmp5agbu] {
    margin: 25px 0;
}

.section-heading[b-yrnmp5agbu] {
    font-weight: bold;
    margin-bottom: 15px;
    color: #000;
    font-size: 16px;
}

.particulars-table[b-yrnmp5agbu] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
    background: white;
}

    .particulars-table th[b-yrnmp5agbu],
    .particulars-table td[b-yrnmp5agbu] {
        border: 1px solid #000;
        padding: 10px;
        text-align: left;
        color: #000;
    }

    .particulars-table th[b-yrnmp5agbu] {
        background-color: #d0d0d0;
        font-weight: bold;
    }

    .particulars-table .text-end[b-yrnmp5agbu] {
        text-align: right;
    }

.signatures-section[b-yrnmp5agbu] {
    display: flex;
    justify-content: space-between;
    margin-top: 50px;
    gap: 20px;
}

.signature-box[b-yrnmp5agbu] {
    flex: 1;
    text-align: center;
}

.signature-label[b-yrnmp5agbu] {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 40px;
    color: #000;
}

.signature-line[b-yrnmp5agbu] {
    /*border-bottom: 2px solid #000;*/
    margin: 0 10px 8px;
}

.signature-name[b-yrnmp5agbu] {
    font-size: 13px;
    color: #000;
}

.signature-subtitle[b-yrnmp5agbu] {
    font-size: 11px;
    font-style: italic;
    margin-top: 5px;
    color: #000;
}

/* Modal Styles */
.modal-content[b-yrnmp5agbu] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-xl[b-yrnmp5agbu] {
    max-width: 900px;
}

.modal-header[b-yrnmp5agbu] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-yrnmp5agbu] {
    padding: 0;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-yrnmp5agbu] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Toast */
.toast[b-yrnmp5agbu] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Accounting Entries Styles */
.accounting-entries-container[b-yrnmp5agbu] {
    background: white;
    border: 2px solid #e9ecef;
    border-radius: 12px;
    padding: 1.25rem;
    height: 100%;
    transition: all 0.3s ease;
}

    .accounting-entries-container:hover[b-yrnmp5agbu] {
        border-color: var(--secondary-color);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.1);
    }

.entries-header[b-yrnmp5agbu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #f1f3f5;
}

.entries-title[b-yrnmp5agbu] {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
}

    .entries-title i[b-yrnmp5agbu] {
        color: var(--secondary-color);
    }

.btn-add-entry[b-yrnmp5agbu] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.4rem 0.8rem;
    font-size: 0.85rem;
    font-weight: 600;
    border-radius: 6px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

    .btn-add-entry:hover[b-yrnmp5agbu] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-1px);
        box-shadow: 0 3px 8px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.entry-row[b-yrnmp5agbu] {
    margin-bottom: 0.75rem;
}

.entry-fields[b-yrnmp5agbu] {
    display: grid;
    grid-template-columns: 2fr 1fr auto;
    gap: 0.5rem;
    align-items: start;
}

.entry-account input[b-yrnmp5agbu],
.entry-amount input[b-yrnmp5agbu] {
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 0.5rem;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

    .entry-account input:focus[b-yrnmp5agbu],
    .entry-amount input:focus[b-yrnmp5agbu] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.15rem rgba(212, 175, 55, 0.15);
        outline: none;
    }

.btn-remove-entry[b-yrnmp5agbu] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
    border: none;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    transition: all 0.3s ease;
    font-size: 0.9rem;
}

    .btn-remove-entry:hover[b-yrnmp5agbu] {
        background: linear-gradient(135deg, #c82333 0%, #bd2130 100%);
        transform: scale(1.05);
        box-shadow: 0 2px 6px rgba(220, 53, 69, 0.4);
    }

.empty-entries-message[b-yrnmp5agbu] {
    text-align: center;
    padding: 2rem 1rem;
    color: #6c757d;
    font-size: 0.9rem;
    font-style: italic;
}

.entries-total[b-yrnmp5agbu] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 2px solid var(--primary-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .entries-total .total-label[b-yrnmp5agbu] {
        font-weight: 700;
        color: #495057;
        font-size: 1rem;
    }

    .entries-total .total-value[b-yrnmp5agbu] {
        font-weight: 700;
        font-size: 1.15rem;
        color: var(--primary-color);
    }

/* Validation Summary */
.validation-summary[b-yrnmp5agbu] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid #dee2e6;
    border-radius: 12px;
    padding: 1.25rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    transition: all 0.3s ease;
}

    .validation-summary.balanced[b-yrnmp5agbu] {
        border-color: #28a745;
        background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
    }

    .validation-summary.unbalanced[b-yrnmp5agbu] {
        border-color: #dc3545;
        background: linear-gradient(135deg, #f8d7da 0%, #f5c6cb 100%);
    }

    .validation-summary.warning[b-yrnmp5agbu] {
        border-color: #ffc107;
        background: linear-gradient(135deg, #fff3cd 0%, #ffeaa7 100%);
    }

.validation-item[b-yrnmp5agbu] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    .validation-item.validation-status[b-yrnmp5agbu] {
        grid-column: 1 / -1;
        border-top: 2px solid rgba(0,0,0,0.1);
        padding-top: 1rem;
        margin-top: 0.5rem;
    }

.validation-label[b-yrnmp5agbu] {
    font-weight: 600;
    color: #495057;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.validation-value[b-yrnmp5agbu] {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--primary-color);
}

    .validation-item.validation-status .validation-value[b-yrnmp5agbu] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 1rem;
    }

/* Print Preview Updates */
.particulars-section p[b-yrnmp5agbu] {
    margin: 0.5rem 0;
    font-size: 14px;
}

    .particulars-section p strong[b-yrnmp5agbu] {
        color: #000;
        font-weight: bold;
    }

.total-row[b-yrnmp5agbu] {
    background-color: #f0f0f0;
    font-weight: bold;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-title[b-yrnmp5agbu] {
        font-size: 1.5rem;
    }

    .content-card[b-yrnmp5agbu] {
        padding: 1.5rem;
    }

    .action-buttons-container[b-yrnmp5agbu] {
        flex-direction: column;
    }

        .action-buttons-container .btn[b-yrnmp5agbu] {
            width: 100%;
        }

    .totals-display[b-yrnmp5agbu] {
        margin-top: 0;
    }

    .signatures-section[b-yrnmp5agbu] {
        flex-wrap: wrap;
        gap: 30px;
    }

    .signature-box[b-yrnmp5agbu] {
        flex: 0 0 calc(50% - 15px);
    }

    .print-voucher[b-yrnmp5agbu] {
        padding: 20px;
    }

    .detail-row[b-yrnmp5agbu] {
        flex-direction: column;
        gap: 8px;
    }

    /* Mobile adjustments for accounting entries */
    .entry-fields[b-yrnmp5agbu] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .btn-remove-entry[b-yrnmp5agbu] {
        width: 100%;
    }

    .validation-summary[b-yrnmp5agbu] {
        grid-template-columns: 1fr;
    }

    .entries-header[b-yrnmp5agbu] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .btn-add-entry[b-yrnmp5agbu] {
        width: 100%;
        justify-content: center;
    }
}

@media print {
    body *[b-yrnmp5agbu] {
        visibility: hidden;
    }

    .print-voucher[b-yrnmp5agbu], .print-voucher *[b-yrnmp5agbu] {
        visibility: visible;
    }

    .print-voucher[b-yrnmp5agbu] {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        background: white;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/CheckIssuance/CheckIssuanceUserDashboard.razor.rz.scp.css */
/* Dashboard Cards */
.dashboard-card[b-0y3579ikr6] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

    .dashboard-card:hover[b-0y3579ikr6] {
        transform: translateY(-5px);
        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    }

.card-icon[b-0y3579ikr6] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-0y3579ikr6] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-0y3579ikr6] {
    color: #212529;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.card-change[b-0y3579ikr6] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
}

    .card-change.positive[b-0y3579ikr6] {
        color: #2E7D32;
    }

    .card-change i[b-0y3579ikr6] {
        margin-right: 0.25rem;
    }

/* Content Card */
.content-card[b-0y3579ikr6] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
    max-width: 100%; /* Ensure it doesn't exceed parent width */
    width: 100%;
    box-sizing: border-box;
}

.card-header-custom[b-0y3579ikr6] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-0y3579ikr6] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-0y3579ikr6] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-0y3579ikr6] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Page Header */
.page-header[b-0y3579ikr6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-0y3579ikr6] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-0y3579ikr6] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-0y3579ikr6] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-0y3579ikr6]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-0y3579ikr6] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-0y3579ikr6] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-0y3579ikr6] {
    color: #6c757d;
}

.add-new-btn[b-0y3579ikr6] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration:none;
}

    .add-new-btn:hover[b-0y3579ikr6] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

/* Filter Section */
.filter-section[b-0y3579ikr6] {
    margin-bottom: 1.5rem;
}

.filter-label[b-0y3579ikr6] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
    margin-bottom: 0.25rem;
    display: block;
}

.search-box[b-0y3579ikr6] {
    position: relative;
    width: 100%;
}

    .search-box input[b-0y3579ikr6] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-0y3579ikr6] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-0y3579ikr6] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.form-select-custom[b-0y3579ikr6], .form-control-custom[b-0y3579ikr6] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-select-custom:focus[b-0y3579ikr6], .form-control-custom:focus[b-0y3579ikr6] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Table Styles */
.checks-table[b-0y3579ikr6] {
    width: 100%;
    margin-top: 1rem;
}

    .checks-table thead[b-0y3579ikr6] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .checks-table thead th[b-0y3579ikr6] {
            <!-- color: white; -->
            font-weight: 600;
            padding: 1rem 0.75rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.8rem;
            letter-spacing: 0.5px;
            white-space: nowrap;
        }

    .checks-table tbody tr[b-0y3579ikr6] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .checks-table tbody tr:hover[b-0y3579ikr6] {
            background-color: #f8f5f0;
            box-shadow: inset 4px 0 0 var(--secondary-color), 0 2px 8px rgba(139, 0, 0, 0.1);
            transform: scale(1.01);
        }

        /* Extra visual indicator on hover */
        .checks-table tbody tr:hover td[b-0y3579ikr6] {
 color: var(--primary-color);
     font-weight: 500;
        }

    .checks-table tbody td[b-0y3579ikr6] {
        padding: 1rem 0.75rem;
        vertical-align: middle;
        font-size: 0.9rem;
    }

.voucher-number[b-0y3579ikr6] {
    font-weight: 600;
    color: var(--primary-color);
}

.amount-value[b-0y3579ikr6] {
    font-weight: 700;
    color: var(--primary-color);
}

/* Table Select Dropdowns */
.table-select[b-0y3579ikr6] {
    border: 2px solid #e9ecef;
    border-radius: 6px;
    padding: 0.4rem 0.6rem;
    font-size: 0.85rem;
    transition: all 0.3s ease;
    cursor: pointer;
    width: 100%;
}

    .table-select:focus[b-0y3579ikr6] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.15rem rgba(212, 175, 55, 0.15);
    }

    .table-select:hover[b-0y3579ikr6] {
        border-color: var(--secondary-color);
    }

/* Picker Buttons */
.btn-picker[b-0y3579ikr6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 2px solid #e9ecef;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 500;
    transition: all 0.3s ease;
    cursor: pointer;
    background-color: white;
    text-align: left;
}

    .btn-picker:hover:not(:disabled)[b-0y3579ikr6] {
        border-color: var(--secondary-color);
        background-color: #f8f5f0;
        transform: translateY(-1px);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.2);
    }

    .btn-picker:active:not(:disabled)[b-0y3579ikr6] {
        transform: translateY(0);
        box-shadow: 0 1px 4px rgba(212, 175, 55, 0.15);
    }

    .btn-picker:disabled[b-0y3579ikr6] {
        opacity: 0.6;
        cursor: not-allowed;
    }

    .btn-picker i:first-child[b-0y3579ikr6] {
        color: var(--primary-color);
        font-size: 1.1rem;
        flex-shrink: 0;
    }

    .btn-picker i:last-child[b-0y3579ikr6] {
        color: #6c757d;
        font-size: 0.9rem;
        flex-shrink: 0;
    }

    .btn-picker span[b-0y3579ikr6] {
        flex: 1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.btn-picker-empty[b-0y3579ikr6] {
    color: #6c757d;
    font-style: italic;
}

    .btn-picker-empty:hover:not(:disabled)[b-0y3579ikr6] {
        color: #495057;
    }

.btn-picker-filled[b-0y3579ikr6] {
    color: #212529;
    border-color: #d4af37;
    background-color: #fff8e6;
}

    .btn-picker-filled:hover:not(:disabled)[b-0y3579ikr6] {
        border-color: var(--secondary-color);
        background-color: #fff3cd;
    }

    .btn-picker-filled i:first-child[b-0y3579ikr6] {
        color: var(--secondary-color);
    }

/* Status Select Colors */
.status-select.status-pending[b-0y3579ikr6] {
    background-color: #fff3cd;
    border-color: #ffc107;
    color: #856404;
    font-weight: 600;
}

.status-select.status-progress[b-0y3579ikr6] {
    background-color: #cfe2ff;
    border-color: #0d6efd;
    color: #084298;
    font-weight: 600;
}

.status-select.status-completed[b-0y3579ikr6] {
    background-color: #d1e7dd;
    border-color: #198754;
    color: #0f5132;
    font-weight: 600;
}

.status-select.status-cancelled[b-0y3579ikr6] {
    background-color: #f8d7da;
    border-color: #dc3545;
    color: #842029;
    font-weight: 600;
}

/* Action Buttons */
.action-buttons[b-0y3579ikr6] {
    display: flex;
    gap: 0.4rem;
    justify-content: center;
}

.btn-action[b-0y3579ikr6] {
    padding: 0.4rem 0.6rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-view[b-0y3579ikr6] {
    background-color: #0dcaf0;
    color: white;
}

    .btn-view:hover[b-0y3579ikr6] {
        background-color: #0aa2c0;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 202, 240, 0.3);
    }

.btn-edit[b-0y3579ikr6] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-0y3579ikr6] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

.btn-print[b-0y3579ikr6] {
    background-color: #6c757d;
    color: white;
}

    .btn-print:hover[b-0y3579ikr6] {
        background-color: #5c636a;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(108, 117, 125, 0.3);
    }

/* Pagination */
.pagination-wrapper[b-0y3579ikr6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-0y3579ikr6] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-0y3579ikr6] {
    margin: 0;
}

.page-link[b-0y3579ikr6] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

    .page-link:hover[b-0y3579ikr6] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
    }

.page-item.active .page-link[b-0y3579ikr6] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Modal Styles */
.modal-content[b-0y3579ikr6] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-0y3579ikr6] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-0y3579ikr6] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-0y3579ikr6] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-0y3579ikr6] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-0y3579ikr6] {
            opacity: 1;
        }

.modal-body[b-0y3579ikr6] {
    padding: 2rem;
}

.modal-footer[b-0y3579ikr6] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.detail-label[b-0y3579ikr6] {
    font-weight: 600;
    color: #6c757d;
    font-size: 0.9rem;
    margin-bottom: 0.25rem;
}

.detail-value[b-0y3579ikr6] {
    color: #212529;
    font-size: 1rem;
    margin-bottom: 1rem;
}

/* Buttons */
.btn[b-0y3579ikr6] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-secondary[b-0y3579ikr6] {
    background-color: #6c757d;
    border: none;
}

    .btn-secondary:hover[b-0y3579ikr6] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

/* Toast */
.toast[b-0y3579ikr6] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Filter Modal Styles */
.filter-modal-label[b-0y3579ikr6] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .filter-modal-label i[b-0y3579ikr6] {
        color: var(--primary-color);
        font-size: 1.1rem;
    }

/* Filter Button Styles */
.btn-filter[b-0y3579ikr6] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-filter:hover[b-0y3579ikr6] {
        background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(139, 0, 0, 0.4);
    }

    .btn-filter:active[b-0y3579ikr6] {
        transform: translateY(0);
    }

.btn-reset[b-0y3579ikr6] {
    background-color: #6c757d;
    color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-reset:hover[b-0y3579ikr6] {
        background-color: #5c636a;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(108, 117, 125, 0.3);
    }

.btn-primary-filter[b-0y3579ikr6] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 700;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-primary-filter:hover[b-0y3579ikr6] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

/* Active Filters Display */
.active-filters[b-0y3579ikr6] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    border-left: 4px solid var(--secondary-color);
}

.filter-tag[b-0y3579ikr6] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.75rem;
    background-color: white;
    border: 1px solid var(--secondary-color);
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--primary-color);
    transition: all 0.2s ease;
}

    .filter-tag:hover[b-0y3579ikr6] {
        background-color: #fff8e6;
        box-shadow: 0 2px 6px rgba(212, 175, 55, 0.2);
    }

    .filter-tag i[b-0y3579ikr6] {
        cursor: pointer;
        font-size: 1rem;
        transition: transform 0.2s ease;
    }

        .filter-tag i:hover[b-0y3579ikr6] {
            transform: scale(1.2);
            color: var(--primary-color);
        }

/* Modal Size Adjustments */
.modal-lg[b-0y3579ikr6] {
    max-width: 900px;
}

/* ==================== MOBILE RESPONSIVE STYLES ==================== */

/* Tablet and below (768px) */
@media (max-width: 768px) {
    /* Prevent horizontal overflow on entire page */
    body[b-0y3579ikr6] {
        overflow-x: hidden;
    }

    /* Ensure main content container doesn't overflow */
    .main-content[b-0y3579ikr6] {
        overflow-x: hidden;
        max-width: 100vw;
    }

    /* Ensure content card doesn't overflow */
    .content-card[b-0y3579ikr6] {
        padding: 1.25rem;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* Keep table scrollable on all devices */
    .checks-table-container[b-0y3579ikr6] {
        max-width: 100%;
        overflow-x: auto; /* Allow horizontal scrolling */
        border: 1px solid #e9ecef;
        border-radius: 8px;
    }

    /* Page Header */
    .page-header[b-0y3579ikr6] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
        padding-bottom: 1rem;
        margin-bottom: 1.5rem;
    }

    .page-title[b-0y3579ikr6] {
        font-size: 1.5rem;
    }

        .page-title i[b-0y3579ikr6] {
            font-size: 1.5rem;
        }

    .breadcrumb[b-0y3579ikr6] {
        font-size: 0.8rem;
    }

    .add-new-btn[b-0y3579ikr6] {
        width: 100%;
        justify-content: center;
        padding: 0.65rem 1.25rem;
        font-size: 0.9rem;
    }

    /* Statistics Cards */
    .dashboard-card[b-0y3579ikr6] {
        padding: 1.25rem;
    }

    .card-icon[b-0y3579ikr6] {
        width: 50px;
        height: 50px;
        font-size: 1.5rem;
    }

    .card-value[b-0y3579ikr6] {
        font-size: 1.5rem;
    }

    .card-title[b-0y3579ikr6] {
        font-size: 0.85rem;
    }

    .card-change[b-0y3579ikr6] {
        font-size: 0.8rem;
    }

    /* Content Card */
    .content-card[b-0y3579ikr6] {
        padding: 1.25rem;
    }

    .card-header-custom[b-0y3579ikr6] {
        padding-bottom: 1rem;
        margin-bottom: 1rem;
    }

    .card-title-custom[b-0y3579ikr6] {
        font-size: 1.1rem;
    }

        .card-title-custom i[b-0y3579ikr6] {
            font-size: 1.25rem;
        }

    .card-subtitle-custom[b-0y3579ikr6] {
        font-size: 0.85rem;
    }

    /* Search and Filter Bar */
    .filter-section[b-0y3579ikr6] {
        margin-bottom: 1rem;
    }

    .search-box input[b-0y3579ikr6] {
        padding: 0.6rem 1rem 0.6rem 2.5rem;
        font-size: 0.9rem;
    }

    .search-box i[b-0y3579ikr6] {
        font-size: 1rem;
    }

    /* Filter Buttons */
    .btn-filter[b-0y3579ikr6],
    .btn-reset[b-0y3579ikr6],
    .btn-secondary[b-0y3579ikr6] {
        padding: 0.6rem 1rem;
        font-size: 0.85rem;
        white-space: nowrap;
    }

    /* Active Filters */
    .active-filters[b-0y3579ikr6] {
        padding: 0.6rem 0.75rem;
        gap: 0.4rem;
    }

    .filter-label[b-0y3579ikr6] {
        font-size: 0.8rem;
        width: 100%;
        margin-bottom: 0.25rem;
    }

    .filter-tag[b-0y3579ikr6] {
        font-size: 0.75rem;
        padding: 0.35rem 0.65rem;
    }

    /* Table */
    .checks-table[b-0y3579ikr6] {
        font-size: 0.8rem;
    }

        .checks-table thead th[b-0y3579ikr6],
        .checks-table tbody td[b-0y3579ikr6] {
            padding: 0.75rem 0.5rem;
        }

    .action-buttons[b-0y3579ikr6] {
        flex-direction: column;
        gap: 0.25rem;
    }

    .table-select[b-0y3579ikr6] {
        font-size: 0.8rem;
        padding: 0.35rem 0.5rem;
    }

    .btn-picker[b-0y3579ikr6] {
        font-size: 0.8rem;
        padding: 0.45rem 0.65rem;
    }

        .btn-picker i:first-child[b-0y3579ikr6] {
            font-size: 1rem;
        }

        .btn-picker i:last-child[b-0y3579ikr6] {
            font-size: 0.85rem;
        }

    /* Expandable Details */
    .expanded-content[b-0y3579ikr6] {
        padding: 1.25rem;
    }

    .section-title[b-0y3579ikr6] {
        font-size: 0.95rem;
    }

    .detail-grid[b-0y3579ikr6] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .detail-item[b-0y3579ikr6] {
        padding: 0.75rem;
    }

        .detail-item label[b-0y3579ikr6] {
            font-size: 0.8rem;
        }

        .detail-item span[b-0y3579ikr6] {
            font-size: 0.9rem;
        }

    /* Pagination */
    .pagination-wrapper[b-0y3579ikr6] {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
        margin-top: 1rem;
        padding-top: 1rem;
    }

    .showing-entries[b-0y3579ikr6] {
        font-size: 0.85rem;
        text-align: center;
    }

    .pagination[b-0y3579ikr6] {
        justify-content: center;
    }

    .page-link[b-0y3579ikr6] {
        padding: 0.4rem 0.6rem;
        font-size: 0.85rem;
    }

    /* Modal */
    .modal-lg[b-0y3579ikr6] {
        max-width: 100%;
        margin: 0.5rem;
    }

    .modal-header[b-0y3579ikr6] {
        padding: 1.25rem;
    }

        .modal-header .modal-title[b-0y3579ikr6] {
            font-size: 1.1rem;
        }

            .modal-header .modal-title i[b-0y3579ikr6] {
                font-size: 1.25rem;
            }

    .modal-body[b-0y3579ikr6] {
        padding: 1.25rem;
    }

    .modal-footer[b-0y3579ikr6] {
        padding: 1rem;
        flex-wrap: wrap;
        gap: 0.5rem;
    }

        .modal-footer .btn[b-0y3579ikr6] {
            flex: 1 1 auto;
            min-width: 120px;
        }

    .filter-modal-label[b-0y3579ikr6] {
        font-size: 0.85rem;
    }

        .filter-modal-label i[b-0y3579ikr6] {
            font-size: 1rem;
        }

    .form-select-custom[b-0y3579ikr6],
    .form-control-custom[b-0y3579ikr6] {
        font-size: 0.9rem;
        padding: 0.6rem 0.85rem;
    }
}

/* Small Mobile (576px and below) */
@media (max-width: 576px) {
    /* Prevent page overflow but allow table scrolling */
    body[b-0y3579ikr6], html[b-0y3579ikr6] {
        overflow-x: hidden;
        max-width: 100vw;
    }

    .main-content[b-0y3579ikr6] {
        overflow-x: hidden;
        max-width: 100vw;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    /* Page Header */
    .page-title[b-0y3579ikr6] {
        font-size: 1.25rem;
    }

        .page-title i[b-0y3579ikr6] {
            font-size: 1.25rem;
        }

    .breadcrumb[b-0y3579ikr6] {
        font-size: 0.75rem;
    }

    /* Statistics Cards */
    .dashboard-card[b-0y3579ikr6] {
        padding: 1rem;
    }

    .card-icon[b-0y3579ikr6] {
        width: 45px;
        height: 45px;
        font-size: 1.25rem;
    }

    .card-value[b-0y3579ikr6] {
        font-size: 1.25rem;
    }

    /* Content Card */
    .content-card[b-0y3579ikr6] {
        padding: 1rem;
        border-radius: 8px;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* Table remains scrollable */
    .checks-table-container[b-0y3579ikr6] {
        overflow-x: auto;
        padding: 0.5rem;
        position: relative;
    }

        /* Mobile scroll hint */
        .desktop-view .checks-table-container[b-0y3579ikr6]::after {
            content: 'Swipe \2192';
            position: sticky;
            right: 5px;
            top: 15px;
            float: right;
            background: rgba(139, 0, 0, 0.9);
            color: white;
            padding: 0.4rem 0.8rem;
            border-radius: 15px;
            font-size: 0.75rem;
            font-weight: 700;
            z-index: 10;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
            animation: bounceHorizontal 2s ease-in-out infinite;
        }

    .checks-table-modern[b-0y3579ikr6] {
        min-width: 800px; /* Slightly smaller for mobile but still readable */
    }

    @@keyframes bounceHorizontal {
        0%[b-0y3579ikr6], 100%[b-0y3579ikr6] {
            transform: translateX(0);
            opacity: 0.8;
        }
        50%[b-0y3579ikr6] {
            transform: translateX(-5px);
            opacity: 1;
        }
    }

    .card-header-custom[b-0y3579ikr6] {
        padding-bottom: 0.75rem;
        margin-bottom: 0.75rem;
    }

    /* Search and Filter */
    .search-box input[b-0y3579ikr6] {
        padding: 0.55rem 0.85rem 0.55rem 2.25rem;
        font-size: 0.85rem;
    }

    .search-box i[b-0y3579ikr6] {
        font-size: 0.9rem;
        left: 0.85rem;
    }

    /* Button Groups - Stack vertically */
    .d-flex.gap-2.justify-content-end[b-0y3579ikr6] {
        flex-direction: column !important;
    }

        .d-flex.gap-2.justify-content-end .btn[b-0y3579ikr6] {
            width: 100%;
        }

    .btn-filter[b-0y3579ikr6],
    .btn-reset[b-0y3579ikr6],
    .btn-secondary[b-0y3579ikr6] {
        padding: 0.55rem 0.85rem;
        font-size: 0.8rem;
        justify-content: center;
    }

    /* Active Filters */
    .active-filters[b-0y3579ikr6] {
        padding: 0.5rem;
    }

    .filter-tag[b-0y3579ikr6] {
        font-size: 0.7rem;
        padding: 0.3rem 0.55rem;
    }

    /* Mobile Cards */
    .check-card[b-0y3579ikr6] {
        padding: 1rem;
        margin-bottom: 0.75rem;
    }

    .card-body-row[b-0y3579ikr6] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .voucher-badge-mobile[b-0y3579ikr6] {
        font-size: 0.8rem;
        padding: 0.35rem 0.7rem;
    }

    .date-mobile[b-0y3579ikr6] {
        font-size: 0.8rem;
    }

    .info-content label[b-0y3579ikr6] {
        font-size: 0.7rem;
    }

    .info-content span[b-0y3579ikr6] {
        font-size: 0.85rem;
    }

    .amount-mobile[b-0y3579ikr6] {
        font-size: 0.95rem;
    }

    .detail-row[b-0y3579ikr6] {
        font-size: 0.8rem;
    }

    .btn-action-mobile[b-0y3579ikr6] {
        padding: 0.55rem 0.85rem;
        font-size: 0.8rem;
    }

    .badge[b-0y3579ikr6] {
        padding: 0.4rem 0.8rem;
        font-size: 0.75rem;
    }

    /* Pagination - Compact version */
    .pagination[b-0y3579ikr6] {
        flex-wrap: wrap;
        gap: 0.25rem;
    }

    .page-item[b-0y3579ikr6] {
        flex: 0 0 auto;
    }

    .page-link[b-0y3579ikr6] {
        padding: 0.35rem 0.5rem;
        font-size: 0.8rem;
        min-width: 36px;
        text-align: center;
    }

    /* Hide some page numbers on very small screens */
    .pagination .page-item:not(.active):not(:first-child):not(:last-child):nth-child(n+6)[b-0y3579ikr6] {
        display: none;
    }

    /* Modal adjustments */
    .modal-dialog[b-0y3579ikr6] {
        margin: 0.25rem;
    }

    .modal-header[b-0y3579ikr6] {
        padding: 1rem;
    }

        .modal-header .modal-title[b-0y3579ikr6] {
            font-size: 1rem;
        }

    .modal-body[b-0y3579ikr6] {
        padding: 1rem;
    }

    .modal-footer[b-0y3579ikr6] {
        padding: 0.75rem;
    }

        .modal-footer .btn[b-0y3579ikr6] {
            padding: 0.5rem 0.75rem;
            font-size: 0.8rem;
        }

    /* Expanded content */
    .expanded-content[b-0y3579ikr6] {
        padding: 1rem;
    }

    .section-title[b-0y3579ikr6] {
        font-size: 0.9rem;
    }

    .detail-item[b-0y3579ikr6] {
        padding: 0.65rem;
    }

    .btn-picker-compact[b-0y3579ikr6] {
        font-size: 0.8rem;
        padding: 0.45rem 0.75rem;
    }

    .status-select[b-0y3579ikr6] {
        font-size: 0.8rem;
        padding: 0.4rem;
    }

    .particulars-content[b-0y3579ikr6] {
        padding: 0.75rem;
        font-size: 0.85rem;
    }
}

/* Extra Small Mobile (400px and below) */
@media (max-width: 400px) {
    /* Prevent page overflow while keeping table scrollable */
    body[b-0y3579ikr6], html[b-0y3579ikr6], .main-content[b-0y3579ikr6] {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }

    .page-title[b-0y3579ikr6] {
        font-size: 1.1rem;
        word-wrap: break-word;
    }

    .card-value[b-0y3579ikr6] {
        font-size: 1.1rem;
    }

    .content-card[b-0y3579ikr6] {
        padding: 0.85rem;
        max-width: 100%;
        box-sizing: border-box;
    }

    .check-card[b-0y3579ikr6] {
        padding: 0.85rem;
    }

    .filter-tag[b-0y3579ikr6] {
        font-size: 0.65rem;
        padding: 0.25rem 0.5rem;
    }

    /* Simplify pagination on very small screens */
    .showing-entries[b-0y3579ikr6] {
        font-size: 0.75rem;
    }

    .pagination .page-item:not(.active):not(:first-child):not(:last-child):nth-child(n+4)[b-0y3579ikr6] {
        display: none;
    }

    /* Ensure all text elements can wrap */
    .voucher-badge[b-0y3579ikr6], .voucher-badge-mobile[b-0y3579ikr6], .payee-name[b-0y3579ikr6] {
        word-wrap: break-word;
        white-space: normal;
        max-width: 100%;
    }

    /* Keep table scrollable with reduced minimum width */
    .checks-table-modern[b-0y3579ikr6] {
        min-width: 700px;
    }

    .checks-table-container[b-0y3579ikr6] {
        padding: 0.25rem;
    }
}

/* ==================== RESPONSIVE TABLE STYLES ==================== */

/* Desktop View */
.desktop-view[b-0y3579ikr6] {
    display: block;
}

.mobile-view[b-0y3579ikr6] {
    display: none;
}

/* Table Container with Overflow Handling */
.checks-table-container[b-0y3579ikr6] {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
    margin-bottom: 1rem;
    position: relative;
    /* Ensure scrolling works on all devices */
    max-width: 100%;
    box-sizing: border-box;
}

    /* Scrollbar styling */
    .checks-table-container[b-0y3579ikr6]::-webkit-scrollbar {
        height: 10px;
    }

    .checks-table-container[b-0y3579ikr6]::-webkit-scrollbar-track {
        background: #f1f3f5;
        border-radius: 5px;
        margin: 0 10px;
    }

    .checks-table-container[b-0y3579ikr6]::-webkit-scrollbar-thumb {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        border-radius: 5px;
        border: 2px solid #f1f3f5;
    }

        .checks-table-container[b-0y3579ikr6]::-webkit-scrollbar-thumb:hover {
            background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
        }

    /* Scroll shadow indicator - shows when there's more content to the right */
    .checks-table-container[b-0y3579ikr6] {
        background:
            linear-gradient(to right, white 30%, rgba(255,255,255,0)) 0 0,
            linear-gradient(to right, rgba(255,255,255,0), white 70%) 100% 0,
            radial-gradient(farthest-side at 0 50%, rgba(139,0,0,.2), rgba(0,0,0,0)) 0 0,
            radial-gradient(farthest-side at 100% 50%, rgba(139,0,0,.2), rgba(0,0,0,0)) 100% 0;
        background-repeat: no-repeat;
        background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%;
        background-attachment: local, local, scroll, scroll;
    }

/* Modern Table Styles */
.checks-table-modern[b-0y3579ikr6] {
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    min-width: 900px; /* Minimum width to ensure all columns are readable */
    table-layout: auto;
}

    .checks-table-modern thead[b-0y3579ikr6] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
    }

        .checks-table-modern thead th[b-0y3579ikr6] {
            padding: 1rem;
            font-weight: 600;
            font-size: 0.9rem;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            border: none;
        }

            .checks-table-modern thead th:first-child[b-0y3579ikr6] {
                border-radius: 10px 0 0 0;
            }

            .checks-table-modern thead th:last-child[b-0y3579ikr6] {
                border-radius: 0 10px 0 0;
            }

    .checks-table-modern tbody .main-row[b-0y3579ikr6] {
        background: white;
        transition: all 0.3s ease;
        border-bottom: 1px solid #e9ecef;
    }

        .checks-table-modern tbody .main-row:hover[b-0y3579ikr6] {
            background: #f8f9fa;
            transform: translateX(2px);
            box-shadow: 0 2px 8px rgba(139, 0, 0, 0.1);
        }

        .checks-table-modern tbody .main-row td[b-0y3579ikr6] {
            padding: 1rem;
            vertical-align: middle;
            cursor: pointer;
            white-space: nowrap; /* Prevent text wrapping that could break layout */
        }

            /* Allow certain cells to wrap if needed */
            .checks-table-modern tbody .main-row td:nth-child(4)[b-0y3579ikr6] {
                white-space: normal; /* Payee name can wrap */
                min-width: 150px;
            }

/* Expand Button */
.btn-expand[b-0y3579ikr6] {
    background: none;
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: all 0.3s ease;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .btn-expand:hover[b-0y3579ikr6] {
        background: rgba(139, 0, 0, 0.1);
    }

    .btn-expand i[b-0y3579ikr6] {
        transition: transform 0.3s ease;
        font-size: 1rem;
    }

    .btn-expand.expanded i[b-0y3579ikr6] {
        transform: rotate(90deg);
    }

/* Cell Styles */
.date-wrapper[b-0y3579ikr6] {
    display: flex;
    align-items: center;
    font-size: 0.9rem;
}

.voucher-badge[b-0y3579ikr6] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.85rem;
    display: inline-block;
    letter-spacing: 0.5px;
}

.payee-info[b-0y3579ikr6] {
    display: flex;
    align-items: center;
}

.payee-name[b-0y3579ikr6] {
    font-weight: 600;
    color: #2c3e50;
}

.amount-highlight[b-0y3579ikr6] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
    background: linear-gradient(135deg, rgba(139, 0, 0, 0.05) 0%, rgba(212, 175, 55, 0.05) 100%);
    padding: 0.5rem 0.8rem;
    border-radius: 6px;
    display: inline-block;
}

/* Status Badges */
.badge[b-0y3579ikr6] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: capitalize;
}

.badge-na[b-0y3579ikr6] {
    background: #e9ecef;
    color: #6c757d;
}

.badge-pending[b-0y3579ikr6] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #fff;
}

.badge-in-progress[b-0y3579ikr6] {
    background: linear-gradient(135deg, #17a2b8 0%, #138496 100%);
    color: #fff;
}

.badge-completed[b-0y3579ikr6] {
    background: linear-gradient(135deg, #2E7D32 0%, #43A047 100%);
    color: #fff;
}

.badge-cancelled[b-0y3579ikr6] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: #fff;
}

/* Action Icon Button */
.btn-action-icon[b-0y3579ikr6] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

    .btn-action-icon:hover[b-0y3579ikr6] {
        background: var(--primary-color);
        color: white;
        transform: scale(1.1);
    }

/* Expandable Row */
.expandable-row[b-0y3579ikr6] {
    background: #f8f9fa;
    border-bottom: 2px solid var(--secondary-color);
}

    .expandable-row td[b-0y3579ikr6] {
        padding: 0 !important;
    }

.expanded-content[b-0y3579ikr6] {
    padding: 2rem;
    animation: slideDown 0.3s ease-out;
}

@@keyframes slideDown {
    from[b-0y3579ikr6] {
        opacity: 0;
        transform: translateY(-10px);
    }

    to[b-0y3579ikr6] {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Detail Sections */
.detail-section[b-0y3579ikr6] {
    margin-bottom: 1.5rem;
}

    .detail-section:last-child[b-0y3579ikr6] {
        margin-bottom: 0;
    }

.section-title[b-0y3579ikr6] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--secondary-color);
    display: flex;
    align-items: center;
}

.detail-grid[b-0y3579ikr6] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.detail-item[b-0y3579ikr6] {
    background: white;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

    .detail-item:hover[b-0y3579ikr6] {
        border-color: var(--secondary-color);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.2);
    }

    .detail-item.full-width[b-0y3579ikr6] {
        grid-column: 1 / -1;
    }

    .detail-item label[b-0y3579ikr6] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 0.85rem;
        color: #6c757d;
        font-weight: 600;
        margin-bottom: 0.5rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .detail-item span[b-0y3579ikr6] {
        color: #2c3e50;
        font-weight: 600;
        font-size: 0.95rem;
    }

.check-number[b-0y3579ikr6] {
    font-family: 'Courier New', monospace;
    background: #f8f9fa;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
}

.project-name[b-0y3579ikr6] {
    color: var(--primary-color);
    font-weight: 700;
}

/* Compact Picker Buttons */
.btn-picker-compact[b-0y3579ikr6] {
    width: 100%;
    padding: 0.5rem 1rem;
    border-radius: 6px;
    border: 2px solid #e9ecef;
    background: white;
    color: #6c757d;
    font-size: 0.85rem;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5rem;
}

    .btn-picker-compact.btn-picker-empty[b-0y3579ikr6] {
        border-color: var(--primary-color);
        color: var(--primary-color);
        border-style: dashed;
    }

    .btn-picker-compact.btn-picker-filled[b-0y3579ikr6] {
        background: linear-gradient(135deg, rgba(139, 0, 0, 0.05) 0%, rgba(212, 175, 55, 0.05) 100%);
        border-color: var(--secondary-color);
        color: var(--primary-color);
    }

    .btn-picker-compact:hover[b-0y3579ikr6] {
        background: var(--primary-color);
        color: white;
        border-color: var(--primary-color);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
    }

/* Status Select */
.status-select[b-0y3579ikr6] {
    border: 2px solid #e9ecef;
    border-radius: 6px;
    font-weight: 600;
    padding: 0.5rem;
    background: white;
}

/* Particulars */
.particulars-content[b-0y3579ikr6] {
    background: white;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    color: #2c3e50;
    line-height: 1.6;
}

/* ==================== MOBILE CARD STYLES ==================== */

.check-card[b-0y3579ikr6] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    cursor: pointer;
    border: 2px solid transparent;
}

    .check-card:hover[b-0y3579ikr6] {
        border-color: var(--secondary-color);
        box-shadow: 0 4px 16px rgba(212, 175, 55, 0.3);
        transform: translateY(-2px);
    }

.card-header-row[b-0y3579ikr6] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.voucher-info[b-0y3579ikr6] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.voucher-badge-mobile[b-0y3579ikr6] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.85rem;
    display: inline-block;
    letter-spacing: 0.5px;
}

.date-mobile[b-0y3579ikr6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #6c757d;
    font-size: 0.85rem;
}

.card-body-row[b-0y3579ikr6] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

.info-group[b-0y3579ikr6] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

    .info-group i[b-0y3579ikr6] {
        color: var(--primary-color);
        font-size: 1.25rem;
        margin-top: 0.25rem;
    }

.info-content[b-0y3579ikr6] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    .info-content label[b-0y3579ikr6] {
        font-size: 0.75rem;
        color: #6c757d;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .info-content span[b-0y3579ikr6] {
        font-size: 0.9rem;
        color: #2c3e50;
        font-weight: 600;
    }

.amount-mobile[b-0y3579ikr6] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
}

.card-divider[b-0y3579ikr6] {
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, var(--secondary-color) 50%, transparent 100%);
    margin: 1rem 0;
}

.card-details-grid[b-0y3579ikr6] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.detail-row[b-0y3579ikr6] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.85rem;
    color: #2c3e50;
}

    .detail-row i[b-0y3579ikr6] {
        color: #6c757d;
        width: 20px;
        text-align: center;
    }

.card-actions[b-0y3579ikr6] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.btn-action-mobile[b-0y3579ikr6] {
    background: white;
    border: 2px solid var(--secondary-color);
    color: var(--primary-color);
    padding: 0.6rem 1rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
}

    .btn-action-mobile:hover[b-0y3579ikr6] {
        background: var(--primary-color);
        color: white;
        border-color: var(--primary-color);
    }

    .btn-action-mobile i[b-0y3579ikr6] {
        font-size: 1rem;
    }

/* ==================== RESPONSIVE BREAKPOINTS ==================== */

/* Switch to mobile card view on tablets and smaller */
@@media (max-width: 992px) {
    .desktop-view[b-0y3579ikr6] {
        display: none !important;
    }

    .mobile-view[b-0y3579ikr6] {
        display: block !important;
    }
}

/* Tablet and below - Ensure horizontal scroll */
@@media (max-width: 992px) {
    .checks-table-container[b-0y3579ikr6] {
        overflow-x: auto;
        border: 1px solid #e9ecef;
        border-radius: 8px;
        background: white;
    }

    .checks-table-modern[b-0y3579ikr6] {
        min-width: 900px; /* Ensure minimum width for readability */
    }
    /* Visual scroll indicator on right edge */
    .desktop-view .checks-table-container[b-0y3579ikr6]::after {
        content: '\21C4'; /* Left-right arrow symbol */
        position: sticky;
        right: 0;
        top: 50%;
        float: right;
        transform: translateY(-50%);
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
        padding: 0.5rem 0.75rem;
        border-radius: 20px 0 0 20px;
        font-size: 1rem;
        font-weight: 700;
        z-index: 10;
        box-shadow: -2px 2px 8px rgba(139, 0, 0, 0.3);
        animation: pulseScroll 2s ease-in-out infinite;
        pointer-events: none;
    }

    @@keyframes pulseScroll {
        0%[b-0y3579ikr6], 100%[b-0y3579ikr6] {
            opacity: 0.6;
            transform: translateY(-50%) scale(0.95);
        }

        50%[b-0y3579ikr6] {
            opacity: 1;
            transform: translateY(-50%) scale(1.05);
        }
    }
}

/* Small mobile adjustments for cards */
@@media (max-width: 576px) {
    .card-body-row[b-0y3579ikr6] {
        grid-template-columns: 1fr;
    }

    .check-card[b-0y3579ikr6] {
        padding: 1rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/CheckIssuance/PrintVoucher.razor.rz.scp.css */
/* Dashboard Cards */
.dashboard-card[b-67dmzzdpqd] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

    .dashboard-card:hover[b-67dmzzdpqd] {
        transform: translateY(-5px);
        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    }

.card-icon[b-67dmzzdpqd] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-67dmzzdpqd] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-67dmzzdpqd] {
    color: #212529;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.card-change[b-67dmzzdpqd] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
}

    .card-change.positive[b-67dmzzdpqd] {
        color: #2E7D32;
    }

    .card-change i[b-67dmzzdpqd] {
        margin-right: 0.25rem;
    }

/* Add New Button */
.add-new-btn[b-67dmzzdpqd] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
  display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-67dmzzdpqd] {
      background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .add-new-btn i[b-67dmzzdpqd] {
   font-size: 1.1rem;
    }

/* ==================== FILTER SECTION STYLES ==================== */

.filter-section[b-67dmzzdpqd] {
    margin-bottom: 1.5rem;
}

.filter-label[b-67dmzzdpqd] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
    margin-bottom: 0.25rem;
    display: block;
}

.search-box[b-67dmzzdpqd] {
    position: relative;
    width: 100%;
}

    .search-box input[b-67dmzzdpqd] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-67dmzzdpqd] {
            outline: none;
   border-color: var(--secondary-color);
   box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

        .search-box input:disabled[b-67dmzzdpqd] {
   background-color: #f8f9fa;
   cursor: not-allowed;
        }

    .search-box i[b-67dmzzdpqd] {
        position: absolute;
    left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
   font-size: 1.1rem;
    }

.form-select-custom[b-67dmzzdpqd], .form-control-custom[b-67dmzzdpqd] {
 border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-select-custom:focus[b-67dmzzdpqd], .form-control-custom:focus[b-67dmzzdpqd] {
     border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

    .form-select-custom:disabled[b-67dmzzdpqd], .form-control-custom:disabled[b-67dmzzdpqd] {
        background-color: #f8f9fa;
      cursor: not-allowed;
    }

/* Active Filters Display */
.active-filters[b-67dmzzdpqd] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
  padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    border-left: 4px solid var(--secondary-color);
}

.filter-label[b-67dmzzdpqd] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
    margin-bottom: 0.25rem;
    display: block;
}

.filter-tag[b-67dmzzdpqd] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.75rem;
    background-color: white;
    border: 1px solid var(--secondary-color);
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--primary-color);
    transition: all 0.2s ease;
}

    .filter-tag:hover[b-67dmzzdpqd] {
        background-color: #fff8e6;
        box-shadow: 0 2px 6px rgba(212, 175, 55, 0.2);
    }

 .filter-tag i[b-67dmzzdpqd] {
        cursor: pointer;
      font-size: 1rem;
        transition: transform 0.2s ease;
    }

   .filter-tag i:hover[b-67dmzzdpqd] {
    transform: scale(1.2);
            color: var(--primary-color);
     }

/* ==================== BUTTON STYLES ==================== */

/* Filter Button Styles */
.btn-filter[b-67dmzzdpqd] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
  font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-filter:hover:not(:disabled)[b-67dmzzdpqd] {
        background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(139, 0, 0, 0.4);
    }

    .btn-filter:active:not(:disabled)[b-67dmzzdpqd] {
        transform: translateY(0);
    }

    .btn-filter:disabled[b-67dmzzdpqd] {
opacity: 0.6;
        cursor: not-allowed;
    }

.btn-reset[b-67dmzzdpqd] {
    background-color: #6c757d;
color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
 display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-reset:hover:not(:disabled)[b-67dmzzdpqd] {
        background-color: #5c636a;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(108, 117, 125, 0.3);
    }

    .btn-reset:disabled[b-67dmzzdpqd] {
     opacity: 0.6;
        cursor: not-allowed;
    }

.btn-secondary[b-67dmzzdpqd] {
    background-color: #6c757d;
    color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-secondary:hover:not(:disabled)[b-67dmzzdpqd] {
    background-color: #5c636a;
        transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(108, 117, 125, 0.3);
  }

    .btn-secondary:disabled[b-67dmzzdpqd] {
        opacity: 0.6;
        cursor: not-allowed;
    }

/* Search Section Styles */
.search-section[b-67dmzzdpqd] {
    background: white;
    padding: 1.5rem;
  border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.08);
  margin-bottom: 1.5rem;
}

    .search-section h5[b-67dmzzdpqd] {
        color: var(--primary-color);
  margin-bottom: 1rem;
        font-weight: 600;
  }

.search-btn[b-67dmzzdpqd] {
    background-color: var(--primary-color);
 color: white;
    border: none;
    padding: 0.5rem 1.5rem;
    border-radius: 6px;
    transition: all 0.3s ease;
}

    .search-btn:hover[b-67dmzzdpqd] {
        background-color: var(--accent-color);
        transform: translateY(-2px);
     box-shadow: 0 4px 8px rgba(139, 0, 0, 0.3);
    }

.reset-btn[b-67dmzzdpqd] {
    background-color: #6c757d;
    color: white;
    border: none;
    padding: 0.5rem 1.5rem;
    border-radius: 6px;
    transition: all 0.3s ease;
}

    .reset-btn:hover[b-67dmzzdpqd] {
        background-color: #5a6268;
    }

/* Table Styles */
.voucher-table-section[b-67dmzzdpqd] {
    background: white;
    padding: 1.5rem;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.08);
}



/* ==================== CONTENT CARD STYLES ==================== */

.content-card[b-67dmzzdpqd] {
background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
}

.card-header-custom[b-67dmzzdpqd] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
 border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-67dmzzdpqd] {
    color: var(--primary-color);
    font-size: 1.25rem;
 font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-67dmzzdpqd] {
        color: var(--secondary-color);
        font-size: 1.5rem;
}

.card-subtitle-custom[b-67dmzzdpqd] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Table Container with Overflow Handling */
.vouchers-table-container[b-67dmzzdpqd] {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 1rem;
    position: relative;
    max-width: 100%;
    box-sizing: border-box;
    border-radius: 8px;
    border: 1px solid #e9ecef;
}



/* Modern Table Styles */
.vouchers-table-modern[b-67dmzzdpqd] {
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    min-width: 1000px;
    table-layout: auto;
}

    .vouchers-table-modern thead[b-67dmzzdpqd] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
    }

        .vouchers-table-modern thead th[b-67dmzzdpqd] {
            padding: 1rem;
            font-weight: 600;
            font-size: 0.9rem;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            border: none;
            white-space: nowrap;
        }

            .vouchers-table-modern thead th:first-child[b-67dmzzdpqd] {
                border-radius: 10px 0 0 0;
            }

            .vouchers-table-modern thead th:last-child[b-67dmzzdpqd] {
                border-radius: 0 10px 0 0;
            }

    .vouchers-table-modern tbody .voucher-row[b-67dmzzdpqd] {
        background: white;
        transition: all 0.3s ease;
        border-bottom: 1px solid #e9ecef;
    }

        .vouchers-table-modern tbody .voucher-row:hover[b-67dmzzdpqd] {
            background: #f8f9fa;
            transform: translateX(2px);
            box-shadow: 0 2px 8px rgba(139, 0, 0, 0.1);
        }

        .vouchers-table-modern tbody .voucher-row td[b-67dmzzdpqd] {
            padding: 1rem;
            vertical-align: middle;
            white-space: nowrap;
        }

            /* Allow payee name to wrap if needed */
            .vouchers-table-modern tbody .voucher-row td:nth-child(4)[b-67dmzzdpqd] {
                white-space: normal;
                min-width: 150px;
            }

/* Cell Styles */
.voucher-badge[b-67dmzzdpqd] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.85rem;
    display: inline-block;
    letter-spacing: 0.5px;
}

.date-wrapper[b-67dmzzdpqd] {
    display: flex;
    align-items: center;
    font-size: 0.9rem;
}

.payee-info[b-67dmzzdpqd] {
    display: flex;
    align-items: center;
}

.payee-name[b-67dmzzdpqd] {
    font-weight: 600;
    color: #2c3e50;
}

.check-number[b-67dmzzdpqd] {
    font-family: 'Courier New', monospace;
    background: #f8f9fa;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    font-size: 0.9rem;
    color: #495057;
}

.amount-highlight[b-67dmzzdpqd] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
    background: linear-gradient(135deg, rgba(139, 0, 0, 0.05) 0%, rgba(212, 175, 55, 0.05) 100%);
    padding: 0.5rem 0.8rem;
    border-radius: 6px;
    display: inline-block;
}

.company-name[b-67dmzzdpqd],
.bank-name[b-67dmzzdpqd],
.category-name[b-67dmzzdpqd] {
    color: #2c3e50;
    font-weight: 500;
}

/* Status Badges */
.badge[b-67dmzzdpqd] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: capitalize;
}

.badge-na[b-67dmzzdpqd] {
    background: #e9ecef;
    color: #6c757d;
}

.badge-pending[b-67dmzzdpqd] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #fff;
}

.badge-in-progress[b-67dmzzdpqd] {
    background: linear-gradient(135deg, #17a2b8 0%, #138496 100%);
    color: #fff;
}

.badge-completed[b-67dmzzdpqd] {
    background: linear-gradient(135deg, #2E7D32 0%, #43A047 100%);
    color: #fff;
}

.badge-cancelled[b-67dmzzdpqd] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: #fff;
}

/* Action Icon Button */
.btn-action-icon[b-67dmzzdpqd] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

    .btn-action-icon:hover[b-67dmzzdpqd] {
        background: var(--primary-color);
        color: white;
        transform: scale(1.1);
    }

    .btn-action-icon:disabled[b-67dmzzdpqd] {
        opacity: 0.6;
        cursor: not-allowed;
    }

/* Modal Styles */
.modal-content[b-67dmzzdpqd] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-xl[b-67dmzzdpqd] {
    max-width: 900px;
}

.modal-header[b-67dmzzdpqd] {
    padding: 1.5rem;
background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    border-bottom: none;
}

    .modal-header .modal-title[b-67dmzzdpqd] {
        font-weight: 700;
      display: flex;
 align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-67dmzzdpqd] {
 color: var(--secondary-color);
    font-size: 1.5rem;
        }

    .modal-header .btn-close[b-67dmzzdpqd] {
    filter: brightness(0) invert(1);
opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-67dmzzdpqd] {
            opacity: 1;
        }

.modal-body[b-67dmzzdpqd] {
    padding: 2rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-67dmzzdpqd] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    gap: 0.75rem;
  flex-wrap: wrap;
    justify-content: flex-end;
}

/* Voucher Print Preview */
.voucher-preview[b-67dmzzdpqd] {
    width: 8.5in;
    min-height: 11in;
    margin: 0 auto;
    padding: 0.75in;
    background: white;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    position: relative;
}

.voucher-header[b-67dmzzdpqd] {
    text-align: center;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 3px solid var(--primary-color);
}

    .voucher-header h2[b-67dmzzdpqd] {
        color: var(--primary-color);
        font-weight: 700;
        margin-bottom: 0.5rem;
        font-size: 1.75rem;
    }

    .voucher-header .voucher-number[b-67dmzzdpqd] {
        color: var(--secondary-color);
        font-weight: 600;
        font-size: 1.1rem;
    }

.voucher-info-grid[b-67dmzzdpqd] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.voucher-info-item[b-67dmzzdpqd] {
    display: flex;
    padding: 0.5rem 0;
    border-bottom: 1px solid #e9ecef;
}

.voucher-info-label[b-67dmzzdpqd] {
    font-weight: 600;
    color: var(--primary-color);
    width: 120px;
    flex-shrink: 0;
}

.voucher-info-value[b-67dmzzdpqd] {
    color: #333;
    flex: 1;
}

.voucher-details-section[b-67dmzzdpqd] {
    margin: 1.5rem 0;
}

    .voucher-details-section h4[b-67dmzzdpqd] {
        color: var(--primary-color);
        font-size: 1.1rem;
        font-weight: 600;
        margin-bottom: 1rem;
        padding-bottom: 0.5rem;
        border-bottom: 2px solid var(--secondary-color);
    }

.amount-section[b-67dmzzdpqd] {
    background: #f8f9fa;
    padding: 1rem;
    border-radius: 6px;
    margin: 1rem 0;
    border-left: 4px solid var(--secondary-color);
}

    .amount-section .amount-label[b-67dmzzdpqd] {
        font-weight: 600;
        color: var(--primary-color);
        font-size: 0.95rem;
    }

    .amount-section .amount-value[b-67dmzzdpqd] {
        font-size: 1.5rem;
        font-weight: 700;
        color: var(--primary-color);
        margin-top: 0.25rem;
    }

.voucher-footer[b-67dmzzdpqd] {
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 2px solid #dee2e6;
}

.signature-section[b-67dmzzdpqd] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    margin-top: 1.5rem;
}

.signature-block[b-67dmzzdpqd] {
    text-align: center;
}

.signature-line[b-67dmzzdpqd] {
    border-top: 2px solid #333;
    margin-top: 3rem;
    padding-top: 0.5rem;
    font-weight: 600;
    color: #333;
}

.signature-title[b-67dmzzdpqd] {
    font-size: 0.85rem;
    color: #6c757d;
    margin-top: 0.25rem;
}

.print-btn[b-67dmzzdpqd] {
    background-color: var(--primary-color);
    color: white;
    border: none;
    padding: 0.5rem 1.5rem;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
}

    .print-btn:hover[b-67dmzzdpqd] {
        background-color: var(--accent-color);
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(139, 0, 0, 0.3);
    }


/* Print Voucher Styles */
.print-voucher[b-67dmzzdpqd] {
    padding: 40px;
    background: #e8f0f8;
    font-family: Arial, sans-serif;
}

.voucher-header[b-67dmzzdpqd] {
    text-align: center;
    margin-bottom: 10px;
}

.company-name[b-67dmzzdpqd] {
    font-size: 24px;
    font-weight: bold;
    margin: 0;
    color: #000;
}

.company-address[b-67dmzzdpqd] {
    font-size: 16px;
    margin: 5px 0 0;
    color: #000;
}

.document-title[b-67dmzzdpqd] {
    text-align: center;
    margin: 20px 0;
}

    .document-title h4[b-67dmzzdpqd] {
        font-size: 20px;
        font-weight: bold;
        margin: 0;
        color: #000;
    }

.voucher-divider[b-67dmzzdpqd] {
    border: none;
    border-top: 2px solid #000;
    margin: 20px 0;
}

.voucher-details[b-67dmzzdpqd] {
    margin: 25px 0;
}

.detail-row[b-67dmzzdpqd] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
}

.detail-item[b-67dmzzdpqd] {
    flex: 1;
    display: flex;
    gap: 10px;
}

    .detail-item.full-width[b-67dmzzdpqd] {
        flex: 2;
    }

.detail-label[b-67dmzzdpqd] {
    font-weight: bold;
    min-width: 80px;
    color: #000;
}

.detail-value[b-67dmzzdpqd] {
    color: #000;
}

.particulars-section[b-67dmzzdpqd] {
    margin: 25px 0;
}

.section-heading[b-67dmzzdpqd] {
    font-weight: bold;
    margin-bottom: 15px;
    color: #000;
    font-size: 16px;
}

.particulars-table[b-67dmzzdpqd] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
    background: white;
}

    .particulars-table th[b-67dmzzdpqd],
    .particulars-table td[b-67dmzzdpqd] {
        border: 1px solid #000;
        padding: 10px;
        text-align: left;
        color: #000;
    }

    .particulars-table th[b-67dmzzdpqd] {
        background-color: #d0d0d0;
        font-weight: bold;
    }

    .particulars-table .text-end[b-67dmzzdpqd] {
        text-align: right;
    }

.signatures-section[b-67dmzzdpqd] {
    display: flex;
    justify-content: space-between;
    margin-top: 50px;
    gap: 20px;
}

.signature-box[b-67dmzzdpqd] {
    flex: 1;
    text-align: center;
}

.signature-label[b-67dmzzdpqd] {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 40px;
    color: #000;
}

.signature-line[b-67dmzzdpqd] {
    /*border-bottom: 2px solid #000;*/
    margin: 0 10px 8px;
}

.signature-name[b-67dmzzdpqd] {
    font-size: 13px;
    color: #000;
}

.signature-subtitle[b-67dmzzdpqd] {
    font-size: 11px;
    font-style: italic;
    margin-top: 5px;
    color: #000;
}

/* Modal Styles */
.modal-content[b-67dmzzdpqd] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-xl[b-67dmzzdpqd] {
    max-width: 900px;
}

.modal-header[b-67dmzzdpqd] {
    padding: 1.5rem;
background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    border-bottom: none;
}

    .modal-header .modal-title[b-67dmzzdpqd] {
        font-weight: 700;
      display: flex;
 align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-67dmzzdpqd] {
 color: var(--secondary-color);
    font-size: 1.5rem;
        }

    .modal-header .btn-close[b-67dmzzdpqd] {
    filter: brightness(0) invert(1);
opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-67dmzzdpqd] {
            opacity: 1;
        }

.modal-body[b-67dmzzdpqd] {
    padding: 2rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-67dmzzdpqd] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    gap: 0.75rem;
  flex-wrap: wrap;
    justify-content: flex-end;
}

/* Pagination */
.pagination-wrapper[b-67dmzzdpqd] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-67dmzzdpqd] {
    color: #6c757d;
    font-size: 0.9rem;
}

    .showing-entries span[b-67dmzzdpqd] {
        font-weight: 600;
        color: var(--primary-color);
    }

.pagination[b-67dmzzdpqd] {
    margin: 0;
}

.page-link[b-67dmzzdpqd] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
    background-color: white;
}

    .page-link:hover[b-67dmzzdpqd] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
    }

    .page-link:focus[b-67dmzzdpqd] {
      box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.25);
    }

.page-item.active .page-link[b-67dmzzdpqd] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    color: white;
font-weight: 600;
}

.page-item.disabled .page-link[b-67dmzzdpqd] {
    color: #6c757d;
    pointer-events: none;
    background-color: #fff;
  border-color: #dee2e6;
}

/* ==================== FILTER MODAL STYLES ==================== */

/* Filter Modal Label */
.filter-modal-label[b-67dmzzdpqd] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .filter-modal-label i[b-67dmzzdpqd] {
    color: var(--primary-color);
        font-size: 1.1rem;
    }

/* Form Control Custom Styles for Filter Modal */
.form-select-custom[b-67dmzzdpqd],
.form-control-custom[b-67dmzzdpqd] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
font-size: 0.95rem;
    transition: all 0.3s ease;
    width: 100%;
}

    .form-select-custom:focus[b-67dmzzdpqd],
    .form-control-custom:focus[b-67dmzzdpqd] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        outline: none;
 }

    .form-select-custom:disabled[b-67dmzzdpqd],
    .form-control-custom:disabled[b-67dmzzdpqd] {
        background-color: #f8f9fa;
        cursor: not-allowed;
        opacity: 0.6;
    }

/* Filter Primary Button */
.btn-primary-filter[b-67dmzzdpqd] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
  color: var(--primary-color);
    border: none;
padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 700;
    font-size: 0.95rem;
  transition: all 0.3s ease;
cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-primary-filter:hover:not(:disabled)[b-67dmzzdpqd] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .btn-primary-filter:disabled[b-67dmzzdpqd] {
 opacity: 0.6;
        cursor: not-allowed;
    }
/* _content/AccountingSystem.Web/Components/Pages/CheckIssuance/SearchPickerModal.razor.rz.scp.css */
/* Search Picker Input */
.search-picker-input-wrapper[b-tv9gh20i5p] {
    position: relative;
    margin-bottom: 1.5rem;
}

    .search-picker-input-wrapper i.bi-search[b-tv9gh20i5p] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
        pointer-events: none;
    }

.search-picker-input[b-tv9gh20i5p] {
    padding: 0.75rem 3rem 0.75rem 2.75rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    width: 100%;
}

    .search-picker-input:focus[b-tv9gh20i5p] {
        outline: none;
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

.clear-search-btn[b-tv9gh20i5p] {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #6c757d;
    font-size: 1.2rem;
    cursor: pointer;
    padding: 0.25rem;
    line-height: 1;
    transition: color 0.3s ease;
}

    .clear-search-btn:hover[b-tv9gh20i5p] {
        color: var(--primary-color);
    }

/* Search Results */
.search-picker-results[b-tv9gh20i5p] {
    max-height: 400px;
    overflow-y: auto;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    background-color: #f8f9fa;
}

    .search-picker-results[b-tv9gh20i5p]::-webkit-scrollbar {
        width: 8px;
    }

    .search-picker-results[b-tv9gh20i5p]::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 4px;
    }

    .search-picker-results[b-tv9gh20i5p]::-webkit-scrollbar-thumb {
        background: #888;
        border-radius: 4px;
    }

        .search-picker-results[b-tv9gh20i5p]::-webkit-scrollbar-thumb:hover {
            background: #555;
        }

.search-picker-item[b-tv9gh20i5p] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    border-bottom: 1px solid #e9ecef;
    cursor: pointer;
    transition: all 0.3s ease;
    background-color: white;
}

    .search-picker-item:last-child[b-tv9gh20i5p] {
        border-bottom: none;
    }

    .search-picker-item:hover[b-tv9gh20i5p] {
        background-color: #f8f5f0;
        transform: translateX(4px);
        box-shadow: inset 4px 0 0 var(--secondary-color);
    }

    .search-picker-item.selected[b-tv9gh20i5p] {
        background-color: #fff8e6;
        border-left: 4px solid var(--secondary-color);
        font-weight: 600;
    }

        .search-picker-item.selected:hover[b-tv9gh20i5p] {
            background-color: #fff3cd;
        }

.search-picker-item-content[b-tv9gh20i5p] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .search-picker-item-content i[b-tv9gh20i5p] {
        color: var(--primary-color);
        font-size: 1.5rem;
    }

    .search-picker-item-content span[b-tv9gh20i5p] {
        color: #212529;
        font-size: 0.95rem;
    }

.search-picker-item .bi-check-circle-fill[b-tv9gh20i5p] {
    font-size: 1.25rem;
}

/* No Results */
.search-picker-no-results[b-tv9gh20i5p] {
    padding: 3rem 2rem;
    text-align: center;
    color: #6c757d;
}

    .search-picker-no-results i[b-tv9gh20i5p] {
        font-size: 3rem;
        color: #dee2e6;
        margin-bottom: 1rem;
    }

    .search-picker-no-results p[b-tv9gh20i5p] {
        margin: 0.5rem 0;
        font-size: 1rem;
        font-weight: 500;
        color: #495057;
    }

    .search-picker-no-results small[b-tv9gh20i5p] {
        font-size: 0.85rem;
    }

/* Modal Customization */
.modal-content[b-tv9gh20i5p] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-tv9gh20i5p] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-tv9gh20i5p] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-tv9gh20i5p] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-tv9gh20i5p] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-tv9gh20i5p] {
            opacity: 1;
        }

.modal-body[b-tv9gh20i5p] {
    padding: 2rem;
}

.modal-footer[b-tv9gh20i5p] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

    .modal-footer .btn[b-tv9gh20i5p] {
        padding: 0.65rem 1.5rem;
        font-weight: 600;
        border-radius: 8px;
        transition: all 0.3s ease;
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
    }

    .modal-footer .btn-primary[b-tv9gh20i5p] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        color: var(--primary-color);
        border: none;
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    }

        .modal-footer .btn-primary:hover:not(:disabled)[b-tv9gh20i5p] {
            background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
            transform: translateY(-2px);
            box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
        }

        .modal-footer .btn-primary:disabled[b-tv9gh20i5p] {
            opacity: 0.6;
            cursor: not-allowed;
        }

    .modal-footer .btn-secondary[b-tv9gh20i5p] {
        background-color: #6c757d;
        border: none;
    }

        .modal-footer .btn-secondary:hover[b-tv9gh20i5p] {
            background-color: #5c636a;
            transform: translateY(-2px);
        }

/* Responsive */
@media (max-width: 768px) {
    .search-picker-results[b-tv9gh20i5p] {
        max-height: 300px;
    }

    .search-picker-input[b-tv9gh20i5p] {
        font-size: 0.9rem;
        padding: 0.65rem 3rem 0.65rem 2.5rem;
    }

    .search-picker-item[b-tv9gh20i5p] {
        padding: 0.85rem;
    }

    .search-picker-item-content span[b-tv9gh20i5p] {
        font-size: 0.9rem;
    }

    .modal-body[b-tv9gh20i5p] {
        padding: 1.5rem;
    }

    .modal-footer[b-tv9gh20i5p] {
        padding: 1rem;
    }

        .modal-footer .btn[b-tv9gh20i5p] {
            padding: 0.5rem 1rem;
            font-size: 0.9rem;
        }
}
/* _content/AccountingSystem.Web/Components/Pages/CheckManagement/CheckManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-v2yryk9xtg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-v2yryk9xtg] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-v2yryk9xtg] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-v2yryk9xtg] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-v2yryk9xtg]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-v2yryk9xtg] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-v2yryk9xtg] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-v2yryk9xtg] {
    color: #6c757d;
}

.add-new-btn[b-v2yryk9xtg] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-v2yryk9xtg] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-v2yryk9xtg] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-v2yryk9xtg] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-v2yryk9xtg] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-v2yryk9xtg] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-v2yryk9xtg] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FORM CONTROLS ==================== */
.form-control-custom[b-v2yryk9xtg],
.form-select-custom[b-v2yryk9xtg] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-v2yryk9xtg],
.form-select-custom:focus[b-v2yryk9xtg] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.form-label[b-v2yryk9xtg] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-v2yryk9xtg] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.search-box[b-v2yryk9xtg] {
    position: relative;
    width: 100%;
}

.search-box i[b-v2yryk9xtg] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box input[b-v2yryk9xtg] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-v2yryk9xtg] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.search-box input:disabled[b-v2yryk9xtg] {
    background-color: #e9ecef;
    cursor: not-allowed;
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-v2yryk9xtg] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-v2yryk9xtg] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-v2yryk9xtg] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-v2yryk9xtg] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-v2yryk9xtg] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn-danger[b-v2yryk9xtg] {
    background-color: #dc3545;
    color: white;
    border: none;
}

.btn-danger:hover[b-v2yryk9xtg] {
    background-color: #bb2d3b;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(220, 53, 69, 0.3);
}

.btn:disabled[b-v2yryk9xtg] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== TABLE STYLES ==================== */
.checks-table-container[b-v2yryk9xtg] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.checks-table[b-v2yryk9xtg] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.checks-table thead[b-v2yryk9xtg] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.checks-table thead tr th[b-v2yryk9xtg] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.checks-table thead th:first-child[b-v2yryk9xtg] {
    border-top-left-radius: 12px;
}

.checks-table thead th:last-child[b-v2yryk9xtg] {
    border-top-right-radius: 12px;
}

.checks-table tbody tr[b-v2yryk9xtg] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.checks-table tbody tr:hover[b-v2yryk9xtg] {
    background-color: #f8f9fa;
}

.checks-table tbody td[b-v2yryk9xtg] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

/* Bank Info Styles */
.bank-info[b-v2yryk9xtg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.bank-icon[b-v2yryk9xtg] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    color: white;
    font-weight: 600;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease;
}

.bank-info:hover .bank-icon[b-v2yryk9xtg] {
    transform: scale(1.1);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}

.bank-icon i[b-v2yryk9xtg] {
    font-size: 1.5rem;
}

.bank-name[b-v2yryk9xtg] {
    font-weight: 600;
    color: var(--primary-color);
    display: block;
    word-break: break-word;
}

/* Badge Styles */
.badge[b-v2yryk9xtg] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-v2yryk9xtg] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-v2yryk9xtg] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

.btn-action-icon:hover[b-v2yryk9xtg] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-edit:hover[b-v2yryk9xtg] {
    background: #0056b3;
    color: white;
}

.btn-action-icon.btn-delete:hover[b-v2yryk9xtg] {
    background: #dc3545;
    color: white;
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-v2yryk9xtg] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-v2yryk9xtg] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-v2yryk9xtg] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-v2yryk9xtg] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Tab Container */
.tab-container[b-v2yryk9xtg] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #e9ecef;
}

.tab-btn[b-v2yryk9xtg] {
    background: none;
    border: none;
    padding: 0.75rem 1.5rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: #6c757d;
    cursor: pointer;
    transition: all 0.3s ease;
    border-bottom: 3px solid transparent;
    position: relative;
    bottom: -2px;
}

.tab-btn:hover[b-v2yryk9xtg] {
    color: var(--primary-color);
}

.tab-btn.active[b-v2yryk9xtg] {
    color: var(--primary-color);
    border-bottom-color: var(--primary-color);
}

.tab-content[b-v2yryk9xtg] {
    display: none;
}

.tab-content.active[b-v2yryk9xtg] {
    display: block;
}

/* Form Grid */
.form-grid[b-v2yryk9xtg] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
}

.form-group[b-v2yryk9xtg] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.form-label.required[b-v2yryk9xtg]::after {
    content: "*";
    color: #dc3545;
    margin-left: 0.25rem;
}

.form-input[b-v2yryk9xtg] {
    padding: 0.65rem 1rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-input:focus[b-v2yryk9xtg] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.form-input:disabled[b-v2yryk9xtg] {
    background-color: #f8f9fa;
    cursor: not-allowed;
}

/* Checkbox Styles */
.checkbox-container[b-v2yryk9xtg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.5rem;
}

.checkbox-input[b-v2yryk9xtg] {
    width: 20px;
    height: 20px;
    cursor: pointer;
    accent-color: var(--primary-color);
}

.checkbox-label[b-v2yryk9xtg] {
    font-weight: 500;
    color: #495057;
    cursor: pointer;
    user-select: none;
}

/* Range Inputs */
.range-inputs[b-v2yryk9xtg] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

/* Info Alert */
.info-alert[b-v2yryk9xtg] {
    background-color: #cfe2ff;
    border-left: 4px solid #0d6efd;
    padding: 1rem;
    border-radius: 8px;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: start;
    gap: 0.75rem;
}

.info-alert i[b-v2yryk9xtg] {
    color: #0d6efd;
    font-size: 1.25rem;
    margin-top: 0.1rem;
}

.info-alert-content[b-v2yryk9xtg] {
    flex: 1;
}

.info-alert-title[b-v2yryk9xtg] {
    font-weight: 600;
    color: #084298;
    margin-bottom: 0.25rem;
}

.info-alert-text[b-v2yryk9xtg] {
    font-size: 0.9rem;
    color: #084298;
    margin: 0;
}

/* ==================== PAGINATION ==================== */
.pagination-wrapper[b-v2yryk9xtg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
}

.showing-entries[b-v2yryk9xtg] {
    font-size: 0.9rem;
    color: #495057;
}

.showing-entries span[b-v2yryk9xtg] {
    font-weight: 600;
    color: var(--primary-color);
}

.pagination[b-v2yryk9xtg] {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

.page-item[b-v2yryk9xtg] {
    margin: 0;
}

.page-link[b-v2yryk9xtg] {
    padding: 0.5rem 0.75rem;
    border: 1px solid #dee2e6;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

.page-link:hover:not(:disabled)[b-v2yryk9xtg] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

.page-item.active .page-link[b-v2yryk9xtg] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

.page-item.disabled .page-link[b-v2yryk9xtg] {
    opacity: 0.5;
    cursor: not-allowed;
}

.page-link:disabled[b-v2yryk9xtg] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ==================== ALERTS ==================== */
.alert[b-v2yryk9xtg] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-v2yryk9xtg] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-v2yryk9xtg] {
    color: var(--secondary-color);
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
    .page-title[b-v2yryk9xtg] {
        font-size: 1.5rem;
    }

    .content-card[b-v2yryk9xtg] {
        padding: 1.5rem;
    }

    .filter-section[b-v2yryk9xtg] {
        padding: 0.75rem;
    }

    .action-buttons[b-v2yryk9xtg] {
        flex-wrap: wrap;
    }

    .checks-table thead th[b-v2yryk9xtg],
    .checks-table tbody td[b-v2yryk9xtg] {
        padding: 0.75rem 0.5rem;
    }

    .range-inputs[b-v2yryk9xtg] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 576px) {
    .page-header[b-v2yryk9xtg] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-v2yryk9xtg] {
        width: 100%;
        justify-content: center;
    }

    .pagination-wrapper[b-v2yryk9xtg] {
        flex-direction: column;
        gap: 1rem;
    }

    .pagination[b-v2yryk9xtg] {
        flex-wrap: wrap;
        justify-content: center;
    }

    .page-link[b-v2yryk9xtg] {
        padding: 0.4rem 0.6rem;
        font-size: 0.8rem;
    }

    .modal-footer[b-v2yryk9xtg] {
        flex-direction: column;
    }

    .btn-primary[b-v2yryk9xtg],
    .btn-secondary[b-v2yryk9xtg] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/ColorThemes/ColorThemeDashboard.razor.rz.scp.css */
/* ==================== PAGE HEADER ==================== */

.page-header[b-7u3wfq5t3l] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
    gap: 2rem;
}

    .page-header > div:first-child[b-7u3wfq5t3l] {
        flex: 1;
    }

.page-title[b-7u3wfq5t3l] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0 0 0.5rem 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-7u3wfq5t3l] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-7u3wfq5t3l] {
    margin: 0.5rem 0 0 0;
    padding: 0;
    background: transparent;
    font-size: 0.9rem;
}

    .breadcrumb-item[b-7u3wfq5t3l] {
        color: #6c757d;
    }

        .breadcrumb-item a[b-7u3wfq5t3l] {
            color: var(--primary-color);
            text-decoration: none;
            transition: color 0.3s ease;
        }

            .breadcrumb-item a:hover[b-7u3wfq5t3l] {
                color: var(--secondary-color);
                text-decoration: underline;
            }

        .breadcrumb-item.active[b-7u3wfq5t3l] {
            color: #2c3e50;
            font-weight: 600;
        }

/* ==================== CONTENT CARD ==================== */

.content-card[b-7u3wfq5t3l] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    border: 1px solid rgba(0, 0, 0, 0.05);
    margin-bottom: 1.5rem;
}

.card-header-custom[b-7u3wfq5t3l] {
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e9ecef;
}

    .card-header-custom:last-child[b-7u3wfq5t3l] {
        margin-bottom: 0;
        border-bottom: none;
    }

.card-title-custom[b-7u3wfq5t3l] {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--primary-color);
    margin: 0 0 0.5rem 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-7u3wfq5t3l] {
        font-size: 1.25rem;
        color: var(--secondary-color);
    }

.card-subtitle-custom[b-7u3wfq5t3l] {
    font-size: 0.9rem;
    color: #6c757d;
    margin: 0;
}

/* ==================== LOADING CONTAINER ==================== */

.loading-container[b-7u3wfq5t3l] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    text-align: center;
    color: #6c757d;
}

    .loading-container .spinner-border[b-7u3wfq5t3l] {
        margin-bottom: 1rem;
        width: 3rem;
        height: 3rem;
    }

    .loading-container p[b-7u3wfq5t3l] {
        margin: 0;
        font-size: 1rem;
    }

/* ==================== FILTER SECTION ==================== */

.filter-section[b-7u3wfq5t3l] {
    margin-bottom: 1.5rem;
}

.form-label-custom[b-7u3wfq5t3l] {
    display: block;
    font-size: 0.9rem;
    font-weight: 600;
    color: #6c757d;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.search-box[b-7u3wfq5t3l] {
    position: relative;
    width: 100%;
}

    .search-box input[b-7u3wfq5t3l] {
        width: 100%;
        padding: 0.7rem 1rem 0.7rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
        background: white;
    }

        .search-box input:focus[b-7u3wfq5t3l] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

        .search-box input:disabled[b-7u3wfq5t3l] {
            background-color: #f8f9fa;
            color: #6c757d;
        }

        .search-box input[b-7u3wfq5t3l]::placeholder {
            color: #adb5bd;
        }

    .search-box i[b-7u3wfq5t3l] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
        pointer-events: none;
    }

.form-select-custom[b-7u3wfq5t3l],
.form-control-custom[b-7u3wfq5t3l] {
    width: 100%;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.7rem 1rem;
    font-size: 0.95rem;
    background: white;
    transition: all 0.3s ease;
}

    .form-select-custom:focus[b-7u3wfq5t3l],
    .form-control-custom:focus[b-7u3wfq5t3l] {
        outline: none;
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

    .form-select-custom:hover:not(:focus)[b-7u3wfq5t3l],
    .form-control-custom:hover:not(:focus)[b-7u3wfq5t3l] {
        border-color: #d1d5db;
    }

    .form-select-custom:disabled[b-7u3wfq5t3l],
    .form-control-custom:disabled[b-7u3wfq5t3l] {
        background-color: #f8f9fa;
        color: #6c757d;
        cursor: not-allowed;
    }

/* ==================== ACTION BUTTONS ==================== */

.add-new-btn[b-7u3wfq5t3l] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.8rem 1.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    text-decoration: none;
    white-space: nowrap;
    min-width: fit-content;
}

    .add-new-btn:hover[b-7u3wfq5t3l] {
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        color: var(--primary-color);
        text-decoration: none;
    }

    .add-new-btn:active[b-7u3wfq5t3l] {
        transform: translateY(0);
    }

    .add-new-btn i[b-7u3wfq5t3l] {
        font-size: 1.15rem;
    }

.btn[b-7u3wfq5t3l] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    border: none;
    transition: all 0.3s ease;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.95rem;
}

    .btn:disabled[b-7u3wfq5t3l] {
        opacity: 0.6;
        cursor: not-allowed;
    }

.btn-secondary[b-7u3wfq5t3l] {
    background: #6c757d;
    color: white;
    border: 2px solid #6c757d;
}

    .btn-secondary:hover:not(:disabled)[b-7u3wfq5t3l] {
        background: #5c636a;
        border-color: #5c636a;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(108, 117, 125, 0.3);
    }

.btn-reset[b-7u3wfq5t3l] {
    background: white;
    color: #6c757d;
    border: 2px solid #6c757d;
}

    .btn-reset:hover:not(:disabled)[b-7u3wfq5t3l] {
        background: #6c757d;
        color: white;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(108, 117, 125, 0.3);
    }

.btn-outline-secondary[b-7u3wfq5t3l] {
    background: white;
    color: var(--primary-color);
    border: 2px solid var(--secondary-color);
    padding: 0.5rem 1rem;
    border-radius: 6px;
    font-weight: 600;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.3s ease;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

    .btn-outline-secondary:hover[b-7u3wfq5t3l] {
        background: var(--primary-color);
        color: white;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(139, 0, 0, 0.2);
    }

    .btn-outline-secondary:active[b-7u3wfq5t3l] {
        transform: translateY(0);
    }

    .btn-outline-secondary:disabled[b-7u3wfq5t3l] {
        opacity: 0.6;
        cursor: not-allowed;
        transform: none;
    }

.btn-action-icon[b-7u3wfq5t3l] {
    background: none;
    border: none;
    padding: 0.6rem 0.8rem;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    color: var(--primary-color);
    background: rgba(139, 0, 0, 0.08);
}

    .btn-action-icon:hover[b-7u3wfq5t3l] {
        background: var(--primary-color);
        color: white;
        transform: scale(1.1);
        box-shadow: 0 2px 8px rgba(139, 0, 0, 0.3);
    }

.btn-action-icon.btn-action-danger[b-7u3wfq5t3l] {
    color: #dc3545;
    background: rgba(220, 53, 69, 0.08);
}

    .btn-action-icon.btn-action-danger:hover[b-7u3wfq5t3l] {
        background: #dc3545;
        color: white;
        transform: scale(1.1);
        box-shadow: 0 2px 8px rgba(220, 53, 69, 0.3);
    }

/* ==================== TABLE STYLES ==================== */

.table-responsive[b-7u3wfq5t3l] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
}

    .table-responsive[b-7u3wfq5t3l]::-webkit-scrollbar {
        height: 8px;
    }

    .table-responsive[b-7u3wfq5t3l]::-webkit-scrollbar-track {
        background: #f1f3f5;
        border-radius: 4px;
    }

    .table-responsive[b-7u3wfq5t3l]::-webkit-scrollbar-thumb {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        border-radius: 4px;
        border: 2px solid #f1f3f5;
    }

        .table-responsive[b-7u3wfq5t3l]::-webkit-scrollbar-thumb:hover {
            background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
        }

.table[b-7u3wfq5t3l] {
    width: 100%;
    margin-bottom: 0;
}

.table-modern[b-7u3wfq5t3l] {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
}

    .table-modern thead[b-7u3wfq5t3l] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
    }

        .table-modern thead th[b-7u3wfq5t3l] {
            padding: 1rem 0.75rem;
            font-weight: 700;
            font-size: 0.9rem;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            border: none;
            white-space: nowrap;
        }

            .table-modern thead th:first-child[b-7u3wfq5t3l] {
                border-radius: 8px 0 0 0;
            }

            .table-modern thead th:last-child[b-7u3wfq5t3l] {
                border-radius: 0 8px 0 0;
            }

    .table-modern tbody tr[b-7u3wfq5t3l] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .table-modern tbody tr:hover[b-7u3wfq5t3l] {
            background-color: #f8f5f0;
            box-shadow: inset 4px 0 0 var(--secondary-color);
        }

        .table-modern tbody tr:last-child[b-7u3wfq5t3l] {
            border-bottom: none;
        }

        .table-modern tbody tr:last-child td:first-child[b-7u3wfq5t3l] {
            border-radius: 0 0 0 8px;
        }

        .table-modern tbody tr:last-child td:last-child[b-7u3wfq5t3l] {
            border-radius: 0 0 8px 0;
        }

    .table-modern tbody td[b-7u3wfq5t3l] {
        padding: 1rem 0.75rem;
        vertical-align: middle;
        font-size: 0.9rem;
        color: #2c3e50;
    }

        .table-modern tbody td:first-child[b-7u3wfq5t3l] {
            color: var(--primary-color);
            font-weight: 600;
        }

/* Table Column Styles */
.theme-code[b-7u3wfq5t3l] {
    font-family: 'Courier New', monospace;
    font-weight: 700;
    letter-spacing: 0.5px;
    color: var(--primary-color);
}

.theme-name[b-7u3wfq5t3l] {
    font-weight: 500;
    color: #2c3e50;
}

    .theme-name small[b-7u3wfq5t3l] {
        display: block;
        font-size: 0.85rem;
        color: #6c757d;
        margin-top: 0.25rem;
        font-style: italic;
        font-weight: normal;
    }

.color-preview[b-7u3wfq5t3l] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.color-swatch[b-7u3wfq5t3l] {
    width: 40px;
    height: 40px;
    border-radius: 6px;
    border: 2px solid #e9ecef;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    cursor: help;
}

    .color-swatch:hover[b-7u3wfq5t3l] {
        transform: scale(1.15);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    }

/* Status Badges */
.badge[b-7u3wfq5t3l] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: capitalize;
}

.badge-status[b-7u3wfq5t3l] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: capitalize;
    transition: all 0.3s ease;
}

.badge-active[b-7u3wfq5t3l] {
    background: linear-gradient(135deg, #d1e7dd 0%, #c3e6cb 100%);
    color: #0f5132;
    border: 1px solid #badbcc;
}

.badge-inactive[b-7u3wfq5t3l] {
    background: linear-gradient(135deg, #f8d7da 0%, #f5c2c7 100%);
    color: #842029;
    border: 1px solid #f1b0b7;
}

.bg-success[b-7u3wfq5t3l] {
    background: linear-gradient(135deg, #d1e7dd 0%, #c3e6cb 100%);
    color: #0f5132;
    border: 1px solid #badbcc;
}

/* ==================== PAGINATION ==================== */

.pagination-wrapper[b-7u3wfq5t3l] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
    flex-wrap: wrap;
    gap: 2rem;
}

    @media (max-width: 576px) {
        .pagination-wrapper[b-7u3wfq5t3l] {
            flex-direction: column;
            gap: 1rem;
        }
    }

.showing-entries[b-7u3wfq5t3l] {
    font-size: 0.95rem;
    color: #6c757d;
    white-space: nowrap;
}

    .showing-entries span[b-7u3wfq5t3l] {
        font-weight: 600;
        color: #2c3e50;
    }

.pagination[b-7u3wfq5t3l] {
    display: flex;
    list-style: none;
    gap: 0.5rem;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
    justify-content: center;
}

    .pagination .page-item[b-7u3wfq5t3l] {
        margin: 0;
    }

        .pagination .page-item.disabled .page-link[b-7u3wfq5t3l] {
            opacity: 0.5;
            cursor: not-allowed;
            background: white;
            color: #6c757d;
        }

        .pagination .page-item.active .page-link[b-7u3wfq5t3l] {
            background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
            color: white;
            border: none;
            box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
        }

    .pagination .page-link[b-7u3wfq5t3l] {
        background: white;
        color: var(--primary-color);
        border: 2px solid #e9ecef;
        padding: 0.6rem 0.8rem;
        border-radius: 6px;
        font-weight: 600;
        font-size: 0.9rem;
        cursor: pointer;
        transition: all 0.3s ease;
        min-width: 44px;
        text-align: center;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.4rem;
        text-decoration: none;
    }

        .pagination .page-link:hover:not(.disabled)[b-7u3wfq5t3l] {
            background: var(--primary-color);
            color: white;
            border-color: var(--primary-color);
            transform: translateY(-2px);
            box-shadow: 0 4px 8px rgba(139, 0, 0, 0.2);
        }

/* ==================== ALERT STYLES ==================== */

.alert[b-7u3wfq5t3l] {
    padding: 1rem 1.5rem;
    border-radius: 8px;
    border-left: 4px solid;
    margin-bottom: 1.5rem;
}

.alert-info[b-7u3wfq5t3l] {
    background: #d1ecf1;
    border-color: #0c5460;
    color: #0c5460;
}

    .alert-info a[b-7u3wfq5t3l] {
        color: #0c5460;
        font-weight: 600;
    }

        .alert-info a:hover[b-7u3wfq5t3l] {
            text-decoration: underline;
        }

/* ==================== MODAL STYLES ==================== */

.modal[b-7u3wfq5t3l] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal.fade.show[b-7u3wfq5t3l] {
    display: flex;
}

.modal.d-block[b-7u3wfq5t3l] {
    display: flex !important;
}

.modal-dialog[b-7u3wfq5t3l] {
    width: 100%;
    max-width: 500px;
    margin: auto;
}

    .modal-dialog.modal-dialog-centered[b-7u3wfq5t3l] {
        display: flex;
        align-items: center;
        min-height: calc(100% - 1rem);
    }

.modal-content[b-7u3wfq5t3l] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
    overflow: hidden;
}

.modal-header[b-7u3wfq5t3l] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    padding: 1.5rem;
    border: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .modal-header .modal-title[b-7u3wfq5t3l] {
        font-weight: 700;
        font-size: 1.25rem;
        display: flex;
        align-items: center;
        gap: 0.75rem;
        margin: 0;
    }

    .modal-header .btn-close[b-7u3wfq5t3l] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
        transition: all 0.3s ease;
        cursor: pointer;
        border: none;
        background: none;
        padding: 0;
        font-size: 1.5rem;
    }

        .modal-header .btn-close:hover[b-7u3wfq5t3l] {
            opacity: 1;
        }

.modal-body[b-7u3wfq5t3l] {
    padding: 2rem;
    color: #2c3e50;
    line-height: 1.6;
}

    .modal-body p[b-7u3wfq5t3l] {
        margin-bottom: 0.75rem;
    }

        .modal-body p:last-child[b-7u3wfq5t3l] {
            margin-bottom: 0;
        }

    .modal-body strong[b-7u3wfq5t3l] {
        color: var(--primary-color);
        font-weight: 700;
    }

    .modal-body .text-muted[b-7u3wfq5t3l] {
        color: #6c757d;
    }

.modal-footer[b-7u3wfq5t3l] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
}

.btn-danger[b-7u3wfq5t3l] {
    background: #dc3545;
    color: white;
    border: 2px solid #dc3545;
}

    .btn-danger:hover:not(:disabled)[b-7u3wfq5t3l] {
        background: #c82333;
        border-color: #c82333;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
    }

/* ==================== SPINNER ==================== */

.spinner-border[b-7u3wfq5t3l] {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    vertical-align: text-bottom;
    border: 0.25em solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    -webkit-animation: spinner-border 0.75s linear infinite;
    animation: spinner-border-b-7u3wfq5t3l 0.75s linear infinite;
}

    .spinner-border.spinner-border-sm[b-7u3wfq5t3l] {
        width: 0.875rem;
        height: 0.875rem;
        border-width: 0.2em;
    }

    .spinner-border.text-primary[b-7u3wfq5t3l] {
        color: var(--primary-color) !important;
    }

    .spinner-border-sm.me-2[b-7u3wfq5t3l] {
        margin-right: 0.5rem;
    }

@-webkit-keyframes spinner-border {
    to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

@keyframes spinner-border-b-7u3wfq5t3l {
    to { transform: rotate(360deg); }
}

/* ==================== UTILITY CLASSES ==================== */

.me-2[b-7u3wfq5t3l] {
    margin-right: 0.5rem;
}

.gap-2[b-7u3wfq5t3l] {
    gap: 0.5rem;
}

.gap-3[b-7u3wfq5t3l] {
    gap: 1rem;
}

.g-3 > *[b-7u3wfq5t3l] {
    padding-left: calc(1rem * 0.5);
    padding-right: calc(1rem * 0.5);
}

.g-3[b-7u3wfq5t3l] {
    --bs-gutter-x: 1rem;
    --bs-gutter-y: 0;
}

.d-flex[b-7u3wfq5t3l] {
    display: flex;
}

.h-100[b-7u3wfq5t3l] {
    height: 100%;
}

.text-muted[b-7u3wfq5t3l] {
    color: #6c757d;
}

.small[b-7u3wfq5t3l] {
    font-size: 0.875rem;
}

.visually-hidden[b-7u3wfq5t3l] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

/* ==================== RESPONSIVE DESIGN ==================== */

@media (max-width: 768px) {
    .page-header[b-7u3wfq5t3l] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

        .page-header > div:first-child[b-7u3wfq5t3l] {
            flex: 1;
            width: 100%;
        }

    .add-new-btn[b-7u3wfq5t3l] {
        width: 100%;
        justify-content: center;
    }

    .page-title[b-7u3wfq5t3l] {
        font-size: 1.5rem;
    }

        .page-title i[b-7u3wfq5t3l] {
            font-size: 1.5rem;
        }

    .content-card[b-7u3wfq5t3l] {
        padding: 1.25rem;
    }

    .filter-section .row[b-7u3wfq5t3l] {
        margin-bottom: 1rem;
    }

    .table-responsive[b-7u3wfq5t3l] {
        overflow-x: auto;
        border: 1px solid #e9ecef;
        border-radius: 8px;
        margin-bottom: 1rem;
    }

    .table-modern[b-7u3wfq5t3l] {
        min-width: 700px;
    }

    .table-modern tbody td[b-7u3wfq5t3l] {
        padding: 0.75rem 0.5rem;
        font-size: 0.85rem;
    }

    .table-modern thead th[b-7u3wfq5t3l] {
        padding: 0.75rem 0.5rem;
        font-size: 0.8rem;
    }

    .color-swatch[b-7u3wfq5t3l] {
        width: 32px;
        height: 32px;
    }

    .btn-action-icon[b-7u3wfq5t3l] {
        padding: 0.5rem 0.6rem;
        min-width: 36px;
        height: 36px;
    }

    .btn-outline-secondary[b-7u3wfq5t3l] {
        padding: 0.4rem 0.8rem;
        font-size: 0.8rem;
    }

    .modal-dialog[b-7u3wfq5t3l] {
        max-width: 100%;
        margin: 0.5rem;
    }

    .modal-header[b-7u3wfq5t3l] {
        padding: 1.25rem;
    }

    .modal-header .modal-title[b-7u3wfq5t3l] {
        font-size: 1.1rem;
    }

    .modal-body[b-7u3wfq5t3l] {
        padding: 1.5rem;
    }

    .modal-footer[b-7u3wfq5t3l] {
        padding: 1rem;
        flex-wrap: wrap;
    }

        .modal-footer .btn[b-7u3wfq5t3l] {
            flex: 1 1 auto;
            min-width: 100px;
        }
}

@media (max-width: 576px) {
    .page-title[b-7u3wfq5t3l] {
        font-size: 1.25rem;
    }

        .page-title i[b-7u3wfq5t3l] {
            font-size: 1.25rem;
        }

    .content-card[b-7u3wfq5t3l] {
        padding: 1rem;
    }

    .table-modern[b-7u3wfq5t3l] {
        min-width: 600px;
        font-size: 0.85rem;
    }

    .table-modern thead th[b-7u3wfq5t3l],
    .table-modern tbody td[b-7u3wfq5t3l] {
        padding: 0.65rem 0.4rem;
    }

    .color-preview[b-7u3wfq5t3l] {
        gap: 0.4rem;
    }

    .color-swatch[b-7u3wfq5t3l] {
        width: 28px;
        height: 28px;
    }

    .pagination[b-7u3wfq5t3l] {
        gap: 0.25rem;
    }

    .pagination .page-link[b-7u3wfq5t3l] {
        padding: 0.5rem 0.6rem;
        font-size: 0.8rem;
        min-width: 40px;
    }

    .modal-header[b-7u3wfq5t3l] {
        padding: 1rem;
    }

    .modal-header .modal-title[b-7u3wfq5t3l] {
        font-size: 1.1rem;
    }

    .modal-body[b-7u3wfq5t3l] {
        padding: 1rem;
    }

    .modal-footer[b-7u3wfq5t3l] {
        padding: 0.75rem;
    }

        .modal-footer .btn[b-7u3wfq5t3l] {
            padding: 0.55rem 1rem;
            font-size: 0.85rem;
        }

    .pagination-wrapper[b-7u3wfq5t3l] {
        flex-direction: column;
        align-items: stretch;
    }

    .showing-entries[b-7u3wfq5t3l] {
        text-align: center;
    }

    .pagination[b-7u3wfq5t3l] {
        justify-content: center;
        width: 100%;
    }
}

@media (max-width: 400px) {
    .page-title[b-7u3wfq5t3l] {
        font-size: 1.1rem;
        word-wrap: break-word;
    }

    .content-card[b-7u3wfq5t3l] {
        padding: 0.75rem;
    }

    .table-modern[b-7u3wfq5t3l] {
        min-width: 500px;
        font-size: 0.8rem;
    }

    .table-modern thead th[b-7u3wfq5t3l],
    .table-modern tbody td[b-7u3wfq5t3l] {
        padding: 0.5rem 0.3rem;
    }

    .color-swatch[b-7u3wfq5t3l] {
        width: 24px;
        height: 24px;
    }

    .pagination .page-link[b-7u3wfq5t3l] {
        padding: 0.4rem 0.5rem;
        min-width: 36px;
        font-size: 0.75rem;
    }

    /* Hide some pagination buttons on very small screens */
    .pagination .page-link:not(.active):not(:first-child):not(:last-child):nth-child(n+6)[b-7u3wfq5t3l] {
        display: none;
    }
}

/* ==================== PRINT STYLES ==================== */

@media print {
    .page-header[b-7u3wfq5t3l],
    .add-new-btn[b-7u3wfq5t3l],
    .btn[b-7u3wfq5t3l],
    .filter-section[b-7u3wfq5t3l],
    .pagination-wrapper[b-7u3wfq5t3l],
    .modal[b-7u3wfq5t3l] {
        display: none;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/ColorThemes/ColorThemeForm.razor.rz.scp.css */
/* ==================== PAGE HEADER ==================== */

.page-header[b-4wpyl6jvwm] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
    gap: 2rem;
}

    .page-header > div:first-child[b-4wpyl6jvwm] {
        flex: 1;
    }

.page-title[b-4wpyl6jvwm] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0 0 0.5rem 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-4wpyl6jvwm] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-4wpyl6jvwm] {
    margin: 0.5rem 0 0 0;
    padding: 0;
    background: transparent;
    font-size: 0.9rem;
}

    .breadcrumb-item[b-4wpyl6jvwm] {
        color: #6c757d;
    }

        .breadcrumb-item a[b-4wpyl6jvwm] {
            color: var(--primary-color);
            text-decoration: none;
            transition: color 0.3s ease;
        }

            .breadcrumb-item a:hover[b-4wpyl6jvwm] {
                color: var(--secondary-color);
                text-decoration: underline;
            }

        .breadcrumb-item.active[b-4wpyl6jvwm] {
            color: #2c3e50;
            font-weight: 600;
        }

/* ==================== CONTENT CARD ==================== */

.content-card[b-4wpyl6jvwm] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    border: 1px solid rgba(0, 0, 0, 0.05);
    margin-bottom: 1.5rem;
}

.card-header-custom[b-4wpyl6jvwm] {
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e9ecef;
}

.card-title-custom[b-4wpyl6jvwm] {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--primary-color);
    margin: 0 0 0.5rem 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-4wpyl6jvwm] {
        font-size: 1.25rem;
        color: var(--secondary-color);
    }

.card-subtitle-custom[b-4wpyl6jvwm] {
    font-size: 0.9rem;
    color: #6c757d;
    margin: 0;
}

/* ==================== LOADING CONTAINER ==================== */

.loading-container[b-4wpyl6jvwm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    text-align: center;
    color: #6c757d;
}

    .loading-container .spinner-border[b-4wpyl6jvwm] {
        margin-bottom: 1rem;
        width: 3rem;
        height: 3rem;
    }

    .loading-container p[b-4wpyl6jvwm] {
        margin: 0;
        font-size: 1rem;
    }

/* ==================== EDIT FORM STYLES ==================== */

.form-section[b-4wpyl6jvwm] {
    margin-bottom: 2rem;
}

    .form-section:last-child[b-4wpyl6jvwm] {
        margin-bottom: 1.5rem;
    }

.section-title[b-4wpyl6jvwm] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid var(--secondary-color);
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .section-title i[b-4wpyl6jvwm] {
        color: var(--secondary-color);
        font-size: 1.25rem;
    }

.form-label[b-4wpyl6jvwm] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: #2c3e50;
    margin-bottom: 0.75rem;
}

    .form-label i[b-4wpyl6jvwm] {
        color: var(--secondary-color);
        font-size: 1rem;
    }

.form-text[b-4wpyl6jvwm] {
    display: block;
    font-size: 0.85rem;
    color: #6c757d;
    margin-top: 0.4rem;
}

    .form-text.text-warning[b-4wpyl6jvwm] {
        color: #856404;
    }

.form-control[b-4wpyl6jvwm],
.form-control-custom[b-4wpyl6jvwm],
.form-select[b-4wpyl6jvwm],
.form-select-custom[b-4wpyl6jvwm] {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    background: white;
    color: #2c3e50;
    transition: all 0.3s ease;
    font-family: inherit;
}

    .form-control:focus[b-4wpyl6jvwm],
    .form-control-custom:focus[b-4wpyl6jvwm],
    .form-select:focus[b-4wpyl6jvwm],
    .form-select-custom:focus[b-4wpyl6jvwm] {
        outline: none;
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

    .form-control:hover:not(:focus)[b-4wpyl6jvwm],
    .form-control-custom:hover:not(:focus)[b-4wpyl6jvwm],
    .form-select:hover:not(:focus)[b-4wpyl6jvwm],
    .form-select-custom:hover:not(:focus)[b-4wpyl6jvwm] {
        border-color: #d1d5db;
    }

    .form-control:disabled[b-4wpyl6jvwm],
    .form-control-custom:disabled[b-4wpyl6jvwm],
    .form-select:disabled[b-4wpyl6jvwm],
    .form-select-custom:disabled[b-4wpyl6jvwm] {
        background-color: #f8f9fa;
        color: #6c757d;
        cursor: not-allowed;
        opacity: 0.7;
    }

.form-control[type="color"][b-4wpyl6jvwm],
.form-control-custom[type="color"][b-4wpyl6jvwm] {
    padding: 0.3rem;
    min-height: 45px;
    cursor: pointer;
}

/* ==================== COLOR INPUT GROUP ==================== */

.color-input-group[b-4wpyl6jvwm] {
    margin-bottom: 1.5rem;
}

    .color-input-group:last-child[b-4wpyl6jvwm] {
        margin-bottom: 0;
    }

.color-input-group .color-picker[b-4wpyl6jvwm] {
    max-width: 100px;
    flex-shrink: 0;
}

/* ==================== COLOR PRESETS ==================== */

.color-presets[b-4wpyl6jvwm] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 0.75rem;
}

.preset-btn[b-4wpyl6jvwm] {
    background: white;
    border: 2px solid #e9ecef;
    padding: 0.75rem;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    font-size: 0.85rem;
    color: var(--primary-color);
}

    .preset-btn:hover[b-4wpyl6jvwm] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        color: var(--primary-color);
        border-color: var(--secondary-color);
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(212, 175, 55, 0.3);
    }

    .preset-btn:active[b-4wpyl6jvwm] {
        transform: translateY(0);
    }

.preset-colors[b-4wpyl6jvwm] {
    display: flex;
    gap: 0.4rem;
    width: 100%;
    justify-content: center;
}

.preset-color[b-4wpyl6jvwm] {
    width: 28px;
    height: 28px;
    border-radius: 4px;
    border: 1px solid #ddd;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* ==================== COLOR PREVIEW BOX ==================== */

.color-preview-box[b-4wpyl6jvwm] {
    background: #f8f9fa;
    border-radius: 12px;
    padding: 1.5rem;
    border: 2px solid #e9ecef;
}

.preview-row[b-4wpyl6jvwm] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e9ecef;
}

    .preview-row:last-child[b-4wpyl6jvwm] {
        margin-bottom: 0;
        padding-bottom: 0;
        border-bottom: none;
    }

.preview-label[b-4wpyl6jvwm] {
    font-weight: 600;
    color: #2c3e50;
    min-width: 100px;
    font-size: 0.95rem;
}

.preview-color[b-4wpyl6jvwm] {
    width: 60px;
    height: 50px;
    border-radius: 8px;
    border: 2px solid #e9ecef;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    flex-shrink: 0;
}

.preview-row code[b-4wpyl6jvwm] {
    font-family: 'Courier New', monospace;
    font-weight: 600;
    color: #6c757d;
    background: white;
    padding: 0.4rem 0.75rem;
    border-radius: 4px;
    border: 1px solid #e9ecef;
    font-size: 0.85rem;
}

/* ==================== VALIDATION STYLES ==================== */

.invalid-feedback[b-4wpyl6jvwm],
.validation-message[b-4wpyl6jvwm] {
    font-size: 0.85rem;
    color: #dc3545;
    margin-top: 0.4rem;
    display: block;
}

/* ==================== ALERT MESSAGES ==================== */

.alert[b-4wpyl6jvwm] {
    padding: 1rem 1.25rem;
    border-radius: 8px;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    border-left: 4px solid transparent;
}

    .alert i[b-4wpyl6jvwm] {
        font-size: 1.1rem;
        margin-top: 0.05rem;
        flex-shrink: 0;
    }

.alert-danger[b-4wpyl6jvwm] {
    background: rgba(220, 53, 69, 0.1);
    border-left-color: #dc3545;
    color: #842029;
}

.alert-success[b-4wpyl6jvwm] {
    background: rgba(25, 135, 84, 0.1);
    border-left-color: #198754;
    color: #0f5132;
}

.alert-dismissible[b-4wpyl6jvwm] {
    position: relative;
    padding-right: 2.5rem;
}

    .alert-dismissible .btn-close[b-4wpyl6jvwm] {
        position: absolute;
        right: 1rem;
        top: 50%;
        transform: translateY(-50%);
        background: none;
        border: none;
        font-size: 1.25rem;
        color: inherit;
        opacity: 0.7;
        cursor: pointer;
        transition: opacity 0.3s ease;
    }

        .alert-dismissible .btn-close:hover[b-4wpyl6jvwm] {
            opacity: 1;
        }

/* ==================== FORM CHECKBOXES ==================== */

.form-check[b-4wpyl6jvwm] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem;
    border-radius: 8px;
    transition: all 0.3s ease;
    margin-bottom: 1rem;
}

    .form-check:last-child[b-4wpyl6jvwm] {
        margin-bottom: 0;
    }

    .form-check:hover[b-4wpyl6jvwm] {
        background: rgba(212, 175, 55, 0.05);
    }

.form-check-input[b-4wpyl6jvwm] {
    width: 1.25rem;
    height: 1.25rem;
    border: 2px solid #e9ecef;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s ease;
    flex-shrink: 0;
    margin-top: 0.15rem;
}

    .form-check-input:checked[b-4wpyl6jvwm] {
        background: var(--primary-color);
        border-color: var(--primary-color);
        box-shadow: 0 2px 4px rgba(139, 0, 0, 0.2);
    }

    .form-check-input:focus[b-4wpyl6jvwm] {
        outline: none;
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

.form-check-label[b-4wpyl6jvwm] {
    margin: 0;
    font-weight: 500;
    color: #2c3e50;
    cursor: pointer;
}

/* ==================== ACTION BUTTONS ==================== */

.form-actions[b-4wpyl6jvwm] {
    display: flex;
    justify-content: flex-start;
    gap: 1rem;
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 1px solid #e9ecef;
    flex-wrap: wrap;
}

.btn[b-4wpyl6jvwm] {
    padding: 0.75rem 1.75rem;
    font-weight: 700;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.95rem;
    white-space: nowrap;
    text-decoration: none;
}

    .btn:disabled[b-4wpyl6jvwm] {
        opacity: 0.6;
        cursor: not-allowed;
    }

.btn-primary[b-4wpyl6jvwm] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
}

    .btn-primary:hover:not(:disabled)[b-4wpyl6jvwm] {
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(139, 0, 0, 0.4);
        background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
    }

    .btn-primary:active:not(:disabled)[b-4wpyl6jvwm] {
        transform: translateY(0);
    }

.btn-secondary[b-4wpyl6jvwm] {
    background: #6c757d;
    color: white;
}

    .btn-secondary:hover:not(:disabled)[b-4wpyl6jvwm] {
        background: #5c636a;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(108, 117, 125, 0.3);
    }

    .btn-secondary:active:not(:disabled)[b-4wpyl6jvwm] {
        transform: translateY(0);
    }

.spinner-border[b-4wpyl6jvwm] {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    vertical-align: text-bottom;
    border: 0.25em solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    -webkit-animation: spinner-border 0.75s linear infinite;
    animation: spinner-border-b-4wpyl6jvwm 0.75s linear infinite;
}

    .spinner-border.spinner-border-sm[b-4wpyl6jvwm] {
        width: 0.875rem;
        height: 0.875rem;
        border-width: 0.2em;
    }

    .spinner-border.text-primary[b-4wpyl6jvwm] {
        color: var(--primary-color) !important;
    }

@-webkit-keyframes spinner-border {
    to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

@keyframes spinner-border-b-4wpyl6jvwm {
    to { transform: rotate(360deg); }
}

/* ==================== UTILITY CLASSES ==================== */

.d-block[b-4wpyl6jvwm] {
    display: block;
}

.me-2[b-4wpyl6jvwm] {
    margin-right: 0.5rem;
}

.text-muted[b-4wpyl6jvwm] {
    color: #6c757d;
}

.badge[b-4wpyl6jvwm] {
    display: inline-block;
    padding: 0.4rem 0.75rem;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.8rem;
}

.bg-light[b-4wpyl6jvwm] {
    background: #f8f9fa;
    color: #2c3e50;
}

/* ==================== TENANT DROPDOWN ==================== */

.tenant-dropdown-wrapper[b-4wpyl6jvwm] {
    position: relative;
    margin-bottom: 1rem;
}

.tenant-dropdown[b-4wpyl6jvwm] {
    appearance: none;
    padding-right: 2.5rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%236c757d' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 16px 12px;
    padding-right: 2.5rem;
}

.tenant-dropdown[b-4wpyl6jvwm]::-ms-expand {
    display: none;
}

.tenant-info-badge[b-4wpyl6jvwm] {
    padding: 1rem;
    border-radius: 8px;
    margin-top: 1rem;
    display: flex;
    align-items: center;
    animation: slideIn-b-4wpyl6jvwm 0.3s ease-out;
}

.tenant-color-indicator[b-4wpyl6jvwm] {
    width: 24px;
    height: 24px;
    border-radius: 6px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    flex-shrink: 0;
}

@keyframes slideIn-b-4wpyl6jvwm {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Tenant dropdown styling - color for each option */
.tenant-dropdown option[b-4wpyl6jvwm] {
    padding: 0.5rem 1rem;
    border-left: 4px solid transparent;
}

.tenant-dropdown option:checked[b-4wpyl6jvwm] {
    background: linear-gradient(#87CEEB 0%, #87CEEB 100%);
    background-color: #87CEEB;
}

/* ==================== RESPONSIVE DESIGN ==================== */

/* Tablets (768px and below) */
@media (max-width: 768px) {
    body[b-4wpyl6jvwm] {
        overflow-x: hidden;
    }

    .main-content[b-4wpyl6jvwm] {
        overflow-x: hidden;
        max-width: 100vw;
    }

    .page-header[b-4wpyl6jvwm] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
        padding-bottom: 1rem;
        margin-bottom: 1.5rem;
    }

        .page-header > div:first-child[b-4wpyl6jvwm] {
            width: 100%;
        }

    .page-title[b-4wpyl6jvwm] {
        font-size: 1.5rem;
    }

        .page-title i[b-4wpyl6jvwm] {
            font-size: 1.5rem;
        }

    .content-card[b-4wpyl6jvwm] {
        padding: 1.25rem;
    }

    .form-label[b-4wpyl6jvwm] {
        font-size: 0.9rem;
    }

    .form-control[b-4wpyl6jvwm],
    .form-control-custom[b-4wpyl6jvwm],
    .form-select[b-4wpyl6jvwm],
    .form-select-custom[b-4wpyl6jvwm] {
        padding: 0.65rem 0.9rem;
        font-size: 0.9rem;
    }

    .color-presets[b-4wpyl6jvwm] {
        grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
    }

    .section-title[b-4wpyl6jvwm] {
        font-size: 1.05rem;
        margin-bottom: 1rem;
    }

    .form-actions[b-4wpyl6jvwm] {
        flex-direction: column;
    }

        .form-actions .btn[b-4wpyl6jvwm] {
            width: 100%;
            justify-content: center;
        }

    .color-preview-box[b-4wpyl6jvwm] {
        padding: 1.25rem;
    }

    .preview-row[b-4wpyl6jvwm] {
        gap: 1rem;
    }

    .tenant-info-badge[b-4wpyl6jvwm] {
        flex-direction: column;
        text-align: center;
    }

        .tenant-info-badge > div[b-4wpyl6jvwm] {
            flex-direction: column;
            gap: 0.5rem;
        }
}

/* Mobile (576px and below) */
@media (max-width: 576px) {
    body[b-4wpyl6jvwm], html[b-4wpyl6jvwm] {
        overflow-x: hidden;
        max-width: 100vw;
    }

    .main-content[b-4wpyl6jvwm] {
        overflow-x: hidden;
        max-width: 100vw;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    .page-header[b-4wpyl6jvwm] {
        border-bottom: 2px solid var(--primary-color);
    }

    .page-title[b-4wpyl6jvwm] {
        font-size: 1.25rem;
    }

        .page-title i[b-4wpyl6jvwm] {
            font-size: 1.25rem;
        }

    .content-card[b-4wpyl6jvwm] {
        padding: 1rem;
    }

    .form-section[b-4wpyl6jvwm] {
        margin-bottom: 1.5rem;
    }

    .form-label[b-4wpyl6jvwm] {
        font-size: 0.85rem;
    }

    .form-control[b-4wpyl6jvwm],
    .form-control-custom[b-4wpyl6jvwm],
    .form-select[b-4wpyl6jvwm],
    .form-select-custom[b-4wpyl6jvwm] {
        padding: 0.6rem 0.85rem;
        font-size: 0.9rem;
    }

    .color-presets[b-4wpyl6jvwm] {
        grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
        gap: 0.6rem;
    }

    .preset-btn[b-4wpyl6jvwm] {
        padding: 0.6rem;
        font-size: 0.8rem;
    }

    .preset-colors[b-4wpyl6jvwm] {
        gap: 0.3rem;
    }

    .preset-color[b-4wpyl6jvwm] {
        width: 24px;
        height: 24px;
    }

    .form-check[b-4wpyl6jvwm] {
        padding: 0.6rem;
        margin-bottom: 0.75rem;
    }

    .form-check-input[b-4wpyl6jvwm] {
        width: 1.1rem;
        height: 1.1rem;
    }

    .form-actions[b-4wpyl6jvwm] {
        gap: 0.6rem;
        margin-top: 1.5rem;
        padding-top: 1.5rem;
    }

    .btn[b-4wpyl6jvwm] {
        padding: 0.65rem 1.25rem;
        font-size: 0.9rem;
    }

    .color-preview-box[b-4wpyl6jvwm] {
        padding: 1rem;
    }

    .preview-row[b-4wpyl6jvwm] {
        flex-direction: column;
        gap: 0.6rem;
    }

    .preview-label[b-4wpyl6jvwm] {
        min-width: auto;
        font-size: 0.9rem;
    }

    .preview-color[b-4wpyl6jvwm] {
        width: 100%;
        height: 40px;
    }

    .alert[b-4wpyl6jvwm] {
        padding: 0.75rem 1rem;
        margin-bottom: 1rem;
        font-size: 0.9rem;
    }

    .card-header-custom[b-4wpyl6jvwm] {
        margin-bottom: 1rem;
        padding-bottom: 0.75rem;
    }

    .card-title-custom[b-4wpyl6jvwm] {
        font-size: 1rem;
    }

    .card-subtitle-custom[b-4wpyl6jvwm] {
        font-size: 0.85rem;
    }

    .tenant-info-badge[b-4wpyl6jvwm] {
        padding: 0.75rem;
    }

    .tenant-color-indicator[b-4wpyl6jvwm] {
        width: 20px;
        height: 20px;
    }
}

/* Extra Small Mobile (400px and below) */
@media (max-width: 400px) {
    body[b-4wpyl6jvwm], html[b-4wpyl6jvwm], .main-content[b-4wpyl6jvwm] {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }

    .page-title[b-4wpyl6jvwm] {
        font-size: 1.1rem;
        word-wrap: break-word;
    }

    .content-card[b-4wpyl6jvwm] {
        padding: 0.75rem;
    }

    .form-label[b-4wpyl6jvwm] {
        font-size: 0.8rem;
    }

    .form-control[b-4wpyl6jvwm],
    .form-control-custom[b-4wpyl6jvwm],
    .form-select[b-4wpyl6jvwm],
    .form-select-custom[b-4wpyl6jvwm] {
        padding: 0.55rem 0.75rem;
        font-size: 0.85rem;
    }

    .color-presets[b-4wpyl6jvwm] {
        grid-template-columns: repeat(2, 1fr);
    }

    .preset-btn[b-4wpyl6jvwm] {
        padding: 0.5rem;
        font-size: 0.75rem;
    }

    .btn[b-4wpyl6jvwm] {
        padding: 0.6rem 1rem;
        font-size: 0.85rem;
    }

    .form-actions[b-4wpyl6jvwm] {
        gap: 0.5rem;
    }

        .form-actions .btn[b-4wpyl6jvwm] {
            flex: 1 1 auto;
        }

    .color-preview-box[b-4wpyl6jvwm] {
        padding: 0.75rem;
    }

    .preview-row code[b-4wpyl6jvwm] {
        font-size: 0.75rem;
        padding: 0.3rem 0.6rem;
    }

    .section-title[b-4wpyl6jvwm] {
        font-size: 1rem;
        margin-bottom: 1rem;
    }

    .tenant-info-badge[b-4wpyl6jvwm] {
        padding: 0.5rem;
        font-size: 0.85rem;
    }

    .tenant-color-indicator[b-4wpyl6jvwm] {
        width: 18px;
        height: 18px;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Company/CompanyManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-rpq6ujyzxb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-rpq6ujyzxb] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-rpq6ujyzxb] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-rpq6ujyzxb] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-rpq6ujyzxb]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-rpq6ujyzxb] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-rpq6ujyzxb] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-rpq6ujyzxb] {
    color: #6c757d;
}

.add-new-btn[b-rpq6ujyzxb] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-rpq6ujyzxb] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-rpq6ujyzxb] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-rpq6ujyzxb] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-rpq6ujyzxb] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-rpq6ujyzxb] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-rpq6ujyzxb] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FILTER SECTION ==================== */
.filter-section[b-rpq6ujyzxb] {
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1.5rem;
}

.form-control-custom[b-rpq6ujyzxb],
.form-select-custom[b-rpq6ujyzxb] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-rpq6ujyzxb],
.form-select-custom:focus[b-rpq6ujyzxb] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

textarea.form-control-custom[b-rpq6ujyzxb] {
    resize: vertical;
}

.search-box[b-rpq6ujyzxb] {
    position: relative;
    width: 100%;
}

.search-box input[b-rpq6ujyzxb] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-rpq6ujyzxb] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.search-box i[b-rpq6ujyzxb] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-rpq6ujyzxb] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-rpq6ujyzxb] {
    color: var(--secondary-color);
}

/* ==================== COMPANIES TABLE ==================== */
.companies-table-container[b-rpq6ujyzxb] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.companies-table[b-rpq6ujyzxb] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.companies-table thead[b-rpq6ujyzxb] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.companies-table thead th[b-rpq6ujyzxb] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.companies-table thead th:first-child[b-rpq6ujyzxb] {
    border-top-left-radius: 12px;
}

.companies-table thead th:last-child[b-rpq6ujyzxb] {
    border-top-right-radius: 12px;
}

.companies-table tbody tr[b-rpq6ujyzxb] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.companies-table tbody tr:hover[b-rpq6ujyzxb] {
    background-color: #f8f9fa;
}

.companies-table tbody td[b-rpq6ujyzxb] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.company-name[b-rpq6ujyzxb] {
    font-weight: 600;
    color: var(--primary-color);
}

/* ==================== STATUS BADGES ==================== */
.badge[b-rpq6ujyzxb] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== TABLE SUMMARY ==================== */
.table-summary[b-rpq6ujyzxb] {
    display: flex;
    align-items: center;
    gap: 2rem;
    margin-top: 1.5rem;
    padding: 1.25rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
}

.summary-item[b-rpq6ujyzxb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.95rem;
    color: #495057;
}

.summary-item i[b-rpq6ujyzxb] {
    font-size: 1.5rem;
}

.summary-item strong[b-rpq6ujyzxb] {
    color: var(--primary-color);
    font-size: 1.1rem;
}

/* ==================== ALERTS ==================== */
.alert[b-rpq6ujyzxb] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-rpq6ujyzxb] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-rpq6ujyzxb] {
    color: var(--secondary-color);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-rpq6ujyzxb] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-rpq6ujyzxb] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-rpq6ujyzxb] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-rpq6ujyzxb] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-rpq6ujyzxb] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn:disabled[b-rpq6ujyzxb] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-rpq6ujyzxb] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-rpq6ujyzxb] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

.btn-action-icon:hover[b-rpq6ujyzxb] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-edit:hover[b-rpq6ujyzxb] {
    background: #0056b3;
    color: white;
}

.btn-action-icon.btn-delete:hover[b-rpq6ujyzxb] {
    background: #dc3545;
    color: white;
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-rpq6ujyzxb] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-rpq6ujyzxb] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-rpq6ujyzxb] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-rpq6ujyzxb] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== TOAST ==================== */
.toast[b-rpq6ujyzxb] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
    .page-header[b-rpq6ujyzxb] {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }

    .page-title[b-rpq6ujyzxb] {
        font-size: 1.5rem;
    }

    .content-card[b-rpq6ujyzxb] {
        padding: 1.5rem;
    }

    .companies-table thead th[b-rpq6ujyzxb],
    .companies-table tbody td[b-rpq6ujyzxb] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .table-summary[b-rpq6ujyzxb] {
        flex-direction: column;
        gap: 1rem;
    }

    .summary-item[b-rpq6ujyzxb] {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 576px) {
    .page-header .add-new-btn[b-rpq6ujyzxb] {
        width: 100%;
        justify-content: center;
    }

    .content-card[b-rpq6ujyzxb] {
        padding: 1rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Dashboard.razor.rz.scp.css */

.main-content.expanded[b-iybkylvfc4] {
    margin-left: 0;
}


/* Dashboard Cards */
.page-header[b-iybkylvfc4] {
    margin-bottom: 2rem;
}

    .page-header h1[b-iybkylvfc4] {
        color: var(--primary-color);
        font-weight: 600;
        margin-bottom: 0.5rem;
    }

.breadcrumb[b-iybkylvfc4] {
    background: none;
    padding: 0;
    margin-bottom: 0;
    font-size: 0.9rem;
}

.breadcrumb-item a[b-iybkylvfc4] {
    color: #6c757d;
    text-decoration: none;
}

.breadcrumb-item.active[b-iybkylvfc4] {
    color: var(--primary-color);
}

.dashboard-card[b-iybkylvfc4] {
    background: white;
    border-radius: 10px;
    padding: 1.5rem;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
    margin-bottom: 2rem;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .dashboard-card:hover[b-iybkylvfc4] {
        transform: translateY(-5px);
        box-shadow: 0 5px 20px rgba(0,0,0,0.12);
    }

.card-icon[b-iybkylvfc4] {
    width: 60px;
    height: 60px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
}

    .card-icon.revenue[b-iybkylvfc4] {
        background: linear-gradient(135deg, #2E7D32, #43A047);
    }

    .card-icon.expenses[b-iybkylvfc4] {
        background: linear-gradient(135deg, #C62828, #EF5350);
    }

    .card-icon.balance[b-iybkylvfc4] {
        background: linear-gradient(135deg, #1565C0, #42A5F5);
    }

    .card-icon.transactions[b-iybkylvfc4] {
        background: linear-gradient(135deg, #6A1B9A, #AB47BC);
    }

    .card-icon i[b-iybkylvfc4] {
        color: white;
        font-size: 1.75rem;
    }

.card-title[b-iybkylvfc4] {
    color: #6c757d;
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
}

.card-value[b-iybkylvfc4] {
    color: var(--primary-color);
    font-size: 1.75rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
}

.card-change[b-iybkylvfc4] {
    font-size: 0.875rem;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

    .card-change.positive[b-iybkylvfc4] {
        color: #2E7D32;
    }

    .card-change.negative[b-iybkylvfc4] {
        color: #C62828;
    }

.chart-card[b-iybkylvfc4] {
    background: white;
    border-radius: 10px;
    padding: 1.5rem;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
    margin-bottom: 2rem;
}

.chart-header[b-iybkylvfc4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}

.chart-title[b-iybkylvfc4] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--primary-color);
    margin: 0;
}

.chart-placeholder[b-iybkylvfc4] {
    height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f8f9fa;
    border-radius: 8px;
    color: #6c757d;
}

/* _content/AccountingSystem.Web/Components/Pages/Department/DepartmentManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-2aii6u05h5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-2aii6u05h5] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-2aii6u05h5] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-2aii6u05h5] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-2aii6u05h5]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-2aii6u05h5] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-2aii6u05h5] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-2aii6u05h5] {
    color: #6c757d;
}

.add-new-btn[b-2aii6u05h5] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-2aii6u05h5] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-2aii6u05h5] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-2aii6u05h5] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-2aii6u05h5] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-2aii6u05h5] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-2aii6u05h5] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FILTER SECTION ==================== */
.filter-section[b-2aii6u05h5] {
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1.5rem;
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-2aii6u05h5] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-2aii6u05h5] {
    color: var(--secondary-color);
}

.form-control-custom[b-2aii6u05h5],
.form-select-custom[b-2aii6u05h5] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-2aii6u05h5],
.form-select-custom:focus[b-2aii6u05h5] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== SEARCH BOX ==================== */
.search-box[b-2aii6u05h5] {
    position: relative;
    width: 100%;
}

.search-box input[b-2aii6u05h5] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-2aii6u05h5] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.search-box i[b-2aii6u05h5] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

/* ==================== DATA TABLE ==================== */
.table-container[b-2aii6u05h5] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.data-table[b-2aii6u05h5] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.data-table thead[b-2aii6u05h5] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.data-table thead th[b-2aii6u05h5] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.data-table thead th:first-child[b-2aii6u05h5] {
    border-top-left-radius: 12px;
}

.data-table thead th:last-child[b-2aii6u05h5] {
    border-top-right-radius: 12px;
}

.data-table tbody tr[b-2aii6u05h5] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.data-table tbody tr:hover[b-2aii6u05h5] {
    background-color: #f8f9fa;
}

.data-table tbody td[b-2aii6u05h5] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.code-label[b-2aii6u05h5] {
    font-weight: 600;
    color: var(--primary-color);
    font-family: monospace;
    font-size: 0.9rem;
}

/* ==================== STATUS BADGES ==================== */
.badge[b-2aii6u05h5] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== ALERTS ==================== */
.alert[b-2aii6u05h5] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-2aii6u05h5] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-2aii6u05h5] {
    color: var(--secondary-color);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-2aii6u05h5] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-2aii6u05h5] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-2aii6u05h5] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-2aii6u05h5] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-2aii6u05h5] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn-danger[b-2aii6u05h5] {
    background-color: #dc3545;
    color: white;
    border: none;
}

.btn-danger:hover[b-2aii6u05h5] {
    background-color: #bb2d3b;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
}

.btn:disabled[b-2aii6u05h5] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-2aii6u05h5] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-2aii6u05h5] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

.btn-action-icon:hover[b-2aii6u05h5] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-edit:hover[b-2aii6u05h5] {
    background: #0056b3;
    color: white;
}

.btn-action-icon.btn-delete:hover[b-2aii6u05h5] {
    background: #dc3545;
    color: white;
}

/* ==================== PAGINATION ==================== */
.pagination-wrapper[b-2aii6u05h5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    gap: 2rem;
    margin-top: 1rem;
}

.showing-entries[b-2aii6u05h5] {
    font-size: 0.9rem;
    color: #495057;
}

.showing-entries strong[b-2aii6u05h5] {
    color: var(--primary-color);
}

.pagination[b-2aii6u05h5] {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

.page-item[b-2aii6u05h5] {
    margin: 0;
}

.page-link[b-2aii6u05h5] {
    padding: 0.5rem 0.75rem;
    border: 1px solid #dee2e6;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

.page-link:hover:not(:disabled)[b-2aii6u05h5] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

.page-item.active .page-link[b-2aii6u05h5] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

.page-item.disabled .page-link[b-2aii6u05h5] {
    opacity: 0.5;
    cursor: not-allowed;
}

.page-link:disabled[b-2aii6u05h5] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-2aii6u05h5] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-2aii6u05h5] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-2aii6u05h5] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-2aii6u05h5] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
    .page-header[b-2aii6u05h5] {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }

    .page-title[b-2aii6u05h5] {
        font-size: 1.5rem;
    }

    .content-card[b-2aii6u05h5] {
        padding: 1.5rem;
    }

    .data-table thead th[b-2aii6u05h5],
    .data-table tbody td[b-2aii6u05h5] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .pagination-wrapper[b-2aii6u05h5] {
        flex-direction: column;
        gap: 1rem;
        justify-content: center;
    }

    .pagination[b-2aii6u05h5] {
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media (max-width: 576px) {
    .page-header .add-new-btn[b-2aii6u05h5] {
        width: 100%;
        justify-content: center;
    }

    .content-card[b-2aii6u05h5] {
        padding: 1rem;
    }

    .page-link[b-2aii6u05h5] {
        padding: 0.4rem 0.6rem;
        font-size: 0.8rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/DocumentConfig/DocumentSeriesConfigManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-fpdl8696om] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-fpdl8696om] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-fpdl8696om] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-fpdl8696om] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-fpdl8696om]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-fpdl8696om] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-fpdl8696om] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-fpdl8696om] {
    color: #6c757d;
}

.add-new-btn[b-fpdl8696om] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-fpdl8696om] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-fpdl8696om] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-fpdl8696om] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-fpdl8696om] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-fpdl8696om] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-fpdl8696om] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FORM CONTROLS ==================== */
.form-control-custom[b-fpdl8696om],
.form-select-custom[b-fpdl8696om] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-fpdl8696om],
.form-select-custom:focus[b-fpdl8696om] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.form-label[b-fpdl8696om] {
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-fpdl8696om] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.search-box[b-fpdl8696om] {
    position: relative;
    width: 100%;
}

.search-box i[b-fpdl8696om] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box input[b-fpdl8696om] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-fpdl8696om] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-fpdl8696om] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-fpdl8696om] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-fpdl8696om] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-fpdl8696om] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-fpdl8696om] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn:disabled[b-fpdl8696om] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== TABLE STYLES ==================== */
.configurations-table-container[b-fpdl8696om] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.configurations-table[b-fpdl8696om] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.configurations-table thead[b-fpdl8696om] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.configurations-table thead tr th[b-fpdl8696om] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.configurations-table thead th:first-child[b-fpdl8696om] {
    border-top-left-radius: 12px;
}

.configurations-table thead th:last-child[b-fpdl8696om] {
    border-top-right-radius: 12px;
}

.configurations-table tbody tr[b-fpdl8696om] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.configurations-table tbody tr:hover[b-fpdl8696om] {
    background-color: #f8f9fa;
}

.configurations-table tbody td[b-fpdl8696om] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

/* ==================== CONFIG INFO ==================== */
.config-info[b-fpdl8696om] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.config-name[b-fpdl8696om] {
    font-weight: 600;
    color: var(--primary-color);
}

.format-example[b-fpdl8696om] {
    background: rgba(212, 175, 55, 0.1);
    color: var(--primary-color);
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
    font-size: 0.85rem;
    border: 1px solid rgba(212, 175, 55, 0.3);
}

/* ==================== BADGE STYLES ==================== */
.badge[b-fpdl8696om] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-fpdl8696om] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-fpdl8696om] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
    padding: 0;
}

.btn-action-icon:hover[b-fpdl8696om] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-edit:hover[b-fpdl8696om] {
    background: #0056b3;
    color: white;
}

.btn-action-icon.btn-delete:hover[b-fpdl8696om] {
    background: #dc3545;
    color: white;
}

/* ==================== TABLE SUMMARY ==================== */
.table-summary[b-fpdl8696om] {
    display: flex;
    align-items: center;
    gap: 2rem;
    padding: 1.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
}

.summary-item[b-fpdl8696om] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
    color: #495057;
}

.summary-item i[b-fpdl8696om] {
    color: var(--secondary-color);
    font-size: 1rem;
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-fpdl8696om] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-fpdl8696om] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-fpdl8696om] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-fpdl8696om] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== ALERTS ==================== */
.alert[b-fpdl8696om] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-fpdl8696om] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-fpdl8696om] {
    color: var(--secondary-color);
}

.format-preview[b-fpdl8696om] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    border-radius: 8px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    color: var(--primary-color);
}

.format-preview strong[b-fpdl8696om] {
    color: var(--primary-color);
}

.format-preview code[b-fpdl8696om] {
    display: block;
    margin-top: 0.5rem;
    font-family: monospace;
    font-size: 14px;
    color: var(--primary-color);
}

/* ==================== TOAST ==================== */
.toast[b-fpdl8696om] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
    .page-title[b-fpdl8696om] {
        font-size: 1.5rem;
    }

    .content-card[b-fpdl8696om] {
        padding: 1.5rem;
    }

    .filter-section[b-fpdl8696om] {
        padding: 0.75rem;
    }

    .table-summary[b-fpdl8696om] {
        flex-direction: column;
        gap: 0.75rem;
        align-items: flex-start;
    }
}

@media (max-width: 576px) {
    .page-header[b-fpdl8696om] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-fpdl8696om] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/GroupCode/GroupCodeManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-pe9hwsph5b] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-pe9hwsph5b] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-pe9hwsph5b] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-pe9hwsph5b] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-pe9hwsph5b]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-pe9hwsph5b] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-pe9hwsph5b] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-pe9hwsph5b] {
    color: #6c757d;
}

.add-new-btn[b-pe9hwsph5b] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-pe9hwsph5b] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-pe9hwsph5b] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-pe9hwsph5b] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-pe9hwsph5b] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-pe9hwsph5b] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-pe9hwsph5b] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FILTER SECTION ==================== */
.filter-section[b-pe9hwsph5b] {
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1.5rem;
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-pe9hwsph5b] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-pe9hwsph5b] {
    color: var(--secondary-color);
}

.form-control-custom[b-pe9hwsph5b],
.form-select-custom[b-pe9hwsph5b] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-pe9hwsph5b],
.form-select-custom:focus[b-pe9hwsph5b] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== SEARCH BOX ==================== */
.search-box[b-pe9hwsph5b] {
    position: relative;
    width: 100%;
}

.search-box input[b-pe9hwsph5b] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-pe9hwsph5b] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.search-box i[b-pe9hwsph5b] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

/* ==================== GROUPS TABLE ==================== */
.groups-table-container[b-pe9hwsph5b] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.groups-table[b-pe9hwsph5b] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.groups-table thead[b-pe9hwsph5b] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.groups-table thead th[b-pe9hwsph5b] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.groups-table thead th:first-child[b-pe9hwsph5b] {
    border-top-left-radius: 12px;
}

.groups-table thead th:last-child[b-pe9hwsph5b] {
    border-top-right-radius: 12px;
}

.groups-table tbody tr[b-pe9hwsph5b] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.groups-table tbody tr:hover[b-pe9hwsph5b] {
    background-color: #f8f9fa;
}

.groups-table tbody td[b-pe9hwsph5b] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.group-code-name[b-pe9hwsph5b] {
    font-weight: 600;
    color: var(--primary-color);
}

/* ==================== STATUS BADGES ==================== */
.badge[b-pe9hwsph5b] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== PAGINATION ==================== */
.pagination-wrapper[b-pe9hwsph5b] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
}

.showing-entries[b-pe9hwsph5b] {
    font-size: 0.9rem;
    color: #495057;
}

.showing-entries strong[b-pe9hwsph5b] {
    color: var(--primary-color);
}

.pagination[b-pe9hwsph5b] {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

.page-item[b-pe9hwsph5b] {
    margin: 0;
}

.page-link[b-pe9hwsph5b] {
    padding: 0.5rem 0.75rem;
    border: 1px solid #dee2e6;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

.page-link:hover:not(:disabled)[b-pe9hwsph5b] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

.page-item.active .page-link[b-pe9hwsph5b] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

.page-item.disabled .page-link[b-pe9hwsph5b] {
    opacity: 0.5;
    cursor: not-allowed;
}

.page-link:disabled[b-pe9hwsph5b] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ==================== ALERTS ==================== */
.alert[b-pe9hwsph5b] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-pe9hwsph5b] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-pe9hwsph5b] {
    color: var(--secondary-color);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-pe9hwsph5b] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-pe9hwsph5b] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-pe9hwsph5b] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-pe9hwsph5b] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-pe9hwsph5b] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn-danger[b-pe9hwsph5b] {
    background-color: #dc3545;
    color: white;
    border: none;
}

.btn-danger:hover[b-pe9hwsph5b] {
    background-color: #bb2d3b;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
}

.btn:disabled[b-pe9hwsph5b] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-pe9hwsph5b] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-pe9hwsph5b] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

.btn-action-icon:hover[b-pe9hwsph5b] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-edit:hover[b-pe9hwsph5b] {
    background: #0056b3;
    color: white;
}

.btn-action-icon.btn-delete:hover[b-pe9hwsph5b] {
    background: #dc3545;
    color: white;
}

.btn-action-icon.btn-users:hover[b-pe9hwsph5b] {
    background: #0dcaf0;
    color: white;
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-pe9hwsph5b] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-pe9hwsph5b] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-pe9hwsph5b] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-pe9hwsph5b] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== SECTION TITLE ==================== */
.section-title[b-pe9hwsph5b] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #dee2e6;
}

.section-title i[b-pe9hwsph5b] {
    color: var(--secondary-color);
}

/* ==================== USER ASSIGNMENT TABLE ==================== */
.assignment-table-container[b-pe9hwsph5b] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.assignment-table[b-pe9hwsph5b] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.assignment-table thead[b-pe9hwsph5b] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.assignment-table thead th[b-pe9hwsph5b] {
    padding: 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.85rem;
}

.assignment-table thead th:first-child[b-pe9hwsph5b] {
    border-top-left-radius: 12px;
}

.assignment-table thead th:last-child[b-pe9hwsph5b] {
    border-top-right-radius: 12px;
}

.assignment-table tbody tr[b-pe9hwsph5b] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.assignment-table tbody tr:hover[b-pe9hwsph5b] {
    background-color: #f8f9fa;
}

.assignment-table tbody td[b-pe9hwsph5b] {
    padding: 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
    .page-header[b-pe9hwsph5b] {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }

    .page-title[b-pe9hwsph5b] {
        font-size: 1.5rem;
    }

    .content-card[b-pe9hwsph5b] {
        padding: 1.5rem;
    }

    .groups-table thead th[b-pe9hwsph5b],
    .groups-table tbody td[b-pe9hwsph5b] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .pagination-wrapper[b-pe9hwsph5b] {
        flex-direction: column;
        gap: 1rem;
        justify-content: center;
    }

    .pagination[b-pe9hwsph5b] {
        flex-wrap: wrap;
        justify-content: center;
    }
}

@media (max-width: 576px) {
    .page-header .add-new-btn[b-pe9hwsph5b] {
        width: 100%;
        justify-content: center;
    }

    .content-card[b-pe9hwsph5b] {
        padding: 1rem;
    }

    .page-link[b-pe9hwsph5b] {
        padding: 0.4rem 0.6rem;
        font-size: 0.8rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Inventory/AddProduct.razor.rz.scp.css */
/* Add Product Page - Page-level styles */

.page-header[b-gom98onqoj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-gom98onqoj] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-gom98onqoj] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-gom98onqoj] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-gom98onqoj]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-gom98onqoj] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-gom98onqoj] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-gom98onqoj] {
    color: #6c757d;
}

@media (max-width: 768px) {
    .page-header[b-gom98onqoj] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .page-title[b-gom98onqoj] {
        font-size: 1.5rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Inventory/BrandManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-mt2u4f050k] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-mt2u4f050k] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-mt2u4f050k] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-mt2u4f050k] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-mt2u4f050k]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-mt2u4f050k] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-mt2u4f050k] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-mt2u4f050k] {
    color: #6c757d;
}

.add-new-btn[b-mt2u4f050k] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-mt2u4f050k] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== SUMMARY CARDS ==================== */
.summary-card[b-mt2u4f050k] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    display: flex;
    align-items: center;
    gap: 1rem;
    transition: transform 0.2s, box-shadow 0.2s;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.summary-card:hover[b-mt2u4f050k] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.summary-card .icon[b-mt2u4f050k] {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}

.summary-card .details[b-mt2u4f050k] {
    flex: 1;
}

.summary-card .title[b-mt2u4f050k] {
    font-size: 0.875rem;
    color: #6c757d;
    margin-bottom: 0.25rem;
}

.summary-card .value[b-mt2u4f050k] {
    font-size: 1.75rem;
    font-weight: 600;
    color: var(--primary-color);
}

.bg-primary-light[b-mt2u4f050k] {
    background: rgba(139, 0, 0, 0.1);
}

.bg-success-light[b-mt2u4f050k] {
    background: rgba(25, 135, 84, 0.1);
}

.bg-warning-light[b-mt2u4f050k] {
    background: rgba(255, 193, 7, 0.1);
}

.bg-info-light[b-mt2u4f050k] {
    background: rgba(13, 202, 240, 0.1);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-mt2u4f050k] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-mt2u4f050k] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-mt2u4f050k] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-mt2u4f050k] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-mt2u4f050k] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.search-box[b-mt2u4f050k] {
    position: relative;
    width: 100%;
}

.search-box i[b-mt2u4f050k] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box input[b-mt2u4f050k] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-mt2u4f050k] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-mt2u4f050k] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-mt2u4f050k] {
    color: var(--secondary-color);
}

.form-control-custom[b-mt2u4f050k],
.form-select-custom[b-mt2u4f050k] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-mt2u4f050k],
.form-select-custom:focus[b-mt2u4f050k] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-mt2u4f050k] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-mt2u4f050k] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-mt2u4f050k] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-mt2u4f050k] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-mt2u4f050k] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn:disabled[b-mt2u4f050k] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== TABLE STYLES ==================== */
.brands-table-container[b-mt2u4f050k] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.brands-table[b-mt2u4f050k] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.brands-table thead[b-mt2u4f050k] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.brands-table thead tr th[b-mt2u4f050k] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.brands-table thead th:first-child[b-mt2u4f050k] {
    border-top-left-radius: 12px;
}

.brands-table thead th:last-child[b-mt2u4f050k] {
    border-top-right-radius: 12px;
}

.brands-table tbody tr[b-mt2u4f050k] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.brands-table tbody tr:hover[b-mt2u4f050k] {
    background-color: #f8f9fa;
}

.brands-table tbody td[b-mt2u4f050k] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.product-code[b-mt2u4f050k] {
    font-weight: 600;
    color: var(--primary-color);
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-mt2u4f050k] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-mt2u4f050k] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

.btn-action-icon:hover[b-mt2u4f050k] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

/* ==================== STATUS BADGE ==================== */
.badge[b-mt2u4f050k] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge.bg-success[b-mt2u4f050k] {
    background-color: #28a745 !important;
}

.badge.bg-warning[b-mt2u4f050k] {
    background-color: #ffc107 !important;
}

.badge.bg-secondary[b-mt2u4f050k] {
    background-color: #6c757d !important;
}

/* ==================== SUMMARY SECTION ==================== */
.table-summary[b-mt2u4f050k] {
    display: flex;
    gap: 2rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    flex-wrap: wrap;
    margin-top: 1rem;
}

.summary-item[b-mt2u4f050k] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.95rem;
    color: #495057;
}

.summary-item i[b-mt2u4f050k] {
    font-size: 1.2rem;
}

.summary-item strong[b-mt2u4f050k] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
}

/* ==================== ALERTS ==================== */
.alert[b-mt2u4f050k] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-mt2u4f050k] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-mt2u4f050k] {
    color: var(--secondary-color);
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-mt2u4f050k] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-mt2u4f050k] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-mt2u4f050k] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-mt2u4f050k] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== SECTION TITLES ==================== */
.section-title[b-mt2u4f050k] {
    color: var(--primary-color);
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #dee2e6;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.section-title i[b-mt2u4f050k] {
    color: var(--secondary-color);
}

/* ==================== FORM ENHANCEMENTS ==================== */
.form-check-input:checked[b-mt2u4f050k] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.form-check-input:focus[b-mt2u4f050k] {
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.form-check-label strong[b-mt2u4f050k] {
    color: var(--primary-color);
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 992px) {
    .action-buttons[b-mt2u4f050k] {
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .page-title[b-mt2u4f050k] {
        font-size: 1.5rem;
    }

    .content-card[b-mt2u4f050k] {
        padding: 1.5rem;
    }

    .filter-section[b-mt2u4f050k] {
        padding: 0.75rem;
    }

    .brands-table thead th[b-mt2u4f050k],
    .brands-table tbody td[b-mt2u4f050k] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .table-summary[b-mt2u4f050k] {
        flex-direction: column;
        gap: 1rem;
    }

    .summary-card[b-mt2u4f050k] {
        padding: 1rem;
    }

    .summary-card .icon[b-mt2u4f050k] {
        width: 48px;
        height: 48px;
        font-size: 1.25rem;
    }

    .summary-card .value[b-mt2u4f050k] {
        font-size: 1.5rem;
    }

    .modal-dialog[b-mt2u4f050k] {
        max-width: 95%;
        margin: 1rem auto;
    }
}

@media (max-width: 576px) {
    .page-header[b-mt2u4f050k] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-mt2u4f050k] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Inventory/CategoryManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-ogwj9t47wf] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-ogwj9t47wf] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-ogwj9t47wf] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-ogwj9t47wf] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-ogwj9t47wf]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-ogwj9t47wf] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-ogwj9t47wf] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-ogwj9t47wf] {
    color: #6c757d;
}

.add-new-btn[b-ogwj9t47wf] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px color-mix(in srgb, var(--secondary-color) 30%, transparent);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-ogwj9t47wf] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px color-mix(in srgb, var(--secondary-color) 40%, transparent);
    color: var(--primary-color);
}

/* ==================== SUMMARY CARDS ==================== */
.summary-card[b-ogwj9t47wf] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    display: flex;
    align-items: center;
    gap: 1rem;
    transition: transform 0.2s, box-shadow 0.2s;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.summary-card:hover[b-ogwj9t47wf] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.summary-card .icon[b-ogwj9t47wf] {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}

.summary-card .details[b-ogwj9t47wf] {
    flex: 1;
}

.summary-card .title[b-ogwj9t47wf] {
    font-size: 0.875rem;
    color: #6c757d;
    margin-bottom: 0.25rem;
}

.summary-card .value[b-ogwj9t47wf] {
    font-size: 1.75rem;
    font-weight: 600;
    color: var(--primary-color);
}

.bg-primary-light[b-ogwj9t47wf] {
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
}

.bg-success-light[b-ogwj9t47wf] {
    background: rgba(25, 135, 84, 0.1);
}

.bg-info-light[b-ogwj9t47wf] {
    background: rgba(13, 202, 240, 0.1);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-ogwj9t47wf] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-ogwj9t47wf] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-ogwj9t47wf] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-ogwj9t47wf] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-ogwj9t47wf] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.search-box[b-ogwj9t47wf] {
    position: relative;
    width: 100%;
}

.search-box i[b-ogwj9t47wf] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box input[b-ogwj9t47wf] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-ogwj9t47wf] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--secondary-color) 15%, transparent);
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-ogwj9t47wf] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-ogwj9t47wf] {
    color: var(--secondary-color);
}

.form-control-custom[b-ogwj9t47wf],
.form-select-custom[b-ogwj9t47wf] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-ogwj9t47wf],
.form-select-custom:focus[b-ogwj9t47wf] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--secondary-color) 15%, transparent);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-ogwj9t47wf] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-ogwj9t47wf] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-ogwj9t47wf] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px color-mix(in srgb, var(--secondary-color) 40%, transparent);
    color: var(--primary-color);
}

.btn-secondary[b-ogwj9t47wf] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-ogwj9t47wf] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn:disabled[b-ogwj9t47wf] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== TABLE STYLES ==================== */
.categories-table-container[b-ogwj9t47wf] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.categories-table[b-ogwj9t47wf] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.categories-table thead[b-ogwj9t47wf] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.categories-table thead tr th[b-ogwj9t47wf] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.categories-table thead th:first-child[b-ogwj9t47wf] {
    border-top-left-radius: 12px;
}

.categories-table thead th:last-child[b-ogwj9t47wf] {
    border-top-right-radius: 12px;
}

.categories-table tbody tr[b-ogwj9t47wf] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.categories-table tbody tr:hover[b-ogwj9t47wf] {
    background-color: #f8f9fa;
}

.categories-table tbody td[b-ogwj9t47wf] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.product-code[b-ogwj9t47wf] {
    font-weight: 600;
    color: var(--primary-color);
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-ogwj9t47wf] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-ogwj9t47wf] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

.btn-action-icon:hover[b-ogwj9t47wf] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

/* ==================== STATUS BADGE ==================== */
.badge[b-ogwj9t47wf] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge.bg-success[b-ogwj9t47wf] {
    background-color: #28a745 !important;
}

.badge.bg-secondary[b-ogwj9t47wf] {
    background-color: #6c757d !important;
}

/* ==================== SUMMARY SECTION ==================== */
.table-summary[b-ogwj9t47wf] {
    display: flex;
    gap: 2rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    flex-wrap: wrap;
    margin-top: 1rem;
}

.summary-item[b-ogwj9t47wf] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.95rem;
    color: #495057;
}

.summary-item i[b-ogwj9t47wf] {
    font-size: 1.2rem;
}

.summary-item strong[b-ogwj9t47wf] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
}

/* ==================== ALERTS ==================== */
.alert[b-ogwj9t47wf] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-ogwj9t47wf] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-ogwj9t47wf] {
    color: var(--secondary-color);
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-ogwj9t47wf] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-ogwj9t47wf] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-ogwj9t47wf] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-ogwj9t47wf] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== FORM ENHANCEMENTS ==================== */
.form-check-input:checked[b-ogwj9t47wf] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.form-check-input:focus[b-ogwj9t47wf] {
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--secondary-color) 15%, transparent);
}

.form-check-label strong[b-ogwj9t47wf] {
    color: var(--primary-color);
}

/* ==================== TOAST ==================== */
.toast-container[b-ogwj9t47wf] {
    z-index: 1055;
}

.toast[b-ogwj9t47wf] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 992px) {
    .action-buttons[b-ogwj9t47wf] {
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .page-title[b-ogwj9t47wf] {
        font-size: 1.5rem;
    }

    .content-card[b-ogwj9t47wf] {
        padding: 1.5rem;
    }

    .filter-section[b-ogwj9t47wf] {
        padding: 0.75rem;
    }

    .categories-table thead th[b-ogwj9t47wf],
    .categories-table tbody td[b-ogwj9t47wf] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .table-summary[b-ogwj9t47wf] {
        flex-direction: column;
        gap: 1rem;
    }

    .summary-card[b-ogwj9t47wf] {
        padding: 1rem;
    }

    .summary-card .icon[b-ogwj9t47wf] {
        width: 48px;
        height: 48px;
        font-size: 1.25rem;
    }

    .summary-card .value[b-ogwj9t47wf] {
        font-size: 1.5rem;
    }

    .modal-dialog[b-ogwj9t47wf] {
        max-width: 95%;
        margin: 1rem auto;
    }
}

@media (max-width: 576px) {
    .page-header[b-ogwj9t47wf] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-ogwj9t47wf] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Inventory/EditProduct.razor.rz.scp.css */
/* Edit Product Page - Page-level styles */

.page-header[b-aem61gsirt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-aem61gsirt] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-aem61gsirt] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-aem61gsirt] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-aem61gsirt]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-aem61gsirt] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-aem61gsirt] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-aem61gsirt] {
    color: #6c757d;
}

@media (max-width: 768px) {
    .page-header[b-aem61gsirt] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .page-title[b-aem61gsirt] {
        font-size: 1.5rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Inventory/InventoryDocumentForm.razor.rz.scp.css */
/* ==================== PAGE HEADER ==================== */
.page-header[b-bzvglawb4j] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-bzvglawb4j] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-bzvglawb4j] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-bzvglawb4j] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-bzvglawb4j]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-bzvglawb4j] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-bzvglawb4j] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-bzvglawb4j] {
    color: #6c757d;
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-bzvglawb4j] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-bzvglawb4j] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-bzvglawb4j] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-bzvglawb4j] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-bzvglawb4j] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-bzvglawb4j] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.form-control-custom[b-bzvglawb4j],
.form-select-custom[b-bzvglawb4j] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-bzvglawb4j],
.form-select-custom:focus[b-bzvglawb4j] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.form-control-custom[readonly][b-bzvglawb4j] {
    background-color: #f8f9fa;
    color: #6c757d;
}

/* ==================== ALERTS ==================== */
.alert[b-bzvglawb4j] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.alert-info[b-bzvglawb4j] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-bzvglawb4j] {
    color: var(--secondary-color);
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: 1px;
}

.alert-danger[b-bzvglawb4j] {
    background: #fff5f5;
    border: 1px solid #f5c2c7;
    color: #842029;
}

.alert-danger i[b-bzvglawb4j] {
    color: #dc3545;
    flex-shrink: 0;
    margin-top: 2px;
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-bzvglawb4j] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-bzvglawb4j] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-bzvglawb4j] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-bzvglawb4j] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-bzvglawb4j] {
    background-color: #5c636a;
    transform: translateY(-2px);
    color: white;
}

.btn:disabled[b-bzvglawb4j] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

/* ==================== ITEMS SECTION ==================== */
.items-section[b-bzvglawb4j] {
    margin-top: 0.5rem;
}

.items-toolbar[b-bzvglawb4j] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #dee2e6;
}

.section-title[b-bzvglawb4j] {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 700;
}

.items-count-badge[b-bzvglawb4j] {
    background: var(--primary-color);
    color: white;
    padding: 0.2rem 0.65rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
}

.btn-add-item[b-bzvglawb4j] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.5rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.9rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(212, 175, 55, 0.3);
}

.btn-add-item:hover[b-bzvglawb4j] {
    transform: translateY(-2px);
    box-shadow: 0 4px 14px rgba(212, 175, 55, 0.45);
    color: var(--primary-color);
}

/* ==================== ITEMS TABLE ==================== */
.items-table-container[b-bzvglawb4j] {
    /* overflow: visible so the product dropdown panel can float outside the table */
    overflow: visible;
    border-radius: 12px 12px 0 0;
    border: 1px solid #e9ecef;
    border-bottom: none;
}

.items-table[b-bzvglawb4j] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.items-table thead[b-bzvglawb4j] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.items-table thead th[b-bzvglawb4j] {
    padding: 0.875rem 0.65rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.85rem;
}

.items-table thead th:first-child[b-bzvglawb4j] {
    border-top-left-radius: 12px;
}

.items-table thead th:last-child[b-bzvglawb4j] {
    border-top-right-radius: 12px;
}

.items-table tbody tr[b-bzvglawb4j] {
    border-bottom: 1px solid #e9ecef;
    transition: background 0.2s ease;
}

.items-table tbody tr:hover[b-bzvglawb4j],
.items-table tbody tr.row-dropdown-open[b-bzvglawb4j] {
    background-color: #f8f9fa;
}

.items-table tbody td[b-bzvglawb4j] {
    padding: 0.45rem 0.5rem;
    vertical-align: middle;
    font-size: 0.875rem;
    color: #495057;
}

/* ==================== PRODUCT AUTOCOMPLETE ==================== */
.product-cell[b-bzvglawb4j] {
    min-width: 240px;
    position: relative;
}

.product-autocomplete[b-bzvglawb4j] {
    position: relative;
}

.product-input-wrapper[b-bzvglawb4j] {
    display: flex;
    align-items: center;
    border: 1.5px solid #dee2e6;
    border-radius: 8px;
    background: white;
    padding: 0 0.5rem;
    gap: 0.35rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    cursor: text;
}

.product-autocomplete.is-open .product-input-wrapper[b-bzvglawb4j] {
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.15rem rgba(212, 175, 55, 0.2);
    border-radius: 8px 8px 0 0;
}

.product-search-icon[b-bzvglawb4j] {
    color: #adb5bd;
    font-size: 0.8rem;
    flex-shrink: 0;
}

.product-autocomplete.is-open .product-search-icon[b-bzvglawb4j] {
    color: var(--secondary-color);
}

.product-search-input[b-bzvglawb4j] {
    flex: 1;
    border: none;
    outline: none;
    padding: 0.3rem 0.1rem;
    font-size: 0.85rem;
    background: transparent;
    color: #212529;
    min-width: 0;
}

.product-search-input[b-bzvglawb4j]::placeholder {
    color: #adb5bd;
    font-style: italic;
}

.product-search-input:disabled[b-bzvglawb4j] {
    background: transparent;
    cursor: not-allowed;
}

.product-chevron[b-bzvglawb4j] {
    color: #adb5bd;
    font-size: 0.7rem;
    flex-shrink: 0;
    transition: transform 0.2s ease, color 0.2s ease;
}

.product-chevron.rotated[b-bzvglawb4j] {
    transform: rotate(180deg);
    color: var(--secondary-color);
}

/* Dropdown panel */
.product-dropdown-panel[b-bzvglawb4j] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 1.5px solid var(--secondary-color);
    border-top: none;
    border-radius: 0 0 10px 10px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    z-index: 200;
    max-height: 280px;
    overflow-y: auto;
}

.product-drop-item[b-bzvglawb4j] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 0.75rem;
    cursor: pointer;
    transition: background 0.15s ease;
    border-bottom: 1px solid #f1f3f5;
}

.product-drop-item:last-child[b-bzvglawb4j] {
    border-bottom: none;
}

.product-drop-item:hover[b-bzvglawb4j] {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.08) 0%, rgba(212, 175, 55, 0.04) 100%);
}

.product-drop-item.is-selected[b-bzvglawb4j] {
    background: rgba(212, 175, 55, 0.12);
}

.product-drop-item.is-highlighted[b-bzvglawb4j] {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.18) 0%, rgba(212, 175, 55, 0.08) 100%);
    border-left: 3px solid var(--secondary-color);
}

.product-drop-item.is-highlighted .product-drop-thumb[b-bzvglawb4j] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
}

.product-drop-thumb[b-bzvglawb4j] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.15) 0%, rgba(212, 175, 55, 0.08) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--secondary-color);
    font-size: 1rem;
}

.product-drop-item.is-selected .product-drop-thumb[b-bzvglawb4j] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
}

.product-drop-info[b-bzvglawb4j] {
    flex: 1;
    min-width: 0;
}

.product-drop-title[b-bzvglawb4j] {
    display: flex;
    align-items: baseline;
    gap: 0.2rem;
    flex-wrap: wrap;
    line-height: 1.3;
}

.product-drop-code[b-bzvglawb4j] {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 0.82rem;
    white-space: nowrap;
}

.product-drop-sep[b-bzvglawb4j] {
    color: #adb5bd;
    font-size: 0.82rem;
}

.product-drop-name[b-bzvglawb4j] {
    font-weight: 600;
    color: #212529;
    font-size: 0.85rem;
}

.product-drop-unit-tag[b-bzvglawb4j] {
    background: rgba(212, 175, 55, 0.15);
    color: var(--primary-color);
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-left: 0.2rem;
    white-space: nowrap;
}

.product-drop-sub[b-bzvglawb4j] {
    font-size: 0.75rem;
    color: #6c757d;
    margin-top: 0.15rem;
}

.product-drop-item.is-selected .product-drop-sub[b-bzvglawb4j] {
    color: var(--primary-color);
    opacity: 0.7;
}

.product-drop-empty[b-bzvglawb4j] {
    padding: 1rem 0.75rem;
    text-align: center;
    color: #6c757d;
    font-size: 0.85rem;
    font-style: italic;
}

.product-drop-img[b-bzvglawb4j] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
    display: block;
}

.product-drop-hint[b-bzvglawb4j] {
    padding: 0.4rem 0.75rem;
    background: #f8f9fa;
    border-top: 1px solid #e9ecef;
    font-size: 0.72rem;
    color: #adb5bd;
    text-align: center;
}

.product-drop-hint kbd[b-bzvglawb4j] {
    display: inline-block;
    padding: 0.1rem 0.3rem;
    font-size: 0.68rem;
    background: white;
    border: 1px solid #dee2e6;
    border-radius: 3px;
    box-shadow: 0 1px 0 rgba(0,0,0,0.1);
    color: #495057;
    font-family: monospace;
}

/* ==================== TABLE FORM CONTROLS ==================== */
.form-control-table[b-bzvglawb4j],
.form-select-table[b-bzvglawb4j] {
    border: 1.5px solid #dee2e6;
    border-radius: 6px;
    padding: 0.3rem 0.5rem;
    font-size: 0.85rem;
    width: 100%;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    background-color: white;
}

.form-control-table:focus[b-bzvglawb4j],
.form-select-table:focus[b-bzvglawb4j] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.15rem rgba(212, 175, 55, 0.2);
}

.form-control-table:disabled[b-bzvglawb4j],
.form-select-table:disabled[b-bzvglawb4j] {
    background-color: #f8f9fa;
    color: #6c757d;
    cursor: not-allowed;
}

.line-no[b-bzvglawb4j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    background: var(--primary-color);
    color: white;
    border-radius: 50%;
    font-size: 0.72rem;
    font-weight: 700;
}

.conv-factor[b-bzvglawb4j],
.qty-base[b-bzvglawb4j] {
    font-size: 0.8rem;
    color: #6c757d;
    font-weight: 500;
}

.line-total[b-bzvglawb4j] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 0.875rem;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-bzvglawb4j] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
}

.btn-action-icon[b-bzvglawb4j] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 0.85rem;
    cursor: pointer;
    padding: 0;
    flex-shrink: 0;
}

.btn-action-icon:hover[b-bzvglawb4j] {
    transform: scale(1.1);
}

.btn-action-icon.btn-delete:hover[b-bzvglawb4j] {
    background: #dc3545;
    color: white;
}

/* ==================== ITEMS TOTAL BAR ==================== */
.items-total-bar[b-bzvglawb4j] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 1.25rem;
    padding: 0.875rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    border: 1px solid #e9ecef;
    border-top: 2px solid #dee2e6;
    margin-bottom: 1.5rem;
}

.total-label[b-bzvglawb4j] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 600;
}

.total-amount[b-bzvglawb4j] {
    color: var(--primary-color);
    font-size: 1.1rem;
    font-weight: 700;
    min-width: 110px;
    text-align: right;
}

/* ==================== FORM ACTIONS ==================== */
.form-actions[b-bzvglawb4j] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding-top: 1.5rem;
    margin-top: 0.5rem;
    border-top: 1px solid #dee2e6;
}

/* ==================== RESPONSIVE ==================== */
@media (max-width: 768px) {
    .page-header[b-bzvglawb4j] {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }

    .page-title[b-bzvglawb4j] {
        font-size: 1.5rem;
    }

    .content-card[b-bzvglawb4j] {
        padding: 1.25rem;
    }

    .items-toolbar[b-bzvglawb4j] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    .btn-add-item[b-bzvglawb4j] {
        width: 100%;
        justify-content: center;
    }

    .items-table-container[b-bzvglawb4j] {
        overflow-x: auto;
    }

    .items-table thead th[b-bzvglawb4j],
    .items-table tbody td[b-bzvglawb4j] {
        font-size: 0.8rem;
        padding: 0.35rem 0.3rem;
    }

    .product-dropdown-panel[b-bzvglawb4j] {
        min-width: 280px;
    }

    .form-actions[b-bzvglawb4j] {
        flex-direction: column-reverse;
    }

    .form-actions .btn[b-bzvglawb4j] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Inventory/InventoryDocumentProcessing.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-bvs6ew9o24] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-bvs6ew9o24] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-bvs6ew9o24] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-bvs6ew9o24] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-bvs6ew9o24]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-bvs6ew9o24] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-bvs6ew9o24] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-bvs6ew9o24] {
    color: #6c757d;
}

.add-new-btn[b-bvs6ew9o24] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-bvs6ew9o24] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-bvs6ew9o24] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-bvs6ew9o24] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-bvs6ew9o24] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-bvs6ew9o24] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-bvs6ew9o24] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-bvs6ew9o24] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-bvs6ew9o24] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-bvs6ew9o24] {
    color: var(--secondary-color);
}

.form-control-custom[b-bvs6ew9o24],
.form-select-custom[b-bvs6ew9o24] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-bvs6ew9o24],
.form-select-custom:focus[b-bvs6ew9o24] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-bvs6ew9o24] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-bvs6ew9o24] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-bvs6ew9o24] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-bvs6ew9o24] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-bvs6ew9o24] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn-filter[b-bvs6ew9o24] {
    background-color: var(--primary-color);
    color: white;
    border: none;
}

.btn-filter:hover[b-bvs6ew9o24] {
    background-color: var(--primary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    color: white;
}

.btn:disabled[b-bvs6ew9o24] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== TABLE STYLES ==================== */
.documents-table-container[b-bvs6ew9o24] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.documents-table[b-bvs6ew9o24] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.documents-table thead[b-bvs6ew9o24] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.documents-table thead tr th[b-bvs6ew9o24] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.documents-table thead th:first-child[b-bvs6ew9o24] {
    border-top-left-radius: 12px;
}

.documents-table thead th:last-child[b-bvs6ew9o24] {
    border-top-right-radius: 12px;
}

.documents-table tbody tr[b-bvs6ew9o24] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.documents-table tbody tr:hover[b-bvs6ew9o24] {
    background-color: #f8f9fa;
}

.documents-table tbody td[b-bvs6ew9o24] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.product-code[b-bvs6ew9o24] {
    font-weight: 600;
    color: var(--primary-color);
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-bvs6ew9o24] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-bvs6ew9o24] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

.btn-action-icon:hover[b-bvs6ew9o24] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

/* ==================== STATUS BADGE ==================== */
.badge[b-bvs6ew9o24] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge.bg-success[b-bvs6ew9o24] {
    background-color: #28a745 !important;
}

.badge.bg-warning[b-bvs6ew9o24] {
    background-color: #ffc107 !important;
}

.badge.bg-info[b-bvs6ew9o24] {
    background-color: #0dcaf0 !important;
}

.badge.bg-secondary[b-bvs6ew9o24] {
    background-color: #6c757d !important;
}

/* ==================== PAGINATION ==================== */
.pagination-section[b-bvs6ew9o24] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 0.5rem;
    flex-wrap: wrap;
    gap: 0.75rem;
    border-top: 1px solid #e9ecef;
    margin-top: 0.5rem;
}

.pagination-info[b-bvs6ew9o24] {
    font-size: 0.9rem;
    color: #6c757d;
}

.pagination-controls[b-bvs6ew9o24] {
    display: flex;
    gap: 0.25rem;
    align-items: center;
}

.btn-page[b-bvs6ew9o24] {
    min-width: 36px;
    height: 36px;
    padding: 0 0.5rem;
    border: 1px solid #dee2e6;
    background: white;
    color: var(--primary-color);
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-page:hover:not(:disabled)[b-bvs6ew9o24] {
    background: var(--primary-color);
    color: white;
    border-color: var(--primary-color);
}

.btn-page.active[b-bvs6ew9o24] {
    background: var(--primary-color);
    color: white;
    border-color: var(--primary-color);
}

.btn-page:disabled[b-bvs6ew9o24] {
    opacity: 0.4;
    cursor: not-allowed;
}

/* ==================== SUMMARY SECTION ==================== */
.table-summary[b-bvs6ew9o24] {
    display: flex;
    gap: 2rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    flex-wrap: wrap;
    margin-top: 1rem;
}

.summary-item[b-bvs6ew9o24] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.95rem;
    color: #495057;
}

.summary-item i[b-bvs6ew9o24] {
    font-size: 1.2rem;
}

.summary-item strong[b-bvs6ew9o24] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
}

/* ==================== ALERTS ==================== */
.alert[b-bvs6ew9o24] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-bvs6ew9o24] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-bvs6ew9o24] {
    color: var(--secondary-color);
}

/* ==================== TOAST ==================== */
.toast[b-bvs6ew9o24] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* ==================== PRINT FILTER MODAL ==================== */
.print-modal-backdrop[b-bvs6ew9o24] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 1040;
}

.print-modal[b-bvs6ew9o24] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1050;
    background: white;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.25);
    width: min(560px, 95vw);
    display: flex;
    flex-direction: column;
    max-height: 90vh;
    overflow: hidden;
}

.print-modal-header[b-bvs6ew9o24] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    border-bottom: 2px solid #dee2e6;
    background: white;
}

.print-modal-title[b-bvs6ew9o24] {
    color: var(--primary-color);
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.print-modal-title i[b-bvs6ew9o24] {
    color: var(--secondary-color);
}

.btn-close-modal[b-bvs6ew9o24] {
    background: none;
    border: none;
    color: #6c757d;
    font-size: 1.1rem;
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

.btn-close-modal:hover[b-bvs6ew9o24] {
    background: #f1f3f5;
    color: var(--primary-color);
}

.print-modal-body[b-bvs6ew9o24] {
    padding: 1.5rem;
    overflow-y: auto;
}

.print-modal-footer[b-bvs6ew9o24] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #e9ecef;
    background: #f8f9fa;
    border-radius: 0 0 12px 12px;
}

.btn-print[b-bvs6ew9o24] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
}

.btn-print:hover:not(:disabled)[b-bvs6ew9o24] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    transform: translateY(-1px);
}

.btn-print:disabled[b-bvs6ew9o24] {
    opacity: 0.65;
    cursor: not-allowed;
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 992px) {
    .action-buttons[b-bvs6ew9o24] {
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .page-title[b-bvs6ew9o24] {
        font-size: 1.5rem;
    }

    .content-card[b-bvs6ew9o24] {
        padding: 1.5rem;
    }

    .filter-section[b-bvs6ew9o24] {
        padding: 0.75rem;
    }

    .documents-table thead th[b-bvs6ew9o24],
    .documents-table tbody td[b-bvs6ew9o24] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .table-summary[b-bvs6ew9o24] {
        flex-direction: column;
        gap: 1rem;
    }
}

@media (max-width: 576px) {
    .page-header[b-bvs6ew9o24] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-bvs6ew9o24] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Inventory/ProductForm.razor.rz.scp.css */
/* ==================== CONTENT CARD ==================== */
.content-card[b-iirl8bksf7] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-iirl8bksf7] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-iirl8bksf7] {
    color: var(--secondary-color);
}

.form-control-custom[b-iirl8bksf7],
.form-select-custom[b-iirl8bksf7] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-iirl8bksf7],
.form-select-custom:focus[b-iirl8bksf7] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.image-preview-container[b-iirl8bksf7] {
    position: relative;
    display: inline-block;
}

.image-preview[b-iirl8bksf7] {
    max-width: 300px;
    max-height: 300px;
    border: 2px solid #dee2e6;
    border-radius: 8px;
    object-fit: contain;
    display: block;
}

.btn-remove-image[b-iirl8bksf7] {
    position: absolute;
    top: 8px;
    right: 8px;
    padding: 4px 8px;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

    .btn-remove-image:hover[b-iirl8bksf7] {
        transform: scale(1.1);
    }
/* ==================== BUTTON STYLES ==================== */
.btn[b-iirl8bksf7] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-iirl8bksf7] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-iirl8bksf7] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-iirl8bksf7] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-iirl8bksf7] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn:disabled[b-iirl8bksf7] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== TABS ==================== */
.product-tabs[b-iirl8bksf7] {
    border-bottom: 2px solid #e9ecef;
    margin-bottom: 1.5rem;
}

.product-tabs .nav-item[b-iirl8bksf7] {
    margin-bottom: -2px;
}

.product-tabs .nav-link[b-iirl8bksf7] {
    border: 2px solid transparent;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    color: #6c757d;
    font-weight: 600;
    padding: 0.75rem 1.25rem;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.product-tabs .nav-link:hover[b-iirl8bksf7] {
    color: var(--primary-color);
    background-color: #f8f9fa;
    border-color: #e9ecef #e9ecef transparent;
}

.product-tabs .nav-link.active[b-iirl8bksf7] {
    color: var(--primary-color);
    background-color: white;
    border-color: var(--secondary-color) var(--secondary-color) white;
    border-bottom: 2px solid white;
}

.product-tabs .nav-link i[b-iirl8bksf7] {
    font-size: 1.1rem;
}

/* ==================== SECTION TITLES ==================== */
.section-title[b-iirl8bksf7] {
    color: var(--primary-color);
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #dee2e6;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.section-title i[b-iirl8bksf7] {
    color: var(--secondary-color);
}

/* ==================== CONVERSIONS TABLE ==================== */
.conversions-table-container[b-iirl8bksf7] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.conversions-table[b-iirl8bksf7] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.conversions-table thead[b-iirl8bksf7] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.conversions-table thead tr th[b-iirl8bksf7] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.conversions-table thead th:first-child[b-iirl8bksf7] {
    border-top-left-radius: 12px;
}

.conversions-table thead th:last-child[b-iirl8bksf7] {
    border-top-right-radius: 12px;
}

.conversions-table tbody tr[b-iirl8bksf7] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.conversions-table tbody tr:hover[b-iirl8bksf7] {
    background-color: #f8f9fa;
}

.conversions-table tbody td[b-iirl8bksf7] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-iirl8bksf7] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-iirl8bksf7] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

.btn-action-icon:hover[b-iirl8bksf7] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

/* ==================== STATUS BADGE ==================== */
.badge[b-iirl8bksf7] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge.bg-info[b-iirl8bksf7] {
    background-color: #0dcaf0 !important;
    color: white;
    text-decoration: none;
    cursor: pointer;
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    transition: all 0.3s ease;
}

.badge.bg-info:hover[b-iirl8bksf7] {
    background-color: #0bb5d6 !important;
    transform: scale(1.05);
}

.badge.bg-secondary[b-iirl8bksf7] {
    background-color: #6c757d !important;
}

.badge.bg-success[b-iirl8bksf7] {
    background-color: #28a745 !important;
}

/* ==================== ALERTS ==================== */
.alert[b-iirl8bksf7] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.alert-info[b-iirl8bksf7] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-iirl8bksf7] {
    color: var(--secondary-color);
}

/* ==================== FORM ENHANCEMENTS ==================== */
.form-check-input:checked[b-iirl8bksf7] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.form-check-input:focus[b-iirl8bksf7] {
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.form-check-label strong[b-iirl8bksf7] {
    color: var(--primary-color);
}

/* ==================== CARD FOOTER ==================== */
.card-footer[b-iirl8bksf7] {
    border-top: 2px solid #e9ecef;
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-iirl8bksf7] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-iirl8bksf7] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-iirl8bksf7] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-iirl8bksf7] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== TOAST ==================== */
.toast[b-iirl8bksf7] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* ==================== FORM HELPERS ==================== */
small.text-muted[b-iirl8bksf7] {
    display: block;
    margin-top: 0.25rem;
    font-size: 0.85rem;
}

[b-iirl8bksf7] .validation-message {
    color: #dc3545;
    font-size: 0.875rem;
    margin-top: 0.25rem;
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 992px) {
    .action-buttons[b-iirl8bksf7] {
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .content-card[b-iirl8bksf7] {
        padding: 1.5rem;
    }

    .product-tabs .nav-link[b-iirl8bksf7] {
        padding: 0.5rem 0.75rem;
        font-size: 0.85rem;
    }

    .conversions-table thead th[b-iirl8bksf7],
    .conversions-table tbody td[b-iirl8bksf7] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .modal-dialog[b-iirl8bksf7] {
        max-width: 95%;
        margin: 1rem auto;
    }
}

@media (max-width: 576px) {
    .btn[b-iirl8bksf7] {
        width: 100%;
        justify-content: center;
    }

    .card-footer .d-flex[b-iirl8bksf7] {
        flex-direction: column;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Inventory/ProductManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-6yxkwfzcs3] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-6yxkwfzcs3] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-6yxkwfzcs3] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-6yxkwfzcs3] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-6yxkwfzcs3]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-6yxkwfzcs3] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-6yxkwfzcs3] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-6yxkwfzcs3] {
    color: #6c757d;
}

.add-new-btn[b-6yxkwfzcs3] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px color-mix(in srgb, var(--secondary-color) 30%, transparent);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-6yxkwfzcs3] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px color-mix(in srgb, var(--secondary-color) 40%, transparent);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-6yxkwfzcs3] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-6yxkwfzcs3] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-6yxkwfzcs3] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-6yxkwfzcs3] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-6yxkwfzcs3] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-6yxkwfzcs3] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-6yxkwfzcs3] {
    color: var(--secondary-color);
}

.form-control-custom[b-6yxkwfzcs3],
.form-select-custom[b-6yxkwfzcs3] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-6yxkwfzcs3],
.form-select-custom:focus[b-6yxkwfzcs3] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--secondary-color) 15%, transparent);
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-6yxkwfzcs3] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.search-box[b-6yxkwfzcs3] {
    position: relative;
    width: 100%;
}

.search-box i[b-6yxkwfzcs3] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box input[b-6yxkwfzcs3] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-6yxkwfzcs3] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--secondary-color) 15%, transparent);
}

.search-box input:disabled[b-6yxkwfzcs3] {
    background-color: #e9ecef;
    cursor: not-allowed;
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-6yxkwfzcs3] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-6yxkwfzcs3] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-6yxkwfzcs3] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px color-mix(in srgb, var(--secondary-color) 40%, transparent);
    color: var(--primary-color);
}

.btn-secondary[b-6yxkwfzcs3] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-6yxkwfzcs3] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn:disabled[b-6yxkwfzcs3] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== TABLE STYLES ==================== */
.products-table-container[b-6yxkwfzcs3] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.products-table[b-6yxkwfzcs3] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.products-table thead[b-6yxkwfzcs3] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.products-table thead tr th[b-6yxkwfzcs3] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.products-table thead th:first-child[b-6yxkwfzcs3] {
    border-top-left-radius: 12px;
}

.products-table thead th:last-child[b-6yxkwfzcs3] {
    border-top-right-radius: 12px;
}

.products-table tbody tr[b-6yxkwfzcs3] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.products-table tbody tr:hover[b-6yxkwfzcs3] {
    background-color: #f8f9fa;
}

.products-table tbody td[b-6yxkwfzcs3] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.product-info[b-6yxkwfzcs3] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.product-code[b-6yxkwfzcs3] {
    font-weight: 600;
    color: var(--primary-color);
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-6yxkwfzcs3] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-6yxkwfzcs3] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

.btn-action-icon:hover[b-6yxkwfzcs3] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

/* ==================== STATUS BADGE ==================== */
.badge[b-6yxkwfzcs3] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge.bg-success[b-6yxkwfzcs3] {
    background-color: #28a745 !important;
}

.badge.bg-warning[b-6yxkwfzcs3] {
    background-color: #ffc107 !important;
}

.badge.bg-info[b-6yxkwfzcs3] {
    background-color: #0dcaf0 !important;
    color: white;
    text-decoration: none;
    cursor: pointer;
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    transition: all 0.3s ease;
}

.badge.bg-info:hover[b-6yxkwfzcs3] {
    background-color: #0bb5d6 !important;
    transform: scale(1.05);
}

.badge.bg-secondary[b-6yxkwfzcs3] {
    background-color: #6c757d !important;
}

/* ==================== SUMMARY SECTION ==================== */
.table-summary[b-6yxkwfzcs3] {
    display: flex;
    gap: 2rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    flex-wrap: wrap;
    margin-top: 1rem;
}

.summary-item[b-6yxkwfzcs3] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.95rem;
    color: #495057;
}

.summary-item i[b-6yxkwfzcs3] {
    font-size: 1.2rem;
}

.summary-item strong[b-6yxkwfzcs3] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
}

/* ==================== ALERTS ==================== */
.alert[b-6yxkwfzcs3] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-6yxkwfzcs3] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-6yxkwfzcs3] {
    color: var(--secondary-color);
}

.alert-info a[b-6yxkwfzcs3] {
    color: var(--primary-color);
    font-weight: 600;
    text-decoration: underline;
}

.alert-info a:hover[b-6yxkwfzcs3] {
    color: var(--secondary-color);
}

.alert-warning[b-6yxkwfzcs3] {
    background-color: #fff3cd;
    border-color: #ffeaa7;
    color: #856404;
}

/* ==================== MODAL STYLES ==================== */
.modal-xl[b-6yxkwfzcs3] {
    max-width: 1200px;
}

.modal-content[b-6yxkwfzcs3] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-6yxkwfzcs3] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-6yxkwfzcs3] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-6yxkwfzcs3] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== PRODUCT TABS ==================== */
.product-tabs[b-6yxkwfzcs3] {
    border-bottom: 2px solid #e9ecef;
    margin-bottom: 1.5rem;
}

.product-tabs .nav-item[b-6yxkwfzcs3] {
    margin-bottom: -2px;
}

.product-tabs .nav-link[b-6yxkwfzcs3] {
    border: 2px solid transparent;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    color: #6c757d;
    font-weight: 600;
    padding: 0.75rem 1.25rem;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.product-tabs .nav-link:hover[b-6yxkwfzcs3] {
    color: var(--primary-color);
    background-color: #f8f9fa;
    border-color: #e9ecef #e9ecef transparent;
}

.product-tabs .nav-link.active[b-6yxkwfzcs3] {
    color: var(--primary-color);
    background-color: white;
    border-color: var(--secondary-color) var(--secondary-color) white;
    border-bottom: 2px solid white;
}

.product-tabs .nav-link i[b-6yxkwfzcs3] {
    font-size: 1.1rem;
}

/* ==================== SECTION TITLES ==================== */
.section-title[b-6yxkwfzcs3] {
    color: var(--primary-color);
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #dee2e6;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.section-title i[b-6yxkwfzcs3] {
    color: var(--secondary-color);
}

/* ==================== FORM ENHANCEMENTS ==================== */
.form-check-input:checked[b-6yxkwfzcs3] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.form-check-input:focus[b-6yxkwfzcs3] {
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--secondary-color) 15%, transparent);
}

.form-check-label strong[b-6yxkwfzcs3] {
    color: var(--primary-color);
}

/* ==================== TOAST ==================== */
.toast[b-6yxkwfzcs3] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 992px) {
    .action-buttons[b-6yxkwfzcs3] {
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .page-title[b-6yxkwfzcs3] {
        font-size: 1.5rem;
    }

    .content-card[b-6yxkwfzcs3] {
        padding: 1.5rem;
    }

    .filter-section[b-6yxkwfzcs3] {
        padding: 0.75rem;
    }

    .products-table thead th[b-6yxkwfzcs3],
    .products-table tbody td[b-6yxkwfzcs3] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .table-summary[b-6yxkwfzcs3] {
        flex-direction: column;
        gap: 1rem;
    }

    .product-tabs .nav-link[b-6yxkwfzcs3] {
        padding: 0.5rem 0.75rem;
        font-size: 0.85rem;
    }
}

@media (max-width: 576px) {
    .page-header[b-6yxkwfzcs3] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-6yxkwfzcs3] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Inventory/StockLevels.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-ya42y0pw8e] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-ya42y0pw8e] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-ya42y0pw8e] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-ya42y0pw8e] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-ya42y0pw8e]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-ya42y0pw8e] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-ya42y0pw8e] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-ya42y0pw8e] {
    color: #6c757d;
}

.add-new-btn[b-ya42y0pw8e] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-ya42y0pw8e] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== STAT CARDS ==================== */
.stat-card[b-ya42y0pw8e] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    height: 100%;
}

.stat-card:hover[b-ya42y0pw8e] {
    transform: translateY(-4px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.stat-header[b-ya42y0pw8e] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.stat-header i[b-ya42y0pw8e] {
    font-size: 1.75rem;
}

.stat-label[b-ya42y0pw8e] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.stat-value[b-ya42y0pw8e] {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.stat-footer[b-ya42y0pw8e] {
    font-size: 0.85rem;
    color: #868e96;
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-ya42y0pw8e] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-ya42y0pw8e] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-ya42y0pw8e] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-ya42y0pw8e] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-ya42y0pw8e] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-ya42y0pw8e] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-ya42y0pw8e] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-ya42y0pw8e] {
    color: var(--secondary-color);
}

.form-control-custom[b-ya42y0pw8e],
.form-select-custom[b-ya42y0pw8e] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-ya42y0pw8e],
.form-select-custom:focus[b-ya42y0pw8e] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-ya42y0pw8e] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-ya42y0pw8e] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-ya42y0pw8e] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-ya42y0pw8e] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-ya42y0pw8e] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn-filter[b-ya42y0pw8e] {
    background-color: var(--primary-color);
    color: white;
    border: none;
}

.btn-filter:hover[b-ya42y0pw8e] {
    background-color: var(--primary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    color: white;
}

.btn:disabled[b-ya42y0pw8e] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== STOCK TABLE STYLES ==================== */
.stock-table-container[b-ya42y0pw8e] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.stock-table[b-ya42y0pw8e] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.stock-table thead[b-ya42y0pw8e] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.stock-table thead tr th[b-ya42y0pw8e] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.stock-table thead th:first-child[b-ya42y0pw8e] {
    border-top-left-radius: 12px;
}

.stock-table thead th:last-child[b-ya42y0pw8e] {
    border-top-right-radius: 12px;
}

.stock-table tbody tr[b-ya42y0pw8e] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.stock-table tbody tr:hover[b-ya42y0pw8e] {
    background-color: #f8f9fa;
}

.stock-table tbody td[b-ya42y0pw8e] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.product-code[b-ya42y0pw8e] {
    font-weight: 600;
    color: var(--primary-color);
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-ya42y0pw8e] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-ya42y0pw8e] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

.btn-action-icon:hover[b-ya42y0pw8e] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

/* ==================== STATUS BADGE ==================== */
.badge[b-ya42y0pw8e] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge.bg-success[b-ya42y0pw8e] {
    background-color: #28a745 !important;
}

.badge.bg-warning[b-ya42y0pw8e] {
    background-color: #ffc107 !important;
}

.badge.bg-info[b-ya42y0pw8e] {
    background-color: #0dcaf0 !important;
}

.badge.bg-secondary[b-ya42y0pw8e] {
    background-color: #6c757d !important;
}

.badge.bg-danger[b-ya42y0pw8e] {
    background-color: #dc3545 !important;
}

/* ==================== SUMMARY SECTION ==================== */
.table-summary[b-ya42y0pw8e] {
    display: flex;
    gap: 2rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    flex-wrap: wrap;
    margin-top: 1rem;
}

.summary-item[b-ya42y0pw8e] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.95rem;
    color: #495057;
}

.summary-item i[b-ya42y0pw8e] {
    font-size: 1.2rem;
}

.summary-item strong[b-ya42y0pw8e] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
}

/* ==================== ALERTS ==================== */
.alert[b-ya42y0pw8e] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-ya42y0pw8e] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-ya42y0pw8e] {
    color: var(--secondary-color);
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-ya42y0pw8e] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-ya42y0pw8e] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-ya42y0pw8e] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-ya42y0pw8e] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== TOAST ==================== */
.toast[b-ya42y0pw8e] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* ==================== LOW STOCK ALERTS ==================== */
.alert-card[b-ya42y0pw8e] {
    border-left: 4px solid #dc3545;
    background: linear-gradient(135deg, #fff5f5 0%, #ffffff 100%);
}

.alert-table-container[b-ya42y0pw8e] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
}

.alert-table[b-ya42y0pw8e] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.alert-table thead[b-ya42y0pw8e] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
}

.alert-table thead th[b-ya42y0pw8e] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    font-size: 0.9rem;
    border: none;
}

.alert-table thead th:first-child[b-ya42y0pw8e] {
    border-top-left-radius: 12px;
}

.alert-table thead th:last-child[b-ya42y0pw8e] {
    border-top-right-radius: 12px;
}

.alert-table tbody tr[b-ya42y0pw8e] {
    border-bottom: 1px solid #f1f3f5;
    transition: all 0.2s ease;
}

.alert-table tbody tr:hover[b-ya42y0pw8e] {
    background-color: #fff5f5;
}

.alert-table tbody td[b-ya42y0pw8e] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
}

/* Alert Row Classes */
.alert-row-critical[b-ya42y0pw8e] {
    background-color: #ffe5e5 !important;
    border-left: 4px solid #dc3545;
}

.alert-row-urgent[b-ya42y0pw8e] {
    background-color: #fff3e5 !important;
    border-left: 4px solid #ff6b6b;
}

.alert-row-high[b-ya42y0pw8e] {
    background-color: #fff9e5 !important;
    border-left: 4px solid #ffc107;
}

.alert-row-normal[b-ya42y0pw8e] {
    background-color: #e5f5ff !important;
    border-left: 4px solid #17a2b8;
}

/* Alert Summary */
.alert-summary[b-ya42y0pw8e] {
    display: flex;
    gap: 2rem;
    padding: 1.5rem;
    margin-top: 1rem;
    background: linear-gradient(135deg, #fff5f5 0%, #ffffff 100%);
    border-radius: 0 0 12px 12px;
    border: 1px solid #ffcccc;
}

.alert-summary-item[b-ya42y0pw8e] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 1rem;
}

.alert-summary-item i[b-ya42y0pw8e] {
    font-size: 1.75rem;
}

.alert-summary-item.urgent[b-ya42y0pw8e] {
    color: #dc3545;
}

.alert-summary-item.urgent i[b-ya42y0pw8e] {
    animation: pulse-b-ya42y0pw8e 2s ease-in-out infinite;
}

.alert-summary-item.high[b-ya42y0pw8e] {
    color: #ff6b6b;
}

.alert-summary-item.normal[b-ya42y0pw8e] {
    color: #17a2b8;
}

.alert-summary-item strong[b-ya42y0pw8e] {
    font-weight: 700;
    font-size: 1.1rem;
}

/* Pulse Animation for Urgent Alerts */
@keyframes pulse-b-ya42y0pw8e {
    0%, 100% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.1);
        opacity: 0.8;
    }
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 992px) {
    .action-buttons[b-ya42y0pw8e] {
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .page-title[b-ya42y0pw8e] {
        font-size: 1.5rem;
    }

    .content-card[b-ya42y0pw8e] {
        padding: 1.5rem;
    }

    .filter-section[b-ya42y0pw8e] {
        padding: 0.75rem;
    }

    .stock-table thead th[b-ya42y0pw8e],
    .stock-table tbody td[b-ya42y0pw8e] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .alert-table thead th[b-ya42y0pw8e],
    .alert-table tbody td[b-ya42y0pw8e] {
        padding: 0.5rem;
        font-size: 0.85rem;
    }

    .table-summary[b-ya42y0pw8e] {
        flex-direction: column;
        gap: 1rem;
    }

    .alert-summary[b-ya42y0pw8e] {
        flex-direction: column;
        gap: 1rem;
    }

    .stat-card[b-ya42y0pw8e] {
        padding: 1rem;
    }

    .stat-value[b-ya42y0pw8e] {
        font-size: 1.5rem;
    }

    .modal-dialog[b-ya42y0pw8e] {
        max-width: 95%;
        margin: 1rem auto;
    }
}

@media (max-width: 576px) {
    .page-header[b-ya42y0pw8e] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-ya42y0pw8e] {
        width: 100%;
        justify-content: center;
    }
}

/* ==================== PRINT REPORT ==================== */
.stock-print-backdrop[b-ya42y0pw8e] {
    background-color: rgba(0, 0, 0, 0.5);
}

.print-report-header[b-ya42y0pw8e] {
    border-bottom: 2px solid #dee2e6;
    padding-bottom: 0.75rem;
}

.stock-print-table th[b-ya42y0pw8e],
.stock-print-table td[b-ya42y0pw8e] {
    font-size: 0.8rem;
    padding: 0.35rem 0.5rem;
    vertical-align: middle;
}

/* _content/AccountingSystem.Web/Components/Pages/Inventory/UnitManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-f85ckw28p5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-f85ckw28p5] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-f85ckw28p5] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-f85ckw28p5] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-f85ckw28p5]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-f85ckw28p5] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-f85ckw28p5] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-f85ckw28p5] {
    color: #6c757d;
}

.add-new-btn[b-f85ckw28p5] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-f85ckw28p5] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== SUMMARY CARDS ==================== */
.summary-card[b-f85ckw28p5] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    display: flex;
    align-items: center;
    gap: 1rem;
    transition: transform 0.2s, box-shadow 0.2s;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.summary-card:hover[b-f85ckw28p5] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.summary-card .icon[b-f85ckw28p5] {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}

.summary-card .details[b-f85ckw28p5] {
    flex: 1;
}

.summary-card .title[b-f85ckw28p5] {
    font-size: 0.875rem;
    color: #6c757d;
    margin-bottom: 0.25rem;
}

.summary-card .value[b-f85ckw28p5] {
    font-size: 1.75rem;
    font-weight: 600;
    color: var(--primary-color);
}

.bg-primary-light[b-f85ckw28p5] {
    background: rgba(139, 0, 0, 0.1);
}

.bg-success-light[b-f85ckw28p5] {
    background: rgba(25, 135, 84, 0.1);
}

.bg-warning-light[b-f85ckw28p5] {
    background: rgba(255, 193, 7, 0.1);
}

.bg-info-light[b-f85ckw28p5] {
    background: rgba(13, 202, 240, 0.1);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-f85ckw28p5] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-f85ckw28p5] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-f85ckw28p5] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-f85ckw28p5] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-f85ckw28p5] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.search-box[b-f85ckw28p5] {
    position: relative;
    width: 100%;
}

.search-box i[b-f85ckw28p5] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box input[b-f85ckw28p5] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-f85ckw28p5] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-f85ckw28p5] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-f85ckw28p5] {
    color: var(--secondary-color);
}

.form-control-custom[b-f85ckw28p5],
.form-select-custom[b-f85ckw28p5] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-f85ckw28p5],
.form-select-custom:focus[b-f85ckw28p5] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-f85ckw28p5] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-f85ckw28p5] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-f85ckw28p5] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-f85ckw28p5] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-f85ckw28p5] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn:disabled[b-f85ckw28p5] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== TABLE STYLES ==================== */
.units-table-container[b-f85ckw28p5] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.units-table[b-f85ckw28p5] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.units-table thead[b-f85ckw28p5] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.units-table thead tr th[b-f85ckw28p5] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.units-table thead th:first-child[b-f85ckw28p5] {
    border-top-left-radius: 12px;
}

.units-table thead th:last-child[b-f85ckw28p5] {
    border-top-right-radius: 12px;
}

.units-table tbody tr[b-f85ckw28p5] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.units-table tbody tr:hover[b-f85ckw28p5] {
    background-color: #f8f9fa;
}

.units-table tbody td[b-f85ckw28p5] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.product-code[b-f85ckw28p5] {
    font-weight: 600;
    color: var(--primary-color);
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-f85ckw28p5] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-f85ckw28p5] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

.btn-action-icon:hover[b-f85ckw28p5] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

/* ==================== STATUS BADGE ==================== */
.badge[b-f85ckw28p5] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge.bg-success[b-f85ckw28p5] {
    background-color: #28a745 !important;
}

.badge.bg-warning[b-f85ckw28p5] {
    background-color: #ffc107 !important;
}

.badge.bg-info[b-f85ckw28p5] {
    background-color: #0dcaf0 !important;
}

.badge.bg-secondary[b-f85ckw28p5] {
    background-color: #6c757d !important;
}

/* ==================== SUMMARY SECTION ==================== */
.table-summary[b-f85ckw28p5] {
    display: flex;
    gap: 2rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    flex-wrap: wrap;
    margin-top: 1rem;
}

.summary-item[b-f85ckw28p5] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.95rem;
    color: #495057;
}

.summary-item i[b-f85ckw28p5] {
    font-size: 1.2rem;
}

.summary-item strong[b-f85ckw28p5] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
}

/* ==================== ALERTS ==================== */
.alert[b-f85ckw28p5] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-f85ckw28p5] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-f85ckw28p5] {
    color: var(--secondary-color);
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-f85ckw28p5] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-f85ckw28p5] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-f85ckw28p5] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-f85ckw28p5] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== SECTION TITLES ==================== */
.section-title[b-f85ckw28p5] {
    color: var(--primary-color);
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #dee2e6;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.section-title i[b-f85ckw28p5] {
    color: var(--secondary-color);
}

/* ==================== FORM ENHANCEMENTS ==================== */
.form-check-input:checked[b-f85ckw28p5] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.form-check-input:focus[b-f85ckw28p5] {
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.form-check-label strong[b-f85ckw28p5] {
    color: var(--primary-color);
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 992px) {
    .action-buttons[b-f85ckw28p5] {
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .page-title[b-f85ckw28p5] {
        font-size: 1.5rem;
    }

    .content-card[b-f85ckw28p5] {
        padding: 1.5rem;
    }

    .filter-section[b-f85ckw28p5] {
        padding: 0.75rem;
    }

    .units-table thead th[b-f85ckw28p5],
    .units-table tbody td[b-f85ckw28p5] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .table-summary[b-f85ckw28p5] {
        flex-direction: column;
        gap: 1rem;
    }

    .summary-card[b-f85ckw28p5] {
        padding: 1rem;
    }

    .summary-card .icon[b-f85ckw28p5] {
        width: 48px;
        height: 48px;
        font-size: 1.25rem;
    }

    .summary-card .value[b-f85ckw28p5] {
        font-size: 1.5rem;
    }

    .modal-dialog[b-f85ckw28p5] {
        max-width: 95%;
        margin: 1rem auto;
    }
}

@media (max-width: 576px) {
    .page-header[b-f85ckw28p5] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-f85ckw28p5] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Inventory/WarehouseManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-w5zfd8zb85] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-w5zfd8zb85] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-w5zfd8zb85] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-w5zfd8zb85] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-w5zfd8zb85]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-w5zfd8zb85] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-w5zfd8zb85] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-w5zfd8zb85] {
    color: #6c757d;
}

.add-new-btn[b-w5zfd8zb85] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-w5zfd8zb85] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== STAT CARDS ==================== */
.stat-card[b-w5zfd8zb85] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    height: 100%;
}

.stat-card:hover[b-w5zfd8zb85] {
    transform: translateY(-4px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.stat-header[b-w5zfd8zb85] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.stat-header i[b-w5zfd8zb85] {
    font-size: 1.75rem;
}

.stat-label[b-w5zfd8zb85] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.stat-value[b-w5zfd8zb85] {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.stat-footer[b-w5zfd8zb85] {
    font-size: 0.85rem;
    color: #868e96;
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-w5zfd8zb85] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-w5zfd8zb85] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-w5zfd8zb85] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-w5zfd8zb85] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-w5zfd8zb85] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-w5zfd8zb85] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.search-box[b-w5zfd8zb85] {
    position: relative;
    width: 100%;
}

.search-box i[b-w5zfd8zb85] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box input[b-w5zfd8zb85] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-w5zfd8zb85] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-w5zfd8zb85] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-w5zfd8zb85] {
    color: var(--secondary-color);
}

.form-control-custom[b-w5zfd8zb85],
.form-select-custom[b-w5zfd8zb85] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-w5zfd8zb85],
.form-select-custom:focus[b-w5zfd8zb85] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-w5zfd8zb85] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-w5zfd8zb85] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-w5zfd8zb85] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-w5zfd8zb85] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-w5zfd8zb85] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn:disabled[b-w5zfd8zb85] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== TABLE STYLES ==================== */
.warehouses-table-container[b-w5zfd8zb85] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.warehouses-table[b-w5zfd8zb85] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.warehouses-table thead[b-w5zfd8zb85] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.warehouses-table thead tr th[b-w5zfd8zb85] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.warehouses-table thead th:first-child[b-w5zfd8zb85] {
    border-top-left-radius: 12px;
}

.warehouses-table thead th:last-child[b-w5zfd8zb85] {
    border-top-right-radius: 12px;
}

.warehouses-table tbody tr[b-w5zfd8zb85] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.warehouses-table tbody tr:hover[b-w5zfd8zb85] {
    background-color: #f8f9fa;
}

.warehouses-table tbody td[b-w5zfd8zb85] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.warehouse-info[b-w5zfd8zb85] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.warehouse-code[b-w5zfd8zb85] {
    font-weight: 600;
    color: var(--primary-color);
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-w5zfd8zb85] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-w5zfd8zb85] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

.btn-action-icon:hover[b-w5zfd8zb85] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

/* ==================== STATUS BADGE ==================== */
.badge[b-w5zfd8zb85] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge.bg-success[b-w5zfd8zb85] {
    background-color: #28a745 !important;
}

.badge.bg-warning[b-w5zfd8zb85] {
    background-color: #ffc107 !important;
}

.badge.bg-info[b-w5zfd8zb85] {
    background-color: #0dcaf0 !important;
}

.badge.bg-secondary[b-w5zfd8zb85] {
    background-color: #6c757d !important;
}

/* ==================== SUMMARY SECTION ==================== */
.table-summary[b-w5zfd8zb85] {
    display: flex;
    gap: 2rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    flex-wrap: wrap;
    margin-top: 1rem;
}

.summary-item[b-w5zfd8zb85] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.95rem;
    color: #495057;
}

.summary-item i[b-w5zfd8zb85] {
    font-size: 1.2rem;
}

.summary-item strong[b-w5zfd8zb85] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
}

/* ==================== ALERTS ==================== */
.alert[b-w5zfd8zb85] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-w5zfd8zb85] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-w5zfd8zb85] {
    color: var(--secondary-color);
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-w5zfd8zb85] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-w5zfd8zb85] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-w5zfd8zb85] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-w5zfd8zb85] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== TOAST ==================== */
.toast[b-w5zfd8zb85] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 992px) {
    .action-buttons[b-w5zfd8zb85] {
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .page-title[b-w5zfd8zb85] {
        font-size: 1.5rem;
    }

    .content-card[b-w5zfd8zb85] {
        padding: 1.5rem;
    }

    .filter-section[b-w5zfd8zb85] {
        padding: 0.75rem;
    }

    .warehouses-table thead th[b-w5zfd8zb85],
    .warehouses-table tbody td[b-w5zfd8zb85] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .table-summary[b-w5zfd8zb85] {
        flex-direction: column;
        gap: 1rem;
    }

    .stat-card[b-w5zfd8zb85] {
        padding: 1rem;
    }

    .stat-value[b-w5zfd8zb85] {
        font-size: 1.5rem;
    }

    .modal-dialog[b-w5zfd8zb85] {
        max-width: 95%;
        margin: 1rem auto;
    }
}

@media (max-width: 576px) {
    .page-header[b-w5zfd8zb85] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-w5zfd8zb85] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/JournalVoucher/JournalVoucher.razor.rz.scp.css */
.journal-voucher-form[b-rye0j6qq9s] {
	max-width: 1200px;
}

.form-section[b-rye0j6qq9s] {
	background: #f8f9fa;
	border: 1px solid #e9ecef;
	border-radius: 8px;
	padding: 1.5rem;
	margin-bottom: 2rem;
}

.section-title[b-rye0j6qq9s] {
	color: var(--primary-color);
	font-weight: 700;
	margin-bottom: 1.5rem;
	font-size: 1.1rem;
	display: flex;
	align-items: center;
}

	.section-title i[b-rye0j6qq9s] {
		color: var(--secondary-color);
	}

/* Content Card */
.content-card[b-rye0j6qq9s] {
	background: white;
	border-radius: 12px;
	padding: 2rem;
	box-shadow: 0 2px 12px rgba(0,0,0,0.08);
	border: 1px solid rgba(0,0,0,0.05);
}

/* Card Header */
.card-header-custom[b-rye0j6qq9s] {
	padding-bottom: 1.5rem;
	margin-bottom: 1.5rem;
	border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-rye0j6qq9s] {
	color: var(--primary-color);
	font-size: 1.25rem;
	font-weight: 700;
	margin-bottom: 0.5rem;
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

	.card-title-custom i[b-rye0j6qq9s] {
		color: var(--secondary-color);
		font-size: 1.5rem;
	}

.card-subtitle-custom[b-rye0j6qq9s] {
	color: #6c757d;
	font-size: 0.9rem;
	margin: 0;
}

/* Form Controls */
.form-label[b-rye0j6qq9s] {
	color: #495057;
	font-weight: 600;
	font-size: 0.9rem;
	margin-bottom: 0.5rem;
	display: flex;
	align-items: center;
}

	.form-label i[b-rye0j6qq9s] {
		color: var(--secondary-color);
	}

.form-control-custom[b-rye0j6qq9s], .form-select-custom[b-rye0j6qq9s] {
	border: 2px solid #e9ecef;
	border-radius: 8px;
	padding: 0.65rem 1rem;
	font-size: 0.95rem;
	transition: all 0.3s ease;
}

.form-control-custom:focus[b-rye0j6qq9s], .form-select-custom:focus[b-rye0j6qq9s] {
	border-color: var(--secondary-color);
	box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* Action Buttons */
.action-buttons-container[b-rye0j6qq9s] {
	display: flex;
	gap: 1rem;
	justify-content: flex-end;
	margin-top: 2rem;
	padding-top: 2rem;
	border-top: 2px solid #f1f3f5;
}

.btn[b-rye0j6qq9s] {
	padding: 0.65rem 1.5rem;
	font-weight: 600;
	border-radius: 8px;
	transition: all 0.3s ease;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

.btn-primary[b-rye0j6qq9s] {
	background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
	color: var(--primary-color);
	border: none;
}

	.btn-primary:hover[b-rye0j6qq9s] {
		background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
		transform: translateY(-2px);
		box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
		color: var(--primary-color);
	}

.btn-secondary[b-rye0j6qq9s] {
	background-color: #6c757d;
	border: none;
}

	.btn-secondary:hover[b-rye0j6qq9s] {
		background-color: #5c636a;
		transform: translateY(-2px);
	}

.btn-warning[b-rye0j6qq9s] {
	background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
	color: #495057;
	border: none;
}

	.btn-warning:hover[b-rye0j6qq9s] {
		background: linear-gradient(135deg, #e0a800 0%, #ffc107 100%);
		transform: translateY(-2px);
		box-shadow: 0 4px 12px rgba(255, 193, 7, 0.4);
		color: #495057;
	}

.btn-info[b-rye0j6qq9s] {
	background: linear-gradient(135deg, #0dcaf0 0%, #0aa2c0 100%);
	color: white;
	border: none;
}

	.btn-info:hover[b-rye0j6qq9s] {
		background: linear-gradient(135deg, #0aa2c0 0%, #0dcaf0 100%);
		transform: translateY(-2px);
		box-shadow: 0 4px 12px rgba(13, 202, 240, 0.4);
		color: white;
	}

/* Page Header */
.page-header[b-rye0j6qq9s] {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 2rem;
	padding-bottom: 1.5rem;
	border-bottom: 3px solid var(--primary-color);
}

.page-title[b-rye0j6qq9s] {
	color: var(--primary-color);
	font-size: 2rem;
	font-weight: 700;
	margin: 0;
	display: flex;
	align-items: center;
	gap: 1rem;
}

	.page-title i[b-rye0j6qq9s] {
		color: var(--secondary-color);
		font-size: 2rem;
	}

.breadcrumb[b-rye0j6qq9s] {
	background: none;
	padding: 0;
	margin: 0.5rem 0 0 0;
	font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-rye0j6qq9s]::before {
	color: #6c757d;
}

.breadcrumb-item a[b-rye0j6qq9s] {
	color: var(--primary-color);
	text-decoration: none;
}

	.breadcrumb-item a:hover[b-rye0j6qq9s] {
		color: var(--secondary-color);
	}

.breadcrumb-item.active[b-rye0j6qq9s] {
	color: #6c757d;
}

/* Accounting Entries Styles */
.accounting-entries-container[b-rye0j6qq9s] {
	background: white;
	border: 2px solid #e9ecef;
	border-radius: 12px;
	padding: 1.25rem;
	height: 100%;
	transition: all 0.3s ease;
}

	.accounting-entries-container:hover[b-rye0j6qq9s] {
		border-color: var(--secondary-color);
		box-shadow: 0 2px 8px rgba(212, 175, 55, 0.1);
	}

.entries-header[b-rye0j6qq9s] {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1rem;
	padding-bottom: 0.75rem;
	border-bottom: 2px solid #f1f3f5;
}

.entries-title[b-rye0j6qq9s] {
	color: var(--primary-color);
	font-size: 1rem;
	font-weight: 700;
	margin: 0;
	display: flex;
	align-items: center;
}

	.entries-title i[b-rye0j6qq9s] {
		color: var(--secondary-color);
	}

.btn-add-entry[b-rye0j6qq9s] {
	background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
	color: var(--primary-color);
	border: none;
	padding: 0.4rem 0.8rem;
	font-size: 0.85rem;
	font-weight: 600;
	border-radius: 6px;
	transition: all 0.3s ease;
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
}

	.btn-add-entry:hover[b-rye0j6qq9s] {
		background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
		transform: translateY(-1px);
		box-shadow: 0 3px 8px rgba(212, 175, 55, 0.4);
		color: var(--primary-color);
	}

.entry-row[b-rye0j6qq9s] {
	margin-bottom: 0.75rem;
}

.entry-fields[b-rye0j6qq9s] {
	display: grid;
	grid-template-columns: 2fr 1fr auto;
	gap: 0.5rem;
	align-items: start;
}

.entry-account input[b-rye0j6qq9s],
.entry-amount input[b-rye0j6qq9s] {
	border: 1px solid #dee2e6;
	border-radius: 6px;
	padding: 0.5rem;
	font-size: 0.9rem;
	transition: all 0.3s ease;
}

	.entry-account input:focus[b-rye0j6qq9s],
	.entry-amount input:focus[b-rye0j6qq9s] {
		border-color: var(--secondary-color);
		box-shadow: 0 0 0 0.15rem rgba(212, 175, 55, 0.15);
		outline: none;
	}

.btn-remove-entry[b-rye0j6qq9s] {
	background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
	color: white;
	border: none;
	padding: 0.5rem 0.75rem;
	border-radius: 6px;
	transition: all 0.3s ease;
	font-size: 0.9rem;
}

	.btn-remove-entry:hover[b-rye0j6qq9s] {
		background: linear-gradient(135deg, #c82333 0%, #bd2130 100%);
		transform: scale(1.05);
		box-shadow: 0 2px 6px rgba(220, 53, 69, 0.4);
	}

.empty-entries-message[b-rye0j6qq9s] {
	text-align: center;
	padding: 2rem 1rem;
	color: #6c757d;
	font-size: 0.9rem;
	font-style: italic;
}

.entries-total[b-rye0j6qq9s] {
	margin-top: 1rem;
	padding-top: 1rem;
	border-top: 2px solid var(--primary-color);
	display: flex;
	justify-content: space-between;
	align-items: center;
}

	.entries-total .total-label[b-rye0j6qq9s] {
		font-weight: 700;
		color: #495057;
		font-size: 1rem;
	}

	.entries-total .total-value[b-rye0j6qq9s] {
		font-weight: 700;
		font-size: 1.15rem;
		color: var(--primary-color);
	}

/* Validation Summary */
.validation-summary[b-rye0j6qq9s] {
	background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
	border: 2px solid #dee2e6;
	border-radius: 12px;
	padding: 1.25rem;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 1rem;
	transition: all 0.3s ease;
}

	.validation-summary.balanced[b-rye0j6qq9s] {
		border-color: #28a745;
		background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
	}

	.validation-summary.unbalanced[b-rye0j6qq9s] {
		border-color: #dc3545;
		background: linear-gradient(135deg, #f8d7da 0%, #f5c6cb 100%);
	}

	.validation-summary.warning[b-rye0j6qq9s] {
		border-color: #ffc107;
		background: linear-gradient(135deg, #fff3cd 0%, #ffeaa7 100%);
	}

.validation-item[b-rye0j6qq9s] {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.validation-item.validation-status[b-rye0j6qq9s] {
	grid-column: 1 / -1;
	border-top: 2px solid rgba(0,0,0,0.1);
	padding-top: 1rem;
	margin-top: 0.5rem;
}

.validation-label[b-rye0j6qq9s] {
	font-weight: 600;
	color: #495057;
	font-size: 0.85rem;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.validation-value[b-rye0j6qq9s] {
	font-weight: 700;
	font-size: 1.1rem;
	color: var(--primary-color);
}


/* Section Divider */
.section-divider[b-rye0j6qq9s] {
	margin: 2rem 0 1.5rem;
	padding-top: 1.5rem;
	border-top: 2px dashed #dee2e6;
}

.section-title[b-rye0j6qq9s] {
	color: var(--primary-color);
	font-weight: 700;
	font-size: 1.1rem;
	display: flex;
	align-items: center;
}

	.section-title i[b-rye0j6qq9s] {
		color: var(--secondary-color);
	}

	.validation-item.validation-status .validation-value[b-rye0j6qq9s] {
		display: flex;
		align-items: center;
		gap: 0.5rem;
		font-size: 1rem;
	}
.signatures-section[b-rye0j6qq9s] {
	display: flex;
	justify-content: space-between;
	margin-top: 50px;
	gap: 20px;
}

.signature-box[b-rye0j6qq9s] {
	flex: 1;
	text-align: center;
}

.signature-label[b-rye0j6qq9s] {
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 40px;
	color: #000;
}

.signature-line[b-rye0j6qq9s] {
	/*border-bottom: 2px solid #000;*/
	margin: 0 10px 8px;
}

.signature-name[b-rye0j6qq9s] {
	font-size: 13px;
	color: #000;
}

.signature-subtitle[b-rye0j6qq9s] {
	font-size: 11px;
	font-style: italic;
	margin-top: 5px;
	color: #000;
}

/* Responsive Design */
@media (max-width: 768px) {
	.page-title[b-rye0j6qq9s] {
		font-size: 1.5rem;
	}

	.content-card[b-rye0j6qq9s] {
		padding: 1.5rem;
	}

	.action-buttons-container[b-rye0j6qq9s] {
		flex-direction: column;
	}

		.action-buttons-container .btn[b-rye0j6qq9s] {
			width: 100%;
		}

	.validation-summary[b-rye0j6qq9s] {
		grid-template-columns: 1fr;
	}

/* Mobile adjustments for accounting entries */
	.entry-fields[b-rye0j6qq9s] {
		grid-template-columns: 1fr;
		gap: 0.75rem;
	}

	.btn-remove-entry[b-rye0j6qq9s] {
		width: 100%;
	}

	.entries-header[b-rye0j6qq9s] {
		flex-direction: column;
		align-items: stretch;
		gap: 0.75rem;
	}

	.btn-add-entry[b-rye0j6qq9s] {
		width: 100%;
		justify-content: center;
	}
}
/* _content/AccountingSystem.Web/Components/Pages/JournalVoucher/JournalVoucherDashboard.razor.rz.scp.css */
/* Journal Voucher Dashboard Styles - Inherits from APDashboard.razor.css base */

/* ==================== DASHBOARD CARD STYLES ==================== */

.dashboard-card[b-0roaih77nw] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

    .dashboard-card:hover[b-0roaih77nw] {
   transform: translateY(-5px);
        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    }

.card-icon[b-0roaih77nw] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
  display: flex;
    align-items: center;
  justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-0roaih77nw] {
    color: #6c757d;
  font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-0roaih77nw] {
    color: #212529;
    font-size: 2rem;
 font-weight: 700;
    margin-bottom: 0.5rem;
}

.card-change[b-0roaih77nw] {
 font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
}

    .card-change.positive[b-0roaih77nw] {
        color: #2E7D32;
    }

    .card-change i[b-0roaih77nw] {
    margin-right: 0.25rem;
    }

/* ==================== CONTENT CARD & HEADER STYLES ==================== */

.content-card[b-0roaih77nw] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
    max-width: 100%;
  width: 100%;
box-sizing: border-box;
}

.card-header-custom[b-0roaih77nw] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-0roaih77nw] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-0roaih77nw] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-0roaih77nw] {
    color: #6c757d;
  font-size: 0.9rem;
    margin: 0;
}

/* ==================== PAGE HEADER & BREADCRUMB STYLES ==================== */

.page-header[b-0roaih77nw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-0roaih77nw] {
  color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-0roaih77nw] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-0roaih77nw] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-0roaih77nw]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-0roaih77nw] {
    color: var(--primary-color);
    text-decoration: none;
}

 .breadcrumb-item a:hover[b-0roaih77nw] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-0roaih77nw] {
    color: #6c757d;
}

.add-new-btn[b-0roaih77nw] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

    .add-new-btn:hover[b-0roaih77nw] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
  transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
 }

/* ==================== SEARCH & FILTER STYLES ==================== */

.filter-section[b-0roaih77nw] {
    margin-bottom: 1.5rem;
}

.filter-label[b-0roaih77nw] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
    margin-bottom: 0.25rem;
    display: block;
}

.search-box[b-0roaih77nw] {
    position: relative;
    width: 100%;
}

    .search-box input[b-0roaih77nw] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
    transition: all 0.3s ease;
 }

        .search-box input:focus[b-0roaih77nw] {
            outline: none;
     border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

 .search-box i[b-0roaih77nw] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.form-select-custom[b-0roaih77nw], .form-control-custom[b-0roaih77nw] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
 transition: all 0.3s ease;
}

    .form-select-custom:focus[b-0roaih77nw], .form-control-custom:focus[b-0roaih77nw] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* ==================== TABLE STYLES ==================== */

.checks-table[b-0roaih77nw] {
    width: 100%;
margin-top: 1rem;
}

    .checks-table thead[b-0roaih77nw] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .checks-table thead th[b-0roaih77nw] {
            color: white;
 font-weight: 600;
  padding: 1rem 0.75rem;
border: none;
            text-transform: uppercase;
            font-size: 0.8rem;
  letter-spacing: 0.5px;
            white-space: nowrap;
        }

    .checks-table tbody tr[b-0roaih77nw] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .checks-table tbody tr:hover[b-0roaih77nw] {
            background-color: #f8f5f0;
       box-shadow: inset 4px 0 0 var(--secondary-color), 0 2px 8px rgba(139, 0, 0, 0.1);
        transform: scale(1.01);
        }

            .checks-table tbody tr:hover td[b-0roaih77nw] {
      color: var(--primary-color);
           font-weight: 500;
            }

    .checks-table tbody td[b-0roaih77nw] {
     padding: 1rem 0.75rem;
        vertical-align: middle;
        font-size: 0.9rem;
    }

/* ==================== BUTTON STYLES ==================== */

.btn[b-0roaih77nw] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-filter[b-0roaih77nw] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-filter:hover[b-0roaih77nw] {
    background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
        transform: translateY(-2px);
   box-shadow: 0 6px 16px rgba(139, 0, 0, 0.4);
    }

    .btn-filter:active[b-0roaih77nw] {
  transform: translateY(0);
    }

.btn-reset[b-0roaih77nw] {
    background-color: #6c757d;
    color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-reset:hover[b-0roaih77nw] {
    background-color: #5c636a;
transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(108, 117, 125, 0.3);
    }

.btn-secondary[b-0roaih77nw] {
background-color: #6c757d;
    border: none;
    color: white;
}

    .btn-secondary:hover[b-0roaih77nw] {
   background-color: #5c636a;
        transform: translateY(-2px);
    }

.btn-primary-filter[b-0roaih77nw] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 700;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-primary-filter:hover[b-0roaih77nw] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

.btn-action-icon[b-0roaih77nw] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
  justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

    .btn-action-icon:hover[b-0roaih77nw] {
    background: var(--primary-color);
        color: white;
        transform: scale(1.1);
    }

.btn-expand[b-0roaih77nw] {
    background: none;
  border: none;
    padding: 0.5rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: all 0.3s ease;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .btn-expand:hover[b-0roaih77nw] {
        background: rgba(139, 0, 0, 0.1);
    }

    .btn-expand i[b-0roaih77nw] {
        transition: transform 0.3s ease;
     font-size: 1rem;
    }

    .btn-expand.expanded i[b-0roaih77nw] {
        transform: rotate(90deg);
    }

/* ==================== BADGE STYLES ==================== */

.badge[b-0roaih77nw] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-weight: 600;
font-size: 0.85rem;
    text-transform: capitalize;
}

.badge-project[b-0roaih77nw] {
  background: linear-gradient(135deg, #1976D2 0%, #42A5F5 100%);
    color: #fff;
}

.badge-non-project[b-0roaih77nw] {
    background: linear-gradient(135deg, #6A1B9A 0%, #AB47BC 100%);
    color: #fff;
}

.badge-info[b-0roaih77nw] {
    background: linear-gradient(135deg, #0dcaf0 0%, #0aa2c0 100%);
    color: #fff;
}

.badge-na[b-0roaih77nw] {
 background: #e9ecef;
    color: #6c757d;
}

/* ==================== CELL & TEXT STYLES ==================== */

.voucher-badge[b-0roaih77nw] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.85rem;
    display: inline-block;
    letter-spacing: 0.5px;
}

.amount-highlight[b-0roaih77nw] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
    background: linear-gradient(135deg, rgba(139, 0, 0, 0.05) 0%, rgba(212, 175, 55, 0.05) 100%);
 padding: 0.5rem 0.8rem;
    border-radius: 6px;
    display: inline-block;
}

.group-code[b-0roaih77nw] {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.1) 0%, rgba(139, 0, 0, 0.1) 100%);
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 600;
    color: var(--primary-color);
    font-size: 0.9rem;
}

.accountable-name[b-0roaih77nw] {
    color: #2c3e50;
    font-weight: 600;
}

.date-wrapper[b-0roaih77nw] {
    display: flex;
    align-items: center;
 font-size: 0.9rem;
}

/* ==================== FILTER & ACTIVE FILTER STYLES ==================== */

.filter-modal-label[b-0roaih77nw] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .filter-modal-label i[b-0roaih77nw] {
    color: var(--primary-color);
        font-size: 1.1rem;
    }

.active-filters[b-0roaih77nw] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    border-left: 4px solid var(--secondary-color);
}

.filter-tag[b-0roaih77nw] {
display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.75rem;
    background-color: white;
    border: 1px solid var(--secondary-color);
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--primary-color);
    transition: all 0.2s ease;
}

    .filter-tag:hover[b-0roaih77nw] {
      background-color: #fff8e6;
        box-shadow: 0 2px 6px rgba(212, 175, 55, 0.2);
  }

    .filter-tag i[b-0roaih77nw] {
cursor: pointer;
        font-size: 1rem;
        transition: transform 0.2s ease;
    }

        .filter-tag i:hover[b-0roaih77nw] {
     transform: scale(1.2);
          color: var(--primary-color);
        }

/* ==================== PAGINATION STYLES ==================== */

.pagination-wrapper[b-0roaih77nw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-0roaih77nw] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-0roaih77nw] {
    margin: 0;
}

.page-link[b-0roaih77nw] {
 color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

    .page-link:hover[b-0roaih77nw] {
      background-color: var(--secondary-color);
     color: var(--primary-color);
        border-color: var(--secondary-color);
    }

.page-item.active .page-link[b-0roaih77nw] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* ==================== MODAL STYLES ==================== */

.modal-content[b-0roaih77nw] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-0roaih77nw] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-0roaih77nw] {
     font-weight: 700;
        display: flex;
        align-items: center;
  gap: 0.75rem;
      color: white;
    }

  .modal-header .modal-title i[b-0roaih77nw] {
          color: var(--secondary-color);
   font-size: 1.5rem;
      }

    .modal-header .btn-close[b-0roaih77nw] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

     .modal-header .btn-close:hover[b-0roaih77nw] {
    opacity: 1;
      }

.modal-body[b-0roaih77nw] {
    padding: 2rem;
}

.modal-footer[b-0roaih77nw] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.modal-lg[b-0roaih77nw] {
    max-width: 900px;
}

/* ==================== EXPANDABLE ROW STYLES ==================== */

.expandable-row[b-0roaih77nw] {
    background: #f8f9fa;
    border-bottom: 2px solid var(--secondary-color);
}

    .expandable-row td[b-0roaih77nw] {
        padding: 0 !important;
    }

.expanded-content[b-0roaih77nw] {
    padding: 2rem;
    animation: slideDown-b-0roaih77nw 0.3s ease-out;
}

@keyframes slideDown-b-0roaih77nw {
    from {
   opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
     transform: translateY(0);
    }
}

.detail-section[b-0roaih77nw] {
    margin-bottom: 1.5rem;
}

    .detail-section:last-child[b-0roaih77nw] {
        margin-bottom: 0;
    }

.section-title[b-0roaih77nw] {
  color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--secondary-color);
    display: flex;
    align-items: center;
}

.detail-grid[b-0roaih77nw] {
  display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.detail-item[b-0roaih77nw] {
    background: white;
    padding: 1rem;
    border-radius: 8px;
  border: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

    .detail-item:hover[b-0roaih77nw] {
 border-color: var(--secondary-color);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.2);
    }

    .detail-item.full-width[b-0roaih77nw] {
        grid-column: 1 / -1;
    }

    .detail-item label[b-0roaih77nw] {
      display: flex;
      align-items: center;
        gap: 0.5rem;
        font-size: 0.85rem;
  color: #6c757d;
        font-weight: 600;
        margin-bottom: 0.5rem;
     text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .detail-item span[b-0roaih77nw] {
        color: #2c3e50;
        font-weight: 600;
        font-size: 0.95rem;
    }

.particulars-content[b-0roaih77nw] {
    background: white;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    color: #2c3e50;
    line-height: 1.6;
}

/* ==================== MOBILE CARD STYLES ==================== */

.check-card[b-0roaih77nw] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
 margin-bottom: 1rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    cursor: pointer;
    border: 2px solid transparent;
}

    .check-card:hover[b-0roaih77nw] {
     border-color: var(--secondary-color);
        box-shadow: 0 4px 16px rgba(212, 175, 55, 0.3);
        transform: translateY(-2px);
    }

.card-header-row[b-0roaih77nw] {
  display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.voucher-info[b-0roaih77nw] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.voucher-badge-mobile[b-0roaih77nw] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.85rem;
    display: inline-block;
    letter-spacing: 0.5px;
}

.date-mobile[b-0roaih77nw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #6c757d;
    font-size: 0.85rem;
}

.card-body-row[b-0roaih77nw] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

.info-group[b-0roaih77nw] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

    .info-group i[b-0roaih77nw] {
        color: var(--primary-color);
      font-size: 1.25rem;
 margin-top: 0.25rem;
 }

.info-content[b-0roaih77nw] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

  .info-content label[b-0roaih77nw] {
    font-size: 0.75rem;
        color: #6c757d;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .info-content span[b-0roaih77nw] {
      font-size: 0.9rem;
        color: #2c3e50;
        font-weight: 600;
    }

.amount-mobile[b-0roaih77nw] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
}

.card-divider[b-0roaih77nw] {
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, var(--secondary-color) 50%, transparent 100%);
    margin: 1rem 0;
}

.card-details-grid[b-0roaih77nw] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.detail-row[b-0roaih77nw] {
    display: flex;
    align-items: center;
 gap: 0.75rem;
    font-size: 0.85rem;
    color: #2c3e50;
}

    .detail-row i[b-0roaih77nw] {
        color: #6c757d;
        width: 20px;
     text-align: center;
    }

/* ==================== RESPONSIVE TABLE STYLES ==================== */

.desktop-view[b-0roaih77nw] {
    display: block;
}

.mobile-view[b-0roaih77nw] {
    display: none;
}

.checks-table-container[b-0roaih77nw] {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
  margin-bottom: 1rem;
    position: relative;
    max-width: 100%;
    box-sizing: border-box;
}

.checks-table-modern[b-0roaih77nw] {
    margin: 0;
    border-collapse: separate;
border-spacing: 0;
    width: 100%;
    min-width: 900px;
    table-layout: auto;
}

    .checks-table-modern thead[b-0roaih77nw] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
    }

        .checks-table-modern thead th[b-0roaih77nw] {
       padding: 1rem;
        font-weight: 600;
    font-size: 0.9rem;
   text-transform: uppercase;
      letter-spacing: 0.5px;
     border: none;
        }

    .checks-table-modern tbody .main-row[b-0roaih77nw] {
        background: white;
        transition: all 0.3s ease;
        border-bottom: 1px solid #e9ecef;
    }

        .checks-table-modern tbody .main-row:hover[b-0roaih77nw] {
            background: #f8f9fa;
         transform: translateX(2px);
            box-shadow: 0 2px 8px rgba(139, 0, 0, 0.1);
        }

        .checks-table-modern tbody .main-row td[b-0roaih77nw] {
            padding: 1rem;
            vertical-align: middle;
        cursor: pointer;
            white-space: nowrap;
        }

/* ==================== RESPONSIVE DESIGN ==================== */

@media (max-width: 992px) {
    .desktop-view[b-0roaih77nw] {
     display: none !important;
    }

    .mobile-view[b-0roaih77nw] {
        display: block !important;
    }
}

@media (max-width: 768px) {
    .content-card[b-0roaih77nw] {
        padding: 1.25rem;
        max-width: 100%;
     box-sizing: border-box;
    }

    .page-header[b-0roaih77nw] {
        flex-direction: column;
     align-items: flex-start;
        gap: 1rem;
        padding-bottom: 1rem;
        margin-bottom: 1.5rem;
    }

    .page-title[b-0roaih77nw] {
        font-size: 1.5rem;
    }

    .add-new-btn[b-0roaih77nw] {
    width: 100%;
justify-content: center;
    }

 .dashboard-card[b-0roaih77nw] {
        padding: 1.25rem;
 }

    .card-value[b-0roaih77nw] {
        font-size: 1.5rem;
    }

    .search-box input[b-0roaih77nw] {
        padding: 0.6rem 1rem 0.6rem 2.5rem;
        font-size: 0.9rem;
    }

    .btn-filter[b-0roaih77nw],
    .btn-reset[b-0roaih77nw],
    .btn-secondary[b-0roaih77nw] {
        padding: 0.6rem 1rem;
        font-size: 0.85rem;
    }

    .filter-tag[b-0roaih77nw] {
        font-size: 0.75rem;
        padding: 0.35rem 0.65rem;
    }

    .modal-lg[b-0roaih77nw] {
        max-width: 100%;
   margin: 0.5rem;
    }

    .form-select-custom[b-0roaih77nw],
    .form-control-custom[b-0roaih77nw] {
        font-size: 0.9rem;
        padding: 0.6rem 0.85rem;
    }
}

@media (max-width: 576px) {
    .page-title[b-0roaih77nw] {
        font-size: 1.25rem;
    }

    .content-card[b-0roaih77nw] {
   padding: 1rem;
    }

    .dashboard-card[b-0roaih77nw] {
        padding: 1rem;
    }

    .search-box input[b-0roaih77nw] {
      padding: 0.55rem 0.85rem 0.55rem 2.25rem;
   font-size: 0.85rem;
    }

    .btn-filter[b-0roaih77nw],
    .btn-reset[b-0roaih77nw],
    .btn-secondary[b-0roaih77nw] {
        padding: 0.55rem 0.85rem;
    font-size: 0.8rem;
    }

    .filter-tag[b-0roaih77nw] {
        font-size: 0.7rem;
        padding: 0.3rem 0.55rem;
    }

    .card-body-row[b-0roaih77nw] {
    grid-template-columns: 1fr;
    }

    .check-card[b-0roaih77nw] {
        padding: 1rem;
    }

    .pagination[b-0roaih77nw] {
     flex-wrap: wrap;
        gap: 0.25rem;
    }

    .page-link[b-0roaih77nw] {
        padding: 0.35rem 0.5rem;
   font-size: 0.8rem;
    }
}

@media (max-width: 400px) {
    .page-title[b-0roaih77nw] {
        font-size: 1.1rem;
    }

    .content-card[b-0roaih77nw] {
 padding: 0.85rem;
    }

    .check-card[b-0roaih77nw] {
        padding: 0.85rem;
    }

    .checks-table-modern[b-0roaih77nw] {
        min-width: 700px;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Landing.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-5rf4gbdd55] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-5rf4gbdd55] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-5rf4gbdd55] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-5rf4gbdd55] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-5rf4gbdd55]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-5rf4gbdd55] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-5rf4gbdd55] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-5rf4gbdd55] {
    color: #6c757d;
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-5rf4gbdd55] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

/* ==================== WELCOME SECTION ==================== */
.welcome-section[b-5rf4gbdd55] {
    text-align: center;
    padding: 3rem 1rem;
}

.welcome-icon[b-5rf4gbdd55] {
    color: var(--secondary-color);
    font-size: 4rem;
    margin-bottom: 1.5rem;
}

.welcome-title[b-5rf4gbdd55] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.5rem;
    margin-bottom: 0.75rem;
}

.welcome-text[b-5rf4gbdd55] {
    color: #6c757d;
    font-size: 1rem;
    margin-bottom: 1rem;
}

.welcome-subtext[b-5rf4gbdd55] {
    color: #6c757d;
    font-size: 0.85rem;
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
    .page-title[b-5rf4gbdd55] {
        font-size: 1.5rem;
    }

    .content-card[b-5rf4gbdd55] {
        padding: 1.5rem;
    }

    .welcome-section[b-5rf4gbdd55] {
        padding: 2rem 0.5rem;
    }
}

@media (max-width: 576px) {
    .page-header[b-5rf4gbdd55] {
        flex-direction: column;
        gap: 1rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/LapsingAsset/LapsingAssetDashboard.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-4grk4544t9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-4grk4544t9] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-4grk4544t9] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-4grk4544t9] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-4grk4544t9]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-4grk4544t9] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-4grk4544t9] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-4grk4544t9] {
    color: #6c757d;
}

.add-new-btn[b-4grk4544t9] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-4grk4544t9] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== DASHBOARD CARDS ==================== */
.dashboard-card[b-4grk4544t9] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.dashboard-card:hover[b-4grk4544t9] {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
    transform: translateY(-4px);
}

.card-icon[b-4grk4544t9] {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: var(--secondary-color);
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    margin-bottom: 1rem;
}

.card-title[b-4grk4544t9] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

.card-value[b-4grk4544t9] {
    font-size: 2rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 0.75rem;
}

.card-change[b-4grk4544t9] {
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: auto;
}

.card-change.positive[b-4grk4544t9] {
    color: #28a745;
}

.card-change.info[b-4grk4544t9] {
    color: #17a2b8;
}

.card-change.warning[b-4grk4544t9] {
    color: #ffc107;
}

.card-change.neutral[b-4grk4544t9] {
    color: #6c757d;
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-4grk4544t9] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-4grk4544t9] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-4grk4544t9] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-4grk4544t9] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-4grk4544t9] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FORM CONTROLS ==================== */
.form-control-custom[b-4grk4544t9],
.form-select-custom[b-4grk4544t9] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-4grk4544t9],
.form-select-custom:focus[b-4grk4544t9] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-4grk4544t9] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.search-box[b-4grk4544t9] {
    position: relative;
    width: 100%;
}

.search-box i[b-4grk4544t9] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box input[b-4grk4544t9] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-4grk4544t9] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.search-box input:disabled[b-4grk4544t9] {
    background-color: #e9ecef;
    cursor: not-allowed;
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-4grk4544t9] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-4grk4544t9] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-4grk4544t9] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-4grk4544t9] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-4grk4544t9] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn-filter[b-4grk4544t9] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
    border: none;
}

.btn-filter:hover:not(:disabled)[b-4grk4544t9] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    color: white;
}

.btn-reset[b-4grk4544t9] {
    background: #6c757d;
    color: white;
    border: none;
}

.btn-reset:hover:not(:disabled)[b-4grk4544t9] {
    background: #5c636a;
    transform: translateY(-2px);
}

.btn-danger[b-4grk4544t9] {
    background-color: #dc3545;
    color: white;
    border: none;
}

.btn-danger:hover[b-4grk4544t9] {
    background-color: #c82333;
    transform: translateY(-2px);
}

.btn-sm[b-4grk4544t9] {
    padding: 0.4rem 0.8rem;
    font-size: 0.85rem;
}

.btn:disabled[b-4grk4544t9] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Active Filters */
.active-filters[b-4grk4544t9] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem;
    background: white;
    border-radius: 8px;
    border: 1px solid #dee2e6;
}

.filter-label[b-4grk4544t9] {
    font-weight: 600;
    color: #495057;
}

.filter-tag[b-4grk4544t9] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.75rem;
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
}

.filter-tag i[b-4grk4544t9] {
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.2s;
}

.filter-tag i:hover[b-4grk4544t9] {
    opacity: 1;
}

/* ==================== TABLE STYLES ==================== */
.lapsing-table-container[b-4grk4544t9] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.lapsing-assets-table[b-4grk4544t9] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.lapsing-assets-table thead[b-4grk4544t9] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.lapsing-assets-table thead tr th[b-4grk4544t9] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.lapsing-assets-table thead th:first-child[b-4grk4544t9] {
    border-top-left-radius: 12px;
}

.lapsing-assets-table thead th:last-child[b-4grk4544t9] {
    border-top-right-radius: 12px;
}

.lapsing-assets-table tbody tr[b-4grk4544t9] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.lapsing-assets-table tbody tr:hover[b-4grk4544t9] {
    background-color: #f8f9fa;
}

.lapsing-assets-table tbody tr.main-row[b-4grk4544t9] {
    cursor: pointer;
}

.lapsing-assets-table tbody td[b-4grk4544t9] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

/* Asset Code */
.asset-code[b-4grk4544t9] {
    font-weight: 700;
    color: var(--primary-color);
    display: block;
    font-size: 1rem;
}

.amount-highlight[b-4grk4544t9] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
}

.amount-lapsing[b-4grk4544t9] {
    color: #856404;
    font-weight: 600;
}

.amount-nbv[b-4grk4544t9] {
    color: #0c5460;
    font-weight: 600;
}

/* Badge Styles */
.badge[b-4grk4544t9] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== EXPAND & ACTION BUTTONS ==================== */
.btn-expand[b-4grk4544t9] {
    background: none;
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: all 0.3s ease;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-expand i[b-4grk4544t9] {
    font-size: 1rem;
    transition: transform 0.3s ease;
}

.btn-expand.expanded i[b-4grk4544t9] {
    transform: rotate(90deg);
}

.btn-expand:hover[b-4grk4544t9] {
    background: rgba(139, 0, 0, 0.1);
}

.action-buttons[b-4grk4544t9] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-4grk4544t9] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

.btn-action-icon:hover[b-4grk4544t9] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

/* ==================== EXPANDABLE ROW ==================== */
.expandable-row[b-4grk4544t9] {
    background: #f8f9fa;
}

.expandable-row td[b-4grk4544t9] {
    padding: 0 !important;
}

.expanded-content[b-4grk4544t9] {
    padding: 1.5rem;
    border-top: 2px solid var(--secondary-color);
}

.detail-section[b-4grk4544t9] {
    margin-bottom: 1.5rem;
}

.detail-section:last-child[b-4grk4544t9] {
    margin-bottom: 0;
}

.detail-section.action-section[b-4grk4544t9] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    padding-top: 1.5rem;
    border-top: 1px solid #dee2e6;
}

.section-title[b-4grk4544t9] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #dee2e6;
}

.section-title i[b-4grk4544t9] {
    color: var(--secondary-color);
}

.detail-grid[b-4grk4544t9] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.detail-item[b-4grk4544t9] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.detail-item.full-width[b-4grk4544t9] {
    grid-column: 1 / -1;
}

.detail-item label[b-4grk4544t9] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.detail-item label i[b-4grk4544t9] {
    color: var(--secondary-color);
}

.detail-item span[b-4grk4544t9] {
    font-size: 0.95rem;
    color: #212529;
    font-weight: 500;
}

/* ==================== PAGINATION ==================== */
.pagination-wrapper[b-4grk4544t9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
}

.showing-entries[b-4grk4544t9] {
    font-size: 0.9rem;
    color: #495057;
}

.showing-entries span[b-4grk4544t9] {
    font-weight: 600;
    color: var(--primary-color);
}

.pagination[b-4grk4544t9] {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

.page-item[b-4grk4544t9] {
    margin: 0;
}

.page-link[b-4grk4544t9] {
    padding: 0.5rem 0.75rem;
    border: 1px solid #dee2e6;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

.page-link:hover:not(:disabled)[b-4grk4544t9] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

.page-item.active .page-link[b-4grk4544t9] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

.page-item.disabled .page-link[b-4grk4544t9] {
    opacity: 0.5;
    cursor: not-allowed;
}

.page-link:disabled[b-4grk4544t9] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ==================== ALERTS ==================== */
.alert[b-4grk4544t9] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-4grk4544t9] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-4grk4544t9] {
    color: var(--secondary-color);
}

.alert-info a[b-4grk4544t9] {
    color: var(--primary-color);
    font-weight: 600;
    text-decoration: underline;
}

.alert-info a:hover[b-4grk4544t9] {
    color: var(--secondary-color);
}

/* ==================== FILTER MODAL ==================== */
.filter-modal-label[b-4grk4544t9] {
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.filter-modal-label i[b-4grk4544t9] {
    color: var(--secondary-color);
}

/* Modal Styles */
.modal-content[b-4grk4544t9] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-4grk4544t9] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-4grk4544t9] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-4grk4544t9] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 1200px) {
    .detail-grid[b-4grk4544t9] {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    }
}

@media (max-width: 992px) {
    .desktop-view[b-4grk4544t9] {
        display: none !important;
    }

    .mobile-view[b-4grk4544t9] {
        display: block !important;
    }
}

@media (max-width: 768px) {
    .page-title[b-4grk4544t9] {
        font-size: 1.5rem;
    }

    .content-card[b-4grk4544t9] {
        padding: 1.5rem;
    }

    .filter-section[b-4grk4544t9] {
        padding: 0.75rem;
    }

    .dashboard-card[b-4grk4544t9] {
        padding: 1.25rem;
    }

    .card-value[b-4grk4544t9] {
        font-size: 1.5rem;
    }

    .active-filters[b-4grk4544t9] {
        gap: 0.5rem;
    }

    .filter-tag[b-4grk4544t9] {
        font-size: 0.75rem;
        padding: 0.3rem 0.6rem;
    }

    .lapsing-assets-table thead th[b-4grk4544t9],
    .lapsing-assets-table tbody td[b-4grk4544t9] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .detail-grid[b-4grk4544t9] {
        grid-template-columns: 1fr;
    }

    .detail-section.action-section[b-4grk4544t9] {
        flex-direction: column;
    }

    .detail-section.action-section .btn[b-4grk4544t9] {
        width: 100%;
        justify-content: center;
    }

    .expanded-content[b-4grk4544t9] {
        padding: 1rem;
    }

    .pagination-wrapper[b-4grk4544t9] {
        flex-direction: column;
        gap: 1rem;
    }

    .showing-entries[b-4grk4544t9] {
        text-align: center;
    }

    .pagination[b-4grk4544t9] {
        justify-content: center;
    }
}

@media (max-width: 576px) {
    .page-header[b-4grk4544t9] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-4grk4544t9] {
        width: 100%;
        justify-content: center;
    }

    .dashboard-card[b-4grk4544t9] {
        padding: 1rem;
    }

    .card-icon[b-4grk4544t9] {
        width: 40px;
        height: 40px;
        font-size: 1.2rem;
    }

    .card-title[b-4grk4544t9] {
        font-size: 0.75rem;
    }

    .card-value[b-4grk4544t9] {
        font-size: 1.25rem;
    }

    .card-change[b-4grk4544t9] {
        font-size: 0.8rem;
    }

    .pagination[b-4grk4544t9] {
        flex-wrap: wrap;
    }

    .page-link[b-4grk4544t9] {
        padding: 0.4rem 0.6rem;
        font-size: 0.8rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/LapsingAsset/LapsingAssetForm.razor.rz.scp.css */
/* ============================================
   Lapsing Asset Form Styles
   ============================================ */

.form-container[b-5jwbe2qr78] {
    max-width: 100%;
}

/* Form Sections */
.form-section[b-5jwbe2qr78] {
    padding: 1.5rem;
    background: #f8f9fa;
    border-radius: 10px;
    border-left: 4px solid var(--secondary-color);
}

.form-section:not(:first-child)[b-5jwbe2qr78] {
    margin-top: 1.5rem;
}

.section-title[b-5jwbe2qr78] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: 1.25rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid var(--secondary-color);
}

.section-title i[b-5jwbe2qr78] {
    color: var(--secondary-color);
    font-size: 1.2rem;
}

/* Form Actions */
.form-actions[b-5jwbe2qr78] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.btn[b-5jwbe2qr78] {
    border: none;
    border-radius: 8px;
    padding: 0.65rem 1.5rem;
    font-size: 0.95rem;
    font-weight: 600;
    transition: all 0.3s ease;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.btn-primary[b-5jwbe2qr78] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
}

.btn-primary:hover:not(:disabled)[b-5jwbe2qr78] {
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(212, 175, 55, 0.3);
}

.btn-primary:disabled[b-5jwbe2qr78] {
    opacity: 0.7;
    cursor: not-allowed;
}

.btn-secondary[b-5jwbe2qr78] {
    background-color: rgba(139, 0, 0, 0.1);
    color: var(--primary-color);
}

.btn-secondary:hover[b-5jwbe2qr78] {
    background-color: var(--primary-color);
    color: white;
}

/* Summary Section */
.summary-items[b-5jwbe2qr78] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.summary-item[b-5jwbe2qr78] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    border-left: 4px solid var(--secondary-color);
}

.summary-item label[b-5jwbe2qr78] {
    font-weight: 600;
    color: #6c757d;
    margin: 0;
    font-size: 0.9rem;
}

.summary-item .value[b-5jwbe2qr78] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
}

.summary-item.text-muted .value[b-5jwbe2qr78] {
    color: #6c757d;
}

.summary-item.text-center[b-5jwbe2qr78] {
    justify-content: center;
    text-align: center;
}

/* Schedule Preview */
.schedule-preview-list[b-5jwbe2qr78] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    max-height: 400px;
    overflow-y: auto;
}

.schedule-preview-item[b-5jwbe2qr78] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background: white;
    border-radius: 6px;
    border: 1px solid #e9ecef;
    transition: all 0.2s ease;
}

.schedule-preview-item:hover[b-5jwbe2qr78] {
    background: #f8f9fa;
    border-color: var(--secondary-color);
}

.schedule-date[b-5jwbe2qr78] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 0.9rem;
}

.schedule-amount[b-5jwbe2qr78] {
    font-weight: 700;
    color: var(--secondary-color);
    font-size: 0.95rem;
}

.schedule-preview-item.text-center[b-5jwbe2qr78] {
    justify-content: center;
    text-align: center;
}

/* Input Group Styling */
.input-group[b-5jwbe2qr78] {
    display: flex;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.3s ease;
}

.input-group:focus-within[b-5jwbe2qr78] {
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.input-group-text[b-5jwbe2qr78] {
    background-color: #f8f9fa !important;
    border: none;
    color: #6c757d;
    font-weight: 600;
    padding: 0.65rem 1rem;
    font-size: 1.1rem;
}

.input-group .form-control-custom[b-5jwbe2qr78] {
    border: none !important;
    box-shadow: none !important;
}

.input-group .form-control-custom:focus[b-5jwbe2qr78] {
    box-shadow: none !important;
}

/* Form Text Help */
.form-text[b-5jwbe2qr78] {
    display: block;
    margin-top: 0.4rem;
    font-size: 0.85rem;
    color: #6c757d;
    font-style: italic;
}

/* Spinner Loading State */
.spinner-border-sm[b-5jwbe2qr78] {
    width: 1rem;
    height: 1rem;
    border-width: 0.2em;
}

/* Content Card Styling */
.content-card[b-5jwbe2qr78] {
    background: white;
    border-radius: 10px;
    padding: 1.5rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    border: 1px solid #e9ecef;
}

.card-header-custom[b-5jwbe2qr78] {
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid var(--secondary-color);
}

.card-title-custom[b-5jwbe2qr78] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
    margin: 0 0 0.25rem 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.card-title-custom i[b-5jwbe2qr78] {
    color: var(--secondary-color);
}

.card-subtitle-custom[b-5jwbe2qr78] {
    font-size: 0.85rem;
    color: #6c757d;
    margin: 0;
}

/* Alert Styling */
.alert[b-5jwbe2qr78] {
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid;
    margin-bottom: 1rem;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.alert-info[b-5jwbe2qr78] {
    background-color: #d1ecf1;
    border-color: #bee5eb;
    color: #0c5460;
}

.alert-info i[b-5jwbe2qr78] {
    color: #0c5460;
}

/* Responsive */
@media (max-width: 768px) {
    .form-section[b-5jwbe2qr78] {
        padding: 1.25rem;
    }

    .section-title[b-5jwbe2qr78] {
        font-size: 0.95rem;
        margin-bottom: 1rem;
    }

    .summary-items[b-5jwbe2qr78] {
        gap: 0.75rem;
    }

    .summary-item[b-5jwbe2qr78] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .form-actions[b-5jwbe2qr78] {
        flex-direction: column;
    }

    .form-actions .btn[b-5jwbe2qr78] {
        width: 100%;
        justify-content: center;
    }

    .schedule-preview-item[b-5jwbe2qr78] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
}

/* Scrollbar for schedule preview */
.schedule-preview-list[b-5jwbe2qr78]::-webkit-scrollbar {
    width: 6px;
}

.schedule-preview-list[b-5jwbe2qr78]::-webkit-scrollbar-track {
    background: #f1f3f5;
    border-radius: 3px;
}

.schedule-preview-list[b-5jwbe2qr78]::-webkit-scrollbar-thumb {
    background: var(--secondary-color);
    border-radius: 3px;
}

.schedule-preview-list[b-5jwbe2qr78]::-webkit-scrollbar-thumb:hover {
    background: var(--secondary-color);
}
/* _content/AccountingSystem.Web/Components/Pages/LapsingAsset/LapsingAssetYearlySummary.razor.rz.scp.css */
/* Yearly Summary Report Styles */

/* Dashboard Cards */
.dashboard-card[b-qtcud926aj] {
    background: white;
    border-radius: 10px;
    padding: 1.5rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    border: 1px solid #e9ecef;
}

    .dashboard-card:hover[b-qtcud926aj] {
        transform: translateY(-4px);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
    }

.card-icon[b-qtcud926aj] {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
    color: white;
    font-size: 1.5rem;
}

.card-title[b-qtcud926aj] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

.card-value[b-qtcud926aj] {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 0.75rem;
}

.card-change[b-qtcud926aj] {
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

    .card-change.positive[b-qtcud926aj] {
        color: #28a745;
    }

    .card-change.negative[b-qtcud926aj] {
        color: #dc3545;
    }

    .card-change.neutral[b-qtcud926aj] {
        color: #6c757d;
    }

    .card-change i[b-qtcud926aj] {
        font-size: 1rem;
    }

.lapsing-summary-table-container[b-qtcud926aj] {
    overflow-x: auto;
    margin: 20px 0;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.lapsing-summary-table[b-qtcud926aj] {
    margin: 0;
    background-color: #fff;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.lapsing-summary-table thead[b-qtcud926aj] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #A01A1A 100%);
    color: white;
    position: sticky;
    top: 0;
    z-index: 10;
}

.lapsing-summary-table thead th[b-qtcud926aj] {
    padding: 12px 8px;
    font-weight: 600;
    text-align: center;
    border-bottom: 2px solid rgba(212, 175, 55, 0.3);
    white-space: nowrap;
}

.lapsing-summary-table tbody tr[b-qtcud926aj] {
    border-bottom: 1px solid #ecf0f1;
    transition: background-color 0.2s ease;
}

.lapsing-summary-table tbody tr:hover:not(.asset-type-header):not(.subtotal-row):not(.grand-total-row)[b-qtcud926aj] {
    background-color: rgba(212, 175, 55, 0.05);
}

/* Asset Type Header Rows */
.asset-type-header[b-qtcud926aj] {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.15) 0%, rgba(212, 175, 55, 0.08) 100%);
    font-weight: 600;
    color: var(--primary-color);
    border-bottom: 2px solid rgba(139, 0, 0, 0.2);
}

.asset-type-header td[b-qtcud926aj] {
    padding: 12px 8px;
}

/* Asset Rows */
.asset-row[b-qtcud926aj] {
    background-color: #fff;
}

.asset-row td[b-qtcud926aj] {
    padding: 10px 8px;
    text-align: center;
}

.asset-row:first-child td[b-qtcud926aj] {
    padding-top: 12px;
}

/* Asset Code Styling */
.asset-code[b-qtcud926aj] {
    font-weight: 600;
    color: var(--primary-color);
    font-family: 'Courier New', monospace;
    font-size: 0.9rem;
}

/* Amount Cells */
.amount-cell[b-qtcud926aj] {
    text-align: right;
    font-weight: 500;
    color: var(--primary-color);
    padding-right: 12px;
}

/* Monthly Cells */
.monthly-cell[b-qtcud926aj] {
    text-align: right;
    color: #495057;
    background-color: rgba(212, 175, 55, 0.03);
    font-weight: 500;
    padding-right: 8px;
}

/* Balance Cell */
.balance-cell[b-qtcud926aj] {
    background: linear-gradient(135deg, rgba(139, 0, 0, 0.08) 0%, rgba(212, 175, 55, 0.08) 100%);
    border-left: 2px solid var(--primary-color);
    border-right: 2px solid var(--primary-color);
    font-weight: 600;
    color: var(--primary-color);
}

/* Subtotal Rows */
.subtotal-row[b-qtcud926aj] {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.12) 0%, rgba(212, 175, 55, 0.08) 100%);
    font-weight: 600;
    color: var(--primary-color);
    border-top: 2px solid rgba(139, 0, 0, 0.2);
    border-bottom: 2px solid rgba(139, 0, 0, 0.2);
}

.subtotal-row td[b-qtcud926aj] {
    padding: 10px 8px;
    text-align: right;
}

.subtotal-row td:first-child[b-qtcud926aj] {
    text-align: right;
}

/* Amount Highlight in Subtotal */
.amount-highlight[b-qtcud926aj] {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.15) 0%, rgba(212, 175, 55, 0.1) 100%);
    color: var(--primary-color);
    font-weight: 700;
}

/* Grand Total Row */
.grand-total-row[b-qtcud926aj] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #A01A1A 100%);
    color: white;
    font-weight: 700;
    border-top: 3px solid var(--primary-color);
    border-bottom: 3px solid var(--primary-color);
}

.grand-total-row td[b-qtcud926aj] {
    padding: 12px 8px;
    text-align: right;
    border-bottom: none;
}

/* Grand Total Cell Styling */
.grand-total-cell[b-qtcud926aj] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #A01A1A 100%);
    color: white;
    font-weight: 700;
}

    .grand-total-cell.balance-cell[b-qtcud926aj] {
        background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
        border-left-color: var(--secondary-color);
        border-right-color: var(--secondary-color);
    }

/* Summary Notes */
.summary-notes[b-qtcud926aj] {
    padding: 12px;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.08) 0%, rgba(212, 175, 55, 0.04) 100%);
    border-radius: 4px;
    border-left: 3px solid var(--secondary-color);
    color: var(--primary-color);
}

/* ==================== SIGNATORIES SECTION ==================== */

.signatories-grid[b-qtcud926aj] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 2rem;
    padding: 2rem;
}

.signatory-card[b-qtcud926aj] {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.05) 0%, rgba(212, 175, 55, 0.02) 100%);
    border: 2px solid rgba(139, 0, 0, 0.1);
    border-radius: 8px;
    padding: 2rem 1.5rem;
    text-align: center;
    transition: all 0.3s ease;
}

.signatory-card:hover[b-qtcud926aj] {
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.15);
    border-color: var(--secondary-color);
}

.signatory-role[b-qtcud926aj] {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1rem;
    margin-bottom: 1.5rem;
}

.signature-line[b-qtcud926aj] {
    border-bottom: 2px solid var(--primary-color);
    margin-bottom: 1rem;
    height: 40px;
}

.signatory-name[b-qtcud926aj] {
    font-size: 0.9rem;
    color: #495057;
    margin-bottom: 0.5rem;
    font-weight: 600;
    min-height: 24px;
}

.signatory-details[b-qtcud926aj] {
    margin-bottom: 1rem;
}

.signatory-text[b-qtcud926aj] {
    color: #6c757d;
    font-style: italic;
    display: block;
    margin-bottom: 0.5rem;
}

.date-line[b-qtcud926aj] {
    font-size: 0.85rem;
    color: var(--primary-color);
    margin-top: 1rem;
}

/* ==================== PRINT MODAL STYLES ==================== */

.print-report[b-qtcud926aj] {
    padding: 1rem;
    background: white;
    font-size: 0.9rem;
}

.print-header[b-qtcud926aj] {
    text-align: center;
    margin-bottom: 0.75rem;
    border-bottom: 3px solid var(--primary-color);
    padding-bottom: 0.75rem;
}

.print-header h2[b-qtcud926aj] {
    margin: 0;
    font-size: 1.3rem;
    font-weight: bold;
    color: var(--primary-color);
}

.print-header p[b-qtcud926aj] {
    margin: 0.2rem 0;
    font-size: 0.85rem;
    color: #333;
}

.print-header h3[b-qtcud926aj] {
    margin: 0.5rem 0 0.25rem 0;
    font-size: 1.1rem;
    font-weight: bold;
    color: var(--primary-color);
}

.print-divider[b-qtcud926aj] {
    border: 2px solid var(--secondary-color);
    margin: 0.75rem 0;
}

.print-summary[b-qtcud926aj] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
    margin: 0.75rem 0;
    padding: 0.75rem;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.08) 0%, rgba(212, 175, 55, 0.04) 100%);
    border-radius: 4px;
    border: 1px solid rgba(139, 0, 0, 0.1);
}

.summary-item[b-qtcud926aj] {
    display: flex;
    gap: 0.5rem;
}

.summary-label[b-qtcud926aj] {
    font-weight: 600;
    color: var(--primary-color);
    min-width: 120px;
    font-size: 0.8rem;
}

.summary-value[b-qtcud926aj] {
    color: #495057;
    font-size: 0.8rem;
}

.print-table[b-qtcud926aj] {
    width: 100%;
    border-collapse: collapse;
    margin: 0.75rem 0;
    font-size: 0.65rem;
}

.print-table th[b-qtcud926aj],
.print-table td[b-qtcud926aj] {
    border: 1px solid rgba(139, 0, 0, 0.2);
    padding: 4px 3px;
    text-align: left;
}

.print-table th[b-qtcud926aj] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #A01A1A 100%);
    font-weight: bold;
    color: white;
    white-space: nowrap;
    font-size: 0.7rem;
}

.print-table .asset-type-row td[b-qtcud926aj] {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.12) 0%, rgba(212, 175, 55, 0.08) 100%);
    font-weight: 600;
    padding: 6px 4px;
    font-size: 0.8rem;
    color: var(--primary-color);
}

.print-table .print-total-row td[b-qtcud926aj] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #A01A1A 100%);
    font-weight: bold;
    padding: 6px 4px;
    font-size: 0.75rem;
    color: white;
}

.print-table .text-end[b-qtcud926aj] {
    text-align: right;
}

.print-signatories[b-qtcud926aj] {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: 1.5rem;
    flex-wrap: nowrap;
}

.print-signatory-box[b-qtcud926aj] {
    flex: 1;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 120px;
}

.print-signature-line[b-qtcud926aj] {
    border-bottom: 2px solid var(--primary-color);
    margin-bottom: 0.5rem;
    height: 20px;
    width: 100%;
}

.print-signatory-name[b-qtcud926aj] {
    font-weight: 600;
    font-size: 0.7rem;
    margin: 0.25rem 0;
    color: var(--primary-color);
}

.print-signatory-role[b-qtcud926aj] {
    font-size: 0.65rem;
    color: #333;
    margin: 0.1rem 0;
}

.print-signature-date[b-qtcud926aj] {
    font-size: 0.65rem;
    margin-top: 0.5rem;
    color: var(--primary-color);
}

/* Responsive Design */
@media (max-width: 1200px) {
    .lapsing-summary-table thead th[b-qtcud926aj],
    .lapsing-summary-table tbody td[b-qtcud926aj] {
        font-size: 0.85rem;
        padding: 8px 4px;
    }

    .amount-cell[b-qtcud926aj] {
        padding-right: 8px;
    }

    .signatories-grid[b-qtcud926aj] {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    }
}

@media (max-width: 768px) {
    .lapsing-summary-table[b-qtcud926aj] {
        font-size: 0.8rem;
    }

    .lapsing-summary-table thead th[b-qtcud926aj],
    .lapsing-summary-table tbody td[b-qtcud926aj] {
        padding: 6px 3px;
    }

    .asset-code[b-qtcud926aj] {
        font-size: 0.8rem;
    }

    /* Hide some columns on mobile for readability */
    .monthly-cell[b-qtcud926aj] {
        display: none;
    }

    .signatories-grid[b-qtcud926aj] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .print-signatories[b-qtcud926aj] {
        flex-direction: column;
        gap: 2rem;
    }

    .print-summary[b-qtcud926aj] {
        grid-template-columns: 1fr;
    }
}

/* Button Styling */
.btn-group[b-qtcud926aj] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.add-new-btn[b-qtcud926aj] {
    padding: 10px 16px;
    border-radius: 6px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
    font-size: 0.95rem;
    font-weight: 500;
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}

.add-new-btn:hover[b-qtcud926aj] {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12);
}

.add-new-btn:disabled[b-qtcud926aj] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

.btn[b-qtcud926aj] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    border: none;
    cursor: pointer;
}

.btn-primary[b-qtcud926aj] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
}

.btn-primary:hover[b-qtcud926aj] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

.btn-secondary[b-qtcud926aj] {
    background-color: #6c757d;
    color: white;
}

.btn-secondary:hover[b-qtcud926aj] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

/* Print Styles */
@media print {
    *[b-qtcud926aj] {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }

    html[b-qtcud926aj], body[b-qtcud926aj] {
        width: 100%;
        height: auto;
        overflow-x: hidden;
    }

    body[b-qtcud926aj] {
        font-family: Arial, sans-serif;
        padding: 0.5in;
        background: white;
        margin: 0;
    }

    /* Page Setup */
    @page {
        size: auto;
        margin: 0.5in;
    }

    /* Prevent page breaks inside elements */
    .print-report[b-qtcud926aj] {
        page-break-after: always;
        max-width: 100%;
        margin: 0 auto;
    }

    table[b-qtcud926aj] {
        page-break-inside: avoid;
    }

    tr[b-qtcud926aj] {
        page-break-inside: avoid;
    }

    .print-header[b-qtcud926aj] {
        text-align: center;
        margin-bottom: 0.3in;
        border-bottom: 3px solid var(--primary-color);
        padding-bottom: 0.2in;
        page-break-inside: avoid;
    }

    .print-header h2[b-qtcud926aj] {
        margin: 0;
        font-size: 16px;
        font-weight: bold;
        color: var(--primary-color);
    }

    .print-header p[b-qtcud926aj] {
        margin: 2px 0;
        font-size: 12px;
        color: #333;
    }

    .print-header h3[b-qtcud926aj] {
        margin: 0.1in 0 0.05in 0;
        font-size: 14px;
        font-weight: bold;
        color: var(--primary-color);
    }

    .print-divider[b-qtcud926aj] {
        border: 2px solid var(--secondary-color);
        margin: 0.2in 0;
        height: 0;
    }

    .print-summary[b-qtcud926aj] {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 0.3in;
        margin: 0.3in 0;
        padding: 0.2in;
        background: linear-gradient(135deg, rgba(212, 175, 55, 0.08) 0%, rgba(212, 175, 55, 0.04) 100%);
        border-radius: 4px;
        page-break-inside: avoid;
        border: 1px solid rgba(139, 0, 0, 0.1);
    }

    .summary-item[b-qtcud926aj] {
        display: flex;
        gap: 0.2in;
        font-size: 11px;
    }

    .summary-label[b-qtcud926aj] {
        font-weight: 600;
        color: var(--primary-color);
        min-width: 110px;
        flex-shrink: 0;
    }

    .summary-value[b-qtcud926aj] {
        color: #495057;
        word-break: break-word;
    }

    .print-table[b-qtcud926aj] {
        width: 100%;
        border-collapse: collapse;
        margin: 0.3in 0;
        font-size: 8pt;
        page-break-inside: avoid;
    }

    .print-table th[b-qtcud926aj],
    .print-table td[b-qtcud926aj] {
        border: 1px solid rgba(139, 0, 0, 0.2);
        padding: 3px 2px;
        text-align: left;
    }

    .print-table th[b-qtcud926aj] {
        background: linear-gradient(135deg, var(--primary-color) 0%, #A01A1A 100%);
        font-weight: bold;
        color: white;
        white-space: nowrap;
        font-size: 7pt;
    }

    .print-table .asset-type-row td[b-qtcud926aj] {
        background: linear-gradient(135deg, rgba(212, 175, 55, 0.12) 0%, rgba(212, 175, 55, 0.08) 100%);
        font-weight: 600;
        padding: 4px 3px;
        font-size: 8pt;
        color: var(--primary-color);
    }

    .print-table .print-total-row td[b-qtcud926aj] {
        background: linear-gradient(135deg, var(--primary-color) 0%, #A01A1A 100%);
        font-weight: bold;
        padding: 4px 3px;
        font-size: 8pt;
        color: white;
    }

    .print-table .text-end[b-qtcud926aj] {
        text-align: right;
    }

    .print-signatories[b-qtcud926aj] {
        display: flex;
        justify-content: space-between;
        gap: 0.3in;
        margin-top: 0.5in;
        flex-wrap: wrap;
        page-break-inside: avoid;
    }

    .print-signatory-box[b-qtcud926aj] {
        flex: 1;
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        min-width: 100px;
        page-break-inside: avoid;
    }

    .print-signature-line[b-qtcud926aj] {
        border-bottom: 2px solid var(--primary-color);
        margin-bottom: 0.1in;
        height: 0.5in;
        width: 100%;
    }

    .print-signatory-name[b-qtcud926aj] {
        font-weight: 600;
        font-size: 9px;
        margin: 0.05in 0;
        color: var(--primary-color);
        width: 100%;
        word-break: break-word;
    }

    .print-signatory-role[b-qtcud926aj] {
        font-size: 8px;
        color: #333;
        margin: 0.05in 0;
        width: 100%;
    }

    .print-signature-date[b-qtcud926aj] {
        font-size: 8px;
        margin-top: 0.15in;
        color: var(--primary-color);
    }

    /* Landscape orientation adjustments */
    @media (orientation: landscape) {
        body[b-qtcud926aj] {
            padding: 0.4in;
        }

        .print-report[b-qtcud926aj] {
            max-width: 100%;
        }

        .print-summary[b-qtcud926aj] {
            grid-template-columns: repeat(4, 1fr);
            gap: 0.2in;
        }

        .print-table[b-qtcud926aj] {
            font-size: 7pt;
        }

        .print-table th[b-qtcud926aj] {
            font-size: 6pt;
        }

        .print-signatories[b-qtcud926aj] {
            gap: 0.2in;
        }
    }

    /* Hide UI elements during print */
    .filter-section[b-qtcud926aj],
    .btn-group[b-qtcud926aj],
    .summary-notes[b-qtcud926aj],
    .page-header[b-qtcud926aj],
    .modal-header[b-qtcud926aj],
    .modal-footer[b-qtcud926aj] {
        display: none !important;
    }

    .lapsing-summary-table[b-qtcud926aj] {
        font-size: 10pt;
    }

    .lapsing-summary-table thead[b-qtcud926aj] {
        display: table-header-group;
    }

    .lapsing-summary-table tbody tr[b-qtcud926aj] {
        page-break-inside: avoid;
    }
}

/* Modal Footer */
.modal-footer[b-qtcud926aj] {
    flex-shrink: 0;
    padding: 0.75rem 1rem;
    border-top: 2px solid #dee2e6;
}
/* _content/AccountingSystem.Web/Components/Pages/LapsingAsset/LapsingScheduleView.razor.rz.scp.css */
/* ============================================
   Lapsing Schedule View Styles
   ============================================ */

/* Summary Info Items */
.summary-info-item[b-mh2iyhpn66] {
    padding: 1rem;
    border-radius: 8px;
    background: #f8f9fa;
    text-align: center;
    border-bottom: 3px solid var(--secondary-color);
}

.summary-info-item label[b-mh2iyhpn66] {
    display: block;
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

.summary-info-item .value[b-mh2iyhpn66] {
    display: block;
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--primary-color);
}

/* Schedule Table */
.schedule-table[b-mh2iyhpn66] {
    margin-bottom: 0;
}

.schedule-table thead[b-mh2iyhpn66] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
}

.schedule-table thead th[b-mh2iyhpn66] {
    font-weight: 600;
    padding: 1rem;
    border: none;
    white-space: nowrap;
}

.schedule-table tbody tr[b-mh2iyhpn66] {
    transition: all 0.2s ease;
}

.schedule-table tbody tr.posted-row[b-mh2iyhpn66] {
    background-color: rgba(40, 167, 69, 0.05);
}

.schedule-table tbody tr.pending-row:hover[b-mh2iyhpn66] {
    background-color: rgba(139, 0, 0, 0.05);
}

.schedule-table tbody td[b-mh2iyhpn66] {
    padding: 0.875rem 1rem;
    vertical-align: middle;
}

.period-date[b-mh2iyhpn66] {
    font-weight: 600;
    color: var(--primary-color);
    display: block;
}

.amount[b-mh2iyhpn66] {
    font-weight: 700;
    color: var(--primary-color);
    display: block;
}

.posted-date[b-mh2iyhpn66] {
    font-size: 0.9rem;
    color: #28a745;
    font-weight: 600;
}

/* Action Buttons */
.btn-action-sm[b-mh2iyhpn66] {
    padding: 0.35rem 0.75rem;
    border: none;
    border-radius: 6px;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

.btn-post[b-mh2iyhpn66] {
    background-color: rgba(40, 167, 69, 0.2);
    color: #28a745;
}

.btn-post:hover[b-mh2iyhpn66] {
    background-color: #28a745;
    color: white;
    transform: translateY(-2px);
}

/* Unpost Button */
.btn-unpost[b-mh2iyhpn66] {
    background-color: rgba(255, 193, 7, 0.2);
    color: #ffc107;
}

.btn-unpost:hover[b-mh2iyhpn66] {
    background-color: #ffc107;
    color: #333;
    transform: translateY(-2px);
}

.action-buttons[b-mh2iyhpn66] {
    display: flex;
    gap: 0.5rem;
}

/* Statistics Footer */
.schedule-stats[b-mh2iyhpn66] {
    display: flex;
    gap: 1.5rem;
    padding: 1.5rem;
    background: #f8f9fa;
    border-radius: 0 0 8px 8px;
    flex-wrap: wrap;
    border-top: 1px solid #e9ecef;
}

.stats-item[b-mh2iyhpn66] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.95rem;
    color: #495057;
}

.stats-item i[b-mh2iyhpn66] {
    font-size: 1.2rem;
}

.stats-item strong[b-mh2iyhpn66] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.05rem;
}

/* Filter Section */
.filter-section[b-mh2iyhpn66] {
    padding: 1rem;
    background: white;
    border-radius: 8px;
    border: 1px solid #e9ecef;
}

.search-box[b-mh2iyhpn66] {
    position: relative;
    display: block;
}

.search-box i[b-mh2iyhpn66] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    font-size: 1rem;
    pointer-events: none;
}

.search-box .form-control[b-mh2iyhpn66] {
    padding-left: 2.5rem !important;
}

/* Buttons */
.btn[b-mh2iyhpn66] {
    border: none;
    border-radius: 6px;
    padding: 0.5rem 1rem;
    font-size: 0.9rem;
    font-weight: 600;
    transition: all 0.2s ease;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-filter[b-mh2iyhpn66] {
    background-color: rgba(212, 175, 55, 0.15);
    color: var(--secondary-color);
}

.btn-filter:hover:not(:disabled)[b-mh2iyhpn66] {
    background-color: var(--secondary-color);
    color: var(--primary-color);
}

.btn-secondary[b-mh2iyhpn66] {
    background-color: rgba(139, 0, 0, 0.1);
    color: var(--primary-color);
}

.btn-secondary:hover:not(:disabled)[b-mh2iyhpn66] {
    background-color: var(--primary-color);
    color: white;
}

.btn-success[b-mh2iyhpn66] {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    color: white;
}

.btn-success:hover:not(:disabled)[b-mh2iyhpn66] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(40, 167, 69, 0.3);
}

.btn:disabled[b-mh2iyhpn66] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Spinner */
.spinner-border-sm[b-mh2iyhpn66] {
    width: 1rem;
    height: 1rem;
    border-width: 0.2em;
}

/* Alert */
.alert[b-mh2iyhpn66] {
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid;
    margin-bottom: 1rem;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.alert-danger[b-mh2iyhpn66] {
    background-color: #f8d7da;
    border-color: #f5c6cb;
    color: #721c24;
}

.alert-info[b-mh2iyhpn66] {
    background-color: #d1ecf1;
    border-color: #bee5eb;
    color: #0c5460;
}

.alert-link[b-mh2iyhpn66] {
    color: inherit;
    text-decoration: underline;
    font-weight: 600;
}

/* Content Card */
.content-card[b-mh2iyhpn66] {
    background: white;
    border-radius: 10px;
    padding: 1.5rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    border: 1px solid #e9ecef;
}

.card-header-custom[b-mh2iyhpn66] {
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid var(--secondary-color);
}

.card-title-custom[b-mh2iyhpn66] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
    margin: 0 0 0.25rem 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.card-title-custom i[b-mh2iyhpn66] {
    color: var(--secondary-color);
}

.card-subtitle-custom[b-mh2iyhpn66] {
    font-size: 0.85rem;
    color: #6c757d;
    margin: 0;
}

/* Responsive */
@media (max-width: 768px) {
    .summary-info-item[b-mh2iyhpn66] {
        text-align: left;
    }

    .summary-info-item label[b-mh2iyhpn66] {
        text-align: left;
    }

    .schedule-stats[b-mh2iyhpn66] {
        flex-direction: column;
        gap: 1rem;
    }

    .schedule-table thead th[b-mh2iyhpn66],
    .schedule-table tbody td[b-mh2iyhpn66] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .period-date[b-mh2iyhpn66] {
        font-size: 0.9rem;
    }

    .btn-action-sm[b-mh2iyhpn66] {
        width: 100%;
        justify-content: center;
    }

    .filter-section .row[b-mh2iyhpn66] {
        flex-direction: column;
    }

    .filter-section .col-lg-6[b-mh2iyhpn66] {
        width: 100%;
        margin-bottom: 1rem;
    }

    .d-flex[b-mh2iyhpn66] {
        flex-direction: column;
    }

    .d-flex.gap-2[b-mh2iyhpn66] {
        gap: 0.5rem !important;
    }

    .d-flex.gap-2 .btn[b-mh2iyhpn66] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/PettyCash/PettyCashDashboard.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-23g2krhnbv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-23g2krhnbv] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-23g2krhnbv] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-23g2krhnbv] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-23g2krhnbv]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-23g2krhnbv] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-23g2krhnbv] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-23g2krhnbv] {
    color: #6c757d;
}

.add-new-btn[b-23g2krhnbv] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-23g2krhnbv] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== DASHBOARD CARDS ==================== */
.dashboard-card[b-23g2krhnbv] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.dashboard-card:hover[b-23g2krhnbv] {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
    transform: translateY(-4px);
}

.card-icon[b-23g2krhnbv] {
    width: 50px;
    height: 50px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: var(--secondary-color);
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    margin-bottom: 1rem;
}

.card-title[b-23g2krhnbv] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

.card-value[b-23g2krhnbv] {
    font-size: 2rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 0.75rem;
}

.card-change[b-23g2krhnbv] {
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: auto;
}

.card-change.positive[b-23g2krhnbv] {
    color: #28a745;
}

.card-change.info[b-23g2krhnbv] {
    color: #17a2b8;
}

.card-change.warning[b-23g2krhnbv] {
    color: #ffc107;
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-23g2krhnbv] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-23g2krhnbv] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-23g2krhnbv] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-23g2krhnbv] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-23g2krhnbv] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FORM CONTROLS ==================== */
.form-control-custom[b-23g2krhnbv],
.form-select-custom[b-23g2krhnbv] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-23g2krhnbv],
.form-select-custom:focus[b-23g2krhnbv] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-23g2krhnbv] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.search-box[b-23g2krhnbv] {
    position: relative;
    width: 100%;
}

.search-box i[b-23g2krhnbv] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box input[b-23g2krhnbv] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-23g2krhnbv] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.search-box input:disabled[b-23g2krhnbv] {
    background-color: #e9ecef;
    cursor: not-allowed;
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-23g2krhnbv] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-23g2krhnbv] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-23g2krhnbv] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-23g2krhnbv] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-23g2krhnbv] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn-filter[b-23g2krhnbv] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
    border: none;
}

.btn-filter:hover:not(:disabled)[b-23g2krhnbv] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    color: white;
}

.btn-reset[b-23g2krhnbv] {
    background: #6c757d;
    color: white;
    border: none;
}

.btn-reset:hover:not(:disabled)[b-23g2krhnbv] {
    background: #5c636a;
    transform: translateY(-2px);
}

.btn:disabled[b-23g2krhnbv] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Active Filters */
.active-filters[b-23g2krhnbv] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem;
    background: white;
    border-radius: 8px;
    border: 1px solid #dee2e6;
}

.filter-label[b-23g2krhnbv] {
    font-weight: 600;
    color: #495057;
}

.filter-tag[b-23g2krhnbv] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.75rem;
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
}

.filter-tag i[b-23g2krhnbv] {
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.2s;
}

.filter-tag i:hover[b-23g2krhnbv] {
    opacity: 1;
}

/* ==================== TABLE STYLES ==================== */
.petty-cash-table-container[b-23g2krhnbv] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.petty-cash-table-modern[b-23g2krhnbv] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.petty-cash-table-modern thead[b-23g2krhnbv] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.petty-cash-table-modern thead tr th[b-23g2krhnbv] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.petty-cash-table-modern thead th:first-child[b-23g2krhnbv] {
    border-top-left-radius: 12px;
}

.petty-cash-table-modern thead th:last-child[b-23g2krhnbv] {
    border-top-right-radius: 12px;
}

.petty-cash-table-modern tbody tr[b-23g2krhnbv] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.petty-cash-table-modern tbody tr:hover[b-23g2krhnbv] {
    background-color: #f8f9fa;
}

.petty-cash-table-modern tbody tr.main-row[b-23g2krhnbv] {
    cursor: pointer;
}

.petty-cash-table-modern tbody td[b-23g2krhnbv] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

/* Date Cell */
.date-cell[b-23g2krhnbv] {
    cursor: pointer;
}

.date-wrapper[b-23g2krhnbv] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.date-wrapper i[b-23g2krhnbv] {
    font-size: 0.875rem;
}

/* Badge Styles */
.voucher-badge[b-23g2krhnbv] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.9rem;
}

.group-code[b-23g2krhnbv] {
    font-weight: 500;
    color: #495057;
    font-size: 0.9rem;
}

.category-badge[b-23g2krhnbv] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    color: var(--primary-color);
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 500;
    font-size: 0.9rem;
}

.amount-highlight[b-23g2krhnbv] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
}

.accountable-name[b-23g2krhnbv] {
    color: #495057;
    font-weight: 500;
}

/* Status Badge */
.badge[b-23g2krhnbv] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge.badge-warning[b-23g2krhnbv] {
    background-color: #fff3cd;
    color: #856404;
}

.badge.badge-info[b-23g2krhnbv] {
    background-color: #cce5ff;
    color: #004085;
}

.badge.badge-success[b-23g2krhnbv] {
    background-color: #d4edda;
    color: #155724;
}

.badge.badge-secondary[b-23g2krhnbv] {
    background-color: #e2e3e5;
    color: #383d41;
}

/* ==================== EXPAND & ACTION BUTTONS ==================== */
.btn-expand[b-23g2krhnbv] {
    background: none;
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: all 0.3s ease;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-expand i[b-23g2krhnbv] {
    font-size: 1rem;
    transition: transform 0.3s ease;
}

.btn-expand.expanded i[b-23g2krhnbv] {
    transform: rotate(90deg);
}

.btn-expand:hover[b-23g2krhnbv] {
    background: rgba(139, 0, 0, 0.1);
}

.action-buttons[b-23g2krhnbv] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-23g2krhnbv] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

.btn-action-icon:hover[b-23g2krhnbv] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-edit:hover[b-23g2krhnbv] {
    background: #0056b3;
    color: white;
}

.btn-action-icon.btn-delete:hover[b-23g2krhnbv] {
    background: #dc3545;
    color: white;
}

/* ==================== EXPANDABLE ROW ==================== */
.expandable-row[b-23g2krhnbv] {
    background: #f8f9fa;
}

.expandable-row td[b-23g2krhnbv] {
    padding: 0 !important;
}

.expanded-content[b-23g2krhnbv] {
    padding: 1.5rem;
    border-top: 2px solid var(--secondary-color);
}

@keyframes slideDown-b-23g2krhnbv {
    from {
        opacity: 0;
        max-height: 0;
    }
    to {
        opacity: 1;
        max-height: 1000px;
    }
}

.detail-section[b-23g2krhnbv] {
    margin-bottom: 1.5rem;
}

.detail-section:last-child[b-23g2krhnbv] {
    margin-bottom: 0;
}

.section-title[b-23g2krhnbv] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #dee2e6;
}

.section-title i[b-23g2krhnbv] {
    color: var(--secondary-color);
}

.detail-grid[b-23g2krhnbv] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.detail-item[b-23g2krhnbv] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.detail-item.full-width[b-23g2krhnbv] {
    grid-column: 1 / -1;
}

.detail-item label[b-23g2krhnbv] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.detail-item label i[b-23g2krhnbv] {
    color: var(--secondary-color);
}

.detail-item span[b-23g2krhnbv] {
    font-size: 0.95rem;
    color: #212529;
    font-weight: 500;
}

.particulars-content[b-23g2krhnbv] {
    background: white;
    padding: 1rem;
    border-radius: 8px;
    border-left: 3px solid var(--secondary-color);
    line-height: 1.6;
    color: #495057;
}

/* ==================== MOBILE CARD VIEW ==================== */
.petty-cash-cards-container[b-23g2krhnbv] {
    display: none;
}

.petty-cash-card[b-23g2krhnbv] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    margin-bottom: 1rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.petty-cash-card:hover[b-23g2krhnbv] {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
    transform: translateY(-2px);
}

.card-header-row[b-23g2krhnbv] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #e9ecef;
}

.voucher-info[b-23g2krhnbv] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.voucher-badge-mobile[b-23g2krhnbv] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.9rem;
    display: inline-block;
    width: fit-content;
}

.date-mobile[b-23g2krhnbv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #6c757d;
    font-size: 0.85rem;
}

.card-body-row[b-23g2krhnbv] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

.info-group[b-23g2krhnbv] {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
}

.info-group i[b-23g2krhnbv] {
    color: var(--secondary-color);
    margin-top: 0.25rem;
    font-size: 1.25rem;
}

.info-content[b-23g2krhnbv] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
}

.info-content label[b-23g2krhnbv] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.info-content span[b-23g2krhnbv] {
    font-size: 0.9rem;
    font-weight: 500;
    color: #212529;
}

.amount-mobile[b-23g2krhnbv] {
    color: var(--primary-color);
    font-weight: 700;
}

.card-divider[b-23g2krhnbv] {
    height: 1px;
    background: #e9ecef;
    margin: 1rem 0;
}

.card-details-grid[b-23g2krhnbv] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.detail-row[b-23g2krhnbv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #495057;
}

.detail-row i[b-23g2krhnbv] {
    color: var(--secondary-color);
}

/* ==================== PAGINATION ==================== */
.pagination-wrapper[b-23g2krhnbv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
}

.showing-entries[b-23g2krhnbv] {
    font-size: 0.9rem;
    color: #495057;
}

.showing-entries span[b-23g2krhnbv] {
    font-weight: 600;
    color: var(--primary-color);
}

.pagination[b-23g2krhnbv] {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

.page-item[b-23g2krhnbv] {
    margin: 0;
}

.page-link[b-23g2krhnbv] {
    padding: 0.5rem 0.75rem;
    border: 1px solid #dee2e6;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

.page-link:hover:not(:disabled)[b-23g2krhnbv] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

.page-item.active .page-link[b-23g2krhnbv] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

.page-item.disabled .page-link[b-23g2krhnbv] {
    opacity: 0.5;
    cursor: not-allowed;
}

.page-link:disabled[b-23g2krhnbv] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ==================== FILTER MODAL ==================== */
.filter-modal-label[b-23g2krhnbv] {
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.filter-modal-label i[b-23g2krhnbv] {
    color: var(--secondary-color);
}

/* Modal Styles */
.modal-content[b-23g2krhnbv] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-23g2krhnbv] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-23g2krhnbv] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-23g2krhnbv] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== ALERTS ==================== */
.alert[b-23g2krhnbv] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-23g2krhnbv] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-23g2krhnbv] {
    color: var(--secondary-color);
}

.alert-info a[b-23g2krhnbv] {
    color: var(--primary-color);
    font-weight: 600;
    text-decoration: underline;
}

.alert-info a:hover[b-23g2krhnbv] {
    color: var(--secondary-color);
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 1200px) {
    .detail-grid[b-23g2krhnbv] {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    }

    .card-body-row[b-23g2krhnbv] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 992px) {
    .desktop-view[b-23g2krhnbv] {
        display: none !important;
    }

    .mobile-view[b-23g2krhnbv] {
        display: block !important;
    }

    .action-buttons[b-23g2krhnbv] {
        flex-direction: column;
    }

    .pagination-wrapper[b-23g2krhnbv] {
        justify-content: center;
    }
}

@media (max-width: 768px) {
    .page-title[b-23g2krhnbv] {
        font-size: 1.5rem;
    }

    .content-card[b-23g2krhnbv] {
        padding: 1.5rem;
    }

    .filter-section[b-23g2krhnbv] {
        padding: 0.75rem;
    }

    .dashboard-card[b-23g2krhnbv] {
        padding: 1.25rem;
    }

    .card-value[b-23g2krhnbv] {
        font-size: 1.5rem;
    }

    .active-filters[b-23g2krhnbv] {
        gap: 0.5rem;
    }

    .filter-tag[b-23g2krhnbv] {
        font-size: 0.75rem;
        padding: 0.3rem 0.6rem;
    }
}

@media (max-width: 576px) {
    .page-header[b-23g2krhnbv] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-23g2krhnbv] {
        width: 100%;
        justify-content: center;
    }

    .dashboard-card[b-23g2krhnbv] {
        padding: 1rem;
    }

    .card-icon[b-23g2krhnbv] {
        width: 40px;
        height: 40px;
        font-size: 1.2rem;
    }

    .card-title[b-23g2krhnbv] {
        font-size: 0.75rem;
    }

    .card-value[b-23g2krhnbv] {
        font-size: 1.25rem;
    }

    .card-change[b-23g2krhnbv] {
        font-size: 0.8rem;
    }

    .pagination-wrapper[b-23g2krhnbv] {
        flex-direction: column;
        gap: 1rem;
    }

    .pagination[b-23g2krhnbv] {
        flex-wrap: wrap;
        justify-content: center;
    }

    .page-link[b-23g2krhnbv] {
        padding: 0.4rem 0.6rem;
        font-size: 0.8rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/PettyCash/PettyCashTransaction.razor.rz.scp.css */
/* Content Card */
.content-card[b-9ifj13sb0h] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Card Header */
.card-header-custom[b-9ifj13sb0h] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-9ifj13sb0h] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-9ifj13sb0h] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-9ifj13sb0h] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Form Controls */
.form-label[b-9ifj13sb0h] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

    .form-label i[b-9ifj13sb0h] {
        color: var(--secondary-color);
    }

.form-control-custom[b-9ifj13sb0h], .form-select-custom[b-9ifj13sb0h] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control-custom:focus[b-9ifj13sb0h], .form-select-custom:focus[b-9ifj13sb0h] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Section Divider */
.section-divider[b-9ifj13sb0h] {
    margin: 2rem 0 1.5rem;
    padding-top: 1.5rem;
    border-top: 2px dashed #dee2e6;
}

.section-title[b-9ifj13sb0h] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
}

    .section-title i[b-9ifj13sb0h] {
        color: var(--secondary-color);
    }

/* Totals Display */
.totals-display[b-9ifj13sb0h] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid var(--secondary-color);
    border-radius: 12px;
    padding: 1.25rem;
    margin-top: 1.85rem;
}

.total-item[b-9ifj13sb0h] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
}

    .total-item.balance[b-9ifj13sb0h] {
        border-top: 2px solid var(--primary-color);
        padding-top: 1rem;
        margin-top: 0.5rem;
    }

.total-label[b-9ifj13sb0h] {
    font-weight: 600;
    color: #495057;
    font-size: 0.95rem;
}

.total-value[b-9ifj13sb0h] {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--primary-color);
}

/* Action Buttons */
.action-buttons-container[b-9ifj13sb0h] {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 2px solid #f1f3f5;
}

.btn[b-9ifj13sb0h] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-9ifj13sb0h] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

    .btn-primary:hover[b-9ifj13sb0h] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.btn-secondary[b-9ifj13sb0h] {
    background-color: #6c757d;
    border: none;
}

    .btn-secondary:hover[b-9ifj13sb0h] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

.btn-warning[b-9ifj13sb0h] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #495057;
    border: none;
}

    .btn-warning:hover[b-9ifj13sb0h] {
        background: linear-gradient(135deg, #e0a800 0%, #ffc107 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(255, 193, 7, 0.4);
        color: #495057;
    }

.btn-info[b-9ifj13sb0h] {
    background: linear-gradient(135deg, #0dcaf0 0%, #0aa2c0 100%);
    color: white;
    border: none;
}

    .btn-info:hover[b-9ifj13sb0h] {
        background: linear-gradient(135deg, #0aa2c0 0%, #0dcaf0 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(13, 202, 240, 0.4);
        color: white;
    }

/* Page Header */
.page-header[b-9ifj13sb0h] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-9ifj13sb0h] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-9ifj13sb0h] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-9ifj13sb0h] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-9ifj13sb0h]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-9ifj13sb0h] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-9ifj13sb0h] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-9ifj13sb0h] {
    color: #6c757d;
}

/* Print Voucher Styles */
.print-voucher[b-9ifj13sb0h] {
    padding: 40px;
    background: #e8f0f8;
    font-family: Arial, sans-serif;
}

.voucher-header[b-9ifj13sb0h] {
    text-align: center;
    margin-bottom: 10px;
}

.company-name[b-9ifj13sb0h] {
    font-size: 24px;
    font-weight: bold;
    margin: 0;
    color: #000;
}

.company-address[b-9ifj13sb0h] {
    font-size: 16px;
    margin: 5px 0 0;
    color: #000;
}

.document-title[b-9ifj13sb0h] {
    text-align: center;
    margin: 20px 0;
}

    .document-title h4[b-9ifj13sb0h] {
        font-size: 20px;
        font-weight: bold;
        margin: 0;
        color: #000;
    }

.voucher-divider[b-9ifj13sb0h] {
    border: none;
    border-top: 2px solid #000;
    margin: 20px 0;
}

.voucher-details[b-9ifj13sb0h] {
    margin: 25px 0;
}

.detail-row[b-9ifj13sb0h] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
}

.detail-item[b-9ifj13sb0h] {
    flex: 1;
    display: flex;
    gap: 10px;
}

    .detail-item.full-width[b-9ifj13sb0h] {
        flex: 2;
    }

.detail-label[b-9ifj13sb0h] {
    font-weight: bold;
    min-width: 80px;
    color: #000;
}

.detail-value[b-9ifj13sb0h] {
    color: #000;
}

.particulars-section[b-9ifj13sb0h] {
    margin: 25px 0;
}

.section-heading[b-9ifj13sb0h] {
    font-weight: bold;
    margin-bottom: 15px;
    color: #000;
    font-size: 16px;
}

.particulars-table[b-9ifj13sb0h] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
    background: white;
}

    .particulars-table th[b-9ifj13sb0h],
    .particulars-table td[b-9ifj13sb0h] {
        border: 1px solid #000;
        padding: 10px;
        text-align: left;
        color: #000;
    }

    .particulars-table th[b-9ifj13sb0h] {
        background-color: #d0d0d0;
        font-weight: bold;
    }

    .particulars-table .text-end[b-9ifj13sb0h] {
        text-align: right;
    }

.signatures-section[b-9ifj13sb0h] {
    display: flex;
    justify-content: space-between;
    margin-top: 50px;
    gap: 20px;
}

.signature-box[b-9ifj13sb0h] {
    flex: 1;
    text-align: center;
}

.signature-label[b-9ifj13sb0h] {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 40px;
    color: #000;
}

.signature-line[b-9ifj13sb0h] {
    /*border-bottom: 2px solid #000;*/
    margin: 0 10px 8px;
}

.signature-name[b-9ifj13sb0h] {
    font-size: 13px;
    color: #000;
}

.signature-subtitle[b-9ifj13sb0h] {
    font-size: 11px;
    font-style: italic;
    margin-top: 5px;
    color: #000;
}

/* Modal Styles */
.modal-content[b-9ifj13sb0h] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-xl[b-9ifj13sb0h] {
    max-width: 900px;
}

.modal-header[b-9ifj13sb0h] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-9ifj13sb0h] {
    padding: 0;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-9ifj13sb0h] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Toast */
.toast[b-9ifj13sb0h] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Accounting Entries Styles */
.accounting-entries-container[b-9ifj13sb0h] {
    background: white;
    border: 2px solid #e9ecef;
    border-radius: 12px;
    padding: 1.25rem;
    height: 100%;
    transition: all 0.3s ease;
}

    .accounting-entries-container:hover[b-9ifj13sb0h] {
        border-color: var(--secondary-color);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.1);
    }

.entries-header[b-9ifj13sb0h] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #f1f3f5;
}

.entries-title[b-9ifj13sb0h] {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
}

    .entries-title i[b-9ifj13sb0h] {
        color: var(--secondary-color);
    }

.btn-add-entry[b-9ifj13sb0h] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.4rem 0.8rem;
    font-size: 0.85rem;
    font-weight: 600;
    border-radius: 6px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

    .btn-add-entry:hover[b-9ifj13sb0h] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-1px);
        box-shadow: 0 3px 8px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.entry-row[b-9ifj13sb0h] {
    margin-bottom: 0.75rem;
}

.entry-fields[b-9ifj13sb0h] {
    display: grid;
    grid-template-columns: 2fr 1fr auto;
    gap: 0.5rem;
    align-items: start;
}

.entry-account input[b-9ifj13sb0h],
.entry-amount input[b-9ifj13sb0h] {
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 0.5rem;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

    .entry-account input:focus[b-9ifj13sb0h],
    .entry-amount input:focus[b-9ifj13sb0h] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.15rem rgba(212, 175, 55, 0.15);
        outline: none;
    }

.btn-remove-entry[b-9ifj13sb0h] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
    border: none;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    transition: all 0.3s ease;
    font-size: 0.9rem;
}

    .btn-remove-entry:hover[b-9ifj13sb0h] {
        background: linear-gradient(135deg, #c82333 0%, #bd2130 100%);
        transform: scale(1.05);
        box-shadow: 0 2px 6px rgba(220, 53, 69, 0.4);
    }

.empty-entries-message[b-9ifj13sb0h] {
    text-align: center;
    padding: 2rem 1rem;
    color: #6c757d;
    font-size: 0.9rem;
    font-style: italic;
}

.entries-total[b-9ifj13sb0h] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 2px solid var(--primary-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .entries-total .total-label[b-9ifj13sb0h] {
        font-weight: 700;
        color: #495057;
        font-size: 1rem;
    }

    .entries-total .total-value[b-9ifj13sb0h] {
        font-weight: 700;
        font-size: 1.15rem;
        color: var(--primary-color);
    }

/* Validation Summary */
.validation-summary[b-9ifj13sb0h] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid #dee2e6;
    border-radius: 12px;
    padding: 1.25rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    transition: all 0.3s ease;
}

    .validation-summary.balanced[b-9ifj13sb0h] {
        border-color: #28a745;
        background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
    }

    .validation-summary.unbalanced[b-9ifj13sb0h] {
        border-color: #dc3545;
        background: linear-gradient(135deg, #f8d7da 0%, #f5c6cb 100%);
    }

    .validation-summary.warning[b-9ifj13sb0h] {
        border-color: #ffc107;
        background: linear-gradient(135deg, #fff3cd 0%, #ffeaa7 100%);
    }

.validation-item[b-9ifj13sb0h] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    .validation-item.validation-status[b-9ifj13sb0h] {
        grid-column: 1 / -1;
        border-top: 2px solid rgba(0,0,0,0.1);
        padding-top: 1rem;
        margin-top: 0.5rem;
    }

.validation-label[b-9ifj13sb0h] {
    font-weight: 600;
    color: #495057;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.validation-value[b-9ifj13sb0h] {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--primary-color);
}

.validation-item.validation-status .validation-value[b-9ifj13sb0h] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1rem;
}

/* Print Preview Updates */
.particulars-section p[b-9ifj13sb0h] {
    margin: 0.5rem 0;
    font-size: 14px;
}

    .particulars-section p strong[b-9ifj13sb0h] {
        color: #000;
        font-weight: bold;
    }

.total-row[b-9ifj13sb0h] {
    background-color: #f0f0f0;
    font-weight: bold;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-title[b-9ifj13sb0h] {
        font-size: 1.5rem;
    }

    .content-card[b-9ifj13sb0h] {
        padding: 1.5rem;
    }

    .action-buttons-container[b-9ifj13sb0h] {
        flex-direction: column;
    }

        .action-buttons-container .btn[b-9ifj13sb0h] {
            width: 100%;
        }

    .totals-display[b-9ifj13sb0h] {
        margin-top: 0;
    }

    .signatures-section[b-9ifj13sb0h] {
        flex-wrap: wrap;
        gap: 30px;
    }

    .signature-box[b-9ifj13sb0h] {
        flex: 0 0 calc(50% - 15px);
    }

    .print-voucher[b-9ifj13sb0h] {
        padding: 20px;
    }

    .detail-row[b-9ifj13sb0h] {
        flex-direction: column;
        gap: 8px;
    }

    /* Mobile adjustments for accounting entries */
    .entry-fields[b-9ifj13sb0h] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .btn-remove-entry[b-9ifj13sb0h] {
        width: 100%;
    }

    .validation-summary[b-9ifj13sb0h] {
        grid-template-columns: 1fr;
    }

    .entries-header[b-9ifj13sb0h] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .btn-add-entry[b-9ifj13sb0h] {
        width: 100%;
        justify-content: center;
    }
}

@media print {
    body *[b-9ifj13sb0h] {
        visibility: hidden;
    }

    .print-voucher[b-9ifj13sb0h], .print-voucher *[b-9ifj13sb0h] {
        visibility: visible;
    }

    .print-voucher[b-9ifj13sb0h] {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        background: white;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Position/DeleteConfirmationModal.razor.rz.scp.css */

/* Add New Button */
.add-new-btn[b-s0azsgkf5p] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-s0azsgkf5p] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .add-new-btn i[b-s0azsgkf5p] {
        font-size: 1.1rem;
    }

/* Content Card */
.content-card[b-s0azsgkf5p] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Search and Filter Bar */
.search-filter-bar[b-s0azsgkf5p] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-box[b-s0azsgkf5p] {
    position: relative;
    flex: 1;
    min-width: 250px;
    max-width: 400px;
}

    .search-box input[b-s0azsgkf5p] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-s0azsgkf5p] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-s0azsgkf5p] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.filter-group[b-s0azsgkf5p] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.entries-select[b-s0azsgkf5p] {
    padding: 0.5rem 1rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .entries-select:focus[b-s0azsgkf5p] {
        outline: none;
        border-color: var(--secondary-color);
    }

/* Table Styles */
.positions-table[b-s0azsgkf5p] {
    width: 100%;
    margin-top: 1rem;
}

    .positions-table thead[b-s0azsgkf5p] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .positions-table thead th[b-s0azsgkf5p] {
            color: white;
            font-weight: 600;
            padding: 1rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.85rem;
            letter-spacing: 0.5px;
        }

    .positions-table tbody tr[b-s0azsgkf5p] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .positions-table tbody tr:hover[b-s0azsgkf5p] {
            background-color: #f8f9fa;
            transform: scale(1.01);
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
        }

    .positions-table tbody td[b-s0azsgkf5p] {
        padding: 1rem;
        vertical-align: middle;
    }

.position-name[b-s0azsgkf5p] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 1rem;
}

.position-description[b-s0azsgkf5p] {
    color: #6c757d;
    font-size: 0.9rem;
    line-height: 1.5;
}

/* Action Buttons */
.action-buttons[b-s0azsgkf5p] {
    display: flex;
    gap: 0.5rem;
}

.btn-action[b-s0azsgkf5p] {
    padding: 0.5rem 0.75rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-edit[b-s0azsgkf5p] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-s0azsgkf5p] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

.btn-delete[b-s0azsgkf5p] {
    background-color: #dc3545;
    color: white;
}

    .btn-delete:hover[b-s0azsgkf5p] {
        background-color: #bb2d3b;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
    }

/* Modal Styles */
.modal-content[b-s0azsgkf5p] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-s0azsgkf5p] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-s0azsgkf5p] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-s0azsgkf5p] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-s0azsgkf5p] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-s0azsgkf5p] {
            opacity: 1;
        }

.modal-body[b-s0azsgkf5p] {
    padding: 2rem;
}

.modal-footer[b-s0azsgkf5p] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.form-label[b-s0azsgkf5p] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.form-control[b-s0azsgkf5p], .form-select[b-s0azsgkf5p] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control:focus[b-s0azsgkf5p], .form-select:focus[b-s0azsgkf5p] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

.btn-primary[b-s0azsgkf5p] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-primary:hover[b-s0azsgkf5p] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    }

.btn-secondary[b-s0azsgkf5p] {
    background-color: #6c757d;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-secondary:hover[b-s0azsgkf5p] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

/* Pagination */
.pagination-wrapper[b-s0azsgkf5p] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-s0azsgkf5p] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-s0azsgkf5p] {
    margin: 0;
}

.page-link[b-s0azsgkf5p] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

.page-link:hover[b-s0azsgkf5p] {
    background-color: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

.page-item.active .page-link[b-s0azsgkf5p] {
    color: #dee2e6;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Empty State */
.empty-state[b-s0azsgkf5p] {
    text-align: center;
    padding: 3rem 2rem;
    color: #6c757d;
}

.empty-state i[b-s0azsgkf5p] {
    font-size: 4rem;
    color: #dee2e6;
    margin-bottom: 1rem;
}
/* _content/AccountingSystem.Web/Components/Pages/Position/PositionModal.razor.rz.scp.css */

/* Add New Button */
.add-new-btn[b-z5x0xl3cax] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-z5x0xl3cax] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .add-new-btn i[b-z5x0xl3cax] {
        font-size: 1.1rem;
    }

/* Content Card */
.content-card[b-z5x0xl3cax] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Search and Filter Bar */
.search-filter-bar[b-z5x0xl3cax] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-box[b-z5x0xl3cax] {
    position: relative;
    flex: 1;
    min-width: 250px;
    max-width: 400px;
}

    .search-box input[b-z5x0xl3cax] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-z5x0xl3cax] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-z5x0xl3cax] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.filter-group[b-z5x0xl3cax] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.entries-select[b-z5x0xl3cax] {
    padding: 0.5rem 1rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .entries-select:focus[b-z5x0xl3cax] {
        outline: none;
        border-color: var(--secondary-color);
    }

/* Table Styles */
.positions-table[b-z5x0xl3cax] {
    width: 100%;
    margin-top: 1rem;
}

    .positions-table thead[b-z5x0xl3cax] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .positions-table thead th[b-z5x0xl3cax] {
            color: white;
            font-weight: 600;
            padding: 1rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.85rem;
            letter-spacing: 0.5px;
        }

    .positions-table tbody tr[b-z5x0xl3cax] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .positions-table tbody tr:hover[b-z5x0xl3cax] {
            background-color: #f8f9fa;
            transform: scale(1.01);
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
        }

    .positions-table tbody td[b-z5x0xl3cax] {
        padding: 1rem;
        vertical-align: middle;
    }

.position-name[b-z5x0xl3cax] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 1rem;
}

.position-description[b-z5x0xl3cax] {
    color: #6c757d;
    font-size: 0.9rem;
    line-height: 1.5;
}

/* Action Buttons */
.action-buttons[b-z5x0xl3cax] {
    display: flex;
    gap: 0.5rem;
}

.btn-action[b-z5x0xl3cax] {
    padding: 0.5rem 0.75rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-edit[b-z5x0xl3cax] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-z5x0xl3cax] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

.btn-delete[b-z5x0xl3cax] {
    background-color: #dc3545;
    color: white;
}

    .btn-delete:hover[b-z5x0xl3cax] {
        background-color: #bb2d3b;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
    }

/* Modal Styles */
.modal-content[b-z5x0xl3cax] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-z5x0xl3cax] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-z5x0xl3cax] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-z5x0xl3cax] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-z5x0xl3cax] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-z5x0xl3cax] {
            opacity: 1;
        }

.modal-body[b-z5x0xl3cax] {
    padding: 2rem;
}

.modal-footer[b-z5x0xl3cax] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.form-label[b-z5x0xl3cax] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.form-control[b-z5x0xl3cax], .form-select[b-z5x0xl3cax] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control:focus[b-z5x0xl3cax], .form-select:focus[b-z5x0xl3cax] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

.btn-primary[b-z5x0xl3cax] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-primary:hover[b-z5x0xl3cax] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    }

.btn-secondary[b-z5x0xl3cax] {
    background-color: #6c757d;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-secondary:hover[b-z5x0xl3cax] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

/* Pagination */
.pagination-wrapper[b-z5x0xl3cax] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-z5x0xl3cax] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-z5x0xl3cax] {
    margin: 0;
}

.page-link[b-z5x0xl3cax] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

    .page-link:hover[b-z5x0xl3cax] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
    }

.page-item.active .page-link[b-z5x0xl3cax] {
    color: #dee2e6;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Empty State */
.empty-state[b-z5x0xl3cax] {
    text-align: center;
    padding: 3rem 2rem;
    color: #6c757d;
}

    .empty-state i[b-z5x0xl3cax] {
        font-size: 4rem;
        color: #dee2e6;
        margin-bottom: 1rem;
    }
/* _content/AccountingSystem.Web/Components/Pages/Position/PositionsPage.razor.rz.scp.css */
/* Page Header */
.page-header[b-tiaveb8x9l] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-tiaveb8x9l] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-tiaveb8x9l] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-tiaveb8x9l] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-tiaveb8x9l]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-tiaveb8x9l] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-tiaveb8x9l] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-tiaveb8x9l] {
    color: #6c757d;
}

/* ===== ADD NEW BUTTON ===== */
.add-new-btn[b-tiaveb8x9l] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-tiaveb8x9l] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .add-new-btn i[b-tiaveb8x9l] {
        font-size: 1.1rem;
    }

/* ===== CONTENT CARD ===== */
.content-card[b-tiaveb8x9l] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* ===== SEARCH AND FILTER BAR ===== */
.search-filter-bar[b-tiaveb8x9l] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-box[b-tiaveb8x9l] {
    position: relative;
    flex: 1;
    min-width: 250px;
    max-width: 400px;
}

    .search-box input[b-tiaveb8x9l] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-tiaveb8x9l] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-tiaveb8x9l] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.filter-group[b-tiaveb8x9l] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.entries-select[b-tiaveb8x9l] {
    padding: 0.5rem 1rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .entries-select:focus[b-tiaveb8x9l] {
        outline: none;
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* ===== TABLE STYLES ===== */
.positions-table[b-tiaveb8x9l] {
    width: 100%;
    margin-top: 1rem;
    margin-bottom: 0;
}

    .positions-table thead[b-tiaveb8x9l] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .positions-table thead th[b-tiaveb8x9l] {
            color: white;
            font-weight: 600;
            padding: 1rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.85rem;
            letter-spacing: 0.5px;
        }

    .positions-table tbody tr[b-tiaveb8x9l] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .positions-table tbody tr:hover[b-tiaveb8x9l] {
            background-color: #f8f9fa;
            transform: scale(1.01);
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
        }

    .positions-table tbody td[b-tiaveb8x9l] {
        padding: 1rem;
        vertical-align: middle;
    }

.position-name[b-tiaveb8x9l] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 1rem;
}

.position-description[b-tiaveb8x9l] {
    color: #6c757d;
    font-size: 0.9rem;
    line-height: 1.5;
}

/* ===== ACTION BUTTONS ===== */
.action-buttons[b-tiaveb8x9l] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.btn-action[b-tiaveb8x9l] {
    padding: 0.5rem 0.75rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-edit[b-tiaveb8x9l] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover:not(:disabled)[b-tiaveb8x9l] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

    .btn-edit:disabled[b-tiaveb8x9l] {
        background-color: #6c757d;
        opacity: 0.65;
        cursor: not-allowed;
    }

.btn-delete[b-tiaveb8x9l] {
    background-color: #dc3545;
    color: white;
}

    .btn-delete:hover:not(:disabled)[b-tiaveb8x9l] {
        background-color: #bb2d3b;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
    }

    .btn-delete:disabled[b-tiaveb8x9l] {
        background-color: #6c757d;
        opacity: 0.65;
        cursor: not-allowed;
    }

/* ===== MODAL STYLES ===== */
.modal-content[b-tiaveb8x9l] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-tiaveb8x9l] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-tiaveb8x9l] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-tiaveb8x9l] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-tiaveb8x9l] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-tiaveb8x9l] {
            opacity: 1;
        }

.modal-body[b-tiaveb8x9l] {
    padding: 2rem;
}

.modal-footer[b-tiaveb8x9l] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.form-label[b-tiaveb8x9l] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.form-control[b-tiaveb8x9l], .form-select[b-tiaveb8x9l] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control:focus[b-tiaveb8x9l], .form-select:focus[b-tiaveb8x9l] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        outline: none;
    }

    .form-control:disabled[b-tiaveb8x9l], .form-select:disabled[b-tiaveb8x9l] {
        background-color: #e9ecef;
        cursor: not-allowed;
        opacity: 0.7;
    }

.btn-primary[b-tiaveb8x9l] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-primary:hover[b-tiaveb8x9l] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    }

    .btn-primary:disabled[b-tiaveb8x9l] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        opacity: 0.65;
        cursor: not-allowed;
        transform: none;
    }

.btn-secondary[b-tiaveb8x9l] {
    background-color: #6c757d;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    color: white;
}

    .btn-secondary:hover[b-tiaveb8x9l] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

    .btn-secondary:disabled[b-tiaveb8x9l] {
        background-color: #6c757d;
        opacity: 0.65;
        cursor: not-allowed;
        transform: none;
    }

/* ===== PAGINATION ===== */
.pagination-wrapper[b-tiaveb8x9l] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
    flex-wrap: wrap;
    gap: 1rem;
}

.showing-entries[b-tiaveb8x9l] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-tiaveb8x9l] {
    margin: 0;
}

.page-link[b-tiaveb8x9l] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
    background-color: white;
    cursor: pointer;
}

    .page-link:hover[b-tiaveb8x9l] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
        transform: translateY(-2px);
    }

    .page-link:disabled[b-tiaveb8x9l] {
        color: #6c757d;
        cursor: not-allowed;
        opacity: 0.65;
    }

.page-item.active .page-link[b-tiaveb8x9l] {
    color: white;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* ===== EMPTY STATE ===== */
.empty-state[b-tiaveb8x9l] {
    text-align: center;
    padding: 3rem 2rem;
    color: #6c757d;
}

    .empty-state i[b-tiaveb8x9l] {
        font-size: 4rem;
        color: #dee2e6;
        margin-bottom: 1rem;
    }

/* ===== RESPONSIVE DESIGN ===== */
@media (max-width: 768px) {
    .content-card[b-tiaveb8x9l] {
        padding: 1.5rem 1rem;
    }

    .search-filter-bar[b-tiaveb8x9l] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-box[b-tiaveb8x9l] {
        max-width: 100%;
    }

    .filter-group[b-tiaveb8x9l] {
        flex-direction: column;
    }

    .entries-select[b-tiaveb8x9l] {
        width: 100%;
    }

    .positions-table[b-tiaveb8x9l] {
        font-size: 0.85rem;
    }

        .positions-table thead th[b-tiaveb8x9l],
        .positions-table tbody td[b-tiaveb8x9l] {
            padding: 0.75rem 0.5rem;
        }

    .action-buttons[b-tiaveb8x9l] {
        flex-direction: column;
    }

        .action-buttons .btn-action[b-tiaveb8x9l] {
            width: 100%;
            justify-content: center;
        }

    .pagination-wrapper[b-tiaveb8x9l] {
        flex-direction: column;
        align-items: stretch;
    }

    .showing-entries[b-tiaveb8x9l] {
        text-align: center;
    }

    .pagination[b-tiaveb8x9l] {
        justify-content: center;
    }

    .modal-body[b-tiaveb8x9l] {
        padding: 1.5rem 1rem;
    }

    .modal-footer[b-tiaveb8x9l] {
        padding: 1rem;
    }

    .add-new-btn[b-tiaveb8x9l] {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .content-card[b-tiaveb8x9l] {
        padding: 1rem;
        border-radius: 8px;
    }

    .page-title[b-tiaveb8x9l] {
        font-size: 1.5rem;
    }

    .breadcrumb[b-tiaveb8x9l] {
        font-size: 0.8rem;
    }

    .search-box input[b-tiaveb8x9l] {
        font-size: 0.9rem;
        padding: 0.55rem 0.75rem 0.55rem 2.5rem;
    }

    .entries-select[b-tiaveb8x9l] {
        font-size: 0.85rem;
        padding: 0.4rem 0.75rem;
    }

    .positions-table[b-tiaveb8x9l] {
        font-size: 0.75rem;
    }

        .positions-table thead th[b-tiaveb8x9l] {
            padding: 0.5rem 0.25rem;
        }

        .positions-table tbody td[b-tiaveb8x9l] {
            padding: 0.5rem 0.25rem;
        }

    .btn-action[b-tiaveb8x9l] {
        padding: 0.4rem 0.5rem;
        font-size: 0.8rem;
    }

    .modal-header[b-tiaveb8x9l] {
        padding: 1rem;
    }

    .modal-body[b-tiaveb8x9l] {
        padding: 1rem;
    }

    .add-new-btn[b-tiaveb8x9l] {
        padding: 0.6rem 1rem;
        font-size: 0.9rem;
    }
}

/* _content/AccountingSystem.Web/Components/Pages/POS/CashierShiftManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-vvmh20pt1h] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-vvmh20pt1h] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-vvmh20pt1h] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-vvmh20pt1h] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-vvmh20pt1h]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-vvmh20pt1h] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-vvmh20pt1h] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-vvmh20pt1h] {
    color: #6c757d;
}

.add-new-btn[b-vvmh20pt1h] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-vvmh20pt1h] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-vvmh20pt1h] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-vvmh20pt1h] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-vvmh20pt1h] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-vvmh20pt1h] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-vvmh20pt1h] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FORM CONTROLS ==================== */
.form-control-custom[b-vvmh20pt1h],
.form-select-custom[b-vvmh20pt1h] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-vvmh20pt1h],
.form-select-custom:focus[b-vvmh20pt1h] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.form-label[b-vvmh20pt1h] {
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-vvmh20pt1h] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.search-box[b-vvmh20pt1h] {
    position: relative;
    width: 100%;
}

.search-box i[b-vvmh20pt1h] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box input[b-vvmh20pt1h] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-vvmh20pt1h] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-vvmh20pt1h] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-vvmh20pt1h] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-vvmh20pt1h] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-vvmh20pt1h] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-vvmh20pt1h] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn:disabled[b-vvmh20pt1h] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== TABLE STYLES ==================== */
.shifts-table-container[b-vvmh20pt1h] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.shifts-table[b-vvmh20pt1h] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.shifts-table thead[b-vvmh20pt1h] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.shifts-table thead tr th[b-vvmh20pt1h] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.shifts-table thead th:first-child[b-vvmh20pt1h] {
    border-top-left-radius: 12px;
}

.shifts-table thead th:last-child[b-vvmh20pt1h] {
    border-top-right-radius: 12px;
}

.shifts-table tbody tr[b-vvmh20pt1h] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.shifts-table tbody tr:hover[b-vvmh20pt1h] {
    background-color: #f8f9fa;
}

.shifts-table tbody td[b-vvmh20pt1h] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

/* ==================== BADGE STYLES ==================== */
.badge[b-vvmh20pt1h] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.pos-code[b-vvmh20pt1h] {
    font-weight: 600;
    color: var(--primary-color);
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-vvmh20pt1h] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-vvmh20pt1h] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
    padding: 0;
}

.btn-action-icon:hover[b-vvmh20pt1h] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-edit:hover[b-vvmh20pt1h] {
    background: #0056b3;
    color: white;
}

.btn-action-icon.btn-end-shift:hover[b-vvmh20pt1h] {
    background: #28a745;
    color: white;
}

/* ==================== TABLE SUMMARY ==================== */
.table-summary[b-vvmh20pt1h] {
    display: flex;
    align-items: center;
    padding: 1.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
    gap: 2rem;
}

.summary-item[b-vvmh20pt1h] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
    color: #495057;
}

.summary-item i[b-vvmh20pt1h] {
    color: var(--secondary-color);
    font-size: 1rem;
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-vvmh20pt1h] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-vvmh20pt1h] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-vvmh20pt1h] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-vvmh20pt1h] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== ALERTS ==================== */
.alert[b-vvmh20pt1h] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-vvmh20pt1h] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-vvmh20pt1h] {
    color: var(--secondary-color);
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
    .page-title[b-vvmh20pt1h] {
        font-size: 1.5rem;
    }

    .content-card[b-vvmh20pt1h] {
        padding: 1.5rem;
    }

    .filter-section[b-vvmh20pt1h] {
        padding: 0.75rem;
    }

    .table-summary[b-vvmh20pt1h] {
        flex-direction: column;
        gap: 0.75rem;
        align-items: flex-start;
    }
}

@media (max-width: 576px) {
    .page-header[b-vvmh20pt1h] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-vvmh20pt1h] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/POS/DeviceManagement.razor.rz.scp.css */
/* Device Management - matches POS Settings styling */
.page-header[b-3ewxfcn8q1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-3ewxfcn8q1] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-3ewxfcn8q1] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.add-new-btn[b-3ewxfcn8q1] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.add-new-btn:hover[b-3ewxfcn8q1] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.content-card[b-3ewxfcn8q1] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-3ewxfcn8q1] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-3ewxfcn8q1] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-subtitle-custom[b-3ewxfcn8q1] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

.filter-section[b-3ewxfcn8q1] {
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1.5rem;
}

.search-box[b-3ewxfcn8q1] {
    position: relative;
    width: 100%;
}

.search-box input[b-3ewxfcn8q1] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
}

.search-box i[b-3ewxfcn8q1] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
}

.form-control-custom[b-3ewxfcn8q1],
.form-select-custom[b-3ewxfcn8q1] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
}

.form-label[b-3ewxfcn8q1] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.pos-table-container[b-3ewxfcn8q1] {
    overflow-x: auto;
    border-radius: 12px;
}

.pos-table[b-3ewxfcn8q1] {
    width: 100%;
    margin-bottom: 0;
}

.pos-table thead[b-3ewxfcn8q1] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.pos-table thead th[b-3ewxfcn8q1] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
}

.pos-table tbody tr:hover[b-3ewxfcn8q1] {
    background-color: #f8f9fa;
}

.pos-table tbody td[b-3ewxfcn8q1] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
}

.pos-code[b-3ewxfcn8q1] {
    font-weight: 600;
    font-family: monospace;
}

.action-buttons[b-3ewxfcn8q1] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-3ewxfcn8q1] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    cursor: pointer;
}

.btn-action-icon:hover[b-3ewxfcn8q1] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-delete:hover[b-3ewxfcn8q1] {
    background: #dc3545;
    color: white;
}

.table-summary[b-3ewxfcn8q1] {
    display: flex;
    align-items: center;
    gap: 2rem;
    margin-top: 1.5rem;
    padding: 1.25rem;
    background: #f8f9fa;
    border-radius: 0 0 12px 12px;
}

.summary-item[b-3ewxfcn8q1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.alert-info[b-3ewxfcn8q1] {
    background: #fff8e1;
    border: 1px solid var(--secondary-color);
    border-radius: 12px;
    padding: 1rem 1.25rem;
}
/* _content/AccountingSystem.Web/Components/Pages/POS/POSSettings.razor.rz.scp.css */
/* POS Settings page - reuses BankManagement-style layout */
.page-header[b-f79qkksdug] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-f79qkksdug] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-f79qkksdug] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-f79qkksdug] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.add-new-btn[b-f79qkksdug] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.add-new-btn:hover[b-f79qkksdug] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.content-card[b-f79qkksdug] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-f79qkksdug] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-f79qkksdug] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-subtitle-custom[b-f79qkksdug] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

.filter-section[b-f79qkksdug] {
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1.5rem;
}

.search-box[b-f79qkksdug] {
    position: relative;
    width: 100%;
}

.search-box input[b-f79qkksdug] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
}

.search-box i[b-f79qkksdug] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
}

.form-control-custom[b-f79qkksdug],
.form-select-custom[b-f79qkksdug] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
}

.form-label[b-f79qkksdug] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.pos-table-container[b-f79qkksdug] {
    overflow-x: auto;
    border-radius: 12px;
}

.pos-table[b-f79qkksdug] {
    width: 100%;
    margin-bottom: 0;
}

.pos-table thead[b-f79qkksdug] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.pos-table thead th[b-f79qkksdug] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
}

.pos-table tbody tr:hover[b-f79qkksdug] {
    background-color: #f8f9fa;
}

.pos-table tbody td[b-f79qkksdug] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
}

.pos-code[b-f79qkksdug] {
    font-weight: 600;
    font-family: monospace;
}

.action-buttons[b-f79qkksdug] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-f79qkksdug] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    cursor: pointer;
}

.btn-action-icon:hover[b-f79qkksdug] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-delete:hover[b-f79qkksdug] {
    background: #dc3545;
    color: white;
}

.table-summary[b-f79qkksdug] {
    display: flex;
    align-items: center;
    gap: 2rem;
    margin-top: 1.5rem;
    padding: 1.25rem;
    background: #f8f9fa;
    border-radius: 0 0 12px 12px;
}

.summary-item[b-f79qkksdug] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.alert-info[b-f79qkksdug] {
    background: #fff8e1;
    border: 1px solid var(--secondary-color);
    border-radius: 12px;
    padding: 1rem 1.25rem;
}
/* _content/AccountingSystem.Web/Components/Pages/Procurement/PurchaseDashboard.razor.rz.scp.css */
/* Dashboard Cards */
.dashboard-card[b-la6394nrmp] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

    .dashboard-card:hover[b-la6394nrmp] {
        transform: translateY(-2px);
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    }

.card-icon[b-la6394nrmp] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-la6394nrmp] {
    color: #6c757d;
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-la6394nrmp] {
    color: var(--primary-color);
    font-size: 1.75rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    line-height: 1.2;
}

.card-change[b-la6394nrmp] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
}

    .card-change.positive[b-la6394nrmp] {
        color: #28a745;
    }

    .card-change.warning[b-la6394nrmp] {
        color: #ffc107;
    }

    .card-change.info[b-la6394nrmp] {
        color: #17a2b8;
    }

    .card-change i[b-la6394nrmp] {
        margin-right: 0.25rem;
    }

/* Content Card */
.content-card[b-la6394nrmp] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

.card-header-custom[b-la6394nrmp] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-la6394nrmp] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-la6394nrmp] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-la6394nrmp] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Page Header */
.page-header[b-la6394nrmp] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-la6394nrmp] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-la6394nrmp] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-la6394nrmp] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-la6394nrmp]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-la6394nrmp] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-la6394nrmp] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-la6394nrmp] {
    color: #6c757d;
}

.add-new-btn[b-la6394nrmp] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

    .add-new-btn:hover[b-la6394nrmp] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

/* Filter Section */
.filter-section[b-la6394nrmp] {
    margin-bottom: 1.5rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 12px;
    border: 2px solid #dee2e6;
}

.filter-label[b-la6394nrmp] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    display: block;
}

.search-box[b-la6394nrmp] {
    position: relative;
    width: 100%;
}

    .search-box input[b-la6394nrmp] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-la6394nrmp] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-la6394nrmp] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: var(--secondary-color);
        font-size: 1.1rem;
    }

.form-select-custom[b-la6394nrmp], .form-control-custom[b-la6394nrmp] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-select-custom:focus[b-la6394nrmp], .form-control-custom:focus[b-la6394nrmp] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Buttons */
.btn[b-la6394nrmp] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-filter[b-la6394nrmp] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
    color: white;
    border: none;
}

    .btn-filter:hover:not(:disabled)[b-la6394nrmp] {
        background: linear-gradient(135deg, #a00000 0%, var(--primary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(139, 0, 0, 0.2);
    }

.btn-secondary[b-la6394nrmp] {
    background-color: #6c757d;
    border: none;
}

    .btn-secondary:hover[b-la6394nrmp] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

.btn-reset[b-la6394nrmp] {
    background-color: #6c757d;
    color: white;
    border: none;
}

    .btn-reset:hover:not(:disabled)[b-la6394nrmp] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

.btn-filter:disabled[b-la6394nrmp],
.btn-reset:disabled[b-la6394nrmp],
.btn-secondary:disabled[b-la6394nrmp] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

.btn-primary-filter[b-la6394nrmp] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    transition: all 0.3s ease;
}

    .btn-primary-filter:hover[b-la6394nrmp] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

/* Active Filters Display */
.active-filters[b-la6394nrmp] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    background: white;
    border-radius: 8px;
    border: 2px solid #e9ecef;
}

.filter-tag[b-la6394nrmp] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.85rem;
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
}

    .filter-tag i[b-la6394nrmp] {
        cursor: pointer;
        opacity: 0.8;
        transition: opacity 0.2s;
    }

        .filter-tag i:hover[b-la6394nrmp] {
            opacity: 1;
        }

/* Table Container */
.checks-table-container[b-la6394nrmp] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

/* Modern Table Styles */
.checks-table-modern[b-la6394nrmp] {
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    min-width: 900px;
}

    .checks-table-modern thead[b-la6394nrmp] {
        background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
        color: white;
    }

        .checks-table-modern thead th[b-la6394nrmp] {
            padding: 1rem 0.75rem;
            font-weight: 600;
            font-size: 0.9rem;
            text-align: left;
            border: none;
            white-space: nowrap;
        }

            .checks-table-modern thead th:first-child[b-la6394nrmp] {
                border-top-left-radius: 12px;
            }

            .checks-table-modern thead th:last-child[b-la6394nrmp] {
                border-top-right-radius: 12px;
            }

    .checks-table-modern tbody .main-row[b-la6394nrmp] {
        background: white;
        transition: all 0.2s;
        border-bottom: 1px solid #e9ecef;
    }

        .checks-table-modern tbody .main-row:hover[b-la6394nrmp] {
            background: #f8f9fa;
            transform: scale(1.001);
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
        }

        .checks-table-modern tbody .main-row td[b-la6394nrmp] {
            padding: 0.875rem 0.75rem;
            vertical-align: middle;
            font-size: 0.9rem;
            cursor: pointer;
        }

/* Date Cell */
.date-cell[b-la6394nrmp] {
    cursor: pointer;
}

.date-wrapper[b-la6394nrmp] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

    .date-wrapper i[b-la6394nrmp] {
        color: var(--secondary-color);
        font-size: 0.875rem;
    }

/* AP Code */
.ap-code[b-la6394nrmp] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 0.95rem;
    font-family: 'Courier New', monospace;
}

/* Amount Highlight */
.amount-highlight[b-la6394nrmp] {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1rem;
}

/* Expand Button */
.btn-expand[b-la6394nrmp] {
    background: none;
    border: none;
    padding: 0.25rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: transform 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .btn-expand i[b-la6394nrmp] {
        font-size: 1rem;
        transition: transform 0.2s;
    }

    .btn-expand.expanded i[b-la6394nrmp] {
        transform: rotate(90deg);
    }

    .btn-expand:hover[b-la6394nrmp] {
        background: rgba(212, 175, 55, 0.15);
        border-radius: 4px;
    }

/* Action Icon Button */
.btn-action-icon[b-la6394nrmp] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

    .btn-action-icon:hover[b-la6394nrmp] {
        background: var(--primary-color);
        color: white;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
    }

/* Expandable Row */
.expandable-row[b-la6394nrmp] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-bottom: 2px solid var(--secondary-color);
}

    .expandable-row td[b-la6394nrmp] {
        padding: 0 !important;
    }

.expanded-content[b-la6394nrmp] {
    padding: 2rem;
    border-top: 2px solid var(--secondary-color);
}

/* Detail Sections */
.detail-section[b-la6394nrmp] {
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 2px dashed #dee2e6;
}

    .detail-section:last-child[b-la6394nrmp] {
        margin-bottom: 0;
        border-bottom: none;
    }

.section-title[b-la6394nrmp] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
}

    .section-title i[b-la6394nrmp] {
        color: var(--secondary-color);
    }

.detail-grid[b-la6394nrmp] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.detail-item[b-la6394nrmp] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    .detail-item.full-width[b-la6394nrmp] {
        grid-column: 1 / -1;
    }

    .detail-item label[b-la6394nrmp] {
        color: #495057;
        font-weight: 600;
        font-size: 0.9rem;
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

        .detail-item label i[b-la6394nrmp] {
            color: var(--secondary-color);
        }

    .detail-item span[b-la6394nrmp] {
        font-size: 0.95rem;
        color: #212529;
        font-weight: 500;
    }

.particulars-content[b-la6394nrmp] {
    background: white;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    color: #212529;
    line-height: 1.6;
}

/* Mobile Card View */
.checks-cards-container[b-la6394nrmp] {
    display: none;
}

.check-card[b-la6394nrmp] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    margin-bottom: 1rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    cursor: pointer;
    border: 1px solid rgba(0,0,0,0.05);
}

    .check-card:hover[b-la6394nrmp] {
        transform: translateY(-2px);
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    }

.card-header-row[b-la6394nrmp] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid #f1f3f5;
}

.voucher-info[b-la6394nrmp] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.date-mobile[b-la6394nrmp] {
    font-size: 0.85rem;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

    .date-mobile i[b-la6394nrmp] {
        color: var(--secondary-color);
    }

.amount-mobile[b-la6394nrmp] {
    font-weight: 700;
    color: var(--primary-color);
    font-size: 1.1rem;
}

.card-body-row[b-la6394nrmp] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

.info-group[b-la6394nrmp] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

    .info-group i[b-la6394nrmp] {
        color: var(--secondary-color);
        font-size: 1.25rem;
        margin-top: 0.25rem;
    }

.info-content[b-la6394nrmp] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
}

    .info-content label[b-la6394nrmp] {
        font-size: 0.75rem;
        font-weight: 600;
        color: #6c757d;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .info-content span[b-la6394nrmp] {
        font-size: 0.9rem;
        font-weight: 500;
        color: #212529;
    }

.card-divider[b-la6394nrmp] {
    height: 2px;
    background: linear-gradient(90deg, transparent, #dee2e6, transparent);
    margin: 1rem 0;
}

.card-details-grid[b-la6394nrmp] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.detail-row[b-la6394nrmp] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #495057;
}

    .detail-row i[b-la6394nrmp] {
        color: var(--secondary-color);
    }

/* Pagination */
.pagination-wrapper[b-la6394nrmp] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
    border-top: 2px solid #dee2e6;
}

.showing-entries[b-la6394nrmp] {
    font-size: 0.9rem;
    color: #495057;
    font-weight: 500;
}

    .showing-entries span[b-la6394nrmp] {
        font-weight: 700;
        color: var(--primary-color);
    }

.pagination[b-la6394nrmp] {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

.page-item[b-la6394nrmp] {
    margin: 0;
}

.page-link[b-la6394nrmp] {
    padding: 0.65rem 1rem;
    border: 2px solid #e9ecef;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

    .page-link:hover:not(:disabled)[b-la6394nrmp] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        color: var(--primary-color);
        border-color: var(--secondary-color);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    }

.page-item.active .page-link[b-la6394nrmp] {
    background: linear-gradient(135deg, var(--primary-color) 0%, #a00000 100%);
    color: white;
    border-color: var(--primary-color);
}

.page-item.disabled .page-link[b-la6394nrmp],
.page-link:disabled[b-la6394nrmp] {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

/* Modal Styles */
.modal-content[b-la6394nrmp] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-la6394nrmp] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
    background: white;
}

.modal-title[b-la6394nrmp] {
    color: var(--primary-color);
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .modal-title i[b-la6394nrmp] {
        color: var(--secondary-color);
    }

.modal-body[b-la6394nrmp] {
    padding: 2rem;
}

.modal-footer[b-la6394nrmp] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Filter Modal Styles */
.filter-modal-label[b-la6394nrmp] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .filter-modal-label i[b-la6394nrmp] {
        color: var(--secondary-color);
    }

/* Alert Styles */
.alert[b-la6394nrmp] {
    border-radius: 8px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    border: 2px solid;
}

.alert-info[b-la6394nrmp] {
    background: linear-gradient(135deg, #e7f3ff 0%, #cce5ff 100%);
    border-color: #b3d9ff;
    color: #004085;
}

    .alert-info i[b-la6394nrmp] {
        color: #0066cc;
    }

/* Responsive Design */
@media (max-width: 768px) {
    .page-header[b-la6394nrmp] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
        padding-bottom: 1rem;
        margin-bottom: 1.5rem;
    }

    .page-title[b-la6394nrmp] {
        font-size: 1.5rem;
    }

        .page-title i[b-la6394nrmp] {
            font-size: 1.5rem;
        }

    .breadcrumb[b-la6394nrmp] {
        font-size: 0.8rem;
    }

    .add-new-btn[b-la6394nrmp] {
        width: 100%;
        justify-content: center;
        padding: 0.65rem 1.25rem;
        font-size: 0.9rem;
    }

    .content-card[b-la6394nrmp] {
        padding: 1.5rem;
    }

    .filter-section[b-la6394nrmp] {
        padding: 1rem;
    }

    .dashboard-card[b-la6394nrmp] {
        padding: 1.25rem;
    }

    .card-icon[b-la6394nrmp] {
        width: 50px;
        height: 50px;
        font-size: 1.5rem;
    }

    .card-value[b-la6394nrmp] {
        font-size: 1.5rem;
    }

    .card-title[b-la6394nrmp] {
        font-size: 0.85rem;
    }

    .card-change[b-la6394nrmp] {
        font-size: 0.8rem;
    }

    .checks-table-container.desktop-view[b-la6394nrmp] {
        display: none;
    }

    .checks-cards-container.mobile-view[b-la6394nrmp] {
        display: block;
    }

    .pagination-wrapper[b-la6394nrmp] {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }

    .pagination[b-la6394nrmp] {
        justify-content: center;
        flex-wrap: wrap;
    }

    .card-body-row[b-la6394nrmp] {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 769px) {
    .checks-table-container.desktop-view[b-la6394nrmp] {
        display: block;
    }

    .checks-cards-container.mobile-view[b-la6394nrmp] {
        display: none;
    }
}

@media (max-width: 576px) {
    .page-title[b-la6394nrmp] {
        font-size: 1.25rem;
    }

        .page-title i[b-la6394nrmp] {
            font-size: 1.25rem;
        }

    .dashboard-card[b-la6394nrmp] {
        padding: 1rem;
    }

    .card-icon[b-la6394nrmp] {
        width: 45px;
        height: 45px;
        font-size: 1.25rem;
    }

    .card-value[b-la6394nrmp] {
        font-size: 1.25rem;
    }

    .content-card[b-la6394nrmp] {
        padding: 1rem;
    }

    .check-card[b-la6394nrmp] {
        padding: 1rem;
    }

    .search-box input[b-la6394nrmp] {
        padding: 0.55rem 0.85rem 0.55rem 2.25rem;
        font-size: 0.85rem;
    }

    .btn-filter[b-la6394nrmp],
    .btn-reset[b-la6394nrmp],
    .btn-secondary[b-la6394nrmp] {
        padding: 0.55rem 0.85rem;
        font-size: 0.8rem;
    }

    .active-filters[b-la6394nrmp] {
        padding: 0.5rem;
    }

    .filter-tag[b-la6394nrmp] {
        font-size: 0.7rem;
        padding: 0.3rem 0.55rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Procurement/PurchaseEntry.razor.rz.scp.css */
/* Content Card */
.content-card[b-l6ozs94mrl] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Card Header */
.card-header-custom[b-l6ozs94mrl] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-l6ozs94mrl] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-l6ozs94mrl] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-l6ozs94mrl] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Form Controls */
.form-label[b-l6ozs94mrl] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

    .form-label i[b-l6ozs94mrl] {
        color: var(--secondary-color);
    }

.form-control-custom[b-l6ozs94mrl], .form-select-custom[b-l6ozs94mrl] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control-custom:focus[b-l6ozs94mrl], .form-select-custom:focus[b-l6ozs94mrl] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Section Divider */
.section-divider[b-l6ozs94mrl] {
    margin: 2rem 0 1.5rem;
    padding-top: 1.5rem;
    border-top: 2px dashed #dee2e6;
}

.section-title[b-l6ozs94mrl] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
}

    .section-title i[b-l6ozs94mrl] {
        color: var(--secondary-color);
    }

/* Totals Display */
.totals-display[b-l6ozs94mrl] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid var(--secondary-color);
    border-radius: 12px;
    padding: 1.25rem;
    margin-top: 1.85rem;
}

.total-item[b-l6ozs94mrl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
}

    .total-item.balance[b-l6ozs94mrl] {
        border-top: 2px solid var(--primary-color);
        padding-top: 1rem;
        margin-top: 0.5rem;
    }

.total-label[b-l6ozs94mrl] {
    font-weight: 600;
    color: #495057;
    font-size: 0.95rem;
}

.total-value[b-l6ozs94mrl] {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--primary-color);
}

/* Action Buttons */
.action-buttons-container[b-l6ozs94mrl] {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 2px solid #f1f3f5;
}

.btn[b-l6ozs94mrl] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-l6ozs94mrl] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

    .btn-primary:hover[b-l6ozs94mrl] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.btn-secondary[b-l6ozs94mrl] {
    background-color: #6c757d;
    border: none;
}

    .btn-secondary:hover[b-l6ozs94mrl] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

.btn-warning[b-l6ozs94mrl] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #495057;
    border: none;
}

    .btn-warning:hover[b-l6ozs94mrl] {
        background: linear-gradient(135deg, #e0a800 0%, #ffc107 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(255, 193, 7, 0.4);
        color: #495057;
    }

.btn-info[b-l6ozs94mrl] {
    background: linear-gradient(135deg, #0dcaf0 0%, #0aa2c0 100%);
    color: white;
    border: none;
}

    .btn-info:hover[b-l6ozs94mrl] {
        background: linear-gradient(135deg, #0aa2c0 0%, #0dcaf0 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(13, 202, 240, 0.4);
        color: white;
    }

/* Page Header */
.page-header[b-l6ozs94mrl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-l6ozs94mrl] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-l6ozs94mrl] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-l6ozs94mrl] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-l6ozs94mrl]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-l6ozs94mrl] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-l6ozs94mrl] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-l6ozs94mrl] {
    color: #6c757d;
}

/* Print Voucher Styles */
.print-voucher[b-l6ozs94mrl] {
    padding: 40px;
    background: #e8f0f8;
    font-family: Arial, sans-serif;
}

.voucher-header[b-l6ozs94mrl] {
    text-align: center;
    margin-bottom: 10px;
}

.company-name[b-l6ozs94mrl] {
    font-size: 24px;
    font-weight: bold;
    margin: 0;
    color: #000;
}

.company-address[b-l6ozs94mrl] {
    font-size: 16px;
    margin: 5px 0 0;
    color: #000;
}

.document-title[b-l6ozs94mrl] {
    text-align: center;
    margin: 20px 0;
}

    .document-title h4[b-l6ozs94mrl] {
        font-size: 20px;
        font-weight: bold;
        margin: 0;
        color: #000;
    }

.voucher-divider[b-l6ozs94mrl] {
    border: none;
    border-top: 2px solid #000;
    margin: 20px 0;
}

.voucher-details[b-l6ozs94mrl] {
    margin: 25px 0;
}

.detail-row[b-l6ozs94mrl] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
}

.detail-item[b-l6ozs94mrl] {
    flex: 1;
    display: flex;
    gap: 10px;
}

    .detail-item.full-width[b-l6ozs94mrl] {
        flex: 2;
    }

.detail-label[b-l6ozs94mrl] {
    font-weight: bold;
    min-width: 80px;
    color: #000;
}

.detail-value[b-l6ozs94mrl] {
    color: #000;
}

.particulars-section[b-l6ozs94mrl] {
    margin: 25px 0;
}

.section-heading[b-l6ozs94mrl] {
    font-weight: bold;
    margin-bottom: 15px;
    color: #000;
    font-size: 16px;
}

.particulars-table[b-l6ozs94mrl] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
    background: white;
}

    .particulars-table th[b-l6ozs94mrl],
    .particulars-table td[b-l6ozs94mrl] {
        border: 1px solid #000;
        padding: 10px;
        text-align: left;
        color: #000;
    }

    .particulars-table th[b-l6ozs94mrl] {
        background-color: #d0d0d0;
        font-weight: bold;
    }

    .particulars-table .text-end[b-l6ozs94mrl] {
        text-align: right;
    }

.signatures-section[b-l6ozs94mrl] {
    display: flex;
    justify-content: space-between;
    margin-top: 50px;
    gap: 20px;
}

.signature-box[b-l6ozs94mrl] {
    flex: 1;
    text-align: center;
}

.signature-label[b-l6ozs94mrl] {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 40px;
    color: #000;
}

.signature-line[b-l6ozs94mrl] {
    /*border-bottom: 2px solid #000;*/
    margin: 0 10px 8px;
}

.signature-name[b-l6ozs94mrl] {
    font-size: 13px;
    color: #000;
}

.signature-subtitle[b-l6ozs94mrl] {
    font-size: 11px;
    font-style: italic;
    margin-top: 5px;
    color: #000;
}

/* Modal Styles */
.modal-content[b-l6ozs94mrl] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-xl[b-l6ozs94mrl] {
    max-width: 900px;
}

.modal-header[b-l6ozs94mrl] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-l6ozs94mrl] {
    padding: 0;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-l6ozs94mrl] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Toast */
.toast[b-l6ozs94mrl] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Accounting Entries Styles */
.accounting-entries-container[b-l6ozs94mrl] {
    background: white;
    border: 2px solid #e9ecef;
    border-radius: 12px;
    padding: 1.25rem;
    height: 100%;
    transition: all 0.3s ease;
}

    .accounting-entries-container:hover[b-l6ozs94mrl] {
        border-color: var(--secondary-color);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.1);
    }

.entries-header[b-l6ozs94mrl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #f1f3f5;
}

.entries-title[b-l6ozs94mrl] {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
}

    .entries-title i[b-l6ozs94mrl] {
        color: var(--secondary-color);
    }

.btn-add-entry[b-l6ozs94mrl] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.4rem 0.8rem;
    font-size: 0.85rem;
    font-weight: 600;
    border-radius: 6px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

    .btn-add-entry:hover[b-l6ozs94mrl] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-1px);
        box-shadow: 0 3px 8px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.entry-row[b-l6ozs94mrl] {
    margin-bottom: 0.75rem;
}

.entry-fields[b-l6ozs94mrl] {
    display: grid;
    grid-template-columns: 2fr 1fr auto;
    gap: 0.5rem;
    align-items: start;
}

.entry-account input[b-l6ozs94mrl],
.entry-amount input[b-l6ozs94mrl] {
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 0.5rem;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

    .entry-account input:focus[b-l6ozs94mrl],
    .entry-amount input:focus[b-l6ozs94mrl] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.15rem rgba(212, 175, 55, 0.15);
        outline: none;
    }

.btn-remove-entry[b-l6ozs94mrl] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
    border: none;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    transition: all 0.3s ease;
    font-size: 0.9rem;
}

    .btn-remove-entry:hover[b-l6ozs94mrl] {
        background: linear-gradient(135deg, #c82333 0%, #bd2130 100%);
        transform: scale(1.05);
        box-shadow: 0 2px 6px rgba(220, 53, 69, 0.4);
    }

.empty-entries-message[b-l6ozs94mrl] {
    text-align: center;
    padding: 2rem 1rem;
    color: #6c757d;
    font-size: 0.9rem;
    font-style: italic;
}

.entries-total[b-l6ozs94mrl] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 2px solid var(--primary-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .entries-total .total-label[b-l6ozs94mrl] {
        font-weight: 700;
        color: #495057;
        font-size: 1rem;
    }

    .entries-total .total-value[b-l6ozs94mrl] {
        font-weight: 700;
        font-size: 1.15rem;
        color: var(--primary-color);
    }

/* Validation Summary */
.validation-summary[b-l6ozs94mrl] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid #dee2e6;
    border-radius: 12px;
    padding: 1.25rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    transition: all 0.3s ease;
}

    .validation-summary.balanced[b-l6ozs94mrl] {
        border-color: #28a745;
        background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
    }

    .validation-summary.unbalanced[b-l6ozs94mrl] {
        border-color: #dc3545;
        background: linear-gradient(135deg, #f8d7da 0%, #f5c6cb 100%);
    }

    .validation-summary.warning[b-l6ozs94mrl] {
        border-color: #ffc107;
        background: linear-gradient(135deg, #fff3cd 0%, #ffeaa7 100%);
    }

.validation-item[b-l6ozs94mrl] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    .validation-item.validation-status[b-l6ozs94mrl] {
        grid-column: 1 / -1;
        border-top: 2px solid rgba(0,0,0,0.1);
        padding-top: 1rem;
        margin-top: 0.5rem;
    }

.validation-label[b-l6ozs94mrl] {
    font-weight: 600;
    color: #495057;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.validation-value[b-l6ozs94mrl] {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--primary-color);
}

.validation-item.validation-status .validation-value[b-l6ozs94mrl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1rem;
}

/* Print Preview Updates */
.particulars-section p[b-l6ozs94mrl] {
    margin: 0.5rem 0;
    font-size: 14px;
}

    .particulars-section p strong[b-l6ozs94mrl] {
        color: #000;
        font-weight: bold;
    }

.total-row[b-l6ozs94mrl] {
    background-color: #f0f0f0;
    font-weight: bold;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-title[b-l6ozs94mrl] {
        font-size: 1.5rem;
    }

    .content-card[b-l6ozs94mrl] {
        padding: 1.5rem;
    }

    .action-buttons-container[b-l6ozs94mrl] {
        flex-direction: column;
    }

        .action-buttons-container .btn[b-l6ozs94mrl] {
            width: 100%;
        }

    .totals-display[b-l6ozs94mrl] {
        margin-top: 0;
    }

    .signatures-section[b-l6ozs94mrl] {
        flex-wrap: wrap;
        gap: 30px;
    }

    .signature-box[b-l6ozs94mrl] {
        flex: 0 0 calc(50% - 15px);
    }

    .print-voucher[b-l6ozs94mrl] {
        padding: 20px;
    }

    .detail-row[b-l6ozs94mrl] {
        flex-direction: column;
        gap: 8px;
    }

    /* Mobile adjustments for accounting entries */
    .entry-fields[b-l6ozs94mrl] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .btn-remove-entry[b-l6ozs94mrl] {
        width: 100%;
    }

    .validation-summary[b-l6ozs94mrl] {
        grid-template-columns: 1fr;
    }

    .entries-header[b-l6ozs94mrl] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .btn-add-entry[b-l6ozs94mrl] {
        width: 100%;
        justify-content: center;
    }
}

@media print {
    body *[b-l6ozs94mrl] {
        visibility: hidden;
    }

    .print-voucher[b-l6ozs94mrl], .print-voucher *[b-l6ozs94mrl] {
        visibility: visible;
    }

    .print-voucher[b-l6ozs94mrl] {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        background: white;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Profile/ActivityLogTable.razor.rz.scp.css */
.section-title[b-uvnkndsaln] {
    color: var(--primary-color);
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #e9ecef;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .section-title i[b-uvnkndsaln] {
        color: var(--secondary-color);
    }
/* _content/AccountingSystem.Web/Components/Pages/Profile/ProfileHeader.razor.rz.scp.css */

/* Profile Card */
.profile-card[b-p81skrz1ra] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
    overflow: hidden;
}

.profile-header[b-p81skrz1ra] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    padding: 2.5rem 2rem;
    text-align: center;
    position: relative;
}

.profile-avatar-wrapper[b-p81skrz1ra] {
    position: relative;
    display: inline-block;
}

.profile-avatar[b-p81skrz1ra] {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    border: 5px solid var(--secondary-color);
    object-fit: cover;
    box-shadow: 0 8px 24px rgba(0,0,0,0.3);
}

.avatar-upload-btn[b-p81skrz1ra] {
    position: absolute;
    bottom: 5px;
    right: 5px;
    width: 45px;
    height: 45px;
    background: var(--secondary-color);
    border: 3px solid white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .avatar-upload-btn:hover[b-p81skrz1ra] {
        background: var(--secondary-color);
        transform: scale(1.1);
    }

    .avatar-upload-btn i[b-p81skrz1ra] {
        color: var(--primary-color);
        font-size: 1.2rem;
    }

.profile-name[b-p81skrz1ra] {
    color: white;
    font-size: 1.75rem;
    font-weight: 700;
    margin-top: 1.5rem;
    margin-bottom: 0.5rem;
}

.profile-role[b-p81skrz1ra] {
    color: var(--secondary-color);
    font-size: 1.1rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
}

.profile-status[b-p81skrz1ra] {
    display: inline-block;
    padding: 0.5rem 1.25rem;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 20px;
    color: white;
    font-size: 0.9rem;
    margin-top: 1rem;
}

.profile-body[b-p81skrz1ra] {
    padding: 2.5rem;
}


/* _content/AccountingSystem.Web/Components/Pages/Profile/ProfilePage.razor.rz.scp.css */
/* Page Header */
.page-header[b-ha18x6m421] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-ha18x6m421] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-ha18x6m421] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-ha18x6m421] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-ha18x6m421]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-ha18x6m421] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-ha18x6m421] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-ha18x6m421] {
    color: #6c757d;
}

/* Profile Card */
.profile-card[b-ha18x6m421] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
    overflow: hidden;
}

.profile-header[b-ha18x6m421] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    padding: 2.5rem 2rem;
    text-align: center;
    position: relative;
}

.profile-avatar-wrapper[b-ha18x6m421] {
    position: relative;
    display: inline-block;
}

.profile-avatar[b-ha18x6m421] {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    border: 5px solid var(--secondary-color);
    object-fit: cover;
    box-shadow: 0 8px 24px rgba(0,0,0,0.3);
}

.avatar-upload-btn[b-ha18x6m421] {
    position: absolute;
    bottom: 5px;
    right: 5px;
    width: 45px;
    height: 45px;
    background: var(--secondary-color);
    border: 3px solid white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .avatar-upload-btn:hover[b-ha18x6m421] {
        background: var(--secondary-color);
        transform: scale(1.1);
    }

    .avatar-upload-btn i[b-ha18x6m421] {
        color: var(--primary-color);
        font-size: 1.2rem;
    }

.profile-name[b-ha18x6m421] {
    color: white;
    font-size: 1.75rem;
    font-weight: 700;
    margin-top: 1.5rem;
    margin-bottom: 0.5rem;
}

.profile-role[b-ha18x6m421] {
    color: var(--secondary-color);
    font-size: 1.1rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
}

.profile-status[b-ha18x6m421] {
    display: inline-block;
    padding: 0.5rem 1.25rem;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 20px;
    color: white;
    font-size: 0.9rem;
    margin-top: 1rem;
}

.profile-body[b-ha18x6m421] {
    padding: 2.5rem;
}

.section-title[b-ha18x6m421] {
    color: var(--primary-color);
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #e9ecef;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .section-title i[b-ha18x6m421] {
        color: var(--secondary-color);
    }

/* Info Grid */
.info-grid[b-ha18x6m421] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.info-item[b-ha18x6m421] {
    background: #f8f9fa;
    padding: 1.25rem;
    border-radius: 10px;
    border-left: 4px solid var(--secondary-color);
}

.info-label[b-ha18x6m421] {
    color: #6c757d;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

.info-value[b-ha18x6m421] {
    color: #212529;
    font-size: 1.05rem;
    font-weight: 500;
}

/* Action Buttons */
.action-buttons[b-ha18x6m421] {
    display: flex;
    gap: 1rem;
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 2px solid #e9ecef;
}

.btn-primary[b-ha18x6m421] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 2rem;
    font-weight: 700;
    border-radius: 8px;
    transition: all 0.3s ease;
    font-size: 1rem;
}

    .btn-primary:hover[b-ha18x6m421] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

.btn-secondary[b-ha18x6m421] {
    background-color: #6c757d;
    border: none;
    padding: 0.75rem 2rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    color: white;
}

    .btn-secondary:hover[b-ha18x6m421] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

.btn-danger[b-ha18x6m421] {
    background-color: #dc3545;
    border: none;
    padding: 0.75rem 2rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    color: white;
}

    .btn-danger:hover[b-ha18x6m421] {
        background-color: #bb2d3b;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(220, 53, 69, 0.3);
    }

/* Password Section */
.password-input-wrapper[b-ha18x6m421] {
    position: relative;
}

    .password-input-wrapper .form-control[b-ha18x6m421] {
        padding-right: 3rem;
    }

.password-toggle[b-ha18x6m421] {
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    color: #6c757d;
    font-size: 1.1rem;
    transition: color 0.3s ease;
}

    .password-toggle:hover[b-ha18x6m421] {
        color: var(--secondary-color);
    }

/* Alert Styles */
.alert-custom[b-ha18x6m421] {
    border-radius: 10px;
    border: none;
    padding: 1rem 1.25rem;
    margin-bottom: 1.5rem;
}

.alert-info[b-ha18x6m421] {
    background-color: #E3F2FD;
    color: #1565C0;
}

.alert-success[b-ha18x6m421] {
    background-color: #E8F5E9;
    color: #2E7D32;
}

.alert-warning[b-ha18x6m421] {
    background-color: #FFF3E0;
    color: #E65100;
}

/* Modal enhancements */
.modal-content[b-ha18x6m421] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-ha18x6m421] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-ha18x6m421] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-ha18x6m421] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-ha18x6m421] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-ha18x6m421] {
            opacity: 1;
        }

.modal-body[b-ha18x6m421] {
    padding: 2rem;
}

.modal-footer[b-ha18x6m421] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Responsive Design */
@media (max-width: 768px) {
    .sidebar[b-ha18x6m421] {
        left: calc(-1 * var(--sidebar-width));
    }

        .sidebar.mobile-open[b-ha18x6m421] {
            left: 0;
        }

    .main-content[b-ha18x6m421] {
        margin-left: 0;
    }

    .toggle-sidebar-btn[b-ha18x6m421] {
        left: -20px;
    }

        .toggle-sidebar-btn.mobile-open[b-ha18x6m421] {
            left: calc(var(--sidebar-width) - 20px);
        }

    .header[b-ha18x6m421] {
        padding: 0 1rem;
    }

    .header-brand[b-ha18x6m421] {
        font-size: 1.2rem;
    }

    .user-name[b-ha18x6m421] {
        display: none;
    }

    .page-title[b-ha18x6m421] {
        font-size: 1.5rem;
    }

    .page-header[b-ha18x6m421] {
        flex-direction: column;
        align-items: flex-start;
    }

    .profile-avatar[b-ha18x6m421] {
        width: 120px;
        height: 120px;
    }

    .profile-name[b-ha18x6m421] {
        font-size: 1.4rem;
    }

    .action-buttons[b-ha18x6m421] {
        flex-direction: column;
    }

        .action-buttons button[b-ha18x6m421] {
            width: 100%;
        }
}
/* _content/AccountingSystem.Web/Components/Pages/Profile/ResetPasswordModal.razor.rz.scp.css */


.card-icon[b-dxjwy5wl33] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-dxjwy5wl33] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-dxjwy5wl33] {
    color: #212529;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.card-change[b-dxjwy5wl33] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
}

/* Card Header Custom */
.card-header-custom[b-dxjwy5wl33] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-dxjwy5wl33] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-dxjwy5wl33] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-dxjwy5wl33] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Form Select Custom */
.form-select-custom[b-dxjwy5wl33] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-select-custom:focus[b-dxjwy5wl33] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

    .form-select-custom option[b-dxjwy5wl33] {
        padding: 0.75rem;
    }

        .form-select-custom option:checked[b-dxjwy5wl33] {
            background-color: var(--secondary-color) !important;
            color: var(--primary-color) !important;
            font-weight: 600;
        }

.form-control-custom[b-dxjwy5wl33] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control-custom:focus[b-dxjwy5wl33] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Role Icons */
.role-icon[b-dxjwy5wl33] {
    width: 50px;
    height: 50px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.5rem;
}

/* Pages Container */
.pages-container[b-dxjwy5wl33] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.page-badge[b-dxjwy5wl33] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    color: #495057;
    padding: 0.4rem 0.75rem;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 500;
    display: inline-block;
    border: 1px solid #dee2e6;
    transition: all 0.3s ease;
}

    .page-badge:hover[b-dxjwy5wl33] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        color: var(--primary-color);
        border-color: var(--secondary-color);
        transform: translateY(-2px);
    }

/* Selected Pages Preview */
.selected-pages-preview[b-dxjwy5wl33] {
    background-color: #f8f9fa;
    border-radius: 8px;
    padding: 1rem;
    border: 2px dashed #dee2e6;
}

.preview-container[b-dxjwy5wl33] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    min-height: 50px;
    align-items: center;
}

/* Keyboard shortcut styling */
kbd[b-dxjwy5wl33] {
    background-color: #495057;
    color: white;
    padding: 0.2rem 0.4rem;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 600;
}

/* Enhanced button styles */
.btn-primary[b-dxjwy5wl33] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-primary:hover[b-dxjwy5wl33] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.btn-secondary[b-dxjwy5wl33] {
    background-color: #6c757d;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-secondary:hover[b-dxjwy5wl33] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

/* Action buttons */
.btn-action[b-dxjwy5wl33] {
    padding: 0.5rem 0.75rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-edit[b-dxjwy5wl33] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-dxjwy5wl33] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

/* Toast notification */
.toast[b-dxjwy5wl33] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .role-icon[b-dxjwy5wl33] {
        width: 40px;
        height: 40px;
        font-size: 1.2rem;
    }

    .card-value[b-dxjwy5wl33] {
        font-size: 1.5rem;
    }

    .pages-container[b-dxjwy5wl33] {
        flex-direction: column;
    }

    .form-select-custom[multiple][b-dxjwy5wl33] {
        font-size: 0.9rem;
    }

    .card-header-custom[b-dxjwy5wl33] {
        padding-bottom: 1rem;
        margin-bottom: 1rem;
    }

    .card-title-custom[b-dxjwy5wl33] {
        font-size: 1.1rem;
    }
}

/* Modal enhancements */
.modal-content[b-dxjwy5wl33] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-dxjwy5wl33] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

.modal-header .modal-title[b-dxjwy5wl33] {
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .modal-header .modal-title i[b-dxjwy5wl33] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.modal-header .btn-close[b-dxjwy5wl33] {
    filter: brightness(0) invert(1);
    opacity: 0.8;
}

    .modal-header .btn-close:hover[b-dxjwy5wl33] {
        opacity: 1;
    }

.modal-body[b-dxjwy5wl33] {
    padding: 2rem;
}

.modal-footer[b-dxjwy5wl33] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Form labels with icons */
.form-label[b-dxjwy5wl33] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

    .form-label i[b-dxjwy5wl33] {
        color: var(--secondary-color);
    }

/* Enhanced table styles */
.positions-table[b-dxjwy5wl33] {
    width: 100%;
    margin-top: 1rem;
}

    .positions-table thead[b-dxjwy5wl33] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .positions-table thead th[b-dxjwy5wl33] {
            color: white;
            font-weight: 600;
            padding: 1rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.85rem;
            letter-spacing: 0.5px;
        }

    .positions-table tbody tr[b-dxjwy5wl33] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .positions-table tbody tr:hover[b-dxjwy5wl33] {
            background-color: #f8f9fa;
            transform: scale(1.01);
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
        }

    .positions-table tbody td[b-dxjwy5wl33] {
        padding: 1rem;
        vertical-align: middle;
    }

.position-name[b-dxjwy5wl33] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 1rem;
}

/* Search and filter bar */
.search-filter-bar[b-dxjwy5wl33] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-box[b-dxjwy5wl33] {
    position: relative;
    flex: 1;
    min-width: 250px;
    max-width: 400px;
}

    .search-box input[b-dxjwy5wl33] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-dxjwy5wl33] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-dxjwy5wl33] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.filter-group[b-dxjwy5wl33] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.entries-select[b-dxjwy5wl33] {
    padding: 0.5rem 1rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .entries-select:focus[b-dxjwy5wl33] {
        outline: none;
        border-color: var(--secondary-color);
    }

/* Pagination */
.pagination-wrapper[b-dxjwy5wl33] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-dxjwy5wl33] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-dxjwy5wl33] {
    margin: 0;
}

.page-link[b-dxjwy5wl33] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

    .page-link:hover[b-dxjwy5wl33] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
    }

.page-item.active .page-link[b-dxjwy5wl33] {
    color: #dee2e6;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Content card */
.content-card[b-dxjwy5wl33] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}



/* Alert styling */
.alert-info[b-dxjwy5wl33] {
    background-color: #e3f2fd;
    border-color: #90caf9;
    color: #1565c0;
    border-radius: 8px;
}

/* Action buttons container */
.action-buttons[b-dxjwy5wl33] {
    display: flex;
    gap: 0.5rem;
}
/* _content/AccountingSystem.Web/Components/Pages/ProjectDashboard/ProjectTrackerPage.razor.rz.scp.css */
/* ProjectTrackerPage Scoped Styles - Aligned with Application Theme */

/* Main Content */
.main-content.expanded[b-nivbx0ekxr] {
    margin-left: 0;
}

/* Page Header */
.page-header[b-nivbx0ekxr] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
}

    .page-header .page-title[b-nivbx0ekxr] {
        color: var(--primary-color);
        font-weight: 600;
        margin-bottom: 0.5rem;
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

        .page-header .page-title i[b-nivbx0ekxr] {
            font-size: 1.75rem;
        }

/* Breadcrumb */
.breadcrumb[b-nivbx0ekxr] {
    background: none;
    padding: 0;
    margin-bottom: 0;
    font-size: 0.9rem;
}

    .breadcrumb-item a[b-nivbx0ekxr] {
        color: #6c757d;
        text-decoration: none;
        transition: color 0.2s ease;
    }

        .breadcrumb-item a:hover[b-nivbx0ekxr] {
            color: var(--primary-color);
        }

    .breadcrumb-item.active[b-nivbx0ekxr] {
        color: var(--primary-color);
    }

/* Content Cards */
.content-card[b-nivbx0ekxr] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
    transition: box-shadow 0.3s ease;
}

    .content-card:hover[b-nivbx0ekxr] {
        box-shadow: 0 4px 15px rgba(0,0,0,0.12);
    }

/* Card Header */
.card-header-custom[b-nivbx0ekxr] {
    padding-bottom: 1rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #e9ecef;
}

.card-title-custom[b-nivbx0ekxr] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--primary-color);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.card-subtitle-custom[b-nivbx0ekxr] {
    color: #6c757d;
    font-size: 0.875rem;
    margin: 0;
}

/* Search Box */
.search-box[b-nivbx0ekxr] {
    position: relative;
    max-width: 400px;
}

    .search-box i[b-nivbx0ekxr] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

    .search-box input[b-nivbx0ekxr] {
        padding-left: 2.75rem;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        width: 100%;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-nivbx0ekxr] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

/* Dashboard Cards */
.dashboard-card[b-nivbx0ekxr] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

    .dashboard-card:hover[b-nivbx0ekxr] {
        transform: translateY(-5px);
        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    }

.card-icon[b-nivbx0ekxr] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-nivbx0ekxr] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-nivbx0ekxr] {
    color: #212529;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.card-change[b-nivbx0ekxr] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
}

    .card-change.positive[b-nivbx0ekxr] {
        color: #2E7D32;
    }

    .card-change i[b-nivbx0ekxr] {
        margin-right: 0.25rem;
    }


/* Table Styles */
/* Table Container with Overflow Handling */
.projects-table-container[b-nivbx0ekxr] {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 1rem;
    position: relative;
    max-width: 100%;
    box-sizing: border-box;
    border-radius: 8px;
    border: 1px solid #e9ecef;
}

/* Modern Table Styles */
.projects-table-modern[b-nivbx0ekxr] {
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    min-width: 1100px;
    table-layout: auto;
}

    .projects-table-modern thead[b-nivbx0ekxr] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
    }

        .projects-table-modern thead th[b-nivbx0ekxr] {
            padding: 1rem;
            font-weight: 600;
            font-size: 0.9rem;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            border: none;
            white-space: nowrap;
        }

            .projects-table-modern thead th:first-child[b-nivbx0ekxr] {
                border-radius: 10px 0 0 0;
            }

            .projects-table-modern thead th:last-child[b-nivbx0ekxr] {
                border-radius: 0 10px 0 0;
            }

    .projects-table-modern tbody .project-row[b-nivbx0ekxr] {
        background: white;
        transition: all 0.3s ease;
        border-bottom: 1px solid #e9ecef;
    }

        .projects-table-modern tbody .project-row:hover[b-nivbx0ekxr] {
            background: #f8f9fa;
            transform: translateX(2px);
            box-shadow: 0 2px 8px rgba(139, 0, 0, 0.1);
        }

        .projects-table-modern tbody .project-row td[b-nivbx0ekxr] {
            padding: 1rem;
            vertical-align: middle;
            white-space: nowrap;
        }

            /* Allow project name to wrap if needed */
            .projects-table-modern tbody .project-row td:nth-child(2)[b-nivbx0ekxr] {
                white-space: normal;
                min-width: 150px;
            }

/* Cell Styles */
.project-id-badge[b-nivbx0ekxr] {
    background: linear-gradient(135deg, rgba(139, 0, 0, 0.1) 0%, rgba(212, 175, 55, 0.1) 100%);
    color: var(--primary-color);
    padding: 0.3rem 0.6rem;
    border-radius: 4px;
    font-weight: 700;
    font-size: 0.85rem;
    display: inline-block;
}

.project-info[b-nivbx0ekxr],
.user-info[b-nivbx0ekxr] {
    display: flex;
    align-items: center;
}

.project-name[b-nivbx0ekxr] {
    font-weight: 600;
    color: #2c3e50;
}

.user-name[b-nivbx0ekxr] {
    color: #2c3e50;
    font-weight: 500;
}

.ar-code[b-nivbx0ekxr] {
    font-family: 'Courier New', monospace;
    background: #d4edda;
    color: #155724;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 600;
}

.amount-highlight[b-nivbx0ekxr] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
    background: linear-gradient(135deg, rgba(139, 0, 0, 0.05) 0%, rgba(212, 175, 55, 0.05) 100%);
    padding: 0.5rem 0.8rem;
    border-radius: 6px;
    display: inline-block;
}

.date-wrapper[b-nivbx0ekxr] {
    display: flex;
    align-items: center;
    font-size: 0.9rem;
}

/* Status Badges */
.badge[b-nivbx0ekxr] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: capitalize;
}

.badge-na[b-nivbx0ekxr] {
    background: #e9ecef;
    color: #6c757d;
}

.badge-pending[b-nivbx0ekxr] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #fff;
}

.badge-in-progress[b-nivbx0ekxr] {
    background: linear-gradient(135deg, #17a2b8 0%, #138496 100%);
    color: #fff;
}

.badge-completed[b-nivbx0ekxr] {
    background: linear-gradient(135deg, #2E7D32 0%, #43A047 100%);
    color: #fff;
}

.badge-cancelled[b-nivbx0ekxr] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: #fff;
}

/* Action Buttons */
.action-buttons[b-nivbx0ekxr] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.btn-action-icon[b-nivbx0ekxr] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

    .btn-action-icon:hover[b-nivbx0ekxr] {
        transform: scale(1.1);
    }

.btn-action-edit:hover[b-nivbx0ekxr] {
    background: #0d6efd;
    color: white;
}

.btn-action-view:hover[b-nivbx0ekxr] {
    background: #0dcaf0;
    color: white;
}

.btn-action-delete:hover[b-nivbx0ekxr] {
    background: #dc3545;
    color: white;
}

/* Timeline */
.timeline[b-nivbx0ekxr] {
    position: relative;
    padding-left: 2rem;
}

.timeline-item[b-nivbx0ekxr] {
    position: relative;
    padding-bottom: 2rem;
}

    .timeline-item:last-child[b-nivbx0ekxr] {
        padding-bottom: 0;
    }

.timeline-marker[b-nivbx0ekxr] {
    position: absolute;
    left: -2rem;
    top: 0;
    width: 1rem;
    height: 1rem;
    background: var(--secondary-color);
    border-radius: 50%;
    border: 3px solid white;
    box-shadow: 0 0 0 2px var(--secondary-color);
}

.timeline-item[b-nivbx0ekxr]::before {
    content: '';
    position: absolute;
    left: -1.5rem;
    top: 1rem;
    bottom: -2rem;
    width: 2px;
    background: #dee2e6;
}

.timeline-item:last-child[b-nivbx0ekxr]::before {
    display: none;
}

.timeline-content[b-nivbx0ekxr] {
    background: #f8f9fa;
    padding: 1rem;
    border-radius: 8px;
    border-left: 4px solid var(--secondary-color);
    transition: box-shadow 0.2s ease;
}

    .timeline-content:hover[b-nivbx0ekxr] {
        box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    }

.timeline-header[b-nivbx0ekxr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.timeline-date[b-nivbx0ekxr] {
    font-size: 0.875rem;
    color: #6c757d;
}

.timeline-meta[b-nivbx0ekxr] {
    font-size: 0.875rem;
    color: #6c757d;
    margin-bottom: 0.75rem;
}

.timeline-text[b-nivbx0ekxr] {
    color: #212529;
    line-height: 1.6;
}

/* Buttons */
.btn-group-sm > .btn[b-nivbx0ekxr] {
    white-space: nowrap;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

.add-new-btn[b-nivbx0ekxr] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-nivbx0ekxr] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .add-new-btn i[b-nivbx0ekxr] {
        font-size: 1.1rem;
    }

.btn-primary[b-nivbx0ekxr] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
}

    .btn-primary:hover[b-nivbx0ekxr] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

    .btn-primary:active[b-nivbx0ekxr] {
        transform: translateY(0);
    }

.btn-secondary[b-nivbx0ekxr] {
    background-color: #6c757d;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-secondary:hover[b-nivbx0ekxr] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

.btn-outline-primary[b-nivbx0ekxr] {
    border: 2px solid #0d6efd;
    color: #0d6efd;
    background: transparent;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
}

    .btn-outline-primary:hover[b-nivbx0ekxr] {
        background-color: #0d6efd;
        border-color: #0d6efd;
        color: white;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

.btn-outline-info[b-nivbx0ekxr] {
    border: 2px solid #0dcaf0;
    color: #0dcaf0;
    background: transparent;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
}

    .btn-outline-info:hover[b-nivbx0ekxr] {
        background-color: #0dcaf0;
        border-color: #0dcaf0;
        color: white;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 202, 240, 0.3);
    }

.btn-outline-danger[b-nivbx0ekxr] {
    border: 2px solid #dc3545;
    color: #dc3545;
    background: transparent;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
}

    .btn-outline-danger:hover[b-nivbx0ekxr] {
        background-color: #dc3545;
        border-color: #dc3545;
        color: white;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
    }

.btn-outline-secondary[b-nivbx0ekxr] {
    border: 2px solid #6c757d;
    color: #6c757d;
    background: transparent;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
}

    .btn-outline-secondary:hover[b-nivbx0ekxr] {
        background-color: #6c757d;
        border-color: #6c757d;
        color: white;
        transform: translateY(-2px);
    }

/* Form Controls */
.form-control[b-nivbx0ekxr], .form-select[b-nivbx0ekxr] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control:focus[b-nivbx0ekxr], .form-select:focus[b-nivbx0ekxr] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        outline: none;
    }

.form-label[b-nivbx0ekxr] {
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    font-size: 0.9rem;
}

/* Modal Enhancements */
.modal-content[b-nivbx0ekxr] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-nivbx0ekxr] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-nivbx0ekxr] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-nivbx0ekxr] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-nivbx0ekxr] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-nivbx0ekxr] {
            opacity: 1;
        }

.modal-body[b-nivbx0ekxr] {
    padding: 2rem;
}

.modal-footer[b-nivbx0ekxr] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.modal-title[b-nivbx0ekxr] {
    color: white;
    font-weight: 600;
}

/* Badges */
.badge[b-nivbx0ekxr] {
    padding: 0.5rem 1rem;
    font-weight: 600;
    border-radius: 6px;
    font-size: 0.85rem;
}

/* Toast */
.toast[b-nivbx0ekxr] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

/* Pagination */
.pagination-wrapper[b-nivbx0ekxr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-nivbx0ekxr] {
    color: #6c757d;
    font-size: 0.9rem;
}

    .showing-entries span[b-nivbx0ekxr] {
        font-weight: 600;
        color: var(--primary-color);
    }

.pagination[b-nivbx0ekxr] {
    margin: 0;
}

.page-link[b-nivbx0ekxr] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
    background-color: white;
}

    .page-link:hover[b-nivbx0ekxr] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
    }

    .page-link:focus[b-nivbx0ekxr] {
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.25);
    }

.page-item.active .page-link[b-nivbx0ekxr] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    color: white;
    font-weight: 600;
}

.page-item.disabled .page-link[b-nivbx0ekxr] {
    color: #6c757d;
    pointer-events: none;
    background-color: #fff;
    border-color: #dee2e6;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-header[b-nivbx0ekxr] {
        flex-direction: column;
        gap: 1rem;
    }

        .page-header > div:last-child[b-nivbx0ekxr] {
            width: 100%;
        }

            .page-header > div:last-child .btn[b-nivbx0ekxr] {
                width: 100%;
            }

    .card-value[b-nivbx0ekxr] {
        font-size: 1.5rem;
    }

    .card-title[b-nivbx0ekxr] {
        font-size: 0.75rem;
    }

    .card-icon[b-nivbx0ekxr] {
        width: 50px;
        height: 50px;
        font-size: 1.4rem;
    }

    .search-box[b-nivbx0ekxr] {
        max-width: 100%;
    }

    .d-flex.gap-2.flex-wrap .btn[b-nivbx0ekxr] {
        flex: 1 1 100%;
        min-width: 100%;
    }

    .timeline[b-nivbx0ekxr] {
        padding-left: 1.5rem;
    }

    .timeline-marker[b-nivbx0ekxr] {
        left: -1.5rem;
        width: 0.75rem;
        height: 0.75rem;
    }

    .timeline-item[b-nivbx0ekxr]::before {
        left: -1.125rem;
    }

    /* Table Responsive */
    .projects-table-modern[b-nivbx0ekxr] {
        min-width: 900px;
    }

    .projects-table-modern tbody .project-row td[b-nivbx0ekxr] {
        padding: 0.875rem;
        font-size: 0.9rem;
    }

    /* Voucher styles for mobile */
    .voucher-info[b-nivbx0ekxr] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .voucher-id[b-nivbx0ekxr],
    .voucher-amount[b-nivbx0ekxr] {
        justify-content: center;
    }

    .voucher-details[b-nivbx0ekxr] {
        text-align: center;
    }

    .voucher-selection-container[b-nivbx0ekxr] {
        max-height: 300px;
    }

    .voucher-card-row[b-nivbx0ekxr] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }

        .voucher-card-row .value[b-nivbx0ekxr] {
            text-align: left;
        }

    .voucher-management-section[b-nivbx0ekxr] {
        padding: 1rem;
    }

    .voucher-list-container[b-nivbx0ekxr] {
        max-height: 350px;
    }

    .section-header[b-nivbx0ekxr] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .btn-voucher-count[b-nivbx0ekxr] {
        padding: 0.4rem 0.8rem;
        font-size: 0.85rem;
    }

    .voucher-selection-header[b-nivbx0ekxr] {
        flex-direction: column;
        align-items: flex-start;
    }

    /* Pagination */
    .pagination-wrapper[b-nivbx0ekxr] {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
        margin-top: 1rem;
        padding-top: 1rem;
    }

    .showing-entries[b-nivbx0ekxr] {
        font-size: 0.85rem;
        text-align: center;
    }

    .pagination[b-nivbx0ekxr] {
        justify-content: center;
    }

    .page-link[b-nivbx0ekxr] {
        padding: 0.4rem 0.6rem;
        font-size: 0.85rem;
    }
}

@media (max-width: 576px) {
    .content-card[b-nivbx0ekxr] {
        padding: 1rem;
    }

    .card-header-custom[b-nivbx0ekxr] {
        padding-bottom: 0.75rem;
        margin-bottom: 1rem;
    }

    .card-title-custom[b-nivbx0ekxr] {
        font-size: 1.1rem;
    }

    .dashboard-card[b-nivbx0ekxr] {
        padding: 1rem;
    }
    .card-icon[b-nivbx0ekxr] {
        width: 50px;
        height: 50px;
        font-size: 1.5rem;
    }

    .card-value[b-nivbx0ekxr] {
        font-size: 1.75rem;
    }

    .btn-group-sm > .btn[b-nivbx0ekxr] {
        font-size: 0.75rem;
        padding: 0.25rem 0.5rem;
    }

    .voucher-card[b-nivbx0ekxr] {
        padding: 0.75rem;
    }

    .voucher-card-header[b-nivbx0ekxr] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .btn-remove-voucher[b-nivbx0ekxr] {
        width: 100%;
    }

    .modal-body[b-nivbx0ekxr] {
        padding: 1rem;
    }

    .voucher-selection-item[b-nivbx0ekxr] {
        padding: 0.75rem;
    }

    .form-check-input[b-nivbx0ekxr] {
        width: 1.25rem;
        height: 1.25rem;
    }

    /* Pagination - Compact version */
    .pagination[b-nivbx0ekxr] {
        flex-wrap: wrap;
        gap: 0.25rem;
    }

    .page-item[b-nivbx0ekxr] {
        flex: 0 0 auto;
    }

    .page-link[b-nivbx0ekxr] {
        padding: 0.35rem 0.5rem;
        font-size: 0.8rem;
        min-width: 36px;
        text-align: center;
    }

    .showing-entries[b-nivbx0ekxr] {
        font-size: 0.75rem;
    }

    /* Table Responsive */
    .projects-table-modern[b-nivbx0ekxr] {
        min-width: 800px;
    }

    .projects-table-modern thead th[b-nivbx0ekxr] {
        padding: 0.75rem 0.5rem;
        font-size: 0.8rem;
    }

    .projects-table-modern tbody .project-row td[b-nivbx0ekxr] {
        padding: 0.75rem 0.5rem;
        font-size: 0.85rem;
    }

    .project-id-badge[b-nivbx0ekxr] {
        font-size: 0.75rem;
        padding: 0.25rem 0.5rem;
    }

    .amount-highlight[b-nivbx0ekxr] {
        font-size: 1rem;
        padding: 0.4rem 0.6rem;
    }

    .btn-action-icon[b-nivbx0ekxr] {
        width: 32px;
        height: 32px;
        font-size: 0.9rem;
    }

    .action-buttons[b-nivbx0ekxr] {
        gap: 0.3rem;
    }
}

/* Animation */
@keyframes fadeIn-b-nivbx0ekxr {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.content-card[b-nivbx0ekxr],
.dashboard-card[b-nivbx0ekxr] {
    animation: fadeIn-b-nivbx0ekxr 0.3s ease-out;
}

/* Utility Classes */
.fw-bold[b-nivbx0ekxr] {
    font-weight: 700;
}

.text-muted[b-nivbx0ekxr] {
    color: #6c757d;
}

.text-danger[b-nivbx0ekxr] {
    color: #dc3545;
}

/* Empty State */
.text-center.text-muted.py-4[b-nivbx0ekxr] {
    padding: 3rem 1rem;
}

    .text-center.text-muted.py-4 i[b-nivbx0ekxr] {
        opacity: 0.3;
        font-size: 4rem;
        color: #dee2e6;
    }

    .text-center.text-muted.py-4 p[b-nivbx0ekxr] {
        font-size: 1.1rem;
        margin-top: 1rem;
    }

/* ==================== VOUCHER SELECTION STYLES ==================== */

/* Voucher Search Box */
.voucher-search-box[b-nivbx0ekxr] {
    position: relative;
}

    .voucher-search-box i[b-nivbx0ekxr] {
        position: absolute;
        left: 0.75rem;
        top: 50%;
        transform: translateY(-50%);
        color: var(--primary-color);
        font-size: 1rem;
        z-index: 1;
    }

    .voucher-search-box input[b-nivbx0ekxr] {
        padding-left: 2.5rem;
        border: 2px solid #dee2e6;
        border-radius: 8px;
        transition: all 0.3s ease;
    }

        .voucher-search-box input:focus[b-nivbx0ekxr] {
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
            outline: none;
        }

        .voucher-search-box input[b-nivbx0ekxr]::placeholder {
            color: #adb5bd;
            font-size: 0.9rem;
        }

/* Voucher Selection Container */
.voucher-selection-container[b-nivbx0ekxr] {
    border: 2px solid #e9ecef;
    border-radius: 12px;
    padding: 1rem;
    background: #f8f9fa;
    max-height: 400px;
    overflow-y: auto;
}

.voucher-selection-header[b-nivbx0ekxr] {
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 2px solid #dee2e6;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.voucher-selection-list[b-nivbx0ekxr] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.voucher-selection-item[b-nivbx0ekxr] {
    background: white;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 1rem;
    transition: all 0.3s ease;
}

    .voucher-selection-item:hover[b-nivbx0ekxr] {
        border-color: var(--secondary-color);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.2);
        transform: translateX(4px);
    }

.voucher-info[b-nivbx0ekxr] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 1rem;
    align-items: center;
}

.voucher-id[b-nivbx0ekxr] {
    font-weight: 700;
    color: var(--primary-color);
    background: linear-gradient(135deg, rgba(139, 0, 0, 0.1) 0%, rgba(139, 0, 0, 0.05) 100%);
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    display: flex;
    align-items: center;
    gap: 0.25rem;
    white-space: nowrap;
}

.voucher-details[b-nivbx0ekxr] {
    flex: 1;
    color: #495057;
}

.voucher-amount[b-nivbx0ekxr] {
    font-weight: 700;
    color: var(--primary-color);
    display: flex;
    align-items: center;
    gap: 0.25rem;
    white-space: nowrap;
}

/* Voucher Count Button */
.btn-voucher-count[b-nivbx0ekxr] {
    background: linear-gradient(135deg, #e9ecef 0%, #dee2e6 100%);
    border: 2px solid #dee2e6;
    padding: 0.5rem 1rem;
    border-radius: 8px;
    font-weight: 600;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-voucher-count:hover[b-nivbx0ekxr] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        border-color: var(--secondary-color);
        color: var(--primary-color);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    }

    .btn-voucher-count .badge[b-nivbx0ekxr] {
        background: var(--primary-color) !important;
        color: white;
    }

/* Outline Warning Button */
.btn-outline-warning[b-nivbx0ekxr] {
    border: 2px solid #ffc107;
    color: #ffc107;
    background: transparent;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
}

    .btn-outline-warning:hover[b-nivbx0ekxr] {
        background-color: #ffc107;
        border-color: #ffc107;
        color: #212529;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(255, 193, 7, 0.3);
    }

/* ==================== MANAGE VOUCHERS MODAL STYLES ==================== */

.voucher-management-section[b-nivbx0ekxr] {
    background: white;
    border: 2px solid #e9ecef;
    border-radius: 12px;
    padding: 1.5rem;
    height: 100%;
}

.section-header[b-nivbx0ekxr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 2px solid var(--secondary-color);
}

.section-title[b-nivbx0ekxr] {
    color: var(--primary-color);
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.voucher-list-container[b-nivbx0ekxr] {
    max-height: 500px;
    overflow-y: auto;
    padding-right: 0.5rem;
}

/* Custom Scrollbar */
.voucher-list-container[b-nivbx0ekxr]::-webkit-scrollbar {
    width: 8px;
}

.voucher-list-container[b-nivbx0ekxr]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
}

.voucher-list-container[b-nivbx0ekxr]::-webkit-scrollbar-thumb {
    background: var(--secondary-color);
    border-radius: 10px;
}

    .voucher-list-container[b-nivbx0ekxr]::-webkit-scrollbar-thumb:hover {
        background: var(--primary-color);
    }

/* Voucher Card */
.voucher-card[b-nivbx0ekxr] {
    background: white;
    border: 2px solid #e9ecef;
    border-radius: 10px;
    padding: 1rem;
    margin-bottom: 1rem;
    transition: all 0.3s ease;
}

    .voucher-card:hover[b-nivbx0ekxr] {
        border-color: var(--secondary-color);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.2);
        transform: translateY(-2px);
    }

.voucher-card-selectable[b-nivbx0ekxr] {
    cursor: pointer;
}

    .voucher-card-selectable.selected[b-nivbx0ekxr] {
        border-color: var(--primary-color);
        background: linear-gradient(135deg, rgba(139, 0, 0, 0.05) 0%, rgba(212, 175, 55, 0.05) 100%);
    }

.voucher-card-header[b-nivbx0ekxr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #e9ecef;
}

.voucher-id-badge[b-nivbx0ekxr] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.85rem;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.voucher-card-body[b-nivbx0ekxr] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.voucher-card-row[b-nivbx0ekxr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

    .voucher-card-row .label[b-nivbx0ekxr] {
        color: #6c757d;
        font-size: 0.85rem;
        font-weight: 600;
        white-space: nowrap;
    }

    .voucher-card-row .value[b-nivbx0ekxr] {
        color: #495057;
        text-align: right;
        flex: 1;
        overflow: hidden;
        text-overflow: ellipsis;
    }

        .voucher-card-row .value.amount[b-nivbx0ekxr] {
            color: var(--primary-color);
            font-weight: 700;
        }

/* Remove Voucher Button */
.btn-remove-voucher[b-nivbx0ekxr] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
    border: none;
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 600;
    font-size: 0.85rem;
    transition: all 0.3s ease;
}

    .btn-remove-voucher:hover[b-nivbx0ekxr] {
        background: linear-gradient(135deg, #c82333 0%, #bd2130 100%);
        transform: scale(1.05);
        box-shadow: 0 4px 8px rgba(220, 53, 69, 0.4);
        color: white;
    }

/* Empty Vouchers Message */
.empty-vouchers-message[b-nivbx0ekxr] {
    text-align: center;
    padding: 3rem 1rem;
    color: #6c757d;
}

    .empty-vouchers-message i[b-nivbx0ekxr] {
        opacity: 0.3;
        color: #dee2e6;
    }

    .empty-vouchers-message p[b-nivbx0ekxr] {
        margin-top: 1rem;
        font-size: 1rem;
    }

/* Form Check Enhancements */
.form-check-input[b-nivbx0ekxr] {
    border: 2px solid #dee2e6;
    width: 1.5rem;
    height: 1.5rem;
    cursor: pointer;
}

    .form-check-input:checked[b-nivbx0ekxr] {
        background-color: var(--primary-color);
        border-color: var(--primary-color);
    }

    .form-check-input:focus[b-nivbx0ekxr] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.25);
    }

.form-check-label[b-nivbx0ekxr] {
    cursor: pointer;
    flex: 1;
}

/* ==================== FILTER MODAL STYLES ==================== */

/* Filter Modal Labels */
.filter-modal-label[b-nivbx0ekxr] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .filter-modal-label i[b-nivbx0ekxr] {
        color: var(--primary-color);
        font-size: 1.1rem;
    }

/* Filter Button Styles */
.btn-filter[b-nivbx0ekxr] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-filter:hover[b-nivbx0ekxr] {
        background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(139, 0, 0, 0.4);
    }

    .btn-filter:active[b-nivbx0ekxr] {
        transform: translateY(0);
    }

.btn-reset[b-nivbx0ekxr] {
    background-color: #6c757d;
    color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-reset:hover[b-nivbx0ekxr] {
        background-color: #5c636a;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(108, 117, 125, 0.3);
    }

.btn-primary-filter[b-nivbx0ekxr] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 700;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-primary-filter:hover[b-nivbx0ekxr] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

/* Active Filters Display */
.active-filters[b-nivbx0ekxr] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    border-left: 4px solid var(--secondary-color);
}

.filter-tag[b-nivbx0ekxr] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.75rem;
    background-color: white;
    border: 1px solid var(--secondary-color);
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--primary-color);
    transition: all 0.2s ease;
}

    .filter-tag:hover[b-nivbx0ekxr] {
        background-color: #fff8e6;
        box-shadow: 0 2px 6px rgba(212, 175, 55, 0.2);
    }

    .filter-tag i[b-nivbx0ekxr] {
        cursor: pointer;
        font-size: 1rem;
        transition: transform 0.2s ease;
    }

        .filter-tag i:hover[b-nivbx0ekxr] {
            transform: scale(1.2);
            color: var(--primary-color);
        }

/* Form Control Custom */
.form-control-custom[b-nivbx0ekxr], .form-select-custom[b-nivbx0ekxr] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control-custom:focus[b-nivbx0ekxr], .form-select-custom:focus[b-nivbx0ekxr] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        outline: none;
    }

/* Modal Size Adjustments */
.modal-lg[b-nivbx0ekxr] {
    max-width: 900px;
}

/* Mobile Responsive Styles for Filter */
@media (max-width: 768px) {
    .btn-filter[b-nivbx0ekxr],
    .btn-reset[b-nivbx0ekxr],
    .btn-secondary[b-nivbx0ekxr] {
        padding: 0.5rem 0.75rem;
        font-size: 0.85rem;
    }

    .active-filters[b-nivbx0ekxr] {
        padding: 0.5rem;
    }

    .filter-tag[b-nivbx0ekxr] {
        font-size: 0.75rem;
        padding: 0.3rem 0.6rem;
    }

    .modal-lg[b-nivbx0ekxr] {
        max-width: 100%;
        margin: 0.5rem;
    }

    .filter-modal-label[b-nivbx0ekxr] {
        font-size: 0.85rem;
    }
}

/* ==================== MOBILE RESPONSIVENESS ==================== */
/* _content/AccountingSystem.Web/Components/Pages/ProjectDashboard/ProjectTrackerUserPage.razor.rz.scp.css */
/* ProjectTrackerUserPage Scoped Styles - Aligned with Application Theme */
/* User-focused dashboard with simplified styling inherited from admin dashboard */

/* Main Content */
.main-content.expanded[b-weloatg583] {
    margin-left: 0;
}

/* Page Header */
.page-header[b-weloatg583] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 2rem;
}

    .page-header .page-title[b-weloatg583] {
        color: var(--primary-color);
        font-weight: 600;
      margin-bottom: 0.5rem;
        display: flex;
        align-items: center;
 gap: 0.5rem;
    }

      .page-header .page-title i[b-weloatg583] {
          font-size: 1.75rem;
  }

/* Breadcrumb */
.breadcrumb[b-weloatg583] {
    background: none;
    padding: 0;
    margin-bottom: 0;
    font-size: 0.9rem;
}

    .breadcrumb-item a[b-weloatg583] {
        color: #6c757d;
  text-decoration: none;
        transition: color 0.2s ease;
    }

        .breadcrumb-item a:hover[b-weloatg583] {
            color: var(--primary-color);
      }

    .breadcrumb-item.active[b-weloatg583] {
        color: var(--primary-color);
    }

/* Content Cards */
.content-card[b-weloatg583] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
    transition: box-shadow 0.3s ease;
}

    .content-card:hover[b-weloatg583] {
        box-shadow: 0 4px 15px rgba(0,0,0,0.12);
    }

/* Card Header */
.card-header-custom[b-weloatg583] {
    padding-bottom: 1rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #e9ecef;
}

.card-title-custom[b-weloatg583] {
    font-size: 1.25rem;
font-weight: 600;
    color: var(--primary-color);
    margin: 0;
  display: flex;
    align-items: center;
    gap: 0.5rem;
}

.card-subtitle-custom[b-weloatg583] {
    color: #6c757d;
    font-size: 0.875rem;
    margin: 0;
}

/* Search Box */
.search-box[b-weloatg583] {
    position: relative;
    max-width: 400px;
}

    .search-box i[b-weloatg583] {
   position: absolute;
        left: 1rem;
        top: 50%;
    transform: translateY(-50%);
      color: #6c757d;
   font-size: 1.1rem;
    }

    .search-box input[b-weloatg583] {
     padding-left: 2.75rem;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
     border: 2px solid #e9ecef;
        border-radius: 8px;
        width: 100%;
     font-size: 0.95rem;
 transition: all 0.3s ease;
    }

 .search-box input:focus[b-weloatg583] {
      outline: none;
    border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

/* Dashboard Cards */
.dashboard-card[b-weloatg583] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

    .dashboard-card:hover[b-weloatg583] {
        transform: translateY(-5px);
        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    }

.card-icon[b-weloatg583] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-weloatg583] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-weloatg583] {
    color: #212529;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.card-change[b-weloatg583] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
}

    .card-change.positive[b-weloatg583] {
        color: #2E7D32;
    }

    .card-change i[b-weloatg583] {
        margin-right: 0.25rem;
    }

/* Table Styles */
/* Table Container with Overflow Handling */
.projects-table-container[b-weloatg583] {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 1rem;
    position: relative;
    max-width: 100%;
    box-sizing: border-box;
    border-radius: 8px;
    border: 1px solid #e9ecef;
}

/* Modern Table Styles */
.projects-table-modern[b-weloatg583] {
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    min-width: 1000px;
    table-layout: auto;
}

    .projects-table-modern thead[b-weloatg583] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
    }

        .projects-table-modern thead th[b-weloatg583] {
            padding: 1rem;
            font-weight: 600;
            font-size: 0.9rem;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            border: none;
            white-space: nowrap;
        }

            .projects-table-modern thead th:first-child[b-weloatg583] {
                border-radius: 10px 0 0 0;
            }

            .projects-table-modern thead th:last-child[b-weloatg583] {
                border-radius: 0 10px 0 0;
            }

    .projects-table-modern tbody .project-row[b-weloatg583] {
        background: white;
        transition: all 0.3s ease;
        border-bottom: 1px solid #e9ecef;
    }

        .projects-table-modern tbody .project-row:hover[b-weloatg583] {
            background: #f8f9fa;
            transform: translateX(2px);
            box-shadow: 0 2px 8px rgba(139, 0, 0, 0.1);
        }

        .projects-table-modern tbody .project-row td[b-weloatg583] {
            padding: 1rem;
            vertical-align: middle;
            white-space: nowrap;
        }

            /* Allow project name to wrap if needed */
            .projects-table-modern tbody .project-row td:nth-child(2)[b-weloatg583] {
                white-space: normal;
                min-width: 150px;
            }

/* Cell Styles */
.project-id-badge[b-weloatg583] {
    background: linear-gradient(135deg, rgba(139, 0, 0, 0.1) 0%, rgba(212, 175, 55, 0.1) 100%);
    color: var(--primary-color);
    padding: 0.3rem 0.6rem;
    border-radius: 4px;
    font-weight: 700;
    font-size: 0.85rem;
    display: inline-block;
}

.project-info[b-weloatg583],
.user-info[b-weloatg583] {
    display: flex;
    align-items: center;
}

.project-name[b-weloatg583] {
    font-weight: 600;
    color: #2c3e50;
}

.user-name[b-weloatg583] {
    color: #2c3e50;
    font-weight: 500;
}

.ar-code[b-weloatg583] {
    font-family: 'Courier New', monospace;
    background: #d4edda;
    color: #155724;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 600;
}

.amount-highlight[b-weloatg583] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
    background: linear-gradient(135deg, rgba(139, 0, 0, 0.05) 0%, rgba(212, 175, 55, 0.05) 100%);
    padding: 0.5rem 0.8rem;
    border-radius: 6px;
    display: inline-block;
}

.date-wrapper[b-weloatg583] {
    display: flex;
    align-items: center;
    font-size: 0.9rem;
}

/* Status Badges */
.badge[b-weloatg583] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: capitalize;
}

.badge-na[b-weloatg583] {
    background: #e9ecef;
    color: #6c757d;
}

.badge-pending[b-weloatg583] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #fff;
}

.badge-in-progress[b-weloatg583] {
    background: linear-gradient(135deg, #17a2b8 0%, #138496 100%);
    color: #fff;
}

.badge-completed[b-weloatg583] {
    background: linear-gradient(135deg, #2E7D32 0%, #43A047 100%);
    color: #fff;
}

.badge-cancelled[b-weloatg583] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: #fff;
}

/* Action Buttons */
.action-buttons[b-weloatg583] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.btn-action-icon[b-weloatg583] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

    .btn-action-icon:hover[b-weloatg583] {
        transform: scale(1.1);
    }

.btn-action-edit:hover[b-weloatg583] {
    background: #0d6efd;
    color: white;
}

.btn-action-view:hover[b-weloatg583] {
    background: #0dcaf0;
    color: white;
}

/* Timeline */
.timeline[b-weloatg583] {
    position: relative;
    padding-left: 2rem;
}

.timeline-item[b-weloatg583] {
position: relative;
    padding-bottom: 2rem;
}

    .timeline-item:last-child[b-weloatg583] {
        padding-bottom: 0;
    }

.timeline-marker[b-weloatg583] {
    position: absolute;
left: -2rem;
    top: 0;
    width: 1rem;
    height: 1rem;
    background: var(--secondary-color);
    border-radius: 50%;
    border: 3px solid white;
    box-shadow: 0 0 0 2px var(--secondary-color);
}

.timeline-item[b-weloatg583]::before {
    content: '';
    position: absolute;
 left: -1.5rem;
    top: 1rem;
    bottom: -2rem;
    width: 2px;
    background: #dee2e6;
}

.timeline-item:last-child[b-weloatg583]::before {
    display: none;
}

.timeline-content[b-weloatg583] {
    background: #f8f9fa;
    padding: 1rem;
    border-radius: 8px;
    border-left: 4px solid var(--secondary-color);
    transition: box-shadow 0.2s ease;
}

    .timeline-content:hover[b-weloatg583] {
        box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    }

.timeline-header[b-weloatg583] {
    display: flex;
  justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.timeline-date[b-weloatg583] {
  font-size: 0.875rem;
    color: #6c757d;
}

.timeline-meta[b-weloatg583] {
    font-size: 0.875rem;
    color: #6c757d;
    margin-bottom: 0.75rem;
}

.timeline-text[b-weloatg583] {
    color: #212529;
    line-height: 1.6;
}

/* Buttons */
.btn-group-sm > .btn[b-weloatg583] {
    white-space: nowrap;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

.btn-primary[b-weloatg583] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
}

    .btn-primary:hover[b-weloatg583] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

    .btn-primary:active[b-weloatg583] {
   transform: translateY(0);
    }

.btn-secondary[b-weloatg583] {
    background-color: #6c757d;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
color: white;
}

    .btn-secondary:hover[b-weloatg583] {
        background-color: #5c636a;
  transform: translateY(-2px);
        color: white;
    }

.btn-outline-primary[b-weloatg583] {
    border: 2px solid #0d6efd;
    color: #0d6efd;
    background: transparent;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
}

    .btn-outline-primary:hover[b-weloatg583] {
  background-color: #0d6efd;
     border-color: #0d6efd;
        color: white;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

.btn-outline-info[b-weloatg583] {
    border: 2px solid #0dcaf0;
    color: #0dcaf0;
background: transparent;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
  font-weight: 600;
    transition: all 0.3s ease;
}

  .btn-outline-info:hover[b-weloatg583] {
        background-color: #0dcaf0;
        border-color: #0dcaf0;
color: white;
        transform: translateY(-2px);
     box-shadow: 0 4px 8px rgba(13, 202, 240, 0.3);
    }

.btn-outline-secondary[b-weloatg583] {
    border: 2px solid #6c757d;
    color: #6c757d;
    background: transparent;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
}

    .btn-outline-secondary:hover[b-weloatg583] {
      background-color: #6c757d;
        border-color: #6c757d;
    color: white;
     transform: translateY(-2px);
    }

/* Form Controls */
.form-control[b-weloatg583], .form-select[b-weloatg583] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    background-color: white;
}

    .form-control:focus[b-weloatg583], .form-select:focus[b-weloatg583] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
   outline: none;
    }

    .form-control:disabled[b-weloatg583], .form-select:disabled[b-weloatg583] {
        background-color: #e9ecef;
        color: #6c757d;
        cursor: not-allowed;
    }

.form-label[b-weloatg583] {
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    font-size: 0.9rem;
}

/* Modal Enhancements */
.modal-content[b-weloatg583] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-weloatg583] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-weloatg583] {
    font-weight: 700;
        display: flex;
      align-items: center;
        gap: 0.75rem;
        color: white;
 }

      .modal-header .modal-title i[b-weloatg583] {
  color: var(--secondary-color);
  font-size: 1.5rem;
        }

    .modal-header .btn-close[b-weloatg583] {
   filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-weloatg583] {
  opacity: 1;
    }

.modal-body[b-weloatg583] {
    padding: 2rem;
}

.modal-footer[b-weloatg583] {
 padding: 1.5rem;
 border-top: 1px solid #e9ecef;
}

/* Badges */
.badge[b-weloatg583] {
    padding: 0.5rem 1rem;
    font-weight: 600;
    border-radius: 6px;
    font-size: 0.85rem;
}

/* Toast */
.toast[b-weloatg583] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

/* Read-only Field Styling */
.form-control[disabled][b-weloatg583],
.form-control[readonly][b-weloatg583] {
    background-color: #e9ecef;
    color: #6c757d;
    border-color: #dee2e6;
    cursor: not-allowed;
}

    .form-control[disabled]:focus[b-weloatg583],
    .form-control[readonly]:focus[b-weloatg583] {
    border-color: #dee2e6;
        box-shadow: none;
    }

/* Responsive Design */
@media (max-width: 768px) {
    .page-header[b-weloatg583] {
        flex-direction: column;
        gap: 1rem;
    }

    .card-value[b-weloatg583] {
        font-size: 1.5rem;
    }

    .card-title[b-weloatg583] {
        font-size: 0.75rem;
    }

    .card-icon[b-weloatg583] {
        width: 50px;
        height: 50px;
        font-size: 1.4rem;
    }

    .search-box[b-weloatg583] {
        max-width: 100%;
  }

    .d-flex.gap-2.flex-wrap .btn[b-weloatg583] {
        flex: 1 1 100%;
        min-width: 100%;
    }

    .timeline[b-weloatg583] {
        padding-left: 1.5rem;
    }

    .timeline-marker[b-weloatg583] {
        left: -1.5rem;
        width: 0.75rem;
   height: 0.75rem;
    }

    .timeline-item[b-weloatg583]::before {
        left: -1.125rem;
    }

    /* Table Responsive */
    .projects-table-modern[b-weloatg583] {
        min-width: 900px;
    }

    .projects-table-modern tbody .project-row td[b-weloatg583] {
        padding: 0.875rem;
        font-size: 0.9rem;
    }
}

@media (max-width: 576px) {
    .content-card[b-weloatg583] {
   padding: 1rem;
    }

 .card-header-custom[b-weloatg583] {
        padding-bottom: 0.75rem;
   margin-bottom: 1rem;
    }

    .card-title-custom[b-weloatg583] {
   font-size: 1.1rem;
    }

    .dashboard-card[b-weloatg583] {
        padding: 1.25rem;
    }

    .card-icon[b-weloatg583] {
        width: 50px;
        height: 50px;
        font-size: 1.5rem;
    }

    .card-value[b-weloatg583] {
        font-size: 1.75rem;
    }

    .btn-group-sm > .btn[b-weloatg583] {
        font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
 }

    /* Compact Table */
    .projects-table-modern[b-weloatg583] {
        min-width: 800px;
    }

    .projects-table-modern thead th[b-weloatg583] {
        padding: 0.625rem;
        font-size: 0.8rem;
    }

    .projects-table-modern tbody .project-row td[b-weloatg583] {
        padding: 0.75rem;
        font-size: 0.85rem;
    }

    /* Compact Badges */
    .projects-table-modern .badge[b-weloatg583] {
        font-size: 0.7rem;
        padding: 0.25rem 0.5rem;
    }

    /* Compact Amount */
    .amount-highlight[b-weloatg583] {
        font-size: 0.9rem;
    }

    /* Compact Action Buttons */
    .btn-action-icon[b-weloatg583] {
        width: 32px;
        height: 32px;
        font-size: 0.85rem;
    }

    /* Compact Pagination */
    .pagination-wrapper[b-weloatg583] {
        flex-direction: column;
        gap: 0.75rem;
    }

    .showing-entries[b-weloatg583] {
        text-align: center;
        font-size: 0.8rem;
    }

    .pagination .page-link[b-weloatg583] {
        padding: 0.375rem 0.625rem;
        font-size: 0.8rem;
    }
}

/* Animation */
@keyframes fadeIn-b-weloatg583 {
    from {
        opacity: 0;
 transform: translateY(10px);
    }

    to {
        opacity: 1;
      transform: translateY(0);
    }
}

.content-card[b-weloatg583],
.dashboard-card[b-weloatg583] {
    animation: fadeIn-b-weloatg583 0.3s ease-out;
}

/* Utility Classes */
.fw-bold[b-weloatg583] {
    font-weight: 700;
}

.text-muted[b-weloatg583] {
    color: #6c757d;
}

.text-danger[b-weloatg583] {
    color: #dc3545;
}

/* Empty State */
.text-center.text-muted.py-4[b-weloatg583] {
    padding: 3rem 1rem;
}

    .text-center.text-muted.py-4 i[b-weloatg583] {
        opacity: 0.3;
 font-size: 4rem;
    color: #dee2e6;
    }

    .text-center.text-muted.py-4 p[b-weloatg583] {
        font-size: 1.1rem;
        margin-top: 1rem;
    }

/* Small helper text */
small[b-weloatg583] {
    display: block;
    margin-top: 0.25rem;
    font-size: 0.875rem;
}

.text-muted small[b-weloatg583] {
    color: #6c757d;
}
/* _content/AccountingSystem.Web/Components/Pages/Purchasing/PurchaseRequisitionManagement.razor.rz.scp.css */
/* Inherits from SalesOrderManagement styling for consistency */

/* Add New Button */
.add-new-btn[b-2jat2ri7n1] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-2jat2ri7n1] {
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

/* Stat Cards */
.stat-card[b-2jat2ri7n1] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
    transition: all 0.3s ease;
    height: 100%;
}

    .stat-card:hover[b-2jat2ri7n1] {
        transform: translateY(-4px);
        box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    }

.stat-header[b-2jat2ri7n1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

    .stat-header i[b-2jat2ri7n1] {
        font-size: 1.75rem;
    }

.stat-label[b-2jat2ri7n1] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.stat-value[b-2jat2ri7n1] {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.stat-footer[b-2jat2ri7n1] {
    font-size: 0.85rem;
    color: #868e96;
}

/* Content Card */
.content-card[b-2jat2ri7n1] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

.card-header-custom[b-2jat2ri7n1] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-2jat2ri7n1] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-2jat2ri7n1] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-2jat2ri7n1] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Filter Section */
.filter-section[b-2jat2ri7n1] {
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.form-select-custom[b-2jat2ri7n1] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-select-custom:focus[b-2jat2ri7n1] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Search Box */
.search-box[b-2jat2ri7n1] {
    position: relative;
}

    .search-box input[b-2jat2ri7n1] {
        padding-left: 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-2jat2ri7n1] {
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-2jat2ri7n1] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
    }

/* Requisitions Table */
.requisitions-table[b-2jat2ri7n1] {
    width: 100%;
    margin-top: 1rem;
}

    .requisitions-table thead[b-2jat2ri7n1] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .requisitions-table thead th[b-2jat2ri7n1] {
            font-weight: 600;
            padding: 1rem 0.75rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.85rem;
            letter-spacing: 0.5px;
        }

    .requisitions-table tbody tr[b-2jat2ri7n1] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .requisitions-table tbody tr:hover[b-2jat2ri7n1] {
            background-color: #f8f9fa;
            transform: scale(1.005);
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
        }

    .requisitions-table tbody td[b-2jat2ri7n1] {
        padding: 1rem 0.75rem;
        vertical-align: middle;
        font-size: 0.9rem;
    }

/* Action Buttons */
.btn-action[b-2jat2ri7n1] {
    padding: 0.5rem 0.75rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-right: 0.25rem;
}

.btn-edit[b-2jat2ri7n1] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-2jat2ri7n1] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

.btn-info[b-2jat2ri7n1] {
    background-color: #0dcaf0;
    color: white;
}

    .btn-info:hover[b-2jat2ri7n1] {
        background-color: #0aa2c0;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 202, 240, 0.3);
    }

.btn-success[b-2jat2ri7n1] {
    background-color: #198754;
    color: white;
}

    .btn-success:hover[b-2jat2ri7n1] {
        background-color: #157347;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(25, 135, 84, 0.3);
    }

.btn-primary[b-2jat2ri7n1] {
    background-color: #0d6efd;
    color: white;
}

    .btn-primary:hover[b-2jat2ri7n1] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

/* Table Summary */
.table-summary[b-2jat2ri7n1] {
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin-top: 1.5rem;
    padding: 1.25rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 10px;
    border: 2px solid var(--secondary-color);
}

.summary-item[b-2jat2ri7n1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.95rem;
    color: #495057;
}

    .summary-item i[b-2jat2ri7n1] {
        font-size: 1.5rem;
    }

    .summary-item strong[b-2jat2ri7n1] {
        color: var(--primary-color);
        font-size: 1.1rem;
    }

/* Page Header */
.page-header[b-2jat2ri7n1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-2jat2ri7n1] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-2jat2ri7n1] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-2jat2ri7n1] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-2jat2ri7n1]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-2jat2ri7n1] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-2jat2ri7n1] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-2jat2ri7n1] {
    color: #6c757d;
}

/* Toast */
.toast[b-2jat2ri7n1] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Responsive */
@media (max-width: 768px) {
    .page-header[b-2jat2ri7n1] {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }

    .page-title[b-2jat2ri7n1] {
        font-size: 1.5rem;
    }

    .content-card[b-2jat2ri7n1] {
        padding: 1.5rem;
    }

    .requisitions-table thead th[b-2jat2ri7n1],
    .requisitions-table tbody td[b-2jat2ri7n1] {
        padding: 0.75rem 0.5rem;
        font-size: 0.85rem;
    }

    .table-summary[b-2jat2ri7n1] {
        flex-direction: column;
        gap: 1rem;
    }

    .summary-item[b-2jat2ri7n1] {
        width: 100%;
        justify-content: center;
    }

    .stat-card[b-2jat2ri7n1] {
        margin-bottom: 1rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Reports/IncomeStatement.razor.rz.scp.css */
/* ========================================
   Income Statement Component Styles
   ======================================== */

/* Report Content */
.report-content[b-rt5ybt6zcw] {
    background: white;
    padding: 2rem;
    border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

/* Company Header */
.company-header[b-rt5ybt6zcw] {
    text-align: center;
    margin-bottom: 2.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.company-header h1[b-rt5ybt6zcw] {
    color: var(--primary-color);
    font-size: 1.75rem;
    margin-bottom: 0.5rem;
    font-weight: 700;
}

.company-header h2[b-rt5ybt6zcw] {
    color: #6c757d;
    font-size: 1.25rem;
    margin-bottom: 0.5rem;
    font-weight: 600;
}

.company-header h3[b-rt5ybt6zcw] {
    color: var(--primary-color);
    font-size: 1.1rem;
    margin-bottom: 1rem;
    font-weight: 600;
}

.company-header h4[b-rt5ybt6zcw] {
    color: var(--primary-color);
    font-size: 1rem;
    margin-bottom: 1rem;
    font-weight: 600;
}

.company-header p[b-rt5ybt6zcw] {
    font-size: 0.95rem;
    color: #6c757d;
    margin: 0.25rem 0;
}

.date-period[b-rt5ybt6zcw] {
    color: var(--secondary-color);
    font-weight: 600;
}

/* Section Title */
.section-title[b-rt5ybt6zcw] {
    color: var(--primary-color);
    font-weight: 700;
  margin: 2rem 0 1rem 0;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--secondary-color);
}

/* Table Styles */
.income-table[b-rt5ybt6zcw] {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1.5rem;
    background: white;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.income-table thead[b-rt5ybt6zcw] {
 background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
 color: white;
}

.income-table thead th[b-rt5ybt6zcw] {
    padding: 1rem;
    text-align: left;
  font-weight: 600;
    border: none;
}

.income-table tbody tr[b-rt5ybt6zcw] {
    transition: background-color 0.2s ease;
    border-bottom: 1px solid #e9ecef;
}

.income-table tbody tr:hover[b-rt5ybt6zcw] {
    background-color: rgba(139, 0, 0, 0.03);
}

.income-table tbody td[b-rt5ybt6zcw] {
    padding: 0.9rem 1rem;
    vertical-align: middle;
}

.amount-col[b-rt5ybt6zcw] {
    text-align: right;
    font-family: 'Courier New', monospace;
    font-weight: 500;
}

.negative[b-rt5ybt6zcw] {
    color: #dc3545;
    font-weight: 600;
}

.subtotal-row[b-rt5ybt6zcw] {
    font-weight: 600;
    background-color: #f8f9fa;
    border-top: 2px solid var(--primary-color);
    border-bottom: 2px solid var(--primary-color);
}

.subtotal-row td[b-rt5ybt6zcw] {
 padding: 1rem;
}

.total-row[b-rt5ybt6zcw] {
    font-weight: 700;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.1) 0%, rgba(139, 0, 0, 0.05) 100%);
    border-top: 3px solid var(--primary-color);
    border-bottom: 4px double var(--primary-color);
}

.total-row td[b-rt5ybt6zcw] {
    padding: 1.25rem 1rem;
    color: var(--primary-color);
    font-size: 1.1rem;
}

/* Signatures Section */
.signatures[b-rt5ybt6zcw] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
    margin-top: 3.5rem;
    padding: 2rem;
    border-top: 2px solid var(--secondary-color);
    background: white;
  border-radius: 8px;
}

.signature-block[b-rt5ybt6zcw] {
    text-align: center;
}

.signature-block .label[b-rt5ybt6zcw] {
    font-weight: 600;
 color: var(--primary-color);
    margin-bottom: 2.5rem;
    font-size: 0.95rem;
}

.signature-block .name[b-rt5ybt6zcw] {
    border-top: 2px solid #333;
  padding-top: 0.5rem;
  display: inline-block;
    min-width: 150px;
    font-weight: 500;
    color: #495057;
}

/* Print Button Override */
.page-header .print-btn[b-rt5ybt6zcw] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border: none;
    padding: 0.75rem 1.5rem;
    cursor: pointer;
    border-radius: 8px;
  font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.2);
}

.page-header .print-btn:hover[b-rt5ybt6zcw] {
    background: linear-gradient(135deg, var(--accent-color) 0%, #4a0000 100%);
    transform: translateY(-2px);
 box-shadow: 0 6px 16px rgba(139, 0, 0, 0.3);
}

.page-header .print-btn i[b-rt5ybt6zcw] {
    font-size: 1.1rem;
}

/* Header Actions */
.header-actions[b-rt5ybt6zcw] {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.filter-btn[b-rt5ybt6zcw] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    cursor: pointer;
    border-radius: 8px;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.2);
}

.filter-btn:hover[b-rt5ybt6zcw] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
 box-shadow: 0 6px 16px rgba(212, 175, 55, 0.3);
}

.filter-btn i[b-rt5ybt6zcw] {
    font-size: 1.1rem;
}

/* Filter Summary Section */
.filter-summary[b-rt5ybt6zcw] {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.05) 0%, rgba(212, 175, 55, 0.02) 100%);
    border: 2px solid var(--secondary-color);
    border-left: 4px solid var(--secondary-color);
    padding: 1.5rem;
    margin-bottom: 2rem;
  border-radius: 8px;
    animation: slideDown-b-rt5ybt6zcw 0.3s ease;
}

@keyframes slideDown-b-rt5ybt6zcw {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.summary-header[b-rt5ybt6zcw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.summary-header h3[b-rt5ybt6zcw] {
    color: var(--primary-color);
    margin: 0;
    font-size: 1.1rem;
    display: flex;
  align-items: center;
    gap: 0.5rem;
}

.clear-filters-btn[b-rt5ybt6zcw] {
    background: #dc3545;
    color: white;
    border: none;
    padding: 0.5rem 1rem;
    cursor: pointer;
    border-radius: 6px;
    font-weight: 500;
    font-size: 0.9rem;
    transition: all 0.3s ease;
    display: flex;
 align-items: center;
    gap: 0.4rem;
}

.clear-filters-btn:hover[b-rt5ybt6zcw] {
    background: #c82333;
    transform: translateY(-2px);
}

.summary-tags[b-rt5ybt6zcw] {
    display: flex;
    flex-wrap: wrap;
gap: 0.8rem;
}

.filter-tag[b-rt5ybt6zcw] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: white;
    color: #495057;
    padding: 0.5rem 1rem;
    border-radius: 20px;
  font-size: 0.9rem;
    border: 1px solid var(--secondary-color);
    animation: tagFadeIn-b-rt5ybt6zcw 0.3s ease;
}

@keyframes tagFadeIn-b-rt5ybt6zcw {
    from {
      opacity: 0;
        transform: scale(0.95);
    }
    to {
    opacity: 1;
        transform: scale(1);
    }
}

.filter-tag i[b-rt5ybt6zcw] {
    color: var(--secondary-color);
    font-size: 1rem;
}

/* Modal Overlay */
.modal-overlay[b-rt5ybt6zcw] {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.modal-overlay.active[b-rt5ybt6zcw] {
    display: flex;
    opacity: 1;
}

/* Modal Content */
.modal-content[b-rt5ybt6zcw] {
  background: white;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
    max-width: 600px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
    animation: modalSlideIn-b-rt5ybt6zcw 0.3s ease;
}

@keyframes modalSlideIn-b-rt5ybt6zcw {
    from {
        transform: translateY(-50px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
 opacity: 1;
    }
}

.modal-header[b-rt5ybt6zcw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2rem;
    border-bottom: 2px solid #f0f0f0;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.05) 0%, rgba(212, 175, 55, 0.02) 100%);
}

.modal-header h2[b-rt5ybt6zcw] {
    color: var(--primary-color);
    margin: 0;
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.modal-close[b-rt5ybt6zcw] {
    background: none;
    border: none;
  font-size: 1.5rem;
 cursor: pointer;
    color: #6c757d;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.modal-close:hover[b-rt5ybt6zcw] {
    color: var(--primary-color);
    transform: rotate(90deg);
}

.modal-body[b-rt5ybt6zcw] {
    padding: 2rem;
}

.filter-section[b-rt5ybt6zcw] {
    margin-bottom: 2rem;
}

.filter-section h3[b-rt5ybt6zcw] {
    color: var(--primary-color);
    font-size: 1.1rem;
    margin-bottom: 1.5rem;
    padding-bottom: 0.5rem;
border-bottom: 2px solid var(--secondary-color);
}

.filter-row[b-rt5ybt6zcw] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.filter-grid[b-rt5ybt6zcw] {
 display: grid;
    grid-template-columns: 1fr 1fr;
 gap: 1.5rem;
}

.filter-field[b-rt5ybt6zcw] {
    display: flex;
flex-direction: column;
    gap: 0.5rem;
}

.filter-field label[b-rt5ybt6zcw] {
    font-weight: 600;
    color: #495057;
    font-size: 0.95rem;
}

.filter-field input[b-rt5ybt6zcw],
.filter-field select[b-rt5ybt6zcw] {
    width: 100%;
    padding: 0.75rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    font-size: 0.95rem;
    transition: border-color 0.3s ease;
}

.filter-field input:focus[b-rt5ybt6zcw],
.filter-field select:focus[b-rt5ybt6zcw] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.1);
}

.modal-footer[b-rt5ybt6zcw] {
    display: flex;
    gap: 1rem;
    padding: 2rem;
    border-top: 2px solid #f0f0f0;
    background: #f8f9fa;
    border-radius: 0 0 12px 12px;
}

.btn-secondary[b-rt5ybt6zcw] {
  background: #6c757d;
    color: white;
    border: none;
 padding: 0.75rem 1.5rem;
    cursor: pointer;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    justify-content: center;
}

.btn-secondary:hover[b-rt5ybt6zcw] {
    background: #5a6268;
    transform: translateY(-2px);
}

.btn-primary[b-rt5ybt6zcw] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border: none;
    padding: 0.75rem 1.5rem;
    cursor: pointer;
border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
  display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    justify-content: center;
}

.btn-primary:hover[b-rt5ybt6zcw] {
    background: linear-gradient(135deg, var(--accent-color) 0%, #4a0000 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(139, 0, 0, 0.3);
}

/* Filters Section (removed from main view - kept for backwards compatibility) */
.filters-section[b-rt5ybt6zcw] {
    display: none;
}

/* Disabled field styling */
.form-control-custom:disabled[b-rt5ybt6zcw],
.form-select-custom:disabled[b-rt5ybt6zcw] {
    background-color: #e9ecef !important;
    color: #6c757d !important;
  cursor: not-allowed;
    opacity: 0.7;
    border-color: #dee2e6 !important;
}

.form-select-custom:disabled option[b-rt5ybt6zcw] {
    color: #6c757d;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .signatures[b-rt5ybt6zcw] {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
}
}

@media (max-width: 768px) {
    .report-content[b-rt5ybt6zcw] {
        padding: 1rem;
    }

    .company-header h1[b-rt5ybt6zcw] {
        font-size: 1.5rem;
    }

    .company-header h2[b-rt5ybt6zcw] {
        font-size: 1.1rem;
    }

    .income-table tbody td[b-rt5ybt6zcw],
    .income-table thead th[b-rt5ybt6zcw] {
        padding: 0.75rem 0.5rem;
        font-size: 0.9rem;
    }

    .signatures[b-rt5ybt6zcw] {
        grid-template-columns: 1fr;
     gap: 2rem;
    }

    .modal-content[b-rt5ybt6zcw] {
        width: 95%;
    }

    .filter-row[b-rt5ybt6zcw],
  .filter-grid[b-rt5ybt6zcw] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}

/* ========================================
   PRINT STYLES - Critical for Print Preview
   ======================================== */
@media print {
    /* Show the report content during print */
body *[b-rt5ybt6zcw] {
  visibility: visible;
    }

    /* Hide all non-print elements */
    .page-header[b-rt5ybt6zcw] {
        display: none !important;
    }

    .filters-section[b-rt5ybt6zcw] {
        display: none !important;
    }

    .restrictions[b-rt5ybt6zcw] {
        display: none !important;
    }

    .filter-summary[b-rt5ybt6zcw] {
        display: none !important;
    }

    .main-content > .page-header[b-rt5ybt6zcw] {
        display: none !important;
    }

    /* Hide all buttons */
    button[b-rt5ybt6zcw] {
        display: none !important;
  }

    /* Hide sidebar and navigation */
 .sidebar[b-rt5ybt6zcw] {
        display: none !important;
    }

    .sidebar-toggle[b-rt5ybt6zcw] {
        display: none !important;
    }

    /* Reset main content styling for print with standard page margins */
    .main-content[b-rt5ybt6zcw] {
     margin: 0 !important;
    padding: 0.5in !important;
   background: white !important;
        min-height: auto !important;
   width: 8.5in;
 }

    /* Make report content visible and properly styled */
    .report-content[b-rt5ybt6zcw] {
     background: white !important;
    box-shadow: none !important;
      padding: 0.4in !important;
        border-radius: 0 !important;
        margin: 0 !important;
        display: block !important;
        visibility: visible !important;
   page-break-after: avoid;
     border: none !important;
    }

    /* Ensure company header prints nicely with appropriate spacing */
    .company-header[b-rt5ybt6zcw] {
        page-break-inside: avoid;
        border-bottom: 2px solid #000;
        display: block !important;
     visibility: visible !important;
        margin-bottom: 0.3in !important;
        padding-bottom: 0.3in !important;
    }

    .company-header h1[b-rt5ybt6zcw],
    .company-header h2[b-rt5ybt6zcw],
  .company-header h3[b-rt5ybt6zcw],
 .company-header p[b-rt5ybt6zcw] {
        display: block !important;
 visibility: visible !important;
   color: #000 !important;
  margin: 0.05in 0 !important;
    }

    .company-header h1[b-rt5ybt6zcw] {
        font-size: 20pt !important;
        margin-bottom: 0.1in !important;
        font-weight: bold !important;
    }

    .company-header h2[b-rt5ybt6zcw] {
        font-size: 14pt !important;
        margin-bottom: 0.05in !important;
    }

    .company-header h3[b-rt5ybt6zcw] {
 font-size: 12pt !important;
     margin-bottom: 0.1in !important;
        font-weight: bold !important;
  }

    .company-header p[b-rt5ybt6zcw] {
        font-size: 10pt !important;
        margin: 0.02in 0 !important;
    }

    /* Section titles with minimal spacing */
    .section-title[b-rt5ybt6zcw] {
      color: #000 !important;
        border-bottom: 2px solid #000 !important;
      display: block !important;
  visibility: visible !important;
     margin: 0.2in 0 0.1in 0 !important;
        padding-bottom: 0.05in !important;
 font-size: 11pt !important;
font-weight: bold !important;
    }

    /* Ensure tables print properly with content visible */
    .income-table[b-rt5ybt6zcw] {
        page-break-inside: avoid;
        box-shadow: none !important;
   border: 1px solid #000;
    margin-bottom: 0.15in !important;
display: table !important;
      width: 100%;
        border-collapse: collapse !important;
    }

    .income-table thead[b-rt5ybt6zcw] {
        background: #333 !important;
     -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
        color: white !important;
        display: table-header-group !important;
    }

    .income-table thead th[b-rt5ybt6zcw] {
        background: #333 !important;
  -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
  color: white !important;
        border: 1px solid #000 !important;
        padding: 8px !important;
   display: table-cell !important;
        font-size: 10pt !important;
    }

    .income-table tbody[b-rt5ybt6zcw] {
        display: table-row-group !important;
    }

    .income-table tbody tr[b-rt5ybt6zcw] {
        display: table-row !important;
    }

    .income-table tbody td[b-rt5ybt6zcw] {
     border: 1px solid #000;
    display: table-cell !important;
        padding: 6px 8px !important;
      font-size: 9pt !important;
    }

    .subtotal-row[b-rt5ybt6zcw] {
        background: #e8e8e8 !important;
        -webkit-print-color-adjust: exact;
      print-color-adjust: exact;
        border-top: 2px solid #000 !important;
        border-bottom: 2px solid #000 !important;
        display: table-row !important;
        font-weight: bold !important;
}

    .subtotal-row td[b-rt5ybt6zcw] {
        padding: 8px !important;
        display: table-cell !important;
 font-weight: bold !important;
    }

    .total-row[b-rt5ybt6zcw] {
        background: #d3d3d3 !important;
        -webkit-print-color-adjust: exact;
      print-color-adjust: exact;
        border-top: 3px solid #000 !important;
        border-bottom: 3px double #000 !important;
        font-weight: bold;
        display: table-row !important;
    }

    .total-row td[b-rt5ybt6zcw] {
        padding: 10px 8px !important;
        display: table-cell !important;
        font-weight: bold !important;
      font-size: 10pt !important;
    }

    .amount-col[b-rt5ybt6zcw] {
 text-align: right !important;
    }

    /* Ensure all text is visible in print */
    .negative[b-rt5ybt6zcw] {
        color: #000 !important;
    }

    /* Optimize signatures for print with balanced spacing */
    .signatures[b-rt5ybt6zcw] {
        page-break-inside: avoid;
   margin-top: 0.3in !important;
        padding: 0.3in !important;
   display: grid !important;
        visibility: visible !important;
        grid-template-columns: repeat(4, 1fr) !important;
     gap: 0.2in !important;
      background: white !important;
        border-top: 2px solid #000 !important;
    }

    .signature-block[b-rt5ybt6zcw] {
     page-break-inside: avoid;
        display: block !important;
        visibility: visible !important;
        text-align: center;
   padding: 0.1in 0 !important;
    }

  .signature-block .label[b-rt5ybt6zcw] {
        display: block !important;
        visibility: visible !important;
        color: #000 !important;
        margin-bottom: 0.3in !important;
        font-weight: 600;
        font-size: 9pt !important;
    }

    .signature-block .name[b-rt5ybt6zcw] {
        display: block !important;
        visibility: visible !important;
     color: #000 !important;
        border-top: 2px solid #000 !important;
padding-top: 0.05in !important;
        margin-top: 0.05in !important;
        font-weight: 500;
        min-width: 1.3in;
        font-size: 9pt !important;
    }

    /* Set proper margins for print */
    html[b-rt5ybt6zcw], body[b-rt5ybt6zcw] {
        margin: 0 !important;
      padding: 0 !important;
    }

    /* Optimize table spacing for print */
    .income-table[b-rt5ybt6zcw] {
        width: 100%;
        border-spacing: 0;
    }

  /* Hide scrollbars and unnecessary elements */
    [b-rt5ybt6zcw]::-webkit-scrollbar {
        display: none !important;
    }

    /* Ensure PermissionWrapper doesn't hide content */
    permission-wrapper[b-rt5ybt6zcw],
    [permissionwrapper][b-rt5ybt6zcw] {
        display: block !important;
        visibility: visible !important;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Reports/JournalEntry.razor.rz.scp.css */
/* ========================================
   Journal Entry Component Styles
   ======================================== */

/* Report Content */
.report-content[b-njhklc37rg] {
    background: white;
    padding: 2rem;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

/* Company Header */
.company-header[b-njhklc37rg] {
    text-align: center;
    margin-bottom: 2.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

    .company-header h1[b-njhklc37rg] {
        color: var(--primary-color);
        font-size: 1.75rem;
        margin-bottom: 0.5rem;
        font-weight: 700;
    }

    .company-header h2[b-njhklc37rg] {
        color: #6c757d;
        font-size: 1.25rem;
        margin-bottom: 0.5rem;
        font-weight: 600;
    }

    .company-header h3[b-njhklc37rg] {
        color: var(--primary-color);
        font-size: 1.1rem;
        margin-bottom: 1rem;
        font-weight: 600;
    }

    .company-header p[b-njhklc37rg] {
        font-size: 0.95rem;
        color: #6c757d;
        margin: 0.25rem 0;
    }

.date-period[b-njhklc37rg] {
    color: var(--secondary-color);
    font-weight: 600;
}

/* Section Title */
.section-title[b-njhklc37rg] {
    color: var(--primary-color);
    font-weight: 700;
    margin: 2rem 0 1rem 0;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--secondary-color);
}

/* Table Styles */
.journal-entry-table[b-njhklc37rg] {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1.5rem;
    background: white;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

    .journal-entry-table thead[b-njhklc37rg] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
    }

        .journal-entry-table thead th[b-njhklc37rg] {
            padding: 1rem;
            text-align: left;
            font-weight: 600;
            border: none;
        }

    .journal-entry-table tbody tr[b-njhklc37rg] {
        transition: background-color 0.2s ease;
        border-bottom: 1px solid #e9ecef;
    }

        .journal-entry-table tbody tr:hover[b-njhklc37rg] {
            background-color: rgba(139, 0, 0, 0.03);
        }

    .journal-entry-table tbody td[b-njhklc37rg] {
        padding: 0.9rem 1rem;
        vertical-align: middle;
    }

.amount-col[b-njhklc37rg] {
    text-align: right;
    font-family: 'Courier New', monospace;
    font-weight: 500;
}

.negative[b-njhklc37rg] {
    color: #dc3545;
    font-weight: 600;
}

.subtotal-row[b-njhklc37rg] {
    font-weight: 600;
    background-color: #f8f9fa;
    border-top: 2px solid var(--primary-color);
    border-bottom: 2px solid var(--primary-color);
}

    .subtotal-row td[b-njhklc37rg] {
        padding: 1rem;
    }

.total-row[b-njhklc37rg] {
    font-weight: 700;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.1) 0%, rgba(139, 0, 0, 0.05) 100%);
    border-top: 3px solid var(--primary-color);
    border-bottom: 4px double var(--primary-color);
}

    .total-row td[b-njhklc37rg] {
        padding: 1.25rem 1rem;
        color: var(--primary-color);
        font-size: 1.1rem;
    }

/* Signatures Section */
.signatures[b-njhklc37rg] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
    margin-top: 3.5rem;
    padding: 2rem;
    border-top: 2px solid var(--secondary-color);
    background: white;
    border-radius: 8px;
}

.signature-block[b-njhklc37rg] {
    text-align: center;
}

    .signature-block .label[b-njhklc37rg] {
        font-weight: 600;
        color: var(--primary-color);
        margin-bottom: 2.5rem;
        font-size: 0.95rem;
    }

    .signature-block .name[b-njhklc37rg] {
        border-top: 2px solid #333;
        padding-top: 0.5rem;
        display: inline-block;
        min-width: 150px;
        font-weight: 500;
        color: #495057;
    }

/* Print Button Override */
.page-header .print-btn[b-njhklc37rg] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border: none;
    padding: 0.75rem 1.5rem;
    cursor: pointer;
    border-radius: 8px;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.2);
}

    .page-header .print-btn:hover[b-njhklc37rg] {
        background: linear-gradient(135deg, var(--accent-color) 0%, #4a0000 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(139, 0, 0, 0.3);
    }

    .page-header .print-btn i[b-njhklc37rg] {
        font-size: 1.1rem;
    }

/* Header Actions */
.header-actions[b-njhklc37rg] {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.filter-btn[b-njhklc37rg] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    cursor: pointer;
    border-radius: 8px;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.2);
}

    .filter-btn:hover[b-njhklc37rg] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.3);
    }

    .filter-btn i[b-njhklc37rg] {
        font-size: 1.1rem;
    }

/* Filter Summary Section */
.filter-summary[b-njhklc37rg] {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.05) 0%, rgba(212, 175, 55, 0.02) 100%);
    border: 2px solid var(--secondary-color);
    border-left: 4px solid var(--secondary-color);
    padding: 1.5rem;
    margin-bottom: 2rem;
    border-radius: 8px;
    animation: slideDown-b-njhklc37rg 0.3s ease;
}

@keyframes slideDown-b-njhklc37rg {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.summary-header[b-njhklc37rg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

    .summary-header h3[b-njhklc37rg] {
        color: var(--primary-color);
        margin: 0;
        font-size: 1.1rem;
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

.clear-filters-btn[b-njhklc37rg] {
    background: #dc3545;
    color: white;
    border: none;
    padding: 0.5rem 1rem;
    cursor: pointer;
    border-radius: 6px;
    font-weight: 500;
    font-size: 0.9rem;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

    .clear-filters-btn:hover[b-njhklc37rg] {
        background: #c82333;
        transform: translateY(-2px);
    }

.summary-tags[b-njhklc37rg] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
}

.filter-tag[b-njhklc37rg] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: white;
    color: #495057;
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.9rem;
    border: 1px solid var(--secondary-color);
    animation: tagFadeIn-b-njhklc37rg 0.3s ease;
}

@keyframes tagFadeIn-b-njhklc37rg {
    from {
        opacity: 0;
        transform: scale(0.95);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

.filter-tag i[b-njhklc37rg] {
    color: var(--secondary-color);
    font-size: 1rem;
}

/* Modal Overlay */
.modal-overlay[b-njhklc37rg] {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

    .modal-overlay.active[b-njhklc37rg] {
        display: flex;
        opacity: 1;
    }

/* Modal Content */
.modal-content[b-njhklc37rg] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
    max-width: 600px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
    animation: modalSlideIn-b-njhklc37rg 0.3s ease;
}

@keyframes modalSlideIn-b-njhklc37rg {
    from {
        transform: translateY(-50px);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.modal-header[b-njhklc37rg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2rem;
    border-bottom: 2px solid #f0f0f0;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.05) 0%, rgba(212, 175, 55, 0.02) 100%);
}

    .modal-header h2[b-njhklc37rg] {
        color: var(--primary-color);
        margin: 0;
        font-size: 1.5rem;
        display: flex;
        align-items: center;
        gap: 0.8rem;
    }

.modal-close[b-njhklc37rg] {
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: #6c757d;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

    .modal-close:hover[b-njhklc37rg] {
        color: var(--primary-color);
        transform: rotate(90deg);
    }

.modal-body[b-njhklc37rg] {
    padding: 2rem;
}

.filter-section[b-njhklc37rg] {
    margin-bottom: 2rem;
}

    .filter-section h3[b-njhklc37rg] {
        color: var(--primary-color);
        font-size: 1.1rem;
        margin-bottom: 1.5rem;
        padding-bottom: 0.5rem;
        border-bottom: 2px solid var(--secondary-color);
    }

.filter-row[b-njhklc37rg] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.filter-grid[b-njhklc37rg] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.filter-field[b-njhklc37rg] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

    .filter-field label[b-njhklc37rg] {
        font-weight: 600;
        color: #495057;
        font-size: 0.95rem;
    }

    .filter-field input[b-njhklc37rg],
    .filter-field select[b-njhklc37rg] {
        width: 100%;
        padding: 0.75rem;
        border: 1px solid #dee2e6;
        border-radius: 6px;
        font-size: 0.95rem;
        transition: border-color 0.3s ease;
    }

        .filter-field input:focus[b-njhklc37rg],
        .filter-field select:focus[b-njhklc37rg] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.1);
        }

.modal-footer[b-njhklc37rg] {
    display: flex;
    gap: 1rem;
    padding: 2rem;
    border-top: 2px solid #f0f0f0;
    background: #f8f9fa;
    border-radius: 0 0 12px 12px;
}

.btn-secondary[b-njhklc37rg] {
    background: #6c757d;
    color: white;
    border: none;
    padding: 0.75rem 1.5rem;
    cursor: pointer;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    justify-content: center;
}

    .btn-secondary:hover[b-njhklc37rg] {
        background: #5a6268;
        transform: translateY(-2px);
    }

.btn-primary[b-njhklc37rg] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border: none;
    padding: 0.75rem 1.5rem;
    cursor: pointer;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    justify-content: center;
}

    .btn-primary:hover[b-njhklc37rg] {
        background: linear-gradient(135deg, var(--accent-color) 0%, #4a0000 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(139, 0, 0, 0.3);
    }

/* Filters Section (removed from main view - kept for backwards compatibility) */
.filters-section[b-njhklc37rg] {
    display: none;
}

/* Disabled field styling */
.form-control-custom:disabled[b-njhklc37rg],
.form-select-custom:disabled[b-njhklc37rg] {
    background-color: #e9ecef !important;
    color: #6c757d !important;
    cursor: not-allowed;
    opacity: 0.7;
    border-color: #dee2e6 !important;
}

    .form-select-custom:disabled option[b-njhklc37rg] {
        color: #6c757d;
    }

/* Responsive Design */
@media (max-width: 1024px) {
    .signatures[b-njhklc37rg] {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
    }
}

@media (max-width: 768px) {
    .report-content[b-njhklc37rg] {
        padding: 1rem;
    }

    .company-header h1[b-njhklc37rg] {
        font-size: 1.5rem;
    }

    .company-header h2[b-njhklc37rg] {
        font-size: 1.1rem;
    }

    .journal-entry-table tbody td[b-njhklc37rg],
    .journal-entry-table thead th[b-njhklc37rg] {
        padding: 0.75rem 0.5rem;
        font-size: 0.9rem;
    }

    .signatures[b-njhklc37rg] {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .modal-content[b-njhklc37rg] {
        width: 95%;
    }

    .filter-row[b-njhklc37rg],
    .filter-grid[b-njhklc37rg] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}

/* ========================================
   PRINT STYLES - Critical for Print Preview
   ======================================== */
@media print {
    /* Show the report content during print */
    body *[b-njhklc37rg] {
        visibility: visible;
    }

    /* Hide all non-print elements */
    .page-header[b-njhklc37rg] {
        display: none !important;
    }

    .filters-section[b-njhklc37rg] {
        display: none !important;
    }

    .restrictions[b-njhklc37rg] {
        display: none !important;
    }

    .filter-summary[b-njhklc37rg] {
        display: none !important;
    }

    .main-content > .page-header[b-njhklc37rg] {
        display: none !important;
    }

    /* Hide all buttons */
    button[b-njhklc37rg] {
        display: none !important;
    }

    /* Hide sidebar and navigation */
    .sidebar[b-njhklc37rg] {
        display: none !important;
    }

    .sidebar-toggle[b-njhklc37rg] {
        display: none !important;
    }

    /* Reset main content styling for print with standard page margins */
    .main-content[b-njhklc37rg] {
        margin: 0 !important;
        padding: 0.5in !important;
        background: white !important;
        min-height: auto !important;
        width: 8.5in;
    }

    /* Make report content visible and properly styled */
    .report-content[b-njhklc37rg] {
        background: white !important;
        box-shadow: none !important;
        padding: 0.4in !important;
        border-radius: 0 !important;
        margin: 0 !important;
        display: block !important;
        visibility: visible !important;
        page-break-after: auto;
        border: none !important;
    }

    /* Ensure company header prints nicely with appropriate spacing */
    .company-header[b-njhklc37rg] {
        page-break-inside: avoid;
        border-bottom: 2px solid #000;
        display: block !important;
        visibility: visible !important;
        margin-bottom: 0.3in !important;
        padding-bottom: 0.3in !important;
    }

        .company-header h1[b-njhklc37rg],
        .company-header h2[b-njhklc37rg],
        .company-header h3[b-njhklc37rg],
        .company-header p[b-njhklc37rg] {
            display: block !important;
            visibility: visible !important;
            color: #000 !important;
            margin: 0.05in 0 !important;
        }

        .company-header h1[b-njhklc37rg] {
            font-size: 20pt !important;
            margin-bottom: 0.1in !important;
            font-weight: bold !important;
        }

        .company-header h2[b-njhklc37rg] {
            font-size: 14pt !important;
            margin-bottom: 0.05in !important;
        }

        .company-header h3[b-njhklc37rg] {
            font-size: 12pt !important;
            margin-bottom: 0.1in !important;
            font-weight: bold !important;
        }

        .company-header p[b-njhklc37rg] {
            font-size: 10pt !important;
            margin: 0.02in 0 !important;
        }

    /* Section titles with minimal spacing */
    .section-title[b-njhklc37rg] {
        color: #000 !important;
        border-bottom: 2px solid #000 !important;
        display: block !important;
        visibility: visible !important;
        margin: 0.2in 0 0.1in 0 !important;
        padding-bottom: 0.05in !important;
        font-size: 11pt !important;
        font-weight: bold !important;
    }

    /* ==================== TABLE PRINT STYLES ==================== */
    /* Keep table header on same page as data */
    .journal-entry-table[b-njhklc37rg] {
        page-break-inside: auto;
        box-shadow: none !important;
        border: 1px solid #000;
        margin: 0.15in 0 !important;
        padding: 0 !important;
        display: table !important;
        width: 100%;
        border-collapse: collapse !important;
        empty-cells: show;
    }

    /* Allow table rows to break across pages, but keep header with data */
    .journal-entry-table thead[b-njhklc37rg] {
        background: #333 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
        color: white !important;
        display: table-header-group !important;
    }

        .journal-entry-table thead tr[b-njhklc37rg] {
            display: table-row !important;
            page-break-inside: avoid !important;
        }

        .journal-entry-table thead th[b-njhklc37rg] {
            background: #333 !important;
            -webkit-print-color-adjust: exact;
            print-color-adjust: exact;
            color: white !important;
            border: 1px solid #000 !important;
            padding: 8px !important;
            display: table-cell !important;
            font-size: 10pt !important;
        }

    /* Allow tbody to break naturally across pages */
    .journal-entry-table tbody[b-njhklc37rg] {
        display: table-row-group !important;
    }

        .journal-entry-table tbody tr[b-njhklc37rg] {
            display: table-row !important;
            page-break-inside: auto !important;
        }

            .journal-entry-table tbody td[b-njhklc37rg] {
                border: 1px solid #000;
                display: table-cell !important;
                padding: 6px 8px !important;
                font-size: 9pt !important;
            }

    /* Keep total row with its data - don't let it orphan */
    .total-row[b-njhklc37rg] {
        background: #d3d3d3 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
        border-top: 3px solid #000 !important;
        border-bottom: 3px double #000 !important;
        font-weight: bold;
        display: table-row !important;
        page-break-inside: avoid !important;
        page-break-before: auto !important;
    }

        .total-row td[b-njhklc37rg] {
            padding: 10px 8px !important;
            display: table-cell !important;
            font-weight: bold !important;
            font-size: 10pt !important;
        }

    .subtotal-row[b-njhklc37rg] {
        background: #e8e8e8 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
        border-top: 2px solid #000 !important;
        border-bottom: 2px solid #000 !important;
        display: table-row !important;
        font-weight: bold !important;
        page-break-inside: avoid !important;
    }

        .subtotal-row td[b-njhklc37rg] {
            padding: 8px !important;
            display: table-cell !important;
            font-weight: bold !important;
        }

    .amount-col[b-njhklc37rg] {
        text-align: right !important;
    }

    /* Ensure all text is visible in print */
    .negative[b-njhklc37rg] {
        color: #000 !important;
    }

    /* ==================== SIGNATURE SECTION ==================== */
    /* Force signature section to new page if table is long */
    .signatures[b-njhklc37rg] {
        page-break-before: auto !important;
        page-break-inside: avoid !important;
        margin-top: 0.3in !important;
        padding: 0.3in !important;
        display: grid !important;
        visibility: visible !important;
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 0.2in !important;
        background: white !important;
        border-top: 2px solid #000 !important;
    }

    .signature-block[b-njhklc37rg] {
        page-break-inside: avoid !important;
        display: block !important;
        visibility: visible !important;
        text-align: center;
        padding: 0.1in 0 !important;
    }

        .signature-block .label[b-njhklc37rg] {
            display: block !important;
            visibility: visible !important;
            color: #000 !important;
            margin-bottom: 0.3in !important;
            font-weight: 600;
            font-size: 9pt !important;
        }

        .signature-block .name[b-njhklc37rg] {
            display: block !important;
            visibility: visible !important;
            color: #000 !important;
            border-top: 2px solid #000 !important;
            padding-top: 0.05in !important;
            margin-top: 0.05in !important;
            font-weight: 500;
            min-width: 1.3in;
            font-size: 9pt !important;
        }

    /* Set proper margins for print */
    html[b-njhklc37rg], body[b-njhklc37rg] {
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Optimize table spacing for print */
    .journal-entry-table[b-njhklc37rg] {
        width: 100%;
        border-spacing: 0;
    }

    /* Hide scrollbars and unnecessary elements */
    [b-njhklc37rg]::-webkit-scrollbar {
        display: none !important;
    }

    /* Ensure PermissionWrapper doesn't hide content */
    permission-wrapper[b-njhklc37rg],
    [permissionwrapper][b-njhklc37rg] {
        display: block !important;
        visibility: visible !important;
    }

    /* ==================== PAGE BREAK RULES ==================== */
    @page {
        size: A4;
        margin: 0.5in;
    }

    /* Prevent orphaned headers - keep header with at least some data */
    thead[b-njhklc37rg] {
        display: table-header-group;
    }

    /* Prevent orphaned footers */
    tfoot[b-njhklc37rg] {
        display: table-footer-group;
    }

    /* Avoid awkward breaks */
    h1[b-njhklc37rg], h2[b-njhklc37rg], h3[b-njhklc37rg], h4[b-njhklc37rg], h5[b-njhklc37rg], h6[b-njhklc37rg] {
        page-break-after: avoid;
    }

    tr[b-njhklc37rg] {
        page-break-inside: avoid;
    }

    /* Allow table content to flow naturally */
    table[b-njhklc37rg] {
        page-break-inside: auto;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Reports/TrialBalance.razor.rz.scp.css */
/* ========================================
   Income Statement Component Styles
   ======================================== */

/* Report Content */
.report-content[b-y64sk8vc6i] {
    background: white;
    padding: 2rem;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

/* Company Header */
.company-header[b-y64sk8vc6i] {
    text-align: center;
    margin-bottom: 2.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

    .company-header h1[b-y64sk8vc6i] {
        color: var(--primary-color);
        font-size: 1.75rem;
        margin-bottom: 0.5rem;
        font-weight: 700;
    }

    .company-header h2[b-y64sk8vc6i] {
        color: #6c757d;
        font-size: 1.25rem;
        margin-bottom: 0.5rem;
        font-weight: 600;
    }

    .company-header h3[b-y64sk8vc6i] {
        color: var(--primary-color);
        font-size: 1.1rem;
        margin-bottom: 1rem;
        font-weight: 600;
    }
    .company-header h4[b-y64sk8vc6i] {
        color: var(--primary-color);
        font-size: 1rem;
        margin-bottom: 1rem;
        font-weight: 600;
    }
    .company-header p[b-y64sk8vc6i] {
        font-size: 0.95rem;
        color: #6c757d;
        margin: 0.25rem 0;
    }

.date-period[b-y64sk8vc6i] {
    color: var(--secondary-color);
    font-weight: 600;
}

/* Section Title */
.section-title[b-y64sk8vc6i] {
    color: var(--primary-color);
    font-weight: 700;
    margin: 2rem 0 1rem 0;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--secondary-color);
}

/* Table Styles */
.income-table[b-y64sk8vc6i] {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1.5rem;
    background: white;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

    .income-table thead[b-y64sk8vc6i] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
    }

        .income-table thead th[b-y64sk8vc6i] {
            padding: 1rem;
            text-align: left;
            font-weight: 600;
            border: none;
        }

    .income-table tbody tr[b-y64sk8vc6i] {
        transition: background-color 0.2s ease;
        border-bottom: 1px solid #e9ecef;
    }

        .income-table tbody tr:hover[b-y64sk8vc6i] {
            background-color: rgba(139, 0, 0, 0.03);
        }

    .income-table tbody td[b-y64sk8vc6i] {
        padding: 0.9rem 1rem;
        vertical-align: middle;
    }

.amount-col[b-y64sk8vc6i] {
    text-align: right;
    font-family: 'Courier New', monospace;
    font-weight: 500;
}

.negative[b-y64sk8vc6i] {
    color: #dc3545;
    font-weight: 600;
}

.subtotal-row[b-y64sk8vc6i] {
    font-weight: 600;
    background-color: #f8f9fa;
    border-top: 2px solid var(--primary-color);
    border-bottom: 2px solid var(--primary-color);
}

    .subtotal-row td[b-y64sk8vc6i] {
        padding: 1rem;
    }

.total-row[b-y64sk8vc6i] {
    font-weight: 700;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.1) 0%, rgba(139, 0, 0, 0.05) 100%);
    border-top: 3px solid var(--primary-color);
    border-bottom: 4px double var(--primary-color);
}

    .total-row td[b-y64sk8vc6i] {
        padding: 1.25rem 1rem;
        color: var(--primary-color);
        font-size: 1.1rem;
    }

/* Signatures Section */
.signatures[b-y64sk8vc6i] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
    margin-top: 3.5rem;
    padding: 2rem;
    border-top: 2px solid var(--secondary-color);
    background: white;
    border-radius: 8px;
}

.signature-block[b-y64sk8vc6i] {
    text-align: center;
}

    .signature-block .label[b-y64sk8vc6i] {
        font-weight: 600;
        color: var(--primary-color);
        margin-bottom: 2.5rem;
        font-size: 0.95rem;
    }

    .signature-block .name[b-y64sk8vc6i] {
        border-top: 2px solid #333;
        padding-top: 0.5rem;
        display: inline-block;
        min-width: 150px;
        font-weight: 500;
        color: #495057;
    }

/* Print Button Override */
.page-header .print-btn[b-y64sk8vc6i] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border: none;
    padding: 0.75rem 1.5rem;
    cursor: pointer;
    border-radius: 8px;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.2);
}

    .page-header .print-btn:hover[b-y64sk8vc6i] {
        background: linear-gradient(135deg, var(--accent-color) 0%, #4a0000 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(139, 0, 0, 0.3);
    }

    .page-header .print-btn i[b-y64sk8vc6i] {
        font-size: 1.1rem;
    }

/* Header Actions */
.header-actions[b-y64sk8vc6i] {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.filter-btn[b-y64sk8vc6i] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    cursor: pointer;
    border-radius: 8px;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.2);
}

    .filter-btn:hover[b-y64sk8vc6i] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.3);
    }

    .filter-btn i[b-y64sk8vc6i] {
        font-size: 1.1rem;
    }

/* Filter Summary Section */
.filter-summary[b-y64sk8vc6i] {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.05) 0%, rgba(212, 175, 55, 0.02) 100%);
    border: 2px solid var(--secondary-color);
    border-left: 4px solid var(--secondary-color);
    padding: 1.5rem;
    margin-bottom: 2rem;
    border-radius: 8px;
    animation: slideDown-b-y64sk8vc6i 0.3s ease;
}

@keyframes slideDown-b-y64sk8vc6i {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.summary-header[b-y64sk8vc6i] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

    .summary-header h3[b-y64sk8vc6i] {
        color: var(--primary-color);
        margin: 0;
        font-size: 1.1rem;
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

.clear-filters-btn[b-y64sk8vc6i] {
    background: #dc3545;
    color: white;
    border: none;
    padding: 0.5rem 1rem;
    cursor: pointer;
    border-radius: 6px;
    font-weight: 500;
    font-size: 0.9rem;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

    .clear-filters-btn:hover[b-y64sk8vc6i] {
        background: #c82333;
        transform: translateY(-2px);
    }

.summary-tags[b-y64sk8vc6i] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
}

.filter-tag[b-y64sk8vc6i] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: white;
    color: #495057;
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.9rem;
    border: 1px solid var(--secondary-color);
    animation: tagFadeIn-b-y64sk8vc6i 0.3s ease;
}

@keyframes tagFadeIn-b-y64sk8vc6i {
    from {
        opacity: 0;
        transform: scale(0.95);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

.filter-tag i[b-y64sk8vc6i] {
    color: var(--secondary-color);
    font-size: 1rem;
}

/* Modal Overlay */
.modal-overlay[b-y64sk8vc6i] {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

    .modal-overlay.active[b-y64sk8vc6i] {
        display: flex;
        opacity: 1;
    }

/* Modal Content */
.modal-content[b-y64sk8vc6i] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
    max-width: 600px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
    animation: modalSlideIn-b-y64sk8vc6i 0.3s ease;
}

@keyframes modalSlideIn-b-y64sk8vc6i {
    from {
        transform: translateY(-50px);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.modal-header[b-y64sk8vc6i] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2rem;
    border-bottom: 2px solid #f0f0f0;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.05) 0%, rgba(212, 175, 55, 0.02) 100%);
}

    .modal-header h2[b-y64sk8vc6i] {
        color: var(--primary-color);
        margin: 0;
        font-size: 1.5rem;
        display: flex;
        align-items: center;
        gap: 0.8rem;
    }

.modal-close[b-y64sk8vc6i] {
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: #6c757d;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

    .modal-close:hover[b-y64sk8vc6i] {
        color: var(--primary-color);
        transform: rotate(90deg);
    }

.modal-body[b-y64sk8vc6i] {
    padding: 2rem;
}

.filter-section[b-y64sk8vc6i] {
    margin-bottom: 2rem;
}

    .filter-section h3[b-y64sk8vc6i] {
        color: var(--primary-color);
        font-size: 1.1rem;
        margin-bottom: 1.5rem;
        padding-bottom: 0.5rem;
        border-bottom: 2px solid var(--secondary-color);
    }

.filter-row[b-y64sk8vc6i] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.filter-grid[b-y64sk8vc6i] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.filter-field[b-y64sk8vc6i] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

    .filter-field label[b-y64sk8vc6i] {
        font-weight: 600;
        color: #495057;
        font-size: 0.95rem;
    }

    .filter-field input[b-y64sk8vc6i],
    .filter-field select[b-y64sk8vc6i] {
        width: 100%;
        padding: 0.75rem;
        border: 1px solid #dee2e6;
        border-radius: 6px;
        font-size: 0.95rem;
        transition: border-color 0.3s ease;
    }

        .filter-field input:focus[b-y64sk8vc6i],
        .filter-field select:focus[b-y64sk8vc6i] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.1);
        }

.modal-footer[b-y64sk8vc6i] {
    display: flex;
    gap: 1rem;
    padding: 2rem;
    border-top: 2px solid #f0f0f0;
    background: #f8f9fa;
    border-radius: 0 0 12px 12px;
}

.btn-secondary[b-y64sk8vc6i] {
    background: #6c757d;
    color: white;
    border: none;
    padding: 0.75rem 1.5rem;
    cursor: pointer;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    justify-content: center;
}

    .btn-secondary:hover[b-y64sk8vc6i] {
        background: #5a6268;
        transform: translateY(-2px);
    }

.btn-primary[b-y64sk8vc6i] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border: none;
    padding: 0.75rem 1.5rem;
    cursor: pointer;
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    justify-content: center;
}

    .btn-primary:hover[b-y64sk8vc6i] {
        background: linear-gradient(135deg, var(--accent-color) 0%, #4a0000 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(139, 0, 0, 0.3);
    }

/* Filters Section (removed from main view - kept for backwards compatibility) */
.filters-section[b-y64sk8vc6i] {
    display: none;
}

/* Disabled field styling */
.form-control-custom:disabled[b-y64sk8vc6i],
.form-select-custom:disabled[b-y64sk8vc6i] {
    background-color: #e9ecef !important;
    color: #6c757d !important;
    cursor: not-allowed;
    opacity: 0.7;
    border-color: #dee2e6 !important;
}

    .form-select-custom:disabled option[b-y64sk8vc6i] {
        color: #6c757d;
    }

/* Responsive Design */
@media (max-width: 1024px) {
    .signatures[b-y64sk8vc6i] {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
    }
}

@media (max-width: 768px) {
    .report-content[b-y64sk8vc6i] {
        padding: 1rem;
    }

    .company-header h1[b-y64sk8vc6i] {
        font-size: 1.5rem;
    }

    .company-header h2[b-y64sk8vc6i] {
        font-size: 1.1rem;
    }

    .income-table tbody td[b-y64sk8vc6i],
    .income-table thead th[b-y64sk8vc6i] {
        padding: 0.75rem 0.5rem;
        font-size: 0.9rem;
    }

    .signatures[b-y64sk8vc6i] {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .modal-content[b-y64sk8vc6i] {
        width: 95%;
    }

    .filter-row[b-y64sk8vc6i],
    .filter-grid[b-y64sk8vc6i] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}

/* ========================================
   PRINT STYLES - Critical for Print Preview
   ======================================== */
@media print {
    /* Show the report content during print */
    body *[b-y64sk8vc6i] {
        visibility: visible;
    }

    /* Hide all non-print elements */
    .page-header[b-y64sk8vc6i] {
        display: none !important;
    }

    .filters-section[b-y64sk8vc6i] {
        display: none !important;
    }

    .restrictions[b-y64sk8vc6i] {
        display: none !important;
    }

    .filter-summary[b-y64sk8vc6i] {
        display: none !important;
    }

    .main-content > .page-header[b-y64sk8vc6i] {
        display: none !important;
    }

    /* Hide all buttons */
    button[b-y64sk8vc6i] {
        display: none !important;
    }

    /* Hide sidebar and navigation */
    .sidebar[b-y64sk8vc6i] {
        display: none !important;
    }

    .sidebar-toggle[b-y64sk8vc6i] {
        display: none !important;
    }

    /* Reset main content styling for print with standard page margins */
    .main-content[b-y64sk8vc6i] {
        margin: 0 !important;
        padding: 0.5in !important;
        background: white !important;
        min-height: auto !important;
        width: 8.5in;
    }

    /* Make report content visible and properly styled */
    .report-content[b-y64sk8vc6i] {
        background: white !important;
        box-shadow: none !important;
        padding: 0.4in !important;
        border-radius: 0 !important;
        margin: 0 !important;
        display: block !important;
        visibility: visible !important;
        page-break-after: avoid;
        border: none !important;
    }

    /* Ensure company header prints nicely with appropriate spacing */
    .company-header[b-y64sk8vc6i] {
        page-break-inside: avoid;
        border-bottom: 2px solid #000;
        display: block !important;
        visibility: visible !important;
        margin-bottom: 0.3in !important;
        padding-bottom: 0.3in !important;
    }

        .company-header h1[b-y64sk8vc6i],
        .company-header h2[b-y64sk8vc6i],
        .company-header h3[b-y64sk8vc6i],
        .company-header p[b-y64sk8vc6i] {
            display: block !important;
            visibility: visible !important;
            color: #000 !important;
            margin: 0.05in 0 !important;
        }

        .company-header h1[b-y64sk8vc6i] {
            font-size: 20pt !important;
            margin-bottom: 0.1in !important;
            font-weight: bold !important;
        }

        .company-header h2[b-y64sk8vc6i] {
            font-size: 14pt !important;
            margin-bottom: 0.05in !important;
        }

        .company-header h3[b-y64sk8vc6i] {
            font-size: 12pt !important;
            margin-bottom: 0.1in !important;
            font-weight: bold !important;
        }

        .company-header p[b-y64sk8vc6i] {
            font-size: 10pt !important;
            margin: 0.02in 0 !important;
        }

    /* Section titles with minimal spacing */
    .section-title[b-y64sk8vc6i] {
        color: #000 !important;
        border-bottom: 2px solid #000 !important;
        display: block !important;
        visibility: visible !important;
        margin: 0.2in 0 0.1in 0 !important;
        padding-bottom: 0.05in !important;
        font-size: 11pt !important;
        font-weight: bold !important;
    }

    /* Ensure tables print properly with content visible */
    .income-table[b-y64sk8vc6i] {
        page-break-inside: avoid;
        box-shadow: none !important;
        border: 1px solid #000;
        margin-bottom: 0.15in !important;
        display: table !important;
        width: 100%;
        border-collapse: collapse !important;
    }

        .income-table thead[b-y64sk8vc6i] {
            background: #333 !important;
            -webkit-print-color-adjust: exact;
            print-color-adjust: exact;
            color: white !important;
            display: table-header-group !important;
        }

            .income-table thead th[b-y64sk8vc6i] {
                background: #333 !important;
                -webkit-print-color-adjust: exact;
                print-color-adjust: exact;
                color: white !important;
                border: 1px solid #000 !important;
                padding: 8px !important;
                display: table-cell !important;
                font-size: 10pt !important;
            }

        .income-table tbody[b-y64sk8vc6i] {
            display: table-row-group !important;
        }

            .income-table tbody tr[b-y64sk8vc6i] {
                display: table-row !important;
            }

            .income-table tbody td[b-y64sk8vc6i] {
                border: 1px solid #000;
                display: table-cell !important;
                padding: 6px 8px !important;
                font-size: 9pt !important;
            }

    .subtotal-row[b-y64sk8vc6i] {
        background: #e8e8e8 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
        border-top: 2px solid #000 !important;
        border-bottom: 2px solid #000 !important;
        display: table-row !important;
        font-weight: bold !important;
    }

        .subtotal-row td[b-y64sk8vc6i] {
            padding: 8px !important;
            display: table-cell !important;
            font-weight: bold !important;
        }

    .total-row[b-y64sk8vc6i] {
        background: #d3d3d3 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
        border-top: 3px solid #000 !important;
        border-bottom: 3px double #000 !important;
        font-weight: bold;
        display: table-row !important;
    }

        .total-row td[b-y64sk8vc6i] {
            padding: 10px 8px !important;
            display: table-cell !important;
            font-weight: bold !important;
            font-size: 10pt !important;
        }

    .amount-col[b-y64sk8vc6i] {
        text-align: right !important;
    }

    /* Ensure all text is visible in print */
    .negative[b-y64sk8vc6i] {
        color: #000 !important;
    }

    /* Optimize signatures for print with balanced spacing */
    .signatures[b-y64sk8vc6i] {
        page-break-inside: avoid;
        margin-top: 0.3in !important;
        padding: 0.3in !important;
        display: grid !important;
        visibility: visible !important;
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 0.2in !important;
        background: white !important;
        border-top: 2px solid #000 !important;
    }

    .signature-block[b-y64sk8vc6i] {
        page-break-inside: avoid;
        display: block !important;
        visibility: visible !important;
        text-align: center;
        padding: 0.1in 0 !important;
    }

        .signature-block .label[b-y64sk8vc6i] {
            display: block !important;
            visibility: visible !important;
            color: #000 !important;
            margin-bottom: 0.3in !important;
            font-weight: 600;
            font-size: 9pt !important;
        }

        .signature-block .name[b-y64sk8vc6i] {
            display: block !important;
            visibility: visible !important;
            color: #000 !important;
            border-top: 2px solid #000 !important;
            padding-top: 0.05in !important;
            margin-top: 0.05in !important;
            font-weight: 500;
            min-width: 1.3in;
            font-size: 9pt !important;
        }

    /* Set proper margins for print */
    html[b-y64sk8vc6i], body[b-y64sk8vc6i] {
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Optimize table spacing for print */
    .income-table[b-y64sk8vc6i] {
        width: 100%;
        border-spacing: 0;
    }

    /* Hide scrollbars and unnecessary elements */
    [b-y64sk8vc6i]::-webkit-scrollbar {
        display: none !important;
    }

    /* Ensure PermissionWrapper doesn't hide content */
    permission-wrapper[b-y64sk8vc6i],
    [permissionwrapper][b-y64sk8vc6i] {
        display: block !important;
        visibility: visible !important;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Role/DeleteConfirmationModal.razor.rz.scp.css */

/* Add New Button */
.add-new-btn[b-bnxe4evccn] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-bnxe4evccn] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .add-new-btn i[b-bnxe4evccn] {
        font-size: 1.1rem;
    }

/* Content Card */
.content-card[b-bnxe4evccn] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Search and Filter Bar */
.search-filter-bar[b-bnxe4evccn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-box[b-bnxe4evccn] {
    position: relative;
    flex: 1;
    min-width: 250px;
    max-width: 400px;
}

    .search-box input[b-bnxe4evccn] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-bnxe4evccn] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-bnxe4evccn] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.filter-group[b-bnxe4evccn] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.entries-select[b-bnxe4evccn] {
    padding: 0.5rem 1rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .entries-select:focus[b-bnxe4evccn] {
        outline: none;
        border-color: var(--secondary-color);
    }

/* Table Styles */
.positions-table[b-bnxe4evccn] {
    width: 100%;
    margin-top: 1rem;
}

    .positions-table thead[b-bnxe4evccn] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .positions-table thead th[b-bnxe4evccn] {
            color: white;
            font-weight: 600;
            padding: 1rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.85rem;
            letter-spacing: 0.5px;
        }

    .positions-table tbody tr[b-bnxe4evccn] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .positions-table tbody tr:hover[b-bnxe4evccn] {
            background-color: #f8f9fa;
            transform: scale(1.01);
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
        }

    .positions-table tbody td[b-bnxe4evccn] {
        padding: 1rem;
        vertical-align: middle;
    }

.position-name[b-bnxe4evccn] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 1rem;
}

.position-description[b-bnxe4evccn] {
    color: #6c757d;
    font-size: 0.9rem;
    line-height: 1.5;
}

/* Action Buttons */
.action-buttons[b-bnxe4evccn] {
    display: flex;
    gap: 0.5rem;
}

.btn-action[b-bnxe4evccn] {
    padding: 0.5rem 0.75rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-edit[b-bnxe4evccn] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-bnxe4evccn] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

.btn-delete[b-bnxe4evccn] {
    background-color: #dc3545;
    color: white;
}

    .btn-delete:hover[b-bnxe4evccn] {
        background-color: #bb2d3b;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
    }

/* Modal Styles */
.modal-content[b-bnxe4evccn] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-bnxe4evccn] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-bnxe4evccn] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-bnxe4evccn] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-bnxe4evccn] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-bnxe4evccn] {
            opacity: 1;
        }

.modal-body[b-bnxe4evccn] {
    padding: 2rem;
}

.modal-footer[b-bnxe4evccn] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.form-label[b-bnxe4evccn] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.form-control[b-bnxe4evccn], .form-select[b-bnxe4evccn] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control:focus[b-bnxe4evccn], .form-select:focus[b-bnxe4evccn] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

.btn-primary[b-bnxe4evccn] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-primary:hover[b-bnxe4evccn] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    }

.btn-secondary[b-bnxe4evccn] {
    background-color: #6c757d;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-secondary:hover[b-bnxe4evccn] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

/* Pagination */
.pagination-wrapper[b-bnxe4evccn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-bnxe4evccn] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-bnxe4evccn] {
    margin: 0;
}

.page-link[b-bnxe4evccn] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

    .page-link:hover[b-bnxe4evccn] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
    }

.page-item.active .page-link[b-bnxe4evccn] {
    color: #dee2e6;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Empty State */
.empty-state[b-bnxe4evccn] {
    text-align: center;
    padding: 3rem 2rem;
    color: #6c757d;
}

    .empty-state i[b-bnxe4evccn] {
        font-size: 4rem;
        color: #dee2e6;
        margin-bottom: 1rem;
    }
/* _content/AccountingSystem.Web/Components/Pages/Role/RoleModal.razor.rz.scp.css */
/* Roles Management Styling */

/* ===== ADD NEW BUTTON ===== */
.add-new-btn[b-fdkw2mbpto] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-fdkw2mbpto] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .add-new-btn i[b-fdkw2mbpto] {
        font-size: 1.1rem;
    }

/* ===== CONTENT CARD ===== */
.content-card[b-fdkw2mbpto] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* ===== SEARCH AND FILTER BAR ===== */
.search-filter-bar[b-fdkw2mbpto] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-box[b-fdkw2mbpto] {
    position: relative;
    flex: 1;
    min-width: 250px;
    max-width: 400px;
}

    .search-box input[b-fdkw2mbpto] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-fdkw2mbpto] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-fdkw2mbpto] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.filter-group[b-fdkw2mbpto] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.entries-select[b-fdkw2mbpto] {
    padding: 0.5rem 1rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    background-color: white;
}

    .entries-select:focus[b-fdkw2mbpto] {
        outline: none;
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* ===== TABLE STYLES ===== */
.roles-table[b-fdkw2mbpto] {
    width: 100%;
    margin-top: 1rem;
    margin-bottom: 0;
}

    .roles-table thead[b-fdkw2mbpto] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .roles-table thead th[b-fdkw2mbpto] {
            color: white;
            font-weight: 600;
            padding: 1rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.85rem;
            letter-spacing: 0.5px;
        }

    .roles-table tbody tr[b-fdkw2mbpto] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
        vertical-align: middle;
    }

        .roles-table tbody tr:hover[b-fdkw2mbpto] {
            background-color: #f8f9fa;
            transform: scale(1.01);
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
        }

    .roles-table tbody td[b-fdkw2mbpto] {
        padding: 1rem;
        vertical-align: middle;
    }

.role-name[b-fdkw2mbpto] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 1rem;
}

/* ===== BADGE STYLING ===== */
.badge[b-fdkw2mbpto] {
    font-size: 0.8rem;
    padding: 0.4rem 0.6rem;
    border-radius: 0.25rem;
    font-weight: 600;
}

.badge.bg-info[b-fdkw2mbpto] {
    background-color: #0dcaf0 !important;
    color: #000;
}

.badge.bg-warning[b-fdkw2mbpto] {
    background-color: #ffc107 !important;
    color: #000;
}

.badge.bg-secondary[b-fdkw2mbpto] {
    background-color: #6c757d !important;
    color: #fff;
}

/* ===== ACTION BUTTONS ===== */
.action-buttons[b-fdkw2mbpto] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.btn-action[b-fdkw2mbpto] {
    padding: 0.5rem 0.75rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-edit[b-fdkw2mbpto] {
    background-color: #0d6efd;
    color: white;
}

.btn-edit:hover:not(:disabled)[b-fdkw2mbpto] {
    background-color: #0b5ed7;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
}

.btn-edit:disabled[b-fdkw2mbpto] {
    background-color: #6c757d;
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-permissions[b-fdkw2mbpto] {
    background-color: #0d6efd;
    border-color: #0d6efd;
    color: white;
    padding: 0.375rem 0.75rem;
    font-size: 0.875rem;
    border-radius: 0.25rem;
    transition: all 0.2s ease;
}

    .btn-permissions:hover:not(:disabled)[b-fdkw2mbpto] {
        background-color: #0b5ed7;
        border-color: #0a58ca;
        color: white;
        text-decoration: none;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

    .btn-permissions:disabled[b-fdkw2mbpto] {
        background-color: #6c757d;
        border-color: #6c757d;
        opacity: 0.65;
        cursor: not-allowed;
    }

/* ===== MODAL STYLES ===== */
.modal-content[b-fdkw2mbpto] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-fdkw2mbpto] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-fdkw2mbpto] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-fdkw2mbpto] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-fdkw2mbpto] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-fdkw2mbpto] {
            opacity: 1;
        }

.modal-body[b-fdkw2mbpto] {
    padding: 2rem;
}

.modal-footer[b-fdkw2mbpto] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ===== FORM CONTROLS IN MODAL ===== */
.form-label[b-fdkw2mbpto] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.form-control[b-fdkw2mbpto],
.form-select[b-fdkw2mbpto] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control:focus[b-fdkw2mbpto],
    .form-select:focus[b-fdkw2mbpto] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        outline: none;
    }

    .form-control:disabled[b-fdkw2mbpto],
    .form-select:disabled[b-fdkw2mbpto] {
        background-color: #e9ecef;
        cursor: not-allowed;
        opacity: 0.7;
    }

/* ===== BUTTONS IN MODAL ===== */
.btn[b-fdkw2mbpto] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-fdkw2mbpto] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

    .btn-primary:hover[b-fdkw2mbpto] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

    .btn-primary:disabled[b-fdkw2mbpto] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        opacity: 0.65;
        cursor: not-allowed;
        transform: none;
    }

.btn-secondary[b-fdkw2mbpto] {
    background-color: #6c757d;
    border: none;
    color: white;
}

    .btn-secondary:hover[b-fdkw2mbpto] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

    .btn-secondary:disabled[b-fdkw2mbpto] {
        background-color: #6c757d;
        opacity: 0.65;
        cursor: not-allowed;
        transform: none;
    }

/* ===== PAGINATION ===== */
.pagination-wrapper[b-fdkw2mbpto] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
    flex-wrap: wrap;
    gap: 1rem;
}

.showing-entries[b-fdkw2mbpto] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-fdkw2mbpto] {
    margin: 0;
}

.page-link[b-fdkw2mbpto] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
    background-color: white;
    cursor: pointer;
}

    .page-link:hover[b-fdkw2mbpto] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
        transform: translateY(-2px);
    }

    .page-link:disabled[b-fdkw2mbpto] {
        color: #6c757d;
        cursor: not-allowed;
        opacity: 0.65;
    }

.page-item.active .page-link[b-fdkw2mbpto] {
    color: white;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* ===== PERMISSION MODAL STYLES ===== */
.permissions-container[b-fdkw2mbpto] {
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    padding: 1rem;
    background-color: #f8f9fa;
    max-height: 400px;
    overflow-y: auto;
}

.permission-module[b-fdkw2mbpto] {
    padding: 0.75rem 0;
}

.permission-module:not(:last-child)[b-fdkw2mbpto] {
    border-bottom: 1px solid #dee2e6;
}

.module-title[b-fdkw2mbpto] {
    margin: 0.75rem 0 0.5rem 0;
    color: #495057;
    font-size: 0.95rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .module-title i[b-fdkw2mbpto] {
        color: var(--secondary-color);
    }

.permission-items[b-fdkw2mbpto] {
    margin-left: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.form-check[b-fdkw2mbpto] {
    margin-bottom: 0.5rem;
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

    .form-check-input[b-fdkw2mbpto] {
        margin-top: 0.3rem;
        cursor: pointer;
    }

.form-check-label[b-fdkw2mbpto] {
    margin-bottom: 0;
    cursor: pointer;
    padding-left: 0.25rem;
}

    .form-check-label small[b-fdkw2mbpto] {
        display: block;
        margin-top: 0.25rem;
        margin-left: 1.5rem;
    }

/* ===== ALERT STYLING ===== */
.alert-info[b-fdkw2mbpto] {
    background-color: #d1ecf1;
    border-color: #bee5eb;
    color: #0c5460;
    border-radius: 0.375rem;
    padding: 0.75rem 1.25rem;
    margin-bottom: 0;
}

    .alert-info i[b-fdkw2mbpto] {
        margin-right: 0.5rem;
    }

.alert-danger[b-fdkw2mbpto] {
    background-color: #f8d7da;
    border-color: #f5c6cb;
    color: #721c24;
}

/* ===== EMPTY STATE ===== */
.empty-state[b-fdkw2mbpto] {
    text-align: center;
    padding: 3rem 2rem;
    color: #6c757d;
}

    .empty-state i[b-fdkw2mbpto] {
        font-size: 4rem;
        color: #dee2e6;
        margin-bottom: 1rem;
    }

/* ===== RESPONSIVE DESIGN ===== */
@media (max-width: 768px) {
    .content-card[b-fdkw2mbpto] {
        padding: 1.5rem 1rem;
    }

    .search-filter-bar[b-fdkw2mbpto] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-box[b-fdkw2mbpto] {
        max-width: 100%;
    }

    .filter-group[b-fdkw2mbpto] {
        flex-direction: column;
    }

    .entries-select[b-fdkw2mbpto] {
        width: 100%;
    }

    .roles-table[b-fdkw2mbpto] {
        font-size: 0.85rem;
    }

        .roles-table thead th[b-fdkw2mbpto] {
            padding: 0.75rem 0.5rem;
        }

        .roles-table tbody td[b-fdkw2mbpto] {
            padding: 0.75rem 0.5rem;
        }

    .action-buttons[b-fdkw2mbpto] {
        flex-direction: column;
    }

        .action-buttons .btn-action[b-fdkw2mbpto] {
            width: 100%;
            justify-content: center;
        }

    .pagination-wrapper[b-fdkw2mbpto] {
        flex-direction: column;
        align-items: stretch;
    }

    .showing-entries[b-fdkw2mbpto] {
        text-align: center;
    }

    .pagination[b-fdkw2mbpto] {
        justify-content: center;
    }

    .modal-body[b-fdkw2mbpto] {
        padding: 1.5rem 1rem;
    }

    .modal-footer[b-fdkw2mbpto] {
        padding: 1rem;
    }

    .permissions-container[b-fdkw2mbpto] {
        max-height: 300px;
    }

    .add-new-btn[b-fdkw2mbpto] {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .content-card[b-fdkw2mbpto] {
        padding: 1rem;
        border-radius: 8px;
    }

    .page-title[b-fdkw2mbpto] {
        font-size: 1.5rem;
    }

    .breadcrumb[b-fdkw2mbpto] {
        font-size: 0.8rem;
    }

    .search-box input[b-fdkw2mbpto] {
        font-size: 0.9rem;
        padding: 0.55rem 0.75rem 0.55rem 2.5rem;
    }

    .entries-select[b-fdkw2mbpto] {
        font-size: 0.85rem;
        padding: 0.4rem 0.75rem;
    }

    .roles-table[b-fdkw2mbpto] {
        font-size: 0.75rem;
    }

        .roles-table thead th[b-fdkw2mbpto] {
            padding: 0.5rem 0.25rem;
        }

        .roles-table tbody td[b-fdkw2mbpto] {
            padding: 0.5rem 0.25rem;
        }

    .btn-action[b-fdkw2mbpto] {
        padding: 0.4rem 0.5rem;
        font-size: 0.8rem;
    }

    .modal-header[b-fdkw2mbpto] {
        padding: 1rem;
    }

    .modal-body[b-fdkw2mbpto] {
        padding: 1rem;
    }

    .add-new-btn[b-fdkw2mbpto] {
        padding: 0.6rem 1rem;
        font-size: 0.9rem;
    }
}

/* Loading Spinner */
.spinner-border[b-fdkw2mbpto] {
    width: 2rem;
    height: 2rem;
    border-width: 0.2em;
}

/* Search box in modals */
.input-group[b-fdkw2mbpto] {
    margin-bottom: 1rem;
}

    .input-group .form-control[b-fdkw2mbpto] {
        border-radius: 0.375rem;
    }
/* _content/AccountingSystem.Web/Components/Pages/Role/RolesPage.razor.rz.scp.css */
/* ======================================================
   PAGE HEADER
   ====================================================== */
.page-header[b-y6zfd97uzx] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid #e9ecef;
}

.page-title[b-y6zfd97uzx] {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--primary-color);
    margin: 0 0 0.2rem;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.page-title i[b-y6zfd97uzx] {
    color: var(--secondary-color);
}

.breadcrumb[b-y6zfd97uzx] {
    background: none;
    padding: 0;
    margin: 0.3rem 0 0;
    font-size: 0.85rem;
}

.breadcrumb-item + .breadcrumb-item[b-y6zfd97uzx]::before {
    color: #adb5bd;
}

.breadcrumb-item a[b-y6zfd97uzx] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-y6zfd97uzx] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-y6zfd97uzx] {
    color: #6c757d;
}

/* ======================================================
   ADD NEW BUTTON
   ====================================================== */
.add-new-btn[b-y6zfd97uzx] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.9rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: opacity 0.2s, transform 0.15s;
    white-space: nowrap;
}

.add-new-btn:hover[b-y6zfd97uzx] {
    opacity: 0.9;
    transform: translateY(-1px);
}

/* ======================================================
   CONTENT CARD
   ====================================================== */
.content-card[b-y6zfd97uzx] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    border: 1px solid #e9ecef;
}

/* ======================================================
   SEARCH AND FILTER BAR
   ====================================================== */
.search-filter-bar[b-y6zfd97uzx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.25rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-box[b-y6zfd97uzx] {
    position: relative;
    flex: 1;
    min-width: 200px;
    max-width: 380px;
}

.search-box i[b-y6zfd97uzx] {
    position: absolute;
    left: 0.85rem;
    top: 50%;
    transform: translateY(-50%);
    color: #adb5bd;
    font-size: 0.9rem;
    pointer-events: none;
}

.search-box input[b-y6zfd97uzx] {
    width: 100%;
    padding: 0.6rem 1rem 0.6rem 2.5rem;
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    font-size: 0.9rem;
    transition: border-color 0.2s, box-shadow 0.2s;
    background: #fff;
    color: #212529;
}

.search-box input:focus[b-y6zfd97uzx] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.12);
}

.search-box input[b-y6zfd97uzx]::placeholder {
    color: #adb5bd;
}

.filter-group[b-y6zfd97uzx] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.entries-select[b-y6zfd97uzx] {
    padding: 0.55rem 0.85rem;
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    font-size: 0.875rem;
    cursor: pointer;
    transition: border-color 0.2s, box-shadow 0.2s;
    background: #fff;
    color: #212529;
}

.entries-select:focus[b-y6zfd97uzx] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.12);
}

/* ======================================================
   TABLE
   ====================================================== */
.roles-table[b-y6zfd97uzx] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin-bottom: 0;
}

.roles-table thead th[b-y6zfd97uzx] {
    background: var(--primary-color);
    color: #fff;
    font-weight: 600;
    padding: 0.85rem 1rem;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: none;
    white-space: nowrap;
}

.roles-table thead th:first-child[b-y6zfd97uzx] {
    border-radius: 8px 0 0 0;
}

.roles-table thead th:last-child[b-y6zfd97uzx] {
    border-radius: 0 8px 0 0;
}

.roles-table tbody tr[b-y6zfd97uzx] {
    border-bottom: 1px solid #e9ecef;
    transition: background 0.15s;
    vertical-align: middle;
}

.roles-table tbody tr:last-child td[b-y6zfd97uzx] {
    border-bottom: none;
}

.roles-table tbody tr:hover[b-y6zfd97uzx] {
    background-color: #f8f9fa;
}

.roles-table tbody td[b-y6zfd97uzx] {
    padding: 0.85rem 1rem;
    vertical-align: middle;
    color: #495057;
    font-size: 0.9rem;
    border-bottom: 1px solid #f0f0f0;
}

.role-name[b-y6zfd97uzx] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 0.92rem;
}

/* ======================================================
   BADGES
   ====================================================== */
.badge[b-y6zfd97uzx] {
    font-size: 0.72rem;
    padding: 0.28rem 0.65rem;
    border-radius: 8px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: inline-block;
}

.badge.bg-info[b-y6zfd97uzx] {
    background: rgba(13, 202, 240, 0.12) !important;
    color: #0a8fa5;
    border: 1px solid rgba(13, 202, 240, 0.3);
}

.badge.bg-warning[b-y6zfd97uzx] {
    background: rgba(255, 193, 7, 0.15) !important;
    color: #9a6700;
    border: 1px solid rgba(255, 193, 7, 0.4);
}

.badge.bg-secondary[b-y6zfd97uzx] {
    background: rgba(108, 117, 125, 0.12) !important;
    color: #5a636a;
    border: 1px solid rgba(108, 117, 125, 0.25);
}

/* ======================================================
   BUTTONS — .btn must come BEFORE .btn-action-icon
   ====================================================== */
.btn[b-y6zfd97uzx] {
    padding: 0.6rem 1.25rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.9rem;
    cursor: pointer;
}

.btn-primary[b-y6zfd97uzx] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-y6zfd97uzx] {
    opacity: 0.9;
    transform: translateY(-1px);
    color: var(--primary-color);
}

.btn-secondary[b-y6zfd97uzx] {
    background: #6c757d;
    color: #fff;
    border: none;
}

.btn-secondary:hover[b-y6zfd97uzx] {
    background: #5c636a;
    transform: translateY(-1px);
    color: #fff;
}

.btn-danger[b-y6zfd97uzx] {
    background: #dc3545;
    color: #fff;
    border: none;
}

.btn-danger:hover[b-y6zfd97uzx] {
    background: #bb2d3b;
    transform: translateY(-1px);
}

.btn:disabled[b-y6zfd97uzx] {
    opacity: 0.55;
    cursor: not-allowed;
    transform: none !important;
}

/* ── Action icon buttons — AFTER .btn:disabled ── */
.action-buttons[b-y6zfd97uzx] {
    display: flex;
    gap: 0.4rem;
    align-items: center;
}

.btn-action-icon[b-y6zfd97uzx] {
    width: 36px;
    height: 36px;
    padding: 0;
    border-radius: 50%;
    background: var(--secondary-color);
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.82rem;
    color: var(--primary-color);
    cursor: pointer;
    transition: background 0.18s, transform 0.15s;
    flex-shrink: 0;
}

.btn-action-icon:disabled[b-y6zfd97uzx] {
    opacity: 0.45;
    cursor: not-allowed;
    transform: none !important;
}

.btn-edit:hover:not(:disabled)[b-y6zfd97uzx] {
    background: #0d6efd;
    color: #fff;
}

.btn-delete:hover:not(:disabled)[b-y6zfd97uzx] {
    background: #dc3545;
    color: #fff;
}

/* ======================================================
   ALERTS
   ====================================================== */
.alert-info[b-y6zfd97uzx] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
    border-radius: 10px;
    padding: 0.9rem 1.1rem;
}

.alert-info i[b-y6zfd97uzx] {
    color: var(--secondary-color);
}

.alert-danger[b-y6zfd97uzx] {
    border-radius: 8px;
    padding: 0.9rem 1.1rem;
}

/* ======================================================
   PAGINATION
   ====================================================== */
.pagination-wrapper[b-y6zfd97uzx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid #e9ecef;
    gap: 2rem;
    border-radius: 0 0 12px 12px;
    flex-wrap: wrap;
}

.showing-entries[b-y6zfd97uzx] {
    color: #6c757d;
    font-size: 0.875rem;
}

.showing-entries span[b-y6zfd97uzx] {
    font-weight: 600;
    color: #495057;
}

.pagination[b-y6zfd97uzx] {
    margin: 0;
    display: flex;
    gap: 0.25rem;
    list-style: none;
    padding: 0;
}

.page-link[b-y6zfd97uzx] {
    color: var(--primary-color);
    border: 1.5px solid #e2e8f0;
    border-radius: 6px;
    padding: 0.4rem 0.75rem;
    font-size: 0.875rem;
    transition: background 0.15s, border-color 0.15s;
    background: #fff;
    cursor: pointer;
    display: inline-block;
}

.page-link:hover[b-y6zfd97uzx] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

.page-item.active .page-link[b-y6zfd97uzx] {
    background: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
}

.page-item.disabled .page-link[b-y6zfd97uzx] {
    color: #adb5bd;
    pointer-events: none;
    opacity: 0.6;
}

/* ======================================================
   RESPONSIVE
   ====================================================== */
@media (max-width: 768px) {
    .page-header[b-y6zfd97uzx] {
        flex-direction: column;
        gap: 0.75rem;
    }

    .content-card[b-y6zfd97uzx] {
        padding: 1rem;
    }

    .search-filter-bar[b-y6zfd97uzx] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-box[b-y6zfd97uzx] {
        max-width: 100%;
    }

    .add-new-btn[b-y6zfd97uzx] {
        width: 100%;
        justify-content: center;
    }

    .pagination-wrapper[b-y6zfd97uzx] {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }

    .roles-table thead th[b-y6zfd97uzx],
    .roles-table tbody td[b-y6zfd97uzx] {
        padding: 0.65rem 0.6rem;
        font-size: 0.82rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/SalesOrders/PriceListCreate.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-akjvqdx7a5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-akjvqdx7a5] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-akjvqdx7a5] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-akjvqdx7a5] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-akjvqdx7a5]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-akjvqdx7a5] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-akjvqdx7a5] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-akjvqdx7a5] {
    color: #6c757d;
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-akjvqdx7a5] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-akjvqdx7a5] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-akjvqdx7a5] {
    color: var(--secondary-color);
}

.form-control-custom[b-akjvqdx7a5],
.form-select-custom[b-akjvqdx7a5] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-akjvqdx7a5],
.form-select-custom:focus[b-akjvqdx7a5] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-akjvqdx7a5] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-akjvqdx7a5] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-akjvqdx7a5] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-akjvqdx7a5] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-akjvqdx7a5] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn:disabled[b-akjvqdx7a5] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-akjvqdx7a5] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.4rem;
}

.btn-action-icon[b-akjvqdx7a5] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    padding: 0;
    cursor: pointer;
}

.btn-action-icon:hover[b-akjvqdx7a5] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-delete:hover[b-akjvqdx7a5] {
    background: #dc3545;
    color: white;
}

.btn-expand[b-akjvqdx7a5] {
    background: rgba(0, 0, 0, 0.06);
    color: #495057;
}

.btn-expand:hover[b-akjvqdx7a5],
.btn-expand.is-expanded[b-akjvqdx7a5] {
    background: var(--primary-color);
    color: white;
}

/* ==================== ADD ITEM BUTTON ==================== */
.btn-add-item[b-akjvqdx7a5] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    font-weight: 700;
    padding: 0.5rem 1.25rem;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
    white-space: nowrap;
}

.btn-add-item:hover[b-akjvqdx7a5] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.45);
    color: var(--primary-color);
}

/* ==================== ITEMS COUNT BADGE ==================== */
.items-count-badge[b-akjvqdx7a5] {
    background: var(--primary-color);
    color: white;
    font-size: 0.75rem;
    padding: 0.25rem 0.6rem;
    border-radius: 20px;
    font-weight: 600;
    letter-spacing: 0.3px;
}

/* ==================== ALERTS ==================== */
.alert[b-akjvqdx7a5] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.alert-info[b-akjvqdx7a5] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-akjvqdx7a5] {
    color: var(--secondary-color);
}

/* ==================== ITEMS TOOLBAR ==================== */
.items-toolbar[b-akjvqdx7a5] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 0.5rem;
}

.scope-group[b-akjvqdx7a5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* ==================== PRICING SCOPE TOGGLE ==================== */
.btn-scope-toggle[b-akjvqdx7a5] {
    color: var(--primary-color);
    border: 1px solid var(--primary-color);
    background: white;
    font-weight: 600;
}

.btn-scope-toggle:hover[b-akjvqdx7a5] {
    background: rgba(212, 175, 55, 0.1);
    color: var(--primary-color);
    border-color: var(--primary-color);
}

.btn-check:checked + .btn-scope-toggle[b-akjvqdx7a5] {
    background: var(--primary-color);
    color: white;
    border-color: var(--primary-color);
}

.btn-check:checked + .btn-scope-toggle:hover[b-akjvqdx7a5] {
    background: var(--primary-color);
    color: white;
}

/* ==================== STATUS BADGES ==================== */
.badge-status-active[b-akjvqdx7a5] {
    background: #d4edda;
    color: #155724;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: 8px;
    font-size: 0.7rem;
    padding: 0.3rem 0.6rem;
}

.badge-status-inactive[b-akjvqdx7a5] {
    background: #e2e3e5;
    color: #383d41;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: 8px;
    font-size: 0.7rem;
    padding: 0.3rem 0.6rem;
}

/* ==================== PRICE LIST ITEMS TABLE (Desktop Grid) ==================== */
.items-table-container[b-akjvqdx7a5] {
    overflow-x: auto;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    background: white;
}

.price-list-items-table[b-akjvqdx7a5] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.price-list-items-table thead[b-akjvqdx7a5] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.price-list-items-table thead th[b-akjvqdx7a5] {
    padding: 0.75rem 0.5rem;
    font-weight: 600;
    font-size: 0.8rem;
    text-align: left;
    border: none;
    white-space: nowrap;
}

.price-list-items-table thead th:first-child[b-akjvqdx7a5] {
    border-top-left-radius: 12px;
}

.price-list-items-table thead th:last-child[b-akjvqdx7a5] {
    border-top-right-radius: 12px;
}

.price-list-items-table tbody tr[b-akjvqdx7a5] {
    border-bottom: 1px solid #e9ecef;
    transition: background-color 0.2s ease;
}

.price-list-items-table tbody tr:hover[b-akjvqdx7a5] {
    background-color: #f8f9fa;
}

.price-list-items-table tbody tr.row-warning[b-akjvqdx7a5] {
    background-color: #fff3cd;
}

.price-list-items-table tbody td[b-akjvqdx7a5] {
    padding: 0.5rem 0.35rem;
    vertical-align: middle;
    font-size: 0.85rem;
    color: #495057;
}

.price-list-items-table input[type="number"][b-akjvqdx7a5],
.price-list-items-table input[type="text"][b-akjvqdx7a5],
.price-list-items-table input[type="date"][b-akjvqdx7a5] {
    min-width: 80px;
}

.price-list-items-table .btn-action-icon[b-akjvqdx7a5] {
    width: 32px;
    height: 32px;
    font-size: 0.85rem;
}

/* ==================== COLLAPSED ROW DISPLAY ==================== */
.item-row td[b-akjvqdx7a5] {
    vertical-align: middle;
}

.row-index[b-akjvqdx7a5] {
    color: #adb5bd;
    font-size: 0.8rem;
    font-weight: 600;
}

.item-target-display[b-akjvqdx7a5] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.item-scope-icon[b-akjvqdx7a5] {
    color: var(--secondary-color);
    font-size: 1rem;
    flex-shrink: 0;
}

.item-code[b-akjvqdx7a5] {
    display: block;
    font-size: 0.7rem;
    font-weight: 700;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    line-height: 1.2;
}

.item-name[b-akjvqdx7a5] {
    display: block;
    font-size: 0.9rem;
    font-weight: 600;
    color: #212529;
    line-height: 1.3;
}

.row-expanded > td[b-akjvqdx7a5] {
    border-bottom: none;
    background: rgba(212, 175, 55, 0.04);
}

/* ==================== EXPANDABLE DETAIL ROW ==================== */
.item-detail-row > td[b-akjvqdx7a5] {
    padding: 0;
    border-top: none;
    border-bottom: 2px solid var(--secondary-color);
}

.item-detail-grid[b-akjvqdx7a5] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 0.75rem 1rem;
    padding: 1rem 1.25rem 1.25rem;
    background: linear-gradient(180deg, #fffdf5 0%, #fafafa 100%);
}

.detail-field label[b-akjvqdx7a5] {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin-bottom: 0.3rem;
}

.detail-field-wide[b-akjvqdx7a5] {
    grid-column: span 2;
}

.detail-field-center[b-akjvqdx7a5] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

/* ==================== ADD ITEM MODAL — SCOPE BADGE ==================== */
.add-item-scope-badge[b-akjvqdx7a5] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
    font-weight: 600;
    font-size: 0.9rem;
    padding: 0.5rem 1rem;
    border-radius: 8px;
}

.add-item-scope-badge i[b-akjvqdx7a5] {
    color: var(--secondary-color);
    font-size: 1.1rem;
}

/* ==================== MOBILE ITEM CARDS ==================== */
.item-card[b-akjvqdx7a5] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    margin-bottom: 1rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.item-card-warning[b-akjvqdx7a5] {
    border-color: var(--secondary-color);
    background: #fffdf5;
}

.item-card-header[b-akjvqdx7a5] {
    padding: 0.75rem 1rem;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.item-card-summary[b-akjvqdx7a5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.item-card-label[b-akjvqdx7a5] {
    font-weight: 700;
    font-size: 0.9rem;
    color: white;
}

/* collapsed preview strip */
.item-card-preview[b-akjvqdx7a5] {
    display: flex;
    gap: 1.5rem;
    padding: 0.5rem 1rem;
    background: #f8f9fa;
    border-top: 1px solid #e9ecef;
    font-size: 0.82rem;
    color: #495057;
}

.item-card-body[b-akjvqdx7a5] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    padding: 1rem;
}

.item-field label[b-akjvqdx7a5] {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: 0.25rem;
}

.item-field-full[b-akjvqdx7a5] {
    grid-column: 1 / -1;
}

/* ==================== FORM ENHANCEMENTS ==================== */
.form-check-input:checked[b-akjvqdx7a5] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.form-check-input:focus[b-akjvqdx7a5] {
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== VALIDATION ==================== */
[b-akjvqdx7a5] .validation-message {
    color: #dc3545;
    font-size: 0.875rem;
    margin-top: 0.25rem;
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
    .page-title[b-akjvqdx7a5] {
        font-size: 1.5rem;
    }

    .content-card[b-akjvqdx7a5] {
        padding: 1.5rem;
    }

    .item-card-body[b-akjvqdx7a5] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 576px) {
    .page-header[b-akjvqdx7a5] {
        flex-direction: column;
        gap: 1rem;
    }

    .content-card[b-akjvqdx7a5] {
        padding: 1rem;
    }

    .items-toolbar[b-akjvqdx7a5] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .scope-group[b-akjvqdx7a5] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.35rem;
    }

    .items-toolbar .btn[b-akjvqdx7a5] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/SalesOrders/PriceListManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-court23fqi] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-court23fqi] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-court23fqi] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-court23fqi] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-court23fqi]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-court23fqi] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-court23fqi] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-court23fqi] {
    color: #6c757d;
}

.add-new-btn[b-court23fqi] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-court23fqi] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-court23fqi] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-court23fqi] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-court23fqi] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-court23fqi] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-court23fqi] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-court23fqi] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-court23fqi] {
    color: var(--secondary-color);
}

.form-control-custom[b-court23fqi],
.form-select-custom[b-court23fqi] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-court23fqi],
.form-select-custom:focus[b-court23fqi] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-court23fqi] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-court23fqi] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-court23fqi] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-court23fqi] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-court23fqi] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn:disabled[b-court23fqi] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== LISTING TABLE ==================== */
.pricelists-table-container[b-court23fqi] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.pricelists-table[b-court23fqi] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.pricelists-table thead[b-court23fqi] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.pricelists-table thead tr th[b-court23fqi] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.pricelists-table thead th:first-child[b-court23fqi] {
    border-top-left-radius: 12px;
}

.pricelists-table thead th:last-child[b-court23fqi] {
    border-top-right-radius: 12px;
}

.pricelists-table tbody tr[b-court23fqi] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.pricelists-table tbody tr:hover[b-court23fqi] {
    background-color: #f8f9fa;
}

.pricelists-table tbody td[b-court23fqi] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.product-code[b-court23fqi] {
    font-weight: 600;
    color: var(--primary-color);
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-court23fqi] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.4rem;
}

.btn-action-icon[b-court23fqi] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    padding: 0;
    cursor: pointer;
}

.btn-action-icon:hover[b-court23fqi] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-edit:hover[b-court23fqi] {
    background: var(--primary-color);
    color: white;
}

.btn-delete:hover[b-court23fqi] {
    background: #dc3545;
    color: white;
}

.btn-expand[b-court23fqi] {
    background: rgba(0, 0, 0, 0.06);
    color: #495057;
}

.btn-expand:hover[b-court23fqi],
.btn-expand.is-expanded[b-court23fqi] {
    background: var(--primary-color);
    color: white;
}

/* ==================== BADGES ==================== */
.badge[b-court23fqi] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge-status-active[b-court23fqi] {
    background: #d4edda;
    color: #155724;
}

.badge-status-inactive[b-court23fqi] {
    background: #e2e3e5;
    color: #383d41;
}

.badge-type[b-court23fqi] {
    background: rgba(13, 202, 240, 0.15);
    color: #0a6c7e;
}

.badge-default[b-court23fqi] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.items-count-badge[b-court23fqi] {
    background: var(--primary-color);
    color: white;
    font-size: 0.75rem;
    padding: 0.25rem 0.6rem;
    border-radius: 20px;
    font-weight: 600;
    letter-spacing: 0.3px;
}

/* ==================== ALERTS ==================== */
.alert[b-court23fqi] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.alert-info[b-court23fqi] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-court23fqi] {
    color: var(--secondary-color);
}

/* ==================== ADD ITEM BUTTON ==================== */
.btn-add-item[b-court23fqi] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    font-weight: 700;
    padding: 0.5rem 1.25rem;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
    white-space: nowrap;
    cursor: pointer;
}

.btn-add-item:hover[b-court23fqi] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.45);
    color: var(--primary-color);
}

/* ==================== ITEMS TOOLBAR ==================== */
.items-toolbar[b-court23fqi] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 0.75rem;
}

.scope-locked-badge[b-court23fqi] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
    font-weight: 600;
    font-size: 0.85rem;
    padding: 0.35rem 0.85rem;
    border-radius: 8px;
}

.scope-locked-badge i[b-court23fqi] {
    color: var(--secondary-color);
}

/* ==================== ITEMS TABLE (Edit form) ==================== */
.items-table-container[b-court23fqi] {
    overflow-x: auto;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    background: white;
}

.price-list-items-table[b-court23fqi] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.price-list-items-table thead[b-court23fqi] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.price-list-items-table thead th[b-court23fqi] {
    padding: 0.75rem 0.5rem;
    font-weight: 600;
    font-size: 0.8rem;
    text-align: left;
    border: none;
    white-space: nowrap;
}

.price-list-items-table thead th:first-child[b-court23fqi] { border-top-left-radius: 12px; }
.price-list-items-table thead th:last-child[b-court23fqi]  { border-top-right-radius: 12px; }

.price-list-items-table tbody tr[b-court23fqi] {
    border-bottom: 1px solid #e9ecef;
    transition: background-color 0.2s ease;
}

.price-list-items-table tbody tr:hover[b-court23fqi] { background-color: #f8f9fa; }
.price-list-items-table tbody tr.row-warning[b-court23fqi] { background-color: #fff3cd; }

.price-list-items-table tbody td[b-court23fqi] {
    padding: 0.5rem 0.4rem;
    vertical-align: middle;
    font-size: 0.85rem;
    color: #495057;
}

/* ==================== COLLAPSED ROW DISPLAY ==================== */
.item-row td[b-court23fqi] { vertical-align: middle; }

.row-index[b-court23fqi] {
    color: #adb5bd;
    font-size: 0.8rem;
    font-weight: 600;
}

.item-target-display[b-court23fqi] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.item-scope-icon[b-court23fqi] {
    color: var(--secondary-color);
    font-size: 1rem;
    flex-shrink: 0;
}

.item-code[b-court23fqi] {
    display: block;
    font-size: 0.7rem;
    font-weight: 700;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    line-height: 1.2;
}

.item-name[b-court23fqi] {
    display: block;
    font-size: 0.9rem;
    font-weight: 600;
    color: #212529;
    line-height: 1.3;
}

.row-expanded > td[b-court23fqi] {
    border-bottom: none;
    background: rgba(212, 175, 55, 0.04);
}

/* ==================== EXPANDABLE DETAIL ROW ==================== */
.item-detail-row > td[b-court23fqi] {
    padding: 0;
    border-top: none;
    border-bottom: 2px solid var(--secondary-color);
}

.item-detail-grid[b-court23fqi] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 0.75rem 1rem;
    padding: 1rem 1.25rem 1.25rem;
    background: linear-gradient(180deg, #fffdf5 0%, #fafafa 100%);
}

.detail-field label[b-court23fqi] {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin-bottom: 0.3rem;
}

.detail-field-wide[b-court23fqi]  { grid-column: span 2; }
.detail-field-center[b-court23fqi] { display: flex; flex-direction: column; align-items: flex-start; }

/* ==================== MOBILE ITEM CARDS ==================== */
.item-card[b-court23fqi] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    margin-bottom: 1rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.item-card-warning[b-court23fqi] {
    border-color: var(--secondary-color);
    background: #fffdf5;
}

.item-card-header[b-court23fqi] {
    padding: 0.75rem 1rem;
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.item-card-summary[b-court23fqi] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.item-card-label[b-court23fqi] {
    font-weight: 700;
    font-size: 0.9rem;
    color: white;
}

.item-card-preview[b-court23fqi] {
    display: flex;
    gap: 1.5rem;
    padding: 0.5rem 1rem;
    background: #f8f9fa;
    border-top: 1px solid #e9ecef;
    font-size: 0.82rem;
    color: #495057;
}

.item-card-body[b-court23fqi] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    padding: 1rem;
}

.item-field label[b-court23fqi] {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: 0.25rem;
}

.item-field-full[b-court23fqi] { grid-column: 1 / -1; }

/* ==================== PRICE LIST ITEMS TABLE (legacy min-width) ==================== */
.price-list-items-table input[type="number"][b-court23fqi],
.price-list-items-table input[type="text"][b-court23fqi],
.price-list-items-table input[type="date"][b-court23fqi] {
    min-width: 80px;
}

/* ==================== FORM ENHANCEMENTS ==================== */
.form-check-input:checked[b-court23fqi] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.form-check-input:focus[b-court23fqi] {
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== TOAST ==================== */
.toast[b-court23fqi] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* ==================== VALIDATION ==================== */
[b-court23fqi] .validation-message {
    color: #dc3545;
    font-size: 0.875rem;
    margin-top: 0.25rem;
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
    .page-title[b-court23fqi] {
        font-size: 1.5rem;
    }

    .content-card[b-court23fqi] {
        padding: 1.5rem;
    }

    .pricelists-table thead th[b-court23fqi],
    .pricelists-table tbody td[b-court23fqi] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }
}

@media (max-width: 576px) {
    .page-header[b-court23fqi] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-court23fqi] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/SalesOrders/Production.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-4pnuukzdt6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-4pnuukzdt6] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-4pnuukzdt6] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-4pnuukzdt6] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-4pnuukzdt6]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-4pnuukzdt6] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-4pnuukzdt6] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-4pnuukzdt6] {
    color: #6c757d;
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-4pnuukzdt6] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-4pnuukzdt6] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-4pnuukzdt6] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-4pnuukzdt6] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-4pnuukzdt6] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FILTER SECTION ==================== */
.filter-section[b-4pnuukzdt6] {
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
    margin-bottom: 1.5rem;
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-4pnuukzdt6] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-4pnuukzdt6] {
    color: var(--secondary-color);
}

.form-control-custom[b-4pnuukzdt6],
.form-select-custom[b-4pnuukzdt6] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-4pnuukzdt6],
.form-select-custom:focus[b-4pnuukzdt6] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== TABLE ==================== */
.orders-table-container[b-4pnuukzdt6] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.orders-table[b-4pnuukzdt6] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.orders-table thead[b-4pnuukzdt6] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.orders-table thead th[b-4pnuukzdt6] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.orders-table thead th:first-child[b-4pnuukzdt6] {
    border-top-left-radius: 12px;
}

.orders-table thead th:last-child[b-4pnuukzdt6] {
    border-top-right-radius: 12px;
}

.orders-table tbody tr[b-4pnuukzdt6] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.orders-table tbody tr:hover[b-4pnuukzdt6] {
    background-color: #f8f9fa;
}

.orders-table tbody td[b-4pnuukzdt6] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.orders-table .text-end[b-4pnuukzdt6] {
    text-align: right;
}

/* ==================== EXPAND BUTTON ==================== */
.btn-expand[b-4pnuukzdt6] {
    background: none;
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: all 0.3s ease;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-expand i[b-4pnuukzdt6] {
    font-size: 1rem;
    transition: transform 0.3s ease;
}

.btn-expand:hover[b-4pnuukzdt6] {
    background: rgba(139, 0, 0, 0.1);
}

/* ==================== EXPANDABLE ROW ==================== */
.production-detail-row[b-4pnuukzdt6] {
    background: #f8f9fa;
}

.production-detail-row td[b-4pnuukzdt6] {
    padding: 0 !important;
}

.expanded-content[b-4pnuukzdt6] {
    padding: 1.5rem;
    border-top: 2px solid var(--secondary-color);
}

.detail-grid[b-4pnuukzdt6] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.detail-item[b-4pnuukzdt6] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.detail-item label[b-4pnuukzdt6] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.detail-item span[b-4pnuukzdt6] {
    font-size: 0.95rem;
    color: #212529;
    font-weight: 500;
}

/* ==================== TABLE SUMMARY ==================== */
.table-summary[b-4pnuukzdt6] {
    display: flex;
    align-items: center;
    gap: 2rem;
    margin-top: 1.5rem;
    padding: 1.25rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
}

.summary-item[b-4pnuukzdt6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.95rem;
    color: #495057;
}

.summary-item i[b-4pnuukzdt6] {
    font-size: 1.5rem;
}

.summary-item strong[b-4pnuukzdt6] {
    color: var(--primary-color);
    font-size: 1.1rem;
}

/* ==================== ALERTS ==================== */
.alert[b-4pnuukzdt6] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-4pnuukzdt6] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-4pnuukzdt6] {
    color: var(--secondary-color);
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 1200px) {
    .detail-grid[b-4pnuukzdt6] {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    }
}

@media (max-width: 768px) {
    .page-title[b-4pnuukzdt6] {
        font-size: 1.5rem;
    }

    .content-card[b-4pnuukzdt6] {
        padding: 1.5rem;
    }

    .filter-section[b-4pnuukzdt6] {
        padding: 0.75rem;
    }
}

@media (max-width: 576px) {
    .page-header[b-4pnuukzdt6] {
        flex-direction: column;
        gap: 1rem;
    }

    .content-card[b-4pnuukzdt6] {
        padding: 1rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/SalesOrders/SalesCustomerManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-mps6jcx8mg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-mps6jcx8mg] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-mps6jcx8mg] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-mps6jcx8mg] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-mps6jcx8mg]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-mps6jcx8mg] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-mps6jcx8mg] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-mps6jcx8mg] {
    color: #6c757d;
}

.add-new-btn[b-mps6jcx8mg] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-mps6jcx8mg] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-mps6jcx8mg] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-mps6jcx8mg] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-mps6jcx8mg] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-mps6jcx8mg] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-mps6jcx8mg] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-mps6jcx8mg] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.search-box[b-mps6jcx8mg] {
    position: relative;
    max-width: 100%;
}

.search-box i[b-mps6jcx8mg] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    font-size: 1rem;
}

.search-box input[b-mps6jcx8mg] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-mps6jcx8mg] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== FORM CONTROLS ==================== */
.form-label[b-mps6jcx8mg] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.form-label i[b-mps6jcx8mg] {
    color: var(--secondary-color);
}

.form-control-custom[b-mps6jcx8mg],
.form-select-custom[b-mps6jcx8mg] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-mps6jcx8mg],
.form-select-custom:focus[b-mps6jcx8mg] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== SECTION TITLES ==================== */
.section-title[b-mps6jcx8mg] {
    color: var(--primary-color);
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #dee2e6;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.section-title i[b-mps6jcx8mg] {
    color: var(--secondary-color);
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-mps6jcx8mg] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-mps6jcx8mg] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-mps6jcx8mg] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-mps6jcx8mg] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-mps6jcx8mg] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn:disabled[b-mps6jcx8mg] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== TABLE STYLES ==================== */
.customers-table-container[b-mps6jcx8mg] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.customers-table[b-mps6jcx8mg] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.customers-table thead[b-mps6jcx8mg] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.customers-table thead tr th[b-mps6jcx8mg] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.customers-table thead th:first-child[b-mps6jcx8mg] {
    border-top-left-radius: 12px;
}

.customers-table thead th:last-child[b-mps6jcx8mg] {
    border-top-right-radius: 12px;
}

.customers-table tbody tr[b-mps6jcx8mg] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.customers-table tbody tr:hover[b-mps6jcx8mg] {
    background-color: #f8f9fa;
}

.customers-table tbody td[b-mps6jcx8mg] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.product-code[b-mps6jcx8mg] {
    font-weight: 600;
    color: var(--primary-color);
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-mps6jcx8mg] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-mps6jcx8mg] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

.btn-action-icon:hover[b-mps6jcx8mg] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

/* ==================== STATUS BADGE ==================== */
.badge[b-mps6jcx8mg] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge.bg-info[b-mps6jcx8mg] {
    background-color: #0dcaf0 !important;
}

.badge.bg-success[b-mps6jcx8mg] {
    background-color: #28a745 !important;
}

.badge.bg-secondary[b-mps6jcx8mg] {
    background-color: #6c757d !important;
}

/* ==================== ALERTS ==================== */
.alert[b-mps6jcx8mg] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.alert-info[b-mps6jcx8mg] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-mps6jcx8mg] {
    color: var(--secondary-color);
}

/* ==================== FORM ENHANCEMENTS ==================== */
.form-check-input:checked[b-mps6jcx8mg] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.form-check-input:focus[b-mps6jcx8mg] {
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== TOAST ==================== */
.toast[b-mps6jcx8mg] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* ==================== VALIDATION ==================== */
[b-mps6jcx8mg] .validation-message {
    color: #dc3545;
    font-size: 0.875rem;
    margin-top: 0.25rem;
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 992px) {
    .action-buttons[b-mps6jcx8mg] {
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .page-title[b-mps6jcx8mg] {
        font-size: 1.5rem;
    }

    .content-card[b-mps6jcx8mg] {
        padding: 1.5rem;
    }

    .filter-section[b-mps6jcx8mg] {
        padding: 0.75rem;
    }

    .customers-table thead th[b-mps6jcx8mg],
    .customers-table tbody td[b-mps6jcx8mg] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }
}

@media (max-width: 576px) {
    .page-header[b-mps6jcx8mg] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-mps6jcx8mg] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/SalesOrders/SalesOrderForm.razor.rz.scp.css */
/* ======================================================
   POS PAGE HEADER
   ====================================================== */
.pos-page-header[b-4v12gtjegf] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid #e9ecef;
}

.pos-page-title[b-4v12gtjegf] {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--primary-color);
    margin: 0 0 0.2rem;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.pos-page-title i[b-4v12gtjegf] {
    color: var(--secondary-color);
}

.breadcrumb[b-4v12gtjegf] {
    background: none;
    padding: 0;
    margin: 0.3rem 0 0;
    font-size: 0.85rem;
}

.breadcrumb-item + .breadcrumb-item[b-4v12gtjegf]::before {
    color: #adb5bd;
}

.breadcrumb-item a[b-4v12gtjegf] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-4v12gtjegf] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-4v12gtjegf] {
    color: #6c757d;
}

/* ======================================================
   TWO-COLUMN POS LAYOUT
   ====================================================== */
.pos-layout[b-4v12gtjegf] {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 1.25rem;
    align-items: start;
}

.pos-main[b-4v12gtjegf] {
    min-width: 0;
}

.pos-sidebar[b-4v12gtjegf] {
    position: sticky;
    top: 72px;
}

/* ======================================================
   CARD
   ====================================================== */
.pos-card[b-4v12gtjegf] {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
}

/* ======================================================
   ORDER IDENTITY BAR
   ====================================================== */
.pos-order-bar[b-4v12gtjegf] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.85rem;
}

.pos-order-icon[b-4v12gtjegf] {
    color: var(--secondary-color);
    font-size: 1.1rem;
}

.pos-order-number[b-4v12gtjegf] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #1a1a2e;
}

.pos-status-badge[b-4v12gtjegf] {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.22rem 0.75rem;
    border-radius: 20px;
    letter-spacing: 0.4px;
}

.pos-status-draft[b-4v12gtjegf] {
    background: rgba(255, 193, 7, 0.12);
    color: #9a7400;
    border: 1px solid rgba(255, 193, 7, 0.35);
}

.pos-status-confirmed[b-4v12gtjegf] {
    background: rgba(25, 135, 84, 0.1);
    color: #146c43;
    border: 1px solid rgba(25, 135, 84, 0.28);
}

.pos-status-cancelled[b-4v12gtjegf] {
    background: rgba(220, 53, 69, 0.1);
    color: #b02a37;
    border: 1px solid rgba(220, 53, 69, 0.28);
}

.pos-status-dispatched[b-4v12gtjegf] {
    background: rgba(13, 110, 253, 0.1);
    color: #084298;
    border: 1px solid rgba(13, 110, 253, 0.28);
}

/* ======================================================
   FORM CONTROLS
   ====================================================== */
.form-label[b-4v12gtjegf] {
    color: #495057;
    font-weight: 600;
    font-size: 0.875rem;
    margin-bottom: 0.4rem;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.form-label i[b-4v12gtjegf] {
    color: var(--secondary-color);
}

.form-control-custom[b-4v12gtjegf],
.form-select-custom[b-4v12gtjegf] {
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.55rem 0.9rem;
    font-size: 0.9rem;
    transition: border-color 0.2s, box-shadow 0.2s;
    background-color: #fff;
}

.form-control-custom:focus[b-4v12gtjegf],
.form-select-custom:focus[b-4v12gtjegf] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.12);
}

/* ======================================================
   LINES SECTION HEADER
   ====================================================== */
.pos-section-icon[b-4v12gtjegf] {
    color: var(--secondary-color);
    font-size: 1rem;
}

.pos-section-title[b-4v12gtjegf] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1a1a2e;
    letter-spacing: 0.1px;
}

.pos-lines-header[b-4v12gtjegf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.85rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #f0f0f0;
}

.items-count-badge[b-4v12gtjegf] {
    background: var(--primary-color);
    color: #fff;
    padding: 0.18rem 0.6rem;
    border-radius: 12px;
    font-size: 0.72rem;
    font-weight: 600;
}

/* ── Add item buttons ── */
.pos-add-item-btn[b-4v12gtjegf] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--primary-color);
    background: transparent;
    border: 1.5px dashed var(--primary-color);
    border-radius: 8px;
    padding: 0.35rem 0.9rem;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    transition: background 0.15s;
}

.pos-add-item-btn:hover[b-4v12gtjegf] {
    background: rgba(46, 125, 50, 0.06);
    color: var(--primary-color);
}

.pos-add-item-btn-sm[b-4v12gtjegf] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--primary-color);
    background: transparent;
    border: 1.5px dashed var(--primary-color);
    border-radius: 6px;
    padding: 0.22rem 0.7rem;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    transition: background 0.15s;
}

.pos-add-item-btn-sm:hover[b-4v12gtjegf] {
    background: rgba(46, 125, 50, 0.06);
    color: var(--primary-color);
}

/* ── Empty state ── */
.pos-empty-state[b-4v12gtjegf] {
    text-align: center;
    padding: 2.5rem 1rem;
    color: #adb5bd;
}

.pos-empty-state i[b-4v12gtjegf] {
    font-size: 2.5rem;
    display: block;
    margin-bottom: 0.6rem;
}

.pos-empty-state p[b-4v12gtjegf] {
    margin: 0;
    font-size: 0.9rem;
}

/* ======================================================
   LINES TABLE
   Using an HTML table guarantees column alignment regardless
   of which optional columns (qty, weight) are visible.
   ====================================================== */
.pos-lines-container[b-4v12gtjegf] {
    overflow: visible; /* required for autocomplete dropdown to float out */
}

.pos-lines-table[b-4v12gtjegf] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 0.3rem;
    table-layout: fixed;
}

/* ── Column widths (set on <col> elements) ── */
.col-thumb[b-4v12gtjegf]   { width: 48px;  }
.col-product[b-4v12gtjegf] { /* fluid */   }
.col-qty[b-4v12gtjegf]     { width: 74px;  }
.col-weight[b-4v12gtjegf]  { width: 80px;  }
.col-unit[b-4v12gtjegf]    { width: 76px;  }
.col-price[b-4v12gtjegf]   { width: 96px;  }
.col-disc[b-4v12gtjegf]    { width: 66px;  }
.col-tax[b-4v12gtjegf]     { width: 62px;  }
.col-total[b-4v12gtjegf]   { width: 96px;  }
.col-action[b-4v12gtjegf]  { width: 38px;  }

/* ── Header row ── */
.lines-header-row th[b-4v12gtjegf] {
    padding: 0.25rem 0.5rem 0.5rem;
    font-size: 0.7rem;
    font-weight: 700;
    color: #9aa5b1;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    border-bottom: 2px solid #edf2f7;
    white-space: nowrap;
    vertical-align: bottom;
}

/* ── Data rows — card style ── */
.pos-line-row td[b-4v12gtjegf] {
    padding: 0.55rem 0.5rem;
    vertical-align: middle;
    background: #fff;
    border-top: 1px solid #edf2f7;
    border-bottom: 1px solid #edf2f7;
    transition: background 0.12s, border-color 0.12s;
}

.pos-line-row td:first-child[b-4v12gtjegf] {
    border-left: 1px solid #edf2f7;
    border-radius: 8px 0 0 8px;
    padding-left: 0.6rem;
}

.pos-line-row td:last-child[b-4v12gtjegf] {
    border-right: 1px solid #edf2f7;
    border-radius: 0 8px 8px 0;
    padding-right: 0.5rem;
}

.pos-line-row:hover td[b-4v12gtjegf] {
    background: #f7fafc;
    border-color: #e2e8f0;
}

/* Unit column — distinct background so it reads as a separator between input cells */
.pos-line-row td.col-unit[b-4v12gtjegf] {
    background: #f0f4f8;
}

.pos-line-row:hover td.col-unit[b-4v12gtjegf] {
    background: #e8edf3;
}

.pos-line-row.row-warning td[b-4v12gtjegf] {
    background: #fffdf2;
    border-color: #ffc107;
}

/* ── Product thumbnail ── */
.pos-line-thumb[b-4v12gtjegf] {
    width: 38px;
    height: 38px;
    border-radius: 7px;
    background: linear-gradient(135deg, #e8f0e8 0%, #d4e8d4 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    color: var(--primary-color);
    overflow: hidden;
    flex-shrink: 0;
}

.pos-line-img[b-4v12gtjegf] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ── Product cell content ── */
.pos-line-price-hint[b-4v12gtjegf] {
    font-size: 0.67rem;
    color: #adb5bd;
    margin-top: 0.15rem;
    padding-left: 0.25rem;
}

.pos-line-product-static[b-4v12gtjegf] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #1a1a2e;
}

/* ── Number cell inputs ──
   ::deep pierces the InputNumber component boundary so the rendered <input>
   is styled even though it does not carry the Blazor scope attribute (b-xxx).
   Transforms to: .pos-lines-table[b-xxx] input.pos-cell-input { ... }        */
.pos-lines-table[b-4v12gtjegf]  input.pos-cell-input {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 0.35rem 0.5rem;
    font-size: 0.82rem;
    font-weight: 500;
    border: 1.5px solid #e2e8f0;
    border-radius: 7px;
    text-align: right;
    background: #f7f9fc;
    color: #1a1a2e;
    transition: border-color 0.15s, box-shadow 0.15s, background 0.15s;
    /* Hide browser spinner arrows */
    -moz-appearance: textfield;
    appearance: textfield;
}

.pos-lines-table[b-4v12gtjegf]  input.pos-cell-input::-webkit-inner-spin-button,
.pos-lines-table[b-4v12gtjegf]  input.pos-cell-input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.pos-lines-table[b-4v12gtjegf]  input.pos-cell-input:focus {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.14);
    background: #fff;
}

/* ── Static (read-only) cell values ── */
.pos-cell-static[b-4v12gtjegf] {
    font-size: 0.82rem;
    color: #495057;
    font-weight: 500;
}

/* ── Unit badge ── */
.unit-badge[b-4v12gtjegf] {
    display: inline-block;
    background: rgba(0, 0, 0, 0.06);
    color: #495057;
    font-size: 0.72rem;
    font-weight: 600;
    padding: 0.18rem 0.5rem;
    border-radius: 5px;
    white-space: nowrap;
}

/* ── Line Total value ── */
.pos-line-total-val[b-4v12gtjegf] {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--primary-color);
    white-space: nowrap;
    display: block;
    text-align: right;
}

/* ── Remove button ── */
.pos-remove-btn[b-4v12gtjegf] {
    width: 28px;
    height: 28px;
    border: none;
    background: transparent;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #c0c7d0;
    cursor: pointer;
    font-size: 0.72rem;
    transition: background 0.15s, color 0.15s;
    padding: 0;
    margin: 0 auto;
}

.pos-remove-btn:hover[b-4v12gtjegf] {
    background: rgba(220, 53, 69, 0.1);
    color: #dc3545;
}

/* ── Lines footer ── */
.pos-lines-footer[b-4v12gtjegf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.5rem;
    padding-top: 0.6rem;
    border-top: 1px solid #f0f0f0;
}

.pos-keyboard-hints[b-4v12gtjegf] {
    font-size: 0.7rem;
    color: #bbb;
    display: flex;
    align-items: center;
    gap: 0.2rem;
    flex-wrap: wrap;
}

.pos-keyboard-hints kbd[b-4v12gtjegf] {
    font-size: 0.67rem;
    padding: 0.1rem 0.32rem;
    border: 1px solid #ccc;
    border-radius: 3px;
    background: #f8f9fa;
    color: #555;
}

/* ======================================================
   SUMMARY SIDEBAR
   ====================================================== */
.summary-card[b-4v12gtjegf] {
    padding: 1.4rem 1.25rem;
}

.summary-title[b-4v12gtjegf] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #1a1a2e;
    margin-bottom: 1.1rem;
}

.summary-line[b-4v12gtjegf] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.45rem 0;
    font-size: 0.875rem;
    color: #555;
    border-bottom: 1px solid #f5f5f5;
}

.summary-shipping-row[b-4v12gtjegf] {
    gap: 0.5rem;
}

.summary-shipping-input[b-4v12gtjegf] {
    width: 110px;
    flex-shrink: 0;
}

.summary-shipping-input .form-control[b-4v12gtjegf] {
    text-align: right;
    font-size: 0.82rem;
    padding: 0.28rem 0.5rem;
    border-radius: 6px;
}

.summary-divider[b-4v12gtjegf] {
    height: 1px;
    background: #dee2e6;
    margin: 0.7rem 0;
}

.summary-total-row[b-4v12gtjegf] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 0.4rem 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: #1a1a2e;
}

.summary-total-val[b-4v12gtjegf] {
    font-size: 1.45rem;
    font-weight: 800;
    color: var(--primary-color);
}

.summary-actions[b-4v12gtjegf] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.pos-confirm-btn[b-4v12gtjegf] {
    width: 100%;
    padding: 0.7rem;
    font-size: 0.95rem;
    font-weight: 700;
    background: var(--primary-color);
    color: #fff;
    border: none;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    transition: opacity 0.15s, transform 0.1s;
}

.pos-confirm-btn:hover:not(:disabled)[b-4v12gtjegf] {
    opacity: 0.9;
    transform: translateY(-1px);
}

.pos-confirm-btn:disabled[b-4v12gtjegf] {
    opacity: 0.55;
    cursor: not-allowed;
}

.pos-save-btn[b-4v12gtjegf] {
    width: 100%;
    padding: 0.55rem;
    font-size: 0.875rem;
    font-weight: 600;
    background: transparent;
    color: var(--primary-color);
    border: 1.5px solid var(--primary-color);
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    transition: background 0.15s;
}

.pos-save-btn:hover:not(:disabled)[b-4v12gtjegf] {
    background: rgba(46, 125, 50, 0.06);
}

.pos-post-btn[b-4v12gtjegf] {
    width: 100%;
    padding: 0.7rem;
    font-size: 0.95rem;
    font-weight: 700;
    background: #0dcaf0;
    color: #fff;
    border: none;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    transition: opacity 0.15s;
}

.pos-post-btn:hover:not(:disabled)[b-4v12gtjegf] {
    opacity: 0.9;
}

.pos-print-btn[b-4v12gtjegf] {
    width: 100%;
    padding: 0.45rem;
    font-size: 0.82rem;
    background: #f8f9fa;
    color: #555;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    transition: background 0.15s;
}

.pos-print-btn:hover[b-4v12gtjegf] {
    background: #e9ecef;
}

/* ======================================================
   BOTTOM ACTION BAR
   ====================================================== */
.pos-action-bar[b-4v12gtjegf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 0;
    margin-top: 1.25rem;
    border-top: 1px solid #e9ecef;
}

/* ======================================================
   BUTTON STYLES
   ====================================================== */
.btn[b-4v12gtjegf] {
    padding: 0.6rem 1.25rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.9rem;
}

.btn-primary[b-4v12gtjegf] {
    background: linear-gradient(135deg, var(--secondary-color), var(--secondary-color));
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-4v12gtjegf] {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-4v12gtjegf] {
    background-color: #6c757d;
    color: #fff;
    border: none;
}

.btn-secondary:hover[b-4v12gtjegf] {
    background-color: #5c636a;
    transform: translateY(-1px);
}

.btn-success[b-4v12gtjegf] {
    background-color: #198754;
    color: #fff;
    border: none;
}

.btn-success:hover[b-4v12gtjegf] {
    background-color: #157347;
    transform: translateY(-1px);
}

.btn-info[b-4v12gtjegf] {
    background-color: #0dcaf0;
    color: #fff;
    border: none;
}

.btn-info:hover[b-4v12gtjegf] {
    background-color: #0aa2c0;
    transform: translateY(-1px);
}

.btn-outline-danger[b-4v12gtjegf] {
    background: transparent;
    color: #dc3545;
    border: 1.5px solid #dc3545;
}

.btn-outline-danger:hover[b-4v12gtjegf] {
    background: #dc3545;
    color: #fff;
    transform: translateY(-1px);
}

.btn-danger[b-4v12gtjegf] {
    background-color: #dc3545;
    color: #fff;
    border: none;
}

.btn-danger:hover[b-4v12gtjegf] {
    background-color: #bb2d3b;
    transform: translateY(-1px);
}

.btn:disabled[b-4v12gtjegf] {
    opacity: 0.55;
    cursor: not-allowed;
    transform: none !important;
}

/* ======================================================
   ALERTS
   ====================================================== */
.alert[b-4v12gtjegf] {
    border-radius: 10px;
    padding: 0.9rem 1.1rem;
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.alert-info[b-4v12gtjegf] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-4v12gtjegf] {
    color: var(--secondary-color);
}

.badge[b-4v12gtjegf] {
    padding: 0.3rem 0.6rem;
    border-radius: 6px;
    font-weight: 600;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

/* ======================================================
   PRODUCT AUTOCOMPLETE
   ====================================================== */
.product-autocomplete[b-4v12gtjegf] {
    position: relative;
    width: 100%;
}

.product-input-wrapper[b-4v12gtjegf] {
    display: flex;
    align-items: center;
    border: 1.5px solid #dee2e6;
    border-radius: 8px;
    background: white;
    padding: 0 0.5rem;
    transition: border-color 0.2s, box-shadow 0.2s;
    cursor: text;
}

.product-autocomplete.is-open .product-input-wrapper[b-4v12gtjegf],
.product-input-wrapper:focus-within[b-4v12gtjegf] {
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.product-search-icon[b-4v12gtjegf] {
    color: #adb5bd;
    font-size: 0.82rem;
    flex-shrink: 0;
    margin-right: 0.35rem;
}

.product-search-input[b-4v12gtjegf] {
    border: none;
    outline: none;
    background: transparent;
    flex: 1;
    font-size: 0.82rem;
    color: #212529;
    padding: 0.38rem 0;
    min-width: 0;
}

.product-search-input[b-4v12gtjegf]::placeholder {
    color: #adb5bd;
}

.product-chevron[b-4v12gtjegf] {
    color: #adb5bd;
    font-size: 0.72rem;
    flex-shrink: 0;
    margin-left: 0.25rem;
    transition: transform 0.2s;
}

.product-chevron.rotated[b-4v12gtjegf] {
    transform: rotate(180deg);
    color: var(--secondary-color);
}

.product-dropdown-panel[b-4v12gtjegf] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    min-width: 300px;
    max-width: 400px;
    background: white;
    border: 1.5px solid #dee2e6;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    z-index: 1050;
    overflow: hidden;
}

.product-drop-item[b-4v12gtjegf] {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.55rem 0.8rem;
    cursor: pointer;
    transition: background 0.12s;
    border-bottom: 1px solid #f0f0f0;
}

.product-drop-item:last-of-type[b-4v12gtjegf] {
    border-bottom: none;
}

.product-drop-item:hover[b-4v12gtjegf],
.product-drop-item.is-highlighted[b-4v12gtjegf] {
    background: #fff8e1;
    border-left: 3px solid var(--secondary-color);
    padding-left: calc(0.8rem - 3px);
}

.product-drop-item.is-selected[b-4v12gtjegf] {
    background: rgba(212, 175, 55, 0.08);
}

.product-drop-thumb[b-4v12gtjegf] {
    width: 34px;
    height: 34px;
    border-radius: 7px;
    background: linear-gradient(135deg, var(--primary-color) 0%, rgba(46, 125, 50, 0.7) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: white;
    font-size: 0.95rem;
    overflow: hidden;
}

.product-drop-img[b-4v12gtjegf] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 7px;
    display: block;
}

.product-drop-info[b-4v12gtjegf] {
    flex: 1;
    min-width: 0;
}

.product-drop-title[b-4v12gtjegf] {
    display: flex;
    align-items: center;
    gap: 0.2rem;
    flex-wrap: wrap;
}

.product-drop-code[b-4v12gtjegf] {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--primary-color);
}

.product-drop-sep[b-4v12gtjegf] {
    color: #adb5bd;
    font-size: 0.78rem;
}

.product-drop-name[b-4v12gtjegf] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #212529;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.product-drop-unit-tag[b-4v12gtjegf] {
    background: var(--secondary-color);
    color: var(--primary-color);
    font-size: 0.63rem;
    font-weight: 700;
    padding: 0.08rem 0.35rem;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    flex-shrink: 0;
}

.product-drop-sub[b-4v12gtjegf] {
    font-size: 0.7rem;
    color: #6c757d;
    margin-top: 0.08rem;
}

.product-drop-empty[b-4v12gtjegf] {
    padding: 1rem;
    text-align: center;
    color: #6c757d;
    font-size: 0.83rem;
}

.product-drop-hint[b-4v12gtjegf] {
    padding: 0.35rem 0.8rem;
    background: #f8f9fa;
    border-top: 1px solid #e9ecef;
    font-size: 0.7rem;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 0.2rem;
}

.product-drop-hint kbd[b-4v12gtjegf] {
    background: #e9ecef;
    border: 1px solid #ced4da;
    border-radius: 3px;
    padding: 0.08rem 0.28rem;
    font-size: 0.66rem;
    color: #495057;
}

/* ======================================================
   TOAST
   ====================================================== */
.toast[b-4v12gtjegf] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* ======================================================
   PRINT VOUCHER
   ====================================================== */
.print-voucher[b-4v12gtjegf] {
    padding: 40px;
    background: #e8f0f8;
    font-family: Arial, sans-serif;
}

.print-voucher .voucher-header[b-4v12gtjegf] { text-align: center; margin-bottom: 10px; }
.print-voucher .company-name[b-4v12gtjegf] { font-size: 24px; font-weight: bold; margin: 0; color: #000; }
.print-voucher .company-address[b-4v12gtjegf] { font-size: 16px; margin: 5px 0 0; color: #000; }
.print-voucher .voucher-divider[b-4v12gtjegf] { border: none; border-top: 2px solid #000; margin: 20px 0; }
.print-voucher .voucher-details[b-4v12gtjegf] { margin: 25px 0; }
.print-voucher .detail-row[b-4v12gtjegf] { display: flex; justify-content: space-between; margin-bottom: 12px; }
.print-voucher .detail-item[b-4v12gtjegf] { flex: 1; display: flex; gap: 10px; }
.print-voucher .detail-label[b-4v12gtjegf] { font-weight: bold; min-width: 80px; color: #000; }
.print-voucher .detail-value[b-4v12gtjegf] { color: #000; }
.print-voucher .particulars-section[b-4v12gtjegf] { margin: 25px 0; }
.print-voucher .section-heading[b-4v12gtjegf] { font-weight: bold; margin-bottom: 15px; color: #000; font-size: 16px; }
.print-voucher .particulars-table[b-4v12gtjegf] { width: 100%; border-collapse: collapse; margin-top: 15px; background: white; }
.print-voucher .particulars-table th[b-4v12gtjegf],
.print-voucher .particulars-table td[b-4v12gtjegf] { border: 1px solid #000; padding: 10px; text-align: left; color: #000; }
.print-voucher .particulars-table th[b-4v12gtjegf] { background-color: #d0d0d0; font-weight: bold; }
.print-voucher .particulars-table .text-end[b-4v12gtjegf] { text-align: right; }
.print-voucher .total-row[b-4v12gtjegf] { font-weight: bold; background-color: #f0f0f0; }

/* ======================================================
   RESPONSIVE
   ====================================================== */
@media (max-width: 960px) {
    .pos-layout[b-4v12gtjegf] {
        grid-template-columns: 1fr;
    }

    .pos-sidebar[b-4v12gtjegf] {
        position: static;
    }

    .summary-actions[b-4v12gtjegf] {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .pos-confirm-btn[b-4v12gtjegf],
    .pos-save-btn[b-4v12gtjegf],
    .pos-post-btn[b-4v12gtjegf],
    .pos-print-btn[b-4v12gtjegf] {
        width: auto;
        flex: 1;
    }
}

@media (max-width: 768px) {
    .pos-page-header[b-4v12gtjegf] {
        flex-direction: column;
        gap: 0.75rem;
    }

    .pos-page-title[b-4v12gtjegf] {
        font-size: 1.3rem;
    }

    .pos-lines-container[b-4v12gtjegf] {
        overflow-x: auto;
        margin: 0 -0.5rem;
    }

    .pos-lines-table[b-4v12gtjegf] {
        min-width: 680px;
    }

    .product-dropdown-panel[b-4v12gtjegf] {
        min-width: 260px;
        max-width: 90vw;
    }
}

@media (max-width: 576px) {
    .pos-card[b-4v12gtjegf] {
        padding: 1rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/SalesOrders/SalesOrderManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-tgungsumlb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-tgungsumlb] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-tgungsumlb] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-tgungsumlb] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-tgungsumlb]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-tgungsumlb] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-tgungsumlb] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-tgungsumlb] {
    color: #6c757d;
}

.add-new-btn[b-tgungsumlb] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-tgungsumlb] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== STAT CARDS ==================== */
.stat-card[b-tgungsumlb] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    height: 100%;
}

.stat-card:hover[b-tgungsumlb] {
    transform: translateY(-4px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.stat-header[b-tgungsumlb] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.stat-header i[b-tgungsumlb] {
    font-size: 1.75rem;
    color: var(--secondary-color);
}

.stat-label[b-tgungsumlb] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.stat-value[b-tgungsumlb] {
    font-size: 2rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 0.5rem;
}

.stat-footer[b-tgungsumlb] {
    font-size: 0.85rem;
    color: #868e96;
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-tgungsumlb] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-tgungsumlb] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-tgungsumlb] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-tgungsumlb] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-tgungsumlb] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FORM CONTROLS ==================== */
.form-control-custom[b-tgungsumlb],
.form-select-custom[b-tgungsumlb] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-tgungsumlb],
.form-select-custom:focus[b-tgungsumlb] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.form-label[b-tgungsumlb] {
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-tgungsumlb] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.search-box[b-tgungsumlb] {
    position: relative;
    width: 100%;
}

.search-box i[b-tgungsumlb] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box input[b-tgungsumlb] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-tgungsumlb] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.search-box input:disabled[b-tgungsumlb] {
    background-color: #e9ecef;
    cursor: not-allowed;
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-tgungsumlb] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-tgungsumlb] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-tgungsumlb] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-tgungsumlb] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-tgungsumlb] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn-success[b-tgungsumlb] {
    background-color: #198754;
    color: white;
    border: none;
}

.btn-success:hover[b-tgungsumlb] {
    background-color: #157347;
    transform: translateY(-2px);
}

.btn-info[b-tgungsumlb] {
    background-color: #0dcaf0;
    color: white;
    border: none;
}

.btn-info:hover[b-tgungsumlb] {
    background-color: #0aa2c0;
    transform: translateY(-2px);
}

.btn-filter[b-tgungsumlb] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
    border: none;
}

.btn-filter:hover:not(:disabled)[b-tgungsumlb] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    color: white;
}

.btn-reset[b-tgungsumlb] {
    background: #6c757d;
    color: white;
    border: none;
}

.btn-reset:hover:not(:disabled)[b-tgungsumlb] {
    background: #5c636a;
    transform: translateY(-2px);
}

.btn:disabled[b-tgungsumlb] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Active Filters */
.active-filters[b-tgungsumlb] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem;
    background: white;
    border-radius: 8px;
    border: 1px solid #dee2e6;
}

.filter-label[b-tgungsumlb] {
    font-weight: 600;
    color: #495057;
}

.filter-tag[b-tgungsumlb] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.75rem;
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
}

.filter-tag i[b-tgungsumlb] {
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.2s;
}

.filter-tag i:hover[b-tgungsumlb] {
    opacity: 1;
}

/* ==================== ORDERS TABLE ==================== */
.orders-table-container[b-tgungsumlb] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.orders-table[b-tgungsumlb] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.orders-table thead[b-tgungsumlb] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.orders-table thead th[b-tgungsumlb] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.orders-table thead th:first-child[b-tgungsumlb] {
    border-top-left-radius: 12px;
}

.orders-table thead th:last-child[b-tgungsumlb] {
    border-top-right-radius: 12px;
}

.orders-table tbody tr[b-tgungsumlb] {
    border-bottom: 1px solid #e9ecef;
    transition: background-color 0.2s ease;
}

.orders-table tbody tr:hover[b-tgungsumlb] {
    background-color: #f8f9fa;
}

.orders-table tbody td[b-tgungsumlb] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

.product-code[b-tgungsumlb] {
    font-weight: 600;
    color: var(--primary-color);
}

/* ==================== STATUS BADGES ==================== */
.badge[b-tgungsumlb] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== PROGRESS BAR ==================== */
.progress[b-tgungsumlb] {
    background-color: #e9ecef;
    border-radius: 8px;
    overflow: hidden;
}

.progress-bar[b-tgungsumlb] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, #43A047 100%);
    color: var(--primary-color);
    font-weight: 600;
    font-size: 0.75rem;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-tgungsumlb] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-tgungsumlb] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
    padding: 0;
}

.btn-action-icon:hover[b-tgungsumlb] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-edit:hover[b-tgungsumlb] {
    background: #0056b3;
    color: white;
}

.btn-action-icon.btn-delete:hover[b-tgungsumlb] {
    background: #dc3545;
    color: white;
}

.btn-action-icon.btn-view:hover[b-tgungsumlb] {
    background: #0056b3;
    color: white;
}

.btn-action-icon.btn-confirm:hover[b-tgungsumlb] {
    background: #28a745;
    color: white;
}

.btn-action-icon.btn-dispatch:hover[b-tgungsumlb] {
    background: #17a2b8;
    color: white;
}

.btn-action-icon.btn-info:hover[b-tgungsumlb] {
    background: #17a2b8;
    color: white;
}

/* ==================== TABLE SUMMARY & PAGINATION ==================== */
.table-summary[b-tgungsumlb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
    margin-top: 1.5rem;
    padding: 1.25rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
}

.summary-item[b-tgungsumlb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
    color: #495057;
}

.summary-item i[b-tgungsumlb] {
    color: var(--secondary-color);
    font-size: 1rem;
}

.pagination[b-tgungsumlb] {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

.page-item[b-tgungsumlb] {
    margin: 0;
}

.page-link[b-tgungsumlb] {
    padding: 0.5rem 0.75rem;
    border: 1px solid #dee2e6;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

.page-link:hover:not(:disabled)[b-tgungsumlb] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

.page-item.active .page-link[b-tgungsumlb] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

.page-item.disabled .page-link[b-tgungsumlb] {
    opacity: 0.5;
    cursor: not-allowed;
}

.page-link:disabled[b-tgungsumlb] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-tgungsumlb] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-tgungsumlb] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-tgungsumlb] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-tgungsumlb] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.filter-modal-label[b-tgungsumlb] {
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.filter-modal-label i[b-tgungsumlb] {
    color: var(--secondary-color);
}

/* ==================== SECTION TITLE (view details modal) ==================== */
.section-title[b-tgungsumlb] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid #dee2e6;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.section-title i[b-tgungsumlb] {
    color: var(--secondary-color);
}

/* ==================== MODAL ITEMS TABLE ==================== */
.modal-items-table-container[b-tgungsumlb] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.06);
}

.modal-items-table[b-tgungsumlb] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.modal-items-table thead[b-tgungsumlb] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.modal-items-table thead th[b-tgungsumlb] {
    padding: 0.75rem 0.5rem;
    font-weight: 600;
    font-size: 0.8rem;
    text-align: left;
    border: none;
    white-space: nowrap;
}

.modal-items-table thead th:first-child[b-tgungsumlb] {
    border-top-left-radius: 12px;
}

.modal-items-table thead th:last-child[b-tgungsumlb] {
    border-top-right-radius: 12px;
}

.modal-items-table tbody tr[b-tgungsumlb] {
    border-bottom: 1px solid #e9ecef;
}

.modal-items-table tbody tr:hover[b-tgungsumlb] {
    background-color: #f8f9fa;
}

.modal-items-table tbody td[b-tgungsumlb] {
    padding: 0.65rem 0.5rem;
    vertical-align: middle;
    font-size: 0.85rem;
    color: #495057;
}

.modal-items-table tbody tr.row-highlight td[b-tgungsumlb] {
    font-weight: 700;
    background-color: rgba(212, 175, 55, 0.08);
}

/* ==================== ALERTS ==================== */
.alert[b-tgungsumlb] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.alert-info[b-tgungsumlb] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-tgungsumlb] {
    color: var(--secondary-color);
}

/* ==================== TOAST ==================== */
.toast[b-tgungsumlb] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* ==================== FORM ENHANCEMENTS ==================== */
.form-check-input:checked[b-tgungsumlb] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.form-check-input:focus[b-tgungsumlb] {
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 992px) {
    .action-buttons[b-tgungsumlb] {
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .page-header[b-tgungsumlb] {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }

    .page-title[b-tgungsumlb] {
        font-size: 1.5rem;
    }

    .content-card[b-tgungsumlb] {
        padding: 1.5rem;
    }

    .orders-table thead th[b-tgungsumlb],
    .orders-table tbody td[b-tgungsumlb] {
        padding: 0.65rem 0.5rem;
        font-size: 0.85rem;
    }

    .table-summary[b-tgungsumlb] {
        flex-direction: column;
        gap: 1rem;
    }

    .stat-card[b-tgungsumlb] {
        margin-bottom: 1rem;
    }

    .active-filters[b-tgungsumlb] {
        gap: 0.5rem;
    }

    .filter-tag[b-tgungsumlb] {
        font-size: 0.75rem;
        padding: 0.3rem 0.6rem;
    }
}

@media (max-width: 576px) {
    .page-header .add-new-btn[b-tgungsumlb] {
        width: 100%;
        justify-content: center;
    }

    .content-card[b-tgungsumlb] {
        padding: 1rem;
    }

    .pagination[b-tgungsumlb] {
        flex-wrap: wrap;
        justify-content: center;
    }

    .page-link[b-tgungsumlb] {
        padding: 0.4rem 0.6rem;
        font-size: 0.8rem;
    }
}

/* ==================== PRINT VOUCHER STYLES (preview modal) ==================== */
.print-voucher[b-tgungsumlb] {
    padding: 40px;
    background: #e8f0f8;
    font-family: Arial, sans-serif;
}

.voucher-header[b-tgungsumlb] {
    text-align: center;
    margin-bottom: 10px;
}

.print-voucher .company-name[b-tgungsumlb] {
    font-size: 24px;
    font-weight: bold;
    margin: 0;
    color: #000;
}

.print-voucher .company-address[b-tgungsumlb] {
    font-size: 16px;
    margin: 5px 0 0;
    color: #000;
}

.print-voucher .voucher-divider[b-tgungsumlb] {
    border: none;
    border-top: 2px solid #000;
    margin: 20px 0;
}

.print-voucher .voucher-details[b-tgungsumlb] {
    margin: 25px 0;
}

.print-voucher .detail-row[b-tgungsumlb] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
}

.print-voucher .detail-item[b-tgungsumlb] {
    flex: 1;
    display: flex;
    gap: 10px;
}

.print-voucher .detail-item.full-width[b-tgungsumlb] {
    flex: 2;
}

.print-voucher .detail-label[b-tgungsumlb] {
    font-weight: bold;
    min-width: 80px;
    color: #000;
}

.print-voucher .detail-value[b-tgungsumlb] {
    color: #000;
}

.print-voucher .particulars-section[b-tgungsumlb] {
    margin: 25px 0;
}

.print-voucher .section-heading[b-tgungsumlb] {
    font-weight: bold;
    margin-bottom: 15px;
    color: #000;
    font-size: 16px;
}

.print-voucher .particulars-table[b-tgungsumlb] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
    background: white;
}

.print-voucher .particulars-table th[b-tgungsumlb],
.print-voucher .particulars-table td[b-tgungsumlb] {
    border: 1px solid #000;
    padding: 10px;
    text-align: left;
    color: #000;
}

.print-voucher .particulars-table th[b-tgungsumlb] {
    background-color: #d0d0d0;
    font-weight: bold;
}

.print-voucher .particulars-table .text-end[b-tgungsumlb] {
    text-align: right;
}

.print-voucher .total-row[b-tgungsumlb] {
    font-weight: bold;
    background-color: #f0f0f0;
}
/* _content/AccountingSystem.Web/Components/Pages/Sales/SalesDashboard.razor.rz.scp.css */
/* Dashboard Cards */
.dashboard-card[b-5233drv866] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

    .dashboard-card:hover[b-5233drv866] {
        transform: translateY(-5px);
        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    }

.card-icon[b-5233drv866] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-5233drv866] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-5233drv866] {
    color: #212529;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.card-change[b-5233drv866] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
}

    .card-change.positive[b-5233drv866] {
        color: #2E7D32;
    }

    .card-change i[b-5233drv866] {
        margin-right: 0.25rem;
    }

/* Content Card */
.content-card[b-5233drv866] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
    max-width: 100%; /* Ensure it doesn't exceed parent width */
    width: 100%;
    box-sizing: border-box;
}

.card-header-custom[b-5233drv866] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-5233drv866] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-5233drv866] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-5233drv866] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Page Header */
.page-header[b-5233drv866] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-5233drv866] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-5233drv866] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-5233drv866] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-5233drv866]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-5233drv866] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-5233drv866] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-5233drv866] {
    color: #6c757d;
}

.add-new-btn[b-5233drv866] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration:none;
}

    .add-new-btn:hover[b-5233drv866] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

/* Filter Section */
.filter-section[b-5233drv866] {
    margin-bottom: 1.5rem;
}

.filter-label[b-5233drv866] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
    margin-bottom: 0.25rem;
    display: block;
}

.search-box[b-5233drv866] {
    position: relative;
    width: 100%;
}

    .search-box input[b-5233drv866] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-5233drv866] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-5233drv866] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.form-select-custom[b-5233drv866], .form-control-custom[b-5233drv866] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-select-custom:focus[b-5233drv866], .form-control-custom:focus[b-5233drv866] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Table Styles */
.checks-table[b-5233drv866] {
    width: 100%;
    margin-top: 1rem;
}

    .checks-table thead[b-5233drv866] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .checks-table thead th[b-5233drv866] {
            <!-- color: white; -->
            font-weight: 600;
            padding: 1rem 0.75rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.8rem;
            letter-spacing: 0.5px;
            white-space: nowrap;
        }

    .checks-table tbody tr[b-5233drv866] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .checks-table tbody tr:hover[b-5233drv866] {
            background-color: #f8f5f0;
            box-shadow: inset 4px 0 0 var(--secondary-color), 0 2px 8px rgba(139, 0, 0, 0.1);
            transform: scale(1.01);
        }

        /* Extra visual indicator on hover */
        .checks-table tbody tr:hover td[b-5233drv866] {
 color: var(--primary-color);
     font-weight: 500;
        }

    .checks-table tbody td[b-5233drv866] {
        padding: 1rem 0.75rem;
        vertical-align: middle;
        font-size: 0.9rem;
    }

.voucher-number[b-5233drv866] {
    font-weight: 600;
    color: var(--primary-color);
}

.amount-value[b-5233drv866] {
    font-weight: 700;
    color: var(--primary-color);
}

/* Table Select Dropdowns */
.table-select[b-5233drv866] {
    border: 2px solid #e9ecef;
    border-radius: 6px;
    padding: 0.4rem 0.6rem;
    font-size: 0.85rem;
    transition: all 0.3s ease;
    cursor: pointer;
    width: 100%;
}

    .table-select:focus[b-5233drv866] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.15rem rgba(212, 175, 55, 0.15);
    }

    .table-select:hover[b-5233drv866] {
        border-color: var(--secondary-color);
    }

/* Picker Buttons */
.btn-picker[b-5233drv866] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 2px solid #e9ecef;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 500;
    transition: all 0.3s ease;
    cursor: pointer;
    background-color: white;
    text-align: left;
}

    .btn-picker:hover:not(:disabled)[b-5233drv866] {
        border-color: var(--secondary-color);
        background-color: #f8f5f0;
        transform: translateY(-1px);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.2);
    }

    .btn-picker:active:not(:disabled)[b-5233drv866] {
        transform: translateY(0);
        box-shadow: 0 1px 4px rgba(212, 175, 55, 0.15);
    }

    .btn-picker:disabled[b-5233drv866] {
        opacity: 0.6;
        cursor: not-allowed;
    }

    .btn-picker i:first-child[b-5233drv866] {
        color: var(--primary-color);
        font-size: 1.1rem;
        flex-shrink: 0;
    }

    .btn-picker i:last-child[b-5233drv866] {
        color: #6c757d;
        font-size: 0.9rem;
        flex-shrink: 0;
    }

    .btn-picker span[b-5233drv866] {
        flex: 1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.btn-picker-empty[b-5233drv866] {
    color: #6c757d;
    font-style: italic;
}

    .btn-picker-empty:hover:not(:disabled)[b-5233drv866] {
        color: #495057;
    }

.btn-picker-filled[b-5233drv866] {
    color: #212529;
    border-color: #d4af37;
    background-color: #fff8e6;
}

    .btn-picker-filled:hover:not(:disabled)[b-5233drv866] {
        border-color: var(--secondary-color);
        background-color: #fff3cd;
    }

    .btn-picker-filled i:first-child[b-5233drv866] {
        color: var(--secondary-color);
    }

/* Status Select Colors */
.status-select.status-pending[b-5233drv866] {
    background-color: #fff3cd;
    border-color: #ffc107;
    color: #856404;
    font-weight: 600;
}

.status-select.status-progress[b-5233drv866] {
    background-color: #cfe2ff;
    border-color: #0d6efd;
    color: #084298;
    font-weight: 600;
}

.status-select.status-completed[b-5233drv866] {
    background-color: #d1e7dd;
    border-color: #198754;
    color: #0f5132;
    font-weight: 600;
}

.status-select.status-cancelled[b-5233drv866] {
    background-color: #f8d7da;
    border-color: #dc3545;
    color: #842029;
    font-weight: 600;
}

/* Action Buttons */
.action-buttons[b-5233drv866] {
    display: flex;
    gap: 0.4rem;
    justify-content: center;
}

.btn-action[b-5233drv866] {
    padding: 0.4rem 0.6rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-view[b-5233drv866] {
    background-color: #0dcaf0;
    color: white;
}

    .btn-view:hover[b-5233drv866] {
        background-color: #0aa2c0;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 202, 240, 0.3);
    }

.btn-edit[b-5233drv866] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-5233drv866] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

.btn-print[b-5233drv866] {
    background-color: #6c757d;
    color: white;
}

    .btn-print:hover[b-5233drv866] {
        background-color: #5c636a;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(108, 117, 125, 0.3);
    }

/* Pagination */
.pagination-wrapper[b-5233drv866] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-5233drv866] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-5233drv866] {
    margin: 0;
}

.page-link[b-5233drv866] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

    .page-link:hover[b-5233drv866] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
    }

.page-item.active .page-link[b-5233drv866] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Modal Styles */
.modal-content[b-5233drv866] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-5233drv866] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-5233drv866] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-5233drv866] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-5233drv866] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-5233drv866] {
            opacity: 1;
        }

.modal-body[b-5233drv866] {
    padding: 2rem;
}

.modal-footer[b-5233drv866] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.detail-label[b-5233drv866] {
    font-weight: 600;
    color: #6c757d;
    font-size: 0.9rem;
    margin-bottom: 0.25rem;
}

.detail-value[b-5233drv866] {
    color: #212529;
    font-size: 1rem;
    margin-bottom: 1rem;
}

/* Buttons */
.btn[b-5233drv866] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-secondary[b-5233drv866] {
    background-color: #6c757d;
    border: none;
}

    .btn-secondary:hover[b-5233drv866] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

/* Toast */
.toast[b-5233drv866] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Filter Modal Styles */
.filter-modal-label[b-5233drv866] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .filter-modal-label i[b-5233drv866] {
        color: var(--primary-color);
        font-size: 1.1rem;
    }

/* Filter Button Styles */
.btn-filter[b-5233drv866] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-filter:hover[b-5233drv866] {
        background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(139, 0, 0, 0.4);
    }

    .btn-filter:active[b-5233drv866] {
        transform: translateY(0);
    }

.btn-reset[b-5233drv866] {
    background-color: #6c757d;
    color: white;
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-reset:hover[b-5233drv866] {
        background-color: #5c636a;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(108, 117, 125, 0.3);
    }

.btn-primary-filter[b-5233drv866] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    border-radius: 8px;
    font-weight: 700;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

    .btn-primary-filter:hover[b-5233drv866] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

/* Active Filters Display */
.active-filters[b-5233drv866] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    border-radius: 8px;
    border-left: 4px solid var(--secondary-color);
}

.filter-tag[b-5233drv866] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.75rem;
    background-color: white;
    border: 1px solid var(--secondary-color);
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--primary-color);
    transition: all 0.2s ease;
}

    .filter-tag:hover[b-5233drv866] {
        background-color: #fff8e6;
        box-shadow: 0 2px 6px rgba(212, 175, 55, 0.2);
    }

    .filter-tag i[b-5233drv866] {
        cursor: pointer;
        font-size: 1rem;
        transition: transform 0.2s ease;
    }

        .filter-tag i:hover[b-5233drv866] {
            transform: scale(1.2);
            color: var(--primary-color);
        }

/* Modal Size Adjustments */
.modal-lg[b-5233drv866] {
    max-width: 900px;
}

/* ==================== MOBILE RESPONSIVE STYLES ==================== */

/* Tablet and below (768px) */
@media (max-width: 768px) {
    /* Prevent page overflow but allow table scrolling */
    body[b-5233drv866] {
        overflow-x: hidden;
    }

    /* Ensure main content container doesn't overflow */
    .main-content[b-5233drv866] {
        overflow-x: hidden;
        max-width: 100vw;
    }

    /* Ensure content card doesn't overflow */
    .content-card[b-5233drv866] {
        padding: 1.25rem;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* Keep table scrollable on all devices */
    .checks-table-container[b-5233drv866] {
        max-width: 100%;
        overflow-x: auto; /* Allow horizontal scrolling */
        border: 1px solid #e9ecef;
        border-radius: 8px;
    }

    /* Page Header */
    .page-header[b-5233drv866] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
        padding-bottom: 1rem;
        margin-bottom: 1.5rem;
    }

    .page-title[b-5233drv866] {
        font-size: 1.5rem;
    }

        .page-title i[b-5233drv866] {
            font-size: 1.5rem;
        }

    .breadcrumb[b-5233drv866] {
        font-size: 0.8rem;
    }

    .add-new-btn[b-5233drv866] {
        width: 100%;
        justify-content: center;
        padding: 0.65rem 1.25rem;
        font-size: 0.9rem;
    }

    /* Statistics Cards */
    .dashboard-card[b-5233drv866] {
        padding: 1.25rem;
    }

    .card-icon[b-5233drv866] {
        width: 50px;
        height: 50px;
        font-size: 1.5rem;
    }

    .card-value[b-5233drv866] {
        font-size: 1.5rem;
    }

    .card-title[b-5233drv866] {
        font-size: 0.85rem;
    }

    .card-change[b-5233drv866] {
        font-size: 0.8rem;
    }

    /* Card Header */
    .card-header-custom[b-5233drv866] {
        padding-bottom: 1rem;
        margin-bottom: 1rem;
    }

    .card-title-custom[b-5233drv866] {
        font-size: 1.1rem;
    }

        .card-title-custom i[b-5233drv866] {
            font-size: 1.25rem;
        }

    .card-subtitle-custom[b-5233drv866] {
        font-size: 0.85rem;
    }

    /* Search and Filter Bar */
    .filter-section[b-5233drv866] {
        margin-bottom: 1rem;
    }

    .search-box input[b-5233drv866] {
        padding: 0.6rem 1rem 0.6rem 2.5rem;
        font-size: 0.9rem;
    }

    .search-box i[b-5233drv866] {
        font-size: 1rem;
    }

    /* Filter Buttons */
    .btn-filter[b-5233drv866],
    .btn-reset[b-5233drv866],
    .btn-secondary[b-5233drv866] {
        padding: 0.6rem 1rem;
        font-size: 0.85rem;
        white-space: nowrap;
    }

    /* Active Filters */
    .active-filters[b-5233drv866] {
        padding: 0.6rem 0.75rem;
        gap: 0.4rem;
    }

    .filter-label[b-5233drv866] {
        font-size: 0.8rem;
        width: 100%;
        margin-bottom: 0.25rem;
    }

    .filter-tag[b-5233drv866] {
        font-size: 0.75rem;
        padding: 0.35rem 0.65rem;
    }

    /* Table */
    .checks-table[b-5233drv866] {
        font-size: 0.8rem;
    }

        .checks-table thead th[b-5233drv866],
        .checks-table tbody td[b-5233drv866] {
            padding: 0.75rem 0.5rem;
        }

    .action-buttons[b-5233drv866] {
        flex-direction: column;
        gap: 0.25rem;
    }

    .table-select[b-5233drv866] {
        font-size: 0.8rem;
        padding: 0.35rem 0.5rem;
    }

    .btn-picker[b-5233drv866] {
        font-size: 0.8rem;
        padding: 0.45rem 0.65rem;
    }

        .btn-picker i:first-child[b-5233drv866] {
            font-size: 1rem;
        }

        .btn-picker i:last-child[b-5233drv866] {
            font-size: 0.85rem;
        }

    /* Expandable Details */
    .expanded-content[b-5233drv866] {
        padding: 1.25rem;
    }

    .section-title[b-5233drv866] {
        font-size: 0.95rem;
    }

    .detail-grid[b-5233drv866] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .detail-item[b-5233drv866] {
        padding: 0.75rem;
    }

        .detail-item label[b-5233drv866] {
            font-size: 0.8rem;
        }

        .detail-item span[b-5233drv866] {
            font-size: 0.9rem;
        }

    /* Pagination */
    .pagination-wrapper[b-5233drv866] {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
        margin-top: 1rem;
        padding-top: 1rem;
    }

    .showing-entries[b-5233drv866] {
        font-size: 0.85rem;
        text-align: center;
    }

    .pagination[b-5233drv866] {
        justify-content: center;
    }

    .page-link[b-5233drv866] {
        padding: 0.4rem 0.6rem;
        font-size: 0.85rem;
    }

    /* Modal */
    .modal-lg[b-5233drv866] {
        max-width: 100%;
        margin: 0.5rem;
    }

    .modal-header[b-5233drv866] {
        padding: 1.25rem;
    }

        .modal-header .modal-title[b-5233drv866] {
            font-size: 1.1rem;
        }

            .modal-header .modal-title i[b-5233drv866] {
                font-size: 1.25rem;
            }

    .modal-body[b-5233drv866] {
        padding: 1.25rem;
    }

    .modal-footer[b-5233drv866] {
        padding: 1rem;
        flex-wrap: wrap;
        gap: 0.5rem;
    }

        .modal-footer .btn[b-5233drv866] {
            flex: 1 1 auto;
            min-width: 120px;
        }

    .filter-modal-label[b-5233drv866] {
        font-size: 0.85rem;
    }

        .filter-modal-label i[b-5233drv866] {
            font-size: 1rem;
        }

    .form-select-custom[b-5233drv866],
    .form-control-custom[b-5233drv866] {
        font-size: 0.9rem;
        padding: 0.6rem 0.85rem;
    }
}

/* Small Mobile (576px and below) */
@media (max-width: 576px) {
    /* Prevent page overflow but allow table scrolling */
    body[b-5233drv866], html[b-5233drv866] {
        overflow-x: hidden;
        max-width: 100vw;
    }

    .main-content[b-5233drv866] {
        overflow-x: hidden;
        max-width: 100vw;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    /* Page Header */
    .page-title[b-5233drv866] {
        font-size: 1.25rem;
    }

        .page-title i[b-5233drv866] {
            font-size: 1.25rem;
        }

    .breadcrumb[b-5233drv866] {
        font-size: 0.75rem;
    }

    /* Statistics Cards */
    .dashboard-card[b-5233drv866] {
        padding: 1rem;
    }

    .card-icon[b-5233drv866] {
        width: 45px;
        height: 45px;
        font-size: 1.25rem;
    }

    .card-value[b-5233drv866] {
        font-size: 1.25rem;
    }

    /* Content Card */
    .content-card[b-5233drv866] {
        padding: 1rem;
        border-radius: 8px;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* Table remains scrollable */
    .checks-table-container[b-5233drv866] {
        overflow-x: auto;
        padding: 0.5rem;
        position: relative;
    }

        /* Mobile scroll hint */
        .desktop-view .checks-table-container[b-5233drv866]::after {
            content: 'Swipe \2192';
            position: sticky;
            right: 5px;
            top: 15px;
            float: right;
            background: rgba(139, 0, 0, 0.9);
            color: white;
            padding: 0.4rem 0.8rem;
            border-radius: 15px;
            font-size: 0.75rem;
            font-weight: 700;
            z-index: 10;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
            animation: bounceHorizontal 2s ease-in-out infinite;
        }

    .checks-table-modern[b-5233drv866] {
        min-width: 800px; /* Slightly smaller for mobile but still readable */
    }

    @@keyframes bounceHorizontal {
        0%[b-5233drv866], 100%[b-5233drv866] {
            transform: translateX(0);
            opacity: 0.8;
        }
        50%[b-5233drv866] {
            transform: translateX(-5px);
            opacity: 1;
        }
    }

    .card-header-custom[b-5233drv866] {
        padding-bottom: 0.75rem;
        margin-bottom: 0.75rem;
    }

    /* Search and Filter */
    .search-box input[b-5233drv866] {
        padding: 0.55rem 0.85rem 0.55rem 2.25rem;
        font-size: 0.85rem;
    }

    .search-box i[b-5233drv866] {
        font-size: 0.9rem;
        left: 0.85rem;
    }

    /* Button Groups - Stack vertically */
    .d-flex.gap-2.justify-content-end[b-5233drv866] {
        flex-direction: column !important;
    }

        .d-flex.gap-2.justify-content-end .btn[b-5233drv866] {
            width: 100%;
        }

    .btn-filter[b-5233drv866],
    .btn-reset[b-5233drv866],
    .btn-secondary[b-5233drv866] {
        padding: 0.55rem 0.85rem;
        font-size: 0.8rem;
        justify-content: center;
    }

    /* Active Filters */
    .active-filters[b-5233drv866] {
        padding: 0.5rem;
    }

    .filter-tag[b-5233drv866] {
        font-size: 0.7rem;
        padding: 0.3rem 0.55rem;
    }

    /* Mobile Cards */
    .check-card[b-5233drv866] {
        padding: 1rem;
        margin-bottom: 0.75rem;
    }

    .card-body-row[b-5233drv866] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .voucher-badge-mobile[b-5233drv866] {
        font-size: 0.8rem;
        padding: 0.35rem 0.7rem;
    }

    .date-mobile[b-5233drv866] {
        font-size: 0.8rem;
    }

    .info-content label[b-5233drv866] {
        font-size: 0.7rem;
    }

    .info-content span[b-5233drv866] {
        font-size: 0.85rem;
    }

    .amount-mobile[b-5233drv866] {
        font-size: 0.95rem;
    }

    .detail-row[b-5233drv866] {
        font-size: 0.8rem;
    }

    .btn-action-mobile[b-5233drv866] {
        padding: 0.55rem 0.85rem;
        font-size: 0.8rem;
    }

    .badge[b-5233drv866] {
        padding: 0.4rem 0.8rem;
        font-size: 0.75rem;
    }

    /* Pagination - Compact version */
    .pagination[b-5233drv866] {
        flex-wrap: wrap;
        gap: 0.25rem;
    }

    .page-item[b-5233drv866] {
        flex: 0 0 auto;
    }

    .page-link[b-5233drv866] {
        padding: 0.35rem 0.5rem;
        font-size: 0.8rem;
        min-width: 36px;
        text-align: center;
    }

    /* Hide some page numbers on very small screens */
    .pagination .page-item:not(.active):not(:first-child):not(:last-child):nth-child(n+6)[b-5233drv866] {
        display: none;
    }

    /* Modal adjustments */
    .modal-dialog[b-5233drv866] {
        margin: 0.25rem;
    }

    .modal-header[b-5233drv866] {
        padding: 1rem;
    }

        .modal-header .modal-title[b-5233drv866] {
            font-size: 1rem;
        }

    .modal-body[b-5233drv866] {
        padding: 1rem;
    }

    .modal-footer[b-5233drv866] {
        padding: 0.75rem;
    }

        .modal-footer .btn[b-5233drv866] {
            padding: 0.5rem 0.75rem;
            font-size: 0.8rem;
        }

    /* Expanded content */
    .expanded-content[b-5233drv866] {
        padding: 1rem;
    }

    .section-title[b-5233drv866] {
        font-size: 0.9rem;
    }

    .detail-item[b-5233drv866] {
        padding: 0.65rem;
    }

    .btn-picker-compact[b-5233drv866] {
        font-size: 0.8rem;
        padding: 0.45rem 0.75rem;
    }

    .status-select[b-5233drv866] {
        font-size: 0.8rem;
        padding: 0.4rem;
    }

    .particulars-content[b-5233drv866] {
        padding: 0.75rem;
        font-size: 0.85rem;
    }
}

/* Extra Small Mobile (400px and below) */
@media (max-width: 400px) {
    /* Prevent page overflow while keeping table scrollable */
    body[b-5233drv866], html[b-5233drv866], .main-content[b-5233drv866] {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }

    .page-title[b-5233drv866] {
        font-size: 1.1rem;
        word-wrap: break-word;
    }

    .card-value[b-5233drv866] {
        font-size: 1.1rem;
    }

    .content-card[b-5233drv866] {
        padding: 0.85rem;
        max-width: 100%;
        box-sizing: border-box;
    }

    .check-card[b-5233drv866] {
        padding: 0.85rem;
    }

    .filter-tag[b-5233drv866] {
        font-size: 0.65rem;
        padding: 0.25rem 0.5rem;
    }

    /* Simplify pagination on very small screens */
    .showing-entries[b-5233drv866] {
        font-size: 0.75rem;
    }

    .pagination .page-item:not(.active):not(:first-child):not(:last-child):nth-child(n+4)[b-5233drv866] {
        display: none;
    }

    /* Ensure all text elements can wrap */
    .voucher-badge[b-5233drv866], .voucher-badge-mobile[b-5233drv866], .ar-code[b-5233drv866] {
        word-wrap: break-word;
        white-space: normal;
        max-width: 100%;
    }

    /* Keep table scrollable with reduced minimum width */
    .checks-table-modern[b-5233drv866] {
        min-width: 700px;
    }

    .checks-table-container[b-5233drv866] {
        padding: 0.25rem;
    }
}

/* ==================== RESPONSIVE TABLE STYLES ==================== */

/* Desktop View */
.desktop-view[b-5233drv866] {
    display: block;
}

.mobile-view[b-5233drv866] {
    display: none;
}

/* Table Container with Overflow Handling */
.checks-table-container[b-5233drv866] {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
    margin-bottom: 1rem;
    position: relative;
    /* Ensure scrolling works on all devices */
    max-width: 100%;
    box-sizing: border-box;
}

    /* Scrollbar styling */
    .checks-table-container[b-5233drv866]::-webkit-scrollbar {
        height: 10px;
    }

    .checks-table-container[b-5233drv866]::-webkit-scrollbar-track {
        background: #f1f3f5;
        border-radius: 5px;
        margin: 0 10px;
    }

    .checks-table-container[b-5233drv866]::-webkit-scrollbar-thumb {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        border-radius: 5px;
        border: 2px solid #f1f3f5;
    }

        .checks-table-container[b-5233drv866]::-webkit-scrollbar-thumb:hover {
            background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
        }

    /* Scroll shadow indicator - shows when there's more content to the right */
    .checks-table-container[b-5233drv866] {
        background:
            linear-gradient(to right, white 30%, rgba(255,255,255,0)) 0 0,
            linear-gradient(to right, rgba(255,255,255,0), white 70%) 100% 0,
            radial-gradient(farthest-side at 0 50%, rgba(139,0,0,.2), rgba(0,0,0,0)) 0 0,
            radial-gradient(farthest-side at 100% 50%, rgba(139,0,0,.2), rgba(0,0,0,0)) 100% 0;
        background-repeat: no-repeat;
        background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%;
        background-attachment: local, local, scroll, scroll;
    }

/* Modern Table Styles */
.checks-table-modern[b-5233drv866] {
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    min-width: 900px; /* Minimum width to ensure all columns are readable */
    table-layout: auto;
}

    .checks-table-modern thead[b-5233drv866] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
    }

        .checks-table-modern thead th[b-5233drv866] {
            padding: 1rem;
            font-weight: 600;
            font-size: 0.9rem;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            border: none;
        }

            .checks-table-modern thead th:first-child[b-5233drv866] {
                border-radius: 10px 0 0 0;
            }

            .checks-table-modern thead th:last-child[b-5233drv866] {
                border-radius: 0 10px 0 0;
            }

    .checks-table-modern tbody .main-row[b-5233drv866] {
        background: white;
        transition: all 0.3s ease;
        border-bottom: 1px solid #e9ecef;
    }

        .checks-table-modern tbody .main-row:hover[b-5233drv866] {
            background: #f8f9fa;
            transform: translateX(2px);
            box-shadow: 0 2px 8px rgba(139, 0, 0, 0.1);
        }

        .checks-table-modern tbody .main-row td[b-5233drv866] {
            padding: 1rem;
            vertical-align: middle;
            cursor: pointer;
            white-space: nowrap; /* Prevent text wrapping that could break layout */
        }

            /* Allow AR Code cell to wrap if needed */
            .checks-table-modern tbody .main-row td:nth-child(4)[b-5233drv866] {
                white-space: normal; /* AR Code can wrap */
                min-width: 150px;
            }

/* Expand Button */
.btn-expand[b-5233drv866] {
    background: none;
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: all 0.3s ease;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .btn-expand:hover[b-5233drv866] {
        background: rgba(139, 0, 0, 0.1);
    }

    .btn-expand i[b-5233drv866] {
        transition: transform 0.3s ease;
        font-size: 1rem;
    }

    .btn-expand.expanded i[b-5233drv866] {
        transform: rotate(90deg);
    }

/* Cell Styles */
.date-wrapper[b-5233drv866] {
    display: flex;
    align-items: center;
    font-size: 0.9rem;
}

.voucher-badge[b-5233drv866] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.85rem;
    display: inline-block;
    letter-spacing: 0.5px;
}

.payee-info[b-5233drv866] {
    display: flex;
    align-items: center;
}

.payee-name[b-5233drv866] {
    font-weight: 600;
    color: #2c3e50;
}

.amount-highlight[b-5233drv866] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
    background: linear-gradient(135deg, rgba(139, 0, 0, 0.05) 0%, rgba(212, 175, 55, 0.05) 100%);
    padding: 0.5rem 0.8rem;
    border-radius: 6px;
    display: inline-block;
}

/* Status Badges */
.badge[b-5233drv866] {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: capitalize;
}

.badge-na[b-5233drv866] {
    background: #e9ecef;
    color: #6c757d;
}

.badge-pending[b-5233drv866] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #fff;
}

.badge-in-progress[b-5233drv866] {
    background: linear-gradient(135deg, #17a2b8 0%, #138496 100%);
    color: #fff;
}

.badge-completed[b-5233drv866] {
    background: linear-gradient(135deg, #2E7D32 0%, #43A047 100%);
    color: #fff;
}

.badge-cancelled[b-5233drv866] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: #fff;
}

/* ✅ NEW: Mode of Payment Badge Styles */
.badge-cash[b-5233drv866] {
    background: linear-gradient(135deg, #2E7D32 0%, #43A047 100%);
    color: #fff;
}

.badge-check[b-5233drv866] {
    background: linear-gradient(135deg, #1976D2 0%, #42A5F5 100%);
    color: #fff;
}

.badge-online[b-5233drv866] {
    background: linear-gradient(135deg, #6A1B9A 0%, #AB47BC 100%);
  color: #fff;
}

/* Positive/Negative badges for text color only */
.positive[b-5233drv866] {
    color: #2E7D32;
}

.neutral[b-5233drv866] {
    color: #1976D2;
}

/* Action Icon Button */
.btn-action-icon[b-5233drv866] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
}

    .btn-action-icon:hover[b-5233drv866] {
        background: var(--primary-color);
        color: white;
        transform: scale(1.1);
    }

/* Expandable Row */
.expandable-row[b-5233drv866] {
    background: #f8f9fa;
    border-bottom: 2px solid var(--secondary-color);
}

    .expandable-row td[b-5233drv866] {
        padding: 0 !important;
    }

.expanded-content[b-5233drv866] {
    padding: 2rem;
    animation: slideDown 0.3s ease-out;
}

@@keyframes slideDown {
    from[b-5233drv866] {
        opacity: 0;
        transform: translateY(-10px);
    }

    to[b-5233drv866] {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Detail Sections */
.detail-section[b-5233drv866] {
    margin-bottom: 1.5rem;
}

    .detail-section:last-child[b-5233drv866] {
        margin-bottom: 0;
    }

.section-title[b-5233drv866] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--secondary-color);
    display: flex;
    align-items: center;
}

.detail-grid[b-5233drv866] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
}

.detail-item[b-5233drv866] {
    background: white;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

    .detail-item:hover[b-5233drv866] {
        border-color: var(--secondary-color);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.2);
    }

    .detail-item.full-width[b-5233drv866] {
        grid-column: 1 / -1;
    }

    .detail-item label[b-5233drv866] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 0.85rem;
        color: #6c757d;
        font-weight: 600;
        margin-bottom: 0.5rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .detail-item span[b-5233drv866] {
        color: #2c3e50;
        font-weight: 600;
        font-size: 0.95rem;
    }

.check-number[b-5233drv866] {
    font-family: 'Courier New', monospace;
    background: #f8f9fa;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
}

.project-name[b-5233drv866] {
    color: var(--primary-color);
    font-weight: 700;
}

/* Compact Picker Buttons */
.btn-picker-compact[b-5233drv866] {
    width: 100%;
    padding: 0.5rem 1rem;
    border-radius: 6px;
    border: 2px solid #e9ecef;
    background: white;
    color: #6c757d;
    font-size: 0.85rem;
    font-weight: 600;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5rem;
}

    .btn-picker-compact.btn-picker-empty[b-5233drv866] {
        border-color: var(--primary-color);
        color: var(--primary-color);
        border-style: dashed;
    }

    .btn-picker-compact.btn-picker-filled[b-5233drv866] {
        background: linear-gradient(135deg, rgba(139, 0, 0, 0.05) 0%, rgba(212, 175, 55, 0.05) 100%);
        border-color: var(--secondary-color);
        color: var(--primary-color);
    }

    .btn-picker-compact:hover[b-5233drv866] {
        background: var(--primary-color);
        color: white;
        border-color: var(--primary-color);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(139, 0, 0, 0.3);
    }

/* Status Select */
.status-select[b-5233drv866] {
    border: 2px solid #e9ecef;
    border-radius: 6px;
    font-weight: 600;
    padding: 0.5rem;
    background: white;
}

/* Particulars */
.particulars-content[b-5233drv866] {
    background: white;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    color: #2c3e50;
    line-height: 1.6;
}

/* ==================== MOBILE CARD STYLES ==================== */

.check-card[b-5233drv866] {
    background: white;
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    cursor: pointer;
    border: 2px solid transparent;
}

    .check-card:hover[b-5233drv866] {
        border-color: var(--secondary-color);
        box-shadow: 0 4px 16px rgba(212, 175, 55, 0.3);
        transform: translateY(-2px);
    }

.card-header-row[b-5233drv866] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.voucher-info[b-5233drv866] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.voucher-badge-mobile[b-5233drv866] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.85rem;
    display: inline-block;
    letter-spacing: 0.5px;
}

.date-mobile[b-5233drv866] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #6c757d;
    font-size: 0.85rem;
}

.card-body-row[b-5233drv866] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

.info-group[b-5233drv866] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

    .info-group i[b-5233drv866] {
        color: var(--primary-color);
        font-size: 1.25rem;
        margin-top: 0.25rem;
    }

.info-content[b-5233drv866] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    .info-content label[b-5233drv866] {
        font-size: 0.75rem;
        color: #6c757d;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .info-content span[b-5233drv866] {
        font-size: 0.9rem;
        color: #2c3e50;
        font-weight: 600;
    }

.amount-mobile[b-5233drv866] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
}

.card-divider[b-5233drv866] {
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, var(--secondary-color) 50%, transparent 100%);
    margin: 1rem 0;
}

.card-details-grid[b-5233drv866] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.detail-row[b-5233drv866] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.85rem;
    color: #2c3e50;
}

    .detail-row i[b-5233drv866] {
        color: #6c757d;
        width: 20px;
        text-align: center;
    }

.card-actions[b-5233drv866] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.btn-action-mobile[b-5233drv866] {
    background: white;
    border: 2px solid var(--secondary-color);
    color: var(--primary-color);
    padding: 0.6rem 1rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
}

    .btn-action-mobile:hover[b-5233drv866] {
        background: var(--primary-color);
        color: white;
        border-color: var(--primary-color);
    }

    .btn-action-mobile i[b-5233drv866] {
        font-size: 1rem;
    }

/* ==================== RESPONSIVE BREAKPOINTS ==================== */

/* Switch to mobile card view on tablets and smaller */
@@media (max-width: 992px) {
    .desktop-view[b-5233drv866] {
        display: none !important;
    }

    .mobile-view[b-5233drv866] {
        display: block !important;
    }
}

/* Tablet and below - Ensure horizontal scroll */
@@media (max-width: 992px) {
    .checks-table-container[b-5233drv866] {
        overflow-x: auto;
        border: 1px solid #e9ecef;
        border-radius: 8px;
        background: white;
    }

    .checks-table-modern[b-5233drv866] {
        min-width: 900px; /* Ensure minimum width for readability */
    }

    /* Visual scroll indicator on right edge */
    .desktop-view .checks-table-container[b-5233drv866]::after {
        content: '\21C4'; /* Left-right arrow symbol */
        position: sticky;
        right: 0;
        top: 50%;
        float: right;
        transform: translateY(-50%);
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
        color: white;
        padding: 0.5rem 0.75rem;
        border-radius: 20px 0 0 20px;
        font-size: 1rem;
        font-weight: 700;
        z-index: 10;
        box-shadow: -2px 2px 8px rgba(139, 0, 0, 0.3);
        animation: pulseScroll 2s ease-in-out infinite;
        pointer-events: none;
    }

    @@keyframes pulseScroll {
        0%[b-5233drv866], 100%[b-5233drv866] {
            opacity: 0.6;
            transform: translateY(-50%) scale(0.95);
        }
        50%[b-5233drv866] {
            opacity: 1;
            transform: translateY(-50%) scale(1.05);
        }
    }
}

/* Small mobile adjustments for cards */
@@media (max-width: 576px) {
    .card-body-row[b-5233drv866] {
        grid-template-columns: 1fr;
    }

    .check-card[b-5233drv866] {
        padding: 1rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Sales/SalesEntry.razor.rz.scp.css */
/* Content Card */
.content-card[b-hz4i3blual] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Card Header */
.card-header-custom[b-hz4i3blual] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-hz4i3blual] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

    .card-title-custom i[b-hz4i3blual] {
        color: var(--secondary-color);
        font-size: 1.5rem;
    }

.card-subtitle-custom[b-hz4i3blual] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* Form Controls */
.form-label[b-hz4i3blual] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

    .form-label i[b-hz4i3blual] {
        color: var(--secondary-color);
    }

.form-control-custom[b-hz4i3blual], .form-select-custom[b-hz4i3blual] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control-custom:focus[b-hz4i3blual], .form-select-custom:focus[b-hz4i3blual] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

/* Section Divider */
.section-divider[b-hz4i3blual] {
    margin: 2rem 0 1.5rem;
    padding-top: 1.5rem;
    border-top: 2px dashed #dee2e6;
}

.section-title[b-hz4i3blual] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1.1rem;
    display: flex;
    align-items: center;
}

    .section-title i[b-hz4i3blual] {
        color: var(--secondary-color);
    }

/* Totals Display */
.totals-display[b-hz4i3blual] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid var(--secondary-color);
    border-radius: 12px;
    padding: 1.25rem;
    margin-top: 1.85rem;
}

.total-item[b-hz4i3blual] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
}

    .total-item.balance[b-hz4i3blual] {
        border-top: 2px solid var(--primary-color);
        padding-top: 1rem;
        margin-top: 0.5rem;
    }

.total-label[b-hz4i3blual] {
    font-weight: 600;
    color: #495057;
    font-size: 0.95rem;
}

.total-value[b-hz4i3blual] {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--primary-color);
}

/* Action Buttons */
.action-buttons-container[b-hz4i3blual] {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 2px solid #f1f3f5;
}

.btn[b-hz4i3blual] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-hz4i3blual] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

    .btn-primary:hover[b-hz4i3blual] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.btn-secondary[b-hz4i3blual] {
    background-color: #6c757d;
    border: none;
}

    .btn-secondary:hover[b-hz4i3blual] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

.btn-warning[b-hz4i3blual] {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #495057;
    border: none;
}

    .btn-warning:hover[b-hz4i3blual] {
        background: linear-gradient(135deg, #e0a800 0%, #ffc107 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(255, 193, 7, 0.4);
        color: #495057;
    }

.btn-info[b-hz4i3blual] {
    background: linear-gradient(135deg, #0dcaf0 0%, #0aa2c0 100%);
    color: white;
    border: none;
}

    .btn-info:hover[b-hz4i3blual] {
        background: linear-gradient(135deg, #0aa2c0 0%, #0dcaf0 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(13, 202, 240, 0.4);
        color: white;
    }

/* Page Header */
.page-header[b-hz4i3blual] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-hz4i3blual] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

    .page-title i[b-hz4i3blual] {
        color: var(--secondary-color);
        font-size: 2rem;
    }

.breadcrumb[b-hz4i3blual] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-hz4i3blual]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-hz4i3blual] {
    color: var(--primary-color);
    text-decoration: none;
}

    .breadcrumb-item a:hover[b-hz4i3blual] {
        color: var(--secondary-color);
    }

.breadcrumb-item.active[b-hz4i3blual] {
    color: #6c757d;
}

/* Print Voucher Styles */
.print-voucher[b-hz4i3blual] {
    padding: 40px;
    background: #e8f0f8;
    font-family: Arial, sans-serif;
}

.voucher-header[b-hz4i3blual] {
    text-align: center;
    margin-bottom: 10px;
}

.company-name[b-hz4i3blual] {
    font-size: 24px;
    font-weight: bold;
    margin: 0;
    color: #000;
}

.company-address[b-hz4i3blual] {
    font-size: 16px;
    margin: 5px 0 0;
    color: #000;
}

.document-title[b-hz4i3blual] {
    text-align: center;
    margin: 20px 0;
}

    .document-title h4[b-hz4i3blual] {
        font-size: 20px;
        font-weight: bold;
        margin: 0;
        color: #000;
    }

.voucher-divider[b-hz4i3blual] {
    border: none;
    border-top: 2px solid #000;
    margin: 20px 0;
}

.voucher-details[b-hz4i3blual] {
    margin: 25px 0;
}

.detail-row[b-hz4i3blual] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
}

.detail-item[b-hz4i3blual] {
    flex: 1;
    display: flex;
    gap: 10px;
}

    .detail-item.full-width[b-hz4i3blual] {
        flex: 2;
    }

.detail-label[b-hz4i3blual] {
    font-weight: bold;
    min-width: 80px;
    color: #000;
}

.detail-value[b-hz4i3blual] {
    color: #000;
}

.particulars-section[b-hz4i3blual] {
    margin: 25px 0;
}

.section-heading[b-hz4i3blual] {
    font-weight: bold;
    margin-bottom: 15px;
    color: #000;
    font-size: 16px;
}

.particulars-table[b-hz4i3blual] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
    background: white;
}

    .particulars-table th[b-hz4i3blual],
    .particulars-table td[b-hz4i3blual] {
        border: 1px solid #000;
        padding: 10px;
        text-align: left;
        color: #000;
    }

    .particulars-table th[b-hz4i3blual] {
        background-color: #d0d0d0;
        font-weight: bold;
    }

    .particulars-table .text-end[b-hz4i3blual] {
        text-align: right;
    }

.signatures-section[b-hz4i3blual] {
    display: flex;
    justify-content: space-between;
    margin-top: 50px;
    gap: 20px;
}

.signature-box[b-hz4i3blual] {
    flex: 1;
    text-align: center;
}

.signature-label[b-hz4i3blual] {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 40px;
    color: #000;
}

.signature-line[b-hz4i3blual] {
    /*border-bottom: 2px solid #000;*/
    margin: 0 10px 8px;
}

.signature-name[b-hz4i3blual] {
    font-size: 13px;
    color: #000;
}

.signature-subtitle[b-hz4i3blual] {
    font-size: 11px;
    font-style: italic;
    margin-top: 5px;
    color: #000;
}

/* Modal Styles */
.modal-content[b-hz4i3blual] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-xl[b-hz4i3blual] {
    max-width: 900px;
}

.modal-header[b-hz4i3blual] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-hz4i3blual] {
    padding: 0;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-hz4i3blual] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* Toast */
.toast[b-hz4i3blual] {
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Accounting Entries Styles */
.accounting-entries-container[b-hz4i3blual] {
    background: white;
    border: 2px solid #e9ecef;
    border-radius: 12px;
    padding: 1.25rem;
    height: 100%;
    transition: all 0.3s ease;
}

    .accounting-entries-container:hover[b-hz4i3blual] {
        border-color: var(--secondary-color);
        box-shadow: 0 2px 8px rgba(212, 175, 55, 0.1);
    }

.entries-header[b-hz4i3blual] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #f1f3f5;
}

.entries-title[b-hz4i3blual] {
    color: var(--primary-color);
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
}

    .entries-title i[b-hz4i3blual] {
        color: var(--secondary-color);
    }

.btn-add-entry[b-hz4i3blual] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.4rem 0.8rem;
    font-size: 0.85rem;
    font-weight: 600;
    border-radius: 6px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

    .btn-add-entry:hover[b-hz4i3blual] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-1px);
        box-shadow: 0 3px 8px rgba(212, 175, 55, 0.4);
        color: var(--primary-color);
    }

.entry-row[b-hz4i3blual] {
    margin-bottom: 0.75rem;
}

.entry-fields[b-hz4i3blual] {
    display: grid;
    grid-template-columns: 2fr 1fr auto;
    gap: 0.5rem;
    align-items: start;
}

.entry-account input[b-hz4i3blual],
.entry-amount input[b-hz4i3blual] {
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 0.5rem;
    font-size: 0.9rem;
    transition: all 0.3s ease;
}

    .entry-account input:focus[b-hz4i3blual],
    .entry-amount input:focus[b-hz4i3blual] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.15rem rgba(212, 175, 55, 0.15);
        outline: none;
    }

.btn-remove-entry[b-hz4i3blual] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: white;
    border: none;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    transition: all 0.3s ease;
    font-size: 0.9rem;
}

    .btn-remove-entry:hover[b-hz4i3blual] {
        background: linear-gradient(135deg, #c82333 0%, #bd2130 100%);
        transform: scale(1.05);
        box-shadow: 0 2px 6px rgba(220, 53, 69, 0.4);
    }

.empty-entries-message[b-hz4i3blual] {
    text-align: center;
    padding: 2rem 1rem;
    color: #6c757d;
    font-size: 0.9rem;
    font-style: italic;
}

.entries-total[b-hz4i3blual] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 2px solid var(--primary-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .entries-total .total-label[b-hz4i3blual] {
        font-weight: 700;
        color: #495057;
        font-size: 1rem;
    }

    .entries-total .total-value[b-hz4i3blual] {
        font-weight: 700;
        font-size: 1.15rem;
        color: var(--primary-color);
    }

/* Validation Summary */
.validation-summary[b-hz4i3blual] {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border: 2px solid #dee2e6;
    border-radius: 12px;
    padding: 1.25rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    transition: all 0.3s ease;
}

    .validation-summary.balanced[b-hz4i3blual] {
        border-color: #28a745;
        background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
    }

    .validation-summary.unbalanced[b-hz4i3blual] {
        border-color: #dc3545;
        background: linear-gradient(135deg, #f8d7da 0%, #f5c6cb 100%);
    }

    .validation-summary.warning[b-hz4i3blual] {
        border-color: #ffc107;
        background: linear-gradient(135deg, #fff3cd 0%, #ffeaa7 100%);
    }

.validation-item[b-hz4i3blual] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

    .validation-item.validation-status[b-hz4i3blual] {
        grid-column: 1 / -1;
        border-top: 2px solid rgba(0,0,0,0.1);
        padding-top: 1rem;
        margin-top: 0.5rem;
    }

.validation-label[b-hz4i3blual] {
    font-weight: 600;
    color: #495057;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.validation-value[b-hz4i3blual] {
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--primary-color);
}

    .validation-item.validation-status .validation-value[b-hz4i3blual] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 1rem;
    }

/* Print Preview Updates */
.particulars-section p[b-hz4i3blual] {
    margin: 0.5rem 0;
    font-size: 14px;
}

    .particulars-section p strong[b-hz4i3blual] {
        color: #000;
        font-weight: bold;
    }

.total-row[b-hz4i3blual] {
    background-color: #f0f0f0;
    font-weight: bold;
}

/* Responsive Design */
@media (max-width: 768px) {
    .page-title[b-hz4i3blual] {
        font-size: 1.5rem;
    }

    .content-card[b-hz4i3blual] {
        padding: 1.5rem;
    }

    .action-buttons-container[b-hz4i3blual] {
        flex-direction: column;
    }

        .action-buttons-container .btn[b-hz4i3blual] {
            width: 100%;
        }

    .totals-display[b-hz4i3blual] {
        margin-top: 0;
    }

    .signatures-section[b-hz4i3blual] {
        flex-wrap: wrap;
        gap: 30px;
    }

    .signature-box[b-hz4i3blual] {
        flex: 0 0 calc(50% - 15px);
    }

    .print-voucher[b-hz4i3blual] {
        padding: 20px;
    }

    .detail-row[b-hz4i3blual] {
        flex-direction: column;
        gap: 8px;
    }

    /* Mobile adjustments for accounting entries */
    .entry-fields[b-hz4i3blual] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .btn-remove-entry[b-hz4i3blual] {
        width: 100%;
    }

    .validation-summary[b-hz4i3blual] {
        grid-template-columns: 1fr;
    }

    .entries-header[b-hz4i3blual] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .btn-add-entry[b-hz4i3blual] {
        width: 100%;
        justify-content: center;
    }
}

@media print {
    body *[b-hz4i3blual] {
        visibility: hidden;
    }

    .print-voucher[b-hz4i3blual], .print-voucher *[b-hz4i3blual] {
        visibility: visible;
    }

    .print-voucher[b-hz4i3blual] {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        background: white;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Setup/InitialSetup.razor.rz.scp.css */
.setup-layout[b-bnxxjgc6l1] {
    min-height: 100vh;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
}

.setup-background[b-bnxxjgc6l1] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    z-index: -2;
}

.setup-overlay[b-bnxxjgc6l1] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at 20% 50%, rgba(255, 255, 255, 0.1) 0%, transparent 50%), radial-gradient(circle at 80% 80%, rgba(255, 255, 255, 0.1) 0%, transparent 50%);
    z-index: -1;
}

.setup-container[b-bnxxjgc6l1] {
    width: 100%;
    max-width: 1200px;
    position: relative;
    z-index: 1;
}

.setup-header[b-bnxxjgc6l1] {
    animation: fadeInDown-b-bnxxjgc6l1 0.6s ease-out;
}

.setup-logo[b-bnxxjgc6l1] {
    animation: rotateIn-b-bnxxjgc6l1 0.8s ease-out;
}

.setup-icon[b-bnxxjgc6l1] {
    font-size: 5rem;
    color: #fff;
    filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.2));
    animation: pulse-b-bnxxjgc6l1 2s ease-in-out infinite;
}

.setup-title[b-bnxxjgc6l1] {
    color: #fff;
    font-weight: 700;
    font-size: 2.5rem;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    margin-bottom: 0.5rem;
}

.setup-subtitle[b-bnxxjgc6l1] {
    color: rgba(255, 255, 255, 0.9);
    font-size: 1.2rem;
    font-weight: 300;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.setup-content[b-bnxxjgc6l1] {
    animation: fadeInUp-b-bnxxjgc6l1 0.6s ease-out 0.2s both;
}

.setup-footer[b-bnxxjgc6l1] {
    color: rgba(255, 255, 255, 0.7);
    animation: fadeIn-b-bnxxjgc6l1 0.6s ease-out 0.4s both;
}

    .setup-footer small[b-bnxxjgc6l1] {
        color: rgba(255, 255, 255, 0.8);
        font-size: 0.875rem;
    }

/* Animations */
@keyframes fadeInDown-b-bnxxjgc6l1 {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInUp-b-bnxxjgc6l1 {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeIn-b-bnxxjgc6l1 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes rotateIn-b-bnxxjgc6l1 {
    from {
        opacity: 0;
        transform: rotate(-180deg) scale(0.5);
    }

    to {
        opacity: 1;
        transform: rotate(0) scale(1);
    }
}

@keyframes pulse-b-bnxxjgc6l1 {
    0%, 100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }
}

/* Responsive Design */
@media (max-width: 768px) {
    .setup-layout[b-bnxxjgc6l1] {
        padding: 1rem;
    }

    .setup-icon[b-bnxxjgc6l1] {
        font-size: 3.5rem;
    }

    .setup-title[b-bnxxjgc6l1] {
        font-size: 2rem;
    }

    .setup-subtitle[b-bnxxjgc6l1] {
        font-size: 1rem;
    }
}

/* Override card styles for better contrast on colored background */
.setup-content .card[b-bnxxjgc6l1] {
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
    border: none;
}

.setup-content .card-header[b-bnxxjgc6l1] {
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
}

/* Enhance alert visibility */
.setup-content .alert[b-bnxxjgc6l1] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
/* _content/AccountingSystem.Web/Components/Pages/Setup/TenantList.razor.rz.scp.css */

/* ==================== CONTENT CARD ==================== */
.content-card[b-2nd7d0qgvm] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    margin-bottom: 1.5rem;
}

/* ==================== TABLE ==================== */
.tenant-table[b-2nd7d0qgvm] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin: 0;
}

.tenant-table thead th[b-2nd7d0qgvm] {
    background: linear-gradient(135deg, var(--primary-color), #6d0000);
    color: white;
    padding: 0.875rem 1rem;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: none;
    white-space: nowrap;
}

.tenant-table thead th:first-child[b-2nd7d0qgvm] {
    border-radius: 12px 0 0 0;
}

.tenant-table thead th:last-child[b-2nd7d0qgvm] {
    border-radius: 0 12px 0 0;
}

.tenant-table tbody td[b-2nd7d0qgvm] {
    padding: 0.875rem 1rem;
    vertical-align: middle;
    border-bottom: 1px solid #e9ecef;
    font-size: 0.9rem;
}

.tenant-table tbody tr.main-row:hover[b-2nd7d0qgvm] {
    background: #f8f9fa;
}

/* ==================== TENANT INFO (combined logo + name + code) ==================== */
.tenant-info[b-2nd7d0qgvm] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.tenant-logo[b-2nd7d0qgvm] {
    width: 38px;
    height: 38px;
    object-fit: contain;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    flex-shrink: 0;
}

.tenant-logo-fallback[b-2nd7d0qgvm] {
    width: 38px;
    height: 38px;
    border-radius: 8px;
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #adb5bd;
    font-size: 1.1rem;
}

.tenant-details[b-2nd7d0qgvm] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.tenant-name[b-2nd7d0qgvm] {
    font-weight: 600;
    color: #212529;
    font-size: 0.9rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tenant-code-badge[b-2nd7d0qgvm] {
    background: rgba(139, 0, 0, 0.1);
    color: var(--primary-color);
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    width: fit-content;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== BADGES ==================== */
.badge-admin[b-2nd7d0qgvm] {
    background: rgba(218, 165, 32, 0.15);
    color: #b8860b;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.3rem 0.6rem;
    border-radius: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge-client[b-2nd7d0qgvm] {
    background: rgba(108, 117, 125, 0.12);
    color: #495057;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.3rem 0.6rem;
    border-radius: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge-active[b-2nd7d0qgvm] {
    background: rgba(25, 135, 84, 0.12);
    color: #198754;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.3rem 0.6rem;
    border-radius: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge-inactive[b-2nd7d0qgvm] {
    background: rgba(108, 117, 125, 0.12);
    color: #6c757d;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.3rem 0.6rem;
    border-radius: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== EXPAND BUTTON ==================== */
.btn-expand[b-2nd7d0qgvm] {
    background: none;
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    color: var(--primary-color);
    transition: all 0.3s ease;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-expand i[b-2nd7d0qgvm] {
    font-size: 1rem;
    transition: transform 0.3s ease;
}

.btn-expand.expanded i[b-2nd7d0qgvm] {
    transform: rotate(90deg);
}

.btn-expand:hover[b-2nd7d0qgvm] {
    background: rgba(139, 0, 0, 0.1);
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-2nd7d0qgvm] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-2nd7d0qgvm] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

.btn-action-icon:hover[b-2nd7d0qgvm] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-edit:hover[b-2nd7d0qgvm] {
    background: #0056b3;
    color: white;
}

.btn-action-icon.btn-delete:hover[b-2nd7d0qgvm] {
    background: #dc3545;
    color: white;
}

/* ==================== EXPANDABLE ROW ==================== */
.expandable-row[b-2nd7d0qgvm] {
    background: #f8f9fa;
}

.expandable-row td[b-2nd7d0qgvm] {
    padding: 0 !important;
}

.expanded-content[b-2nd7d0qgvm] {
    padding: 1.5rem;
    border-top: 2px solid var(--secondary-color);
}

/* ==================== DETAIL SECTIONS ==================== */
.detail-section[b-2nd7d0qgvm] {
    margin-bottom: 1.5rem;
}

.detail-section:last-child[b-2nd7d0qgvm] {
    margin-bottom: 0;
}

.section-title[b-2nd7d0qgvm] {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 1rem;
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #dee2e6;
}

.section-title i[b-2nd7d0qgvm] {
    color: var(--secondary-color);
}

.detail-grid[b-2nd7d0qgvm] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

.detail-item[b-2nd7d0qgvm] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.detail-item label[b-2nd7d0qgvm] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.detail-item label i[b-2nd7d0qgvm] {
    color: var(--secondary-color);
    font-size: 0.85rem;
}

.detail-item span[b-2nd7d0qgvm] {
    font-size: 0.9rem;
    color: #212529;
}

/* ==================== EMPTY STATE ==================== */
.alert-info[b-2nd7d0qgvm] {
    background: linear-gradient(135deg, #fff8e1, #fff3cd);
    border: 1px solid var(--secondary-color);
    color: #856404;
    border-radius: 8px;
    padding: 1.5rem;
    text-align: center;
    margin: 1.5rem;
}

/* ==================== RESPONSIVE ==================== */
@media (max-width: 768px) {
    .tenant-table thead[b-2nd7d0qgvm] {
        display: none;
    }

    .tenant-table tbody tr.main-row[b-2nd7d0qgvm] {
        display: block;
        padding: 1rem;
        border-bottom: 1px solid #e9ecef;
    }

    .tenant-table tbody td[b-2nd7d0qgvm] {
        display: block;
        padding: 0.25rem 0;
        border: none;
    }

    .action-buttons[b-2nd7d0qgvm] {
        margin-top: 0.75rem;
    }

    .detail-grid[b-2nd7d0qgvm] {
        grid-template-columns: 1fr;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Signatory/SignatoriesManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-r5u9b2e6u6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-r5u9b2e6u6] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-r5u9b2e6u6] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-r5u9b2e6u6] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-r5u9b2e6u6]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-r5u9b2e6u6] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-r5u9b2e6u6] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-r5u9b2e6u6] {
    color: #6c757d;
}

.add-new-btn[b-r5u9b2e6u6] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-r5u9b2e6u6] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-r5u9b2e6u6] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-r5u9b2e6u6] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-r5u9b2e6u6] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-r5u9b2e6u6] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-r5u9b2e6u6] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FORM CONTROLS ==================== */
.form-control-custom[b-r5u9b2e6u6],
.form-select-custom[b-r5u9b2e6u6] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-r5u9b2e6u6],
.form-select-custom:focus[b-r5u9b2e6u6] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.form-label[b-r5u9b2e6u6] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-r5u9b2e6u6] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.search-box[b-r5u9b2e6u6] {
    position: relative;
    width: 100%;
}

.search-box i[b-r5u9b2e6u6] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box input[b-r5u9b2e6u6] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-r5u9b2e6u6] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.search-box input:disabled[b-r5u9b2e6u6] {
    background-color: #e9ecef;
    cursor: not-allowed;
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-r5u9b2e6u6] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-r5u9b2e6u6] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-r5u9b2e6u6] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-r5u9b2e6u6] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-r5u9b2e6u6] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn-danger[b-r5u9b2e6u6] {
    background-color: #dc3545;
    color: white;
    border: none;
}

.btn-danger:hover[b-r5u9b2e6u6] {
    background-color: #bb2d3b;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(220, 53, 69, 0.3);
}

.btn:disabled[b-r5u9b2e6u6] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== TABLE STYLES ==================== */
.signatories-table-container[b-r5u9b2e6u6] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.signatories-table[b-r5u9b2e6u6] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.signatories-table thead[b-r5u9b2e6u6] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.signatories-table thead tr th[b-r5u9b2e6u6] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.signatories-table thead th:first-child[b-r5u9b2e6u6] {
    border-top-left-radius: 12px;
}

.signatories-table thead th:last-child[b-r5u9b2e6u6] {
    border-top-right-radius: 12px;
}

.signatories-table tbody tr[b-r5u9b2e6u6] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.signatories-table tbody tr:hover[b-r5u9b2e6u6] {
    background-color: #f8f9fa;
}

.signatories-table tbody td[b-r5u9b2e6u6] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

/* Badge Styles */
.badge[b-r5u9b2e6u6] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-r5u9b2e6u6] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-r5u9b2e6u6] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

.btn-action-icon:hover[b-r5u9b2e6u6] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-edit:hover[b-r5u9b2e6u6] {
    background: #0056b3;
    color: white;
}

.btn-action-icon.btn-delete:hover[b-r5u9b2e6u6] {
    background: #dc3545;
    color: white;
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-r5u9b2e6u6] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-r5u9b2e6u6] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-r5u9b2e6u6] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-r5u9b2e6u6] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== PAGINATION ==================== */
.pagination-wrapper[b-r5u9b2e6u6] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
}

.showing-entries[b-r5u9b2e6u6] {
    font-size: 0.9rem;
    color: #495057;
}

.showing-entries span[b-r5u9b2e6u6] {
    font-weight: 600;
    color: var(--primary-color);
}

.pagination[b-r5u9b2e6u6] {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

.page-item[b-r5u9b2e6u6] {
    margin: 0;
}

.page-link[b-r5u9b2e6u6] {
    padding: 0.5rem 0.75rem;
    border: 1px solid #dee2e6;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

.page-link:hover:not(:disabled)[b-r5u9b2e6u6] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

.page-item.active .page-link[b-r5u9b2e6u6] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

.page-item.disabled .page-link[b-r5u9b2e6u6] {
    opacity: 0.5;
    cursor: not-allowed;
}

.page-link:disabled[b-r5u9b2e6u6] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ==================== ALERTS ==================== */
.alert[b-r5u9b2e6u6] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-r5u9b2e6u6] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-r5u9b2e6u6] {
    color: var(--secondary-color);
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
    .page-title[b-r5u9b2e6u6] {
        font-size: 1.5rem;
    }

    .content-card[b-r5u9b2e6u6] {
        padding: 1.5rem;
    }

    .filter-section[b-r5u9b2e6u6] {
        padding: 0.75rem;
    }

    .action-buttons[b-r5u9b2e6u6] {
        flex-wrap: wrap;
    }

    .signatories-table thead th[b-r5u9b2e6u6],
    .signatories-table tbody td[b-r5u9b2e6u6] {
        padding: 0.75rem 0.5rem;
    }
}

@media (max-width: 576px) {
    .page-header[b-r5u9b2e6u6] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-r5u9b2e6u6] {
        width: 100%;
        justify-content: center;
    }

    .pagination-wrapper[b-r5u9b2e6u6] {
        flex-direction: column;
        gap: 1rem;
    }

    .pagination[b-r5u9b2e6u6] {
        flex-wrap: wrap;
        justify-content: center;
    }

    .page-link[b-r5u9b2e6u6] {
        padding: 0.4rem 0.6rem;
        font-size: 0.8rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/Status/StatusManagement.razor.rz.scp.css */
/* ==================== PAGE HEADER & BREADCRUMB ==================== */
.page-header[b-2au8ppah34] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 3px solid var(--primary-color);
}

.page-title[b-2au8ppah34] {
    color: var(--primary-color);
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.page-title i[b-2au8ppah34] {
    color: var(--secondary-color);
    font-size: 2rem;
}

.breadcrumb[b-2au8ppah34] {
    background: none;
    padding: 0;
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
}

.breadcrumb-item + .breadcrumb-item[b-2au8ppah34]::before {
    color: #6c757d;
}

.breadcrumb-item a[b-2au8ppah34] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-2au8ppah34] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-2au8ppah34] {
    color: #6c757d;
}

.add-new-btn[b-2au8ppah34] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.add-new-btn:hover[b-2au8ppah34] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

/* ==================== CONTENT CARD ==================== */
.content-card[b-2au8ppah34] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-header-custom[b-2au8ppah34] {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 2px solid #f1f3f5;
}

.card-title-custom[b-2au8ppah34] {
    color: var(--primary-color);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.card-title-custom i[b-2au8ppah34] {
    color: var(--secondary-color);
    font-size: 1.5rem;
}

.card-subtitle-custom[b-2au8ppah34] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ==================== FORM CONTROLS ==================== */
.form-control-custom[b-2au8ppah34],
.form-select-custom[b-2au8ppah34] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.form-control-custom:focus[b-2au8ppah34],
.form-select-custom:focus[b-2au8ppah34] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.form-label[b-2au8ppah34] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
}

/* ==================== SEARCH & FILTER ==================== */
.filter-section[b-2au8ppah34] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 8px;
}

.search-box[b-2au8ppah34] {
    position: relative;
    width: 100%;
}

.search-box i[b-2au8ppah34] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.search-box input[b-2au8ppah34] {
    width: 100%;
    padding: 0.65rem 1rem 0.65rem 2.5rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.search-box input:focus[b-2au8ppah34] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
}

.search-box input:disabled[b-2au8ppah34] {
    background-color: #e9ecef;
    cursor: not-allowed;
}

/* ==================== BUTTON STYLES ==================== */
.btn[b-2au8ppah34] {
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-2au8ppah34] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-2au8ppah34] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-2au8ppah34] {
    background-color: #6c757d;
    color: white;
    border: none;
}

.btn-secondary:hover[b-2au8ppah34] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn-danger[b-2au8ppah34] {
    background-color: #dc3545;
    color: white;
    border: none;
}

.btn-danger:hover[b-2au8ppah34] {
    background-color: #bb2d3b;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(220, 53, 69, 0.3);
}

.btn:disabled[b-2au8ppah34] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ==================== TABLE STYLES ==================== */
.statuses-table-container[b-2au8ppah34] {
    overflow-x: auto;
    border-radius: 12px;
    background: white;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.statuses-table[b-2au8ppah34] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.statuses-table thead[b-2au8ppah34] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white;
}

.statuses-table thead tr th[b-2au8ppah34] {
    padding: 1rem 0.75rem;
    font-weight: 600;
    text-align: left;
    border: none;
    white-space: nowrap;
    font-size: 0.9rem;
}

.statuses-table thead th:first-child[b-2au8ppah34] {
    border-top-left-radius: 12px;
}

.statuses-table thead th:last-child[b-2au8ppah34] {
    border-top-right-radius: 12px;
}

.statuses-table tbody tr[b-2au8ppah34] {
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.statuses-table tbody tr:hover[b-2au8ppah34] {
    background-color: #f8f9fa;
}

.statuses-table tbody td[b-2au8ppah34] {
    padding: 0.875rem 0.75rem;
    vertical-align: middle;
    font-size: 0.9rem;
    color: #495057;
}

/* Badge Styles */
.badge[b-2au8ppah34] {
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ==================== ACTION BUTTONS ==================== */
.action-buttons[b-2au8ppah34] {
    display: flex;
    gap: 0.5rem;
}

.btn-action-icon[b-2au8ppah34] {
    background: var(--secondary-color);
    border: none;
    color: var(--primary-color);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    font-size: 1rem;
    cursor: pointer;
}

.btn-action-icon:hover[b-2au8ppah34] {
    background: var(--primary-color);
    color: white;
    transform: scale(1.1);
}

.btn-action-icon.btn-edit:hover[b-2au8ppah34] {
    background: #0056b3;
    color: white;
}

.btn-action-icon.btn-delete:hover[b-2au8ppah34] {
    background: #dc3545;
    color: white;
}

/* ==================== MODAL STYLES ==================== */
.modal-content[b-2au8ppah34] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.modal-header[b-2au8ppah34] {
    padding: 1.5rem;
    border-bottom: 2px solid #dee2e6;
}

.modal-body[b-2au8ppah34] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.modal-footer[b-2au8ppah34] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

/* ==================== PAGINATION ==================== */
.pagination-wrapper[b-2au8ppah34] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 1rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 0 0 12px 12px;
    margin-top: 1rem;
}

.showing-entries[b-2au8ppah34] {
    font-size: 0.9rem;
    color: #495057;
}

.showing-entries span[b-2au8ppah34] {
    font-weight: 600;
    color: var(--primary-color);
}

.pagination[b-2au8ppah34] {
    display: flex;
    gap: 0.25rem;
    margin: 0;
    list-style: none;
    padding: 0;
}

.page-item[b-2au8ppah34] {
    margin: 0;
}

.page-link[b-2au8ppah34] {
    padding: 0.5rem 0.75rem;
    border: 1px solid #dee2e6;
    background: white;
    color: var(--primary-color);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
}

.page-link:hover:not(:disabled)[b-2au8ppah34] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
}

.page-item.active .page-link[b-2au8ppah34] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

.page-item.disabled .page-link[b-2au8ppah34] {
    opacity: 0.5;
    cursor: not-allowed;
}

.page-link:disabled[b-2au8ppah34] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ==================== ALERTS ==================== */
.alert[b-2au8ppah34] {
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.alert-info[b-2au8ppah34] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
}

.alert-info i[b-2au8ppah34] {
    color: var(--secondary-color);
}

/* ==================== RESPONSIVE DESIGN ==================== */
@media (max-width: 768px) {
    .page-title[b-2au8ppah34] {
        font-size: 1.5rem;
    }

    .content-card[b-2au8ppah34] {
        padding: 1.5rem;
    }

    .filter-section[b-2au8ppah34] {
        padding: 0.75rem;
    }

    .action-buttons[b-2au8ppah34] {
        flex-wrap: wrap;
    }

    .statuses-table thead th[b-2au8ppah34],
    .statuses-table tbody td[b-2au8ppah34] {
        padding: 0.75rem 0.5rem;
    }
}

@media (max-width: 576px) {
    .page-header[b-2au8ppah34] {
        flex-direction: column;
        gap: 1rem;
    }

    .page-header .add-new-btn[b-2au8ppah34] {
        width: 100%;
        justify-content: center;
    }

    .pagination-wrapper[b-2au8ppah34] {
        flex-direction: column;
        gap: 1rem;
    }

    .pagination[b-2au8ppah34] {
        flex-wrap: wrap;
        justify-content: center;
    }

    .page-link[b-2au8ppah34] {
        padding: 0.4rem 0.6rem;
        font-size: 0.8rem;
    }
}
/* _content/AccountingSystem.Web/Components/Pages/UserManagement/AddUserModal.razor.rz.scp.css */

/* Add New Button */
.add-new-btn[b-wxmpotp8q7] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-wxmpotp8q7] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .add-new-btn i[b-wxmpotp8q7] {
        font-size: 1.1rem;
    }
/* Add New Button */
.add-new-btn[b-wxmpotp8q7] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-wxmpotp8q7] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .add-new-btn i[b-wxmpotp8q7] {
        font-size: 1.1rem;
    }

/* Content Card */
.content-card[b-wxmpotp8q7] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Search and Filter Bar */
.search-filter-bar[b-wxmpotp8q7] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-box[b-wxmpotp8q7] {
    position: relative;
    flex: 1;
    min-width: 250px;
    max-width: 400px;
}

    .search-box input[b-wxmpotp8q7] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-wxmpotp8q7] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-wxmpotp8q7] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.filter-group[b-wxmpotp8q7] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.entries-select[b-wxmpotp8q7] {
    padding: 0.5rem 1rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .entries-select:focus[b-wxmpotp8q7] {
        outline: none;
        border-color: var(--secondary-color);
    }

/* Table Styles */
.positions-table[b-wxmpotp8q7] {
    width: 100%;
    margin-top: 1rem;
}

    .positions-table thead[b-wxmpotp8q7] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .positions-table thead th[b-wxmpotp8q7] {
            color: white;
            font-weight: 600;
            padding: 1rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.85rem;
            letter-spacing: 0.5px;
        }

    .positions-table tbody tr[b-wxmpotp8q7] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .positions-table tbody tr:hover[b-wxmpotp8q7] {
            background-color: #f8f9fa;
            transform: scale(1.01);
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
        }

    .positions-table tbody td[b-wxmpotp8q7] {
        padding: 1rem;
        vertical-align: middle;
    }

.position-name[b-wxmpotp8q7] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 1rem;
}

.position-description[b-wxmpotp8q7] {
    color: #6c757d;
    font-size: 0.9rem;
    line-height: 1.5;
}

/* Action Buttons */
.action-buttons[b-wxmpotp8q7] {
    display: flex;
    gap: 0.5rem;
}

.btn-action[b-wxmpotp8q7] {
    padding: 0.5rem 0.75rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-edit[b-wxmpotp8q7] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-wxmpotp8q7] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

.btn-delete[b-wxmpotp8q7] {
    background-color: #dc3545;
    color: white;
}

    .btn-delete:hover[b-wxmpotp8q7] {
        background-color: #bb2d3b;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
    }

/* Modal Styles */
.modal-content[b-wxmpotp8q7] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-wxmpotp8q7] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-wxmpotp8q7] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-wxmpotp8q7] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-wxmpotp8q7] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-wxmpotp8q7] {
            opacity: 1;
        }

.modal-body[b-wxmpotp8q7] {
    padding: 2rem;
}

.modal-footer[b-wxmpotp8q7] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.form-label[b-wxmpotp8q7] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.form-control[b-wxmpotp8q7], .form-select[b-wxmpotp8q7] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control:focus[b-wxmpotp8q7], .form-select:focus[b-wxmpotp8q7] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

.btn-primary[b-wxmpotp8q7] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-primary:hover[b-wxmpotp8q7] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    }

.btn-secondary[b-wxmpotp8q7] {
    background-color: #6c757d;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-secondary:hover[b-wxmpotp8q7] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

/* Pagination */
.pagination-wrapper[b-wxmpotp8q7] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-wxmpotp8q7] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-wxmpotp8q7] {
    margin: 0;
}

.page-link[b-wxmpotp8q7] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

    .page-link:hover[b-wxmpotp8q7] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
    }

.page-item.active .page-link[b-wxmpotp8q7] {
    color: #dee2e6;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Empty State */
.empty-state[b-wxmpotp8q7] {
    text-align: center;
    padding: 3rem 2rem;
    color: #6c757d;
}

    .empty-state i[b-wxmpotp8q7] {
        font-size: 4rem;
        color: #dee2e6;
        margin-bottom: 1rem;
    }



/* User avatar in table */
.dashboard-card[b-wxmpotp8q7] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

    .dashboard-card:hover[b-wxmpotp8q7] {
        transform: translateY(-5px);
        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    }

.card-icon[b-wxmpotp8q7] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-wxmpotp8q7] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-wxmpotp8q7] {
    color: #212529;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.card-change[b-wxmpotp8q7] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
}

    .card-change.positive[b-wxmpotp8q7] {
        color: #2E7D32;
    }

    .card-change i[b-wxmpotp8q7] {
        margin-right: 0.25rem;
    }

/* Enhanced modal styling */
.modal-lg[b-wxmpotp8q7] {
    max-width: 800px;
}

.alert-info[b-wxmpotp8q7] {
    background-color: #e3f2fd;
    border-color: #90caf9;
    color: #1565c0;
    border-radius: 8px;
}

.alert-warning[b-wxmpotp8q7] {
    border-radius: 8px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .dashboard-card[b-wxmpotp8q7] {
        margin-bottom: 1rem;
    }

    .card-value[b-wxmpotp8q7] {
        font-size: 1.5rem;
    }

    .filter-group[b-wxmpotp8q7] {
        flex-direction: column;
        width: 100%;
    }

        .filter-group select[b-wxmpotp8q7] {
            width: 100%;
        }
}
/* _content/AccountingSystem.Web/Components/Pages/UserManagement/DeleteUserModal.razor.rz.scp.css */

/* Add New Button */
.add-new-btn[b-4vxcifasve] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-4vxcifasve] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .add-new-btn i[b-4vxcifasve] {
        font-size: 1.1rem;
    }
/* Add New Button */
.add-new-btn[b-4vxcifasve] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-4vxcifasve] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .add-new-btn i[b-4vxcifasve] {
        font-size: 1.1rem;
    }

/* Content Card */
.content-card[b-4vxcifasve] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Search and Filter Bar */
.search-filter-bar[b-4vxcifasve] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-box[b-4vxcifasve] {
    position: relative;
    flex: 1;
    min-width: 250px;
    max-width: 400px;
}

    .search-box input[b-4vxcifasve] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-4vxcifasve] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-4vxcifasve] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.filter-group[b-4vxcifasve] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.entries-select[b-4vxcifasve] {
    padding: 0.5rem 1rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .entries-select:focus[b-4vxcifasve] {
        outline: none;
        border-color: var(--secondary-color);
    }

/* Table Styles */
.positions-table[b-4vxcifasve] {
    width: 100%;
    margin-top: 1rem;
}

    .positions-table thead[b-4vxcifasve] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .positions-table thead th[b-4vxcifasve] {
            color: white;
            font-weight: 600;
            padding: 1rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.85rem;
            letter-spacing: 0.5px;
        }

    .positions-table tbody tr[b-4vxcifasve] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .positions-table tbody tr:hover[b-4vxcifasve] {
            background-color: #f8f9fa;
            transform: scale(1.01);
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
        }

    .positions-table tbody td[b-4vxcifasve] {
        padding: 1rem;
        vertical-align: middle;
    }

.position-name[b-4vxcifasve] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 1rem;
}

.position-description[b-4vxcifasve] {
    color: #6c757d;
    font-size: 0.9rem;
    line-height: 1.5;
}

/* Action Buttons */
.action-buttons[b-4vxcifasve] {
    display: flex;
    gap: 0.5rem;
}

.btn-action[b-4vxcifasve] {
    padding: 0.5rem 0.75rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-edit[b-4vxcifasve] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-4vxcifasve] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

.btn-delete[b-4vxcifasve] {
    background-color: #dc3545;
    color: white;
}

    .btn-delete:hover[b-4vxcifasve] {
        background-color: #bb2d3b;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
    }

/* Modal Styles */
.modal-content[b-4vxcifasve] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-4vxcifasve] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-4vxcifasve] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-4vxcifasve] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-4vxcifasve] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-4vxcifasve] {
            opacity: 1;
        }

.modal-body[b-4vxcifasve] {
    padding: 2rem;
}

.modal-footer[b-4vxcifasve] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.form-label[b-4vxcifasve] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.form-control[b-4vxcifasve], .form-select[b-4vxcifasve] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control:focus[b-4vxcifasve], .form-select:focus[b-4vxcifasve] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

.btn-primary[b-4vxcifasve] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-primary:hover[b-4vxcifasve] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    }

.btn-secondary[b-4vxcifasve] {
    background-color: #6c757d;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-secondary:hover[b-4vxcifasve] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

/* Pagination */
.pagination-wrapper[b-4vxcifasve] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-4vxcifasve] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-4vxcifasve] {
    margin: 0;
}

.page-link[b-4vxcifasve] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

    .page-link:hover[b-4vxcifasve] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
    }

.page-item.active .page-link[b-4vxcifasve] {
    color: #dee2e6;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Empty State */
.empty-state[b-4vxcifasve] {
    text-align: center;
    padding: 3rem 2rem;
    color: #6c757d;
}

    .empty-state i[b-4vxcifasve] {
        font-size: 4rem;
        color: #dee2e6;
        margin-bottom: 1rem;
    }



/* User avatar in table */
.dashboard-card[b-4vxcifasve] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

    .dashboard-card:hover[b-4vxcifasve] {
        transform: translateY(-5px);
        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    }

.card-icon[b-4vxcifasve] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-4vxcifasve] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-4vxcifasve] {
    color: #212529;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.card-change[b-4vxcifasve] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
}

    .card-change.positive[b-4vxcifasve] {
        color: #2E7D32;
    }

    .card-change i[b-4vxcifasve] {
        margin-right: 0.25rem;
    }

/* Enhanced modal styling */
.modal-lg[b-4vxcifasve] {
    max-width: 800px;
}

.alert-info[b-4vxcifasve] {
    background-color: #e3f2fd;
    border-color: #90caf9;
    color: #1565c0;
    border-radius: 8px;
}

.alert-warning[b-4vxcifasve] {
    border-radius: 8px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .dashboard-card[b-4vxcifasve] {
        margin-bottom: 1rem;
    }

    .card-value[b-4vxcifasve] {
        font-size: 1.5rem;
    }

    .filter-group[b-4vxcifasve] {
        flex-direction: column;
        width: 100%;
    }

        .filter-group select[b-4vxcifasve] {
            width: 100%;
        }
}
/* _content/AccountingSystem.Web/Components/Pages/UserManagement/EditUserModal.razor.rz.scp.css */

/* Add New Button */
.add-new-btn[b-s6ti85vnbf] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-s6ti85vnbf] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .add-new-btn i[b-s6ti85vnbf] {
        font-size: 1.1rem;
    }
/* Add New Button */
.add-new-btn[b-s6ti85vnbf] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .add-new-btn:hover[b-s6ti85vnbf] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
    }

    .add-new-btn i[b-s6ti85vnbf] {
        font-size: 1.1rem;
    }

/* Content Card */
.content-card[b-s6ti85vnbf] {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Search and Filter Bar */
.search-filter-bar[b-s6ti85vnbf] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-box[b-s6ti85vnbf] {
    position: relative;
    flex: 1;
    min-width: 250px;
    max-width: 400px;
}

    .search-box input[b-s6ti85vnbf] {
        width: 100%;
        padding: 0.65rem 1rem 0.65rem 2.75rem;
        border: 2px solid #e9ecef;
        border-radius: 8px;
        font-size: 0.95rem;
        transition: all 0.3s ease;
    }

        .search-box input:focus[b-s6ti85vnbf] {
            outline: none;
            border-color: var(--secondary-color);
            box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
        }

    .search-box i[b-s6ti85vnbf] {
        position: absolute;
        left: 1rem;
        top: 50%;
        transform: translateY(-50%);
        color: #6c757d;
        font-size: 1.1rem;
    }

.filter-group[b-s6ti85vnbf] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.entries-select[b-s6ti85vnbf] {
    padding: 0.5rem 1rem;
    border: 2px solid #e9ecef;
    border-radius: 8px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .entries-select:focus[b-s6ti85vnbf] {
        outline: none;
        border-color: var(--secondary-color);
    }

/* Table Styles */
.positions-table[b-s6ti85vnbf] {
    width: 100%;
    margin-top: 1rem;
}

    .positions-table thead[b-s6ti85vnbf] {
        background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    }

        .positions-table thead th[b-s6ti85vnbf] {
            color: white;
            font-weight: 600;
            padding: 1rem;
            border: none;
            text-transform: uppercase;
            font-size: 0.85rem;
            letter-spacing: 0.5px;
        }

    .positions-table tbody tr[b-s6ti85vnbf] {
        border-bottom: 1px solid #e9ecef;
        transition: all 0.3s ease;
    }

        .positions-table tbody tr:hover[b-s6ti85vnbf] {
            background-color: #f8f9fa;
            transform: scale(1.01);
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
        }

    .positions-table tbody td[b-s6ti85vnbf] {
        padding: 1rem;
        vertical-align: middle;
    }

.position-name[b-s6ti85vnbf] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 1rem;
}

.position-description[b-s6ti85vnbf] {
    color: #6c757d;
    font-size: 0.9rem;
    line-height: 1.5;
}

/* Action Buttons */
.action-buttons[b-s6ti85vnbf] {
    display: flex;
    gap: 0.5rem;
}

.btn-action[b-s6ti85vnbf] {
    padding: 0.5rem 0.75rem;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-edit[b-s6ti85vnbf] {
    background-color: #0d6efd;
    color: white;
}

    .btn-edit:hover[b-s6ti85vnbf] {
        background-color: #0b5ed7;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(13, 110, 253, 0.3);
    }

.btn-delete[b-s6ti85vnbf] {
    background-color: #dc3545;
    color: white;
}

    .btn-delete:hover[b-s6ti85vnbf] {
        background-color: #bb2d3b;
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(220, 53, 69, 0.3);
    }

/* Modal Styles */
.modal-content[b-s6ti85vnbf] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-header[b-s6ti85vnbf] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    color: white;
    border-radius: 12px 12px 0 0;
    padding: 1.5rem;
    border-bottom: none;
}

    .modal-header .modal-title[b-s6ti85vnbf] {
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

        .modal-header .modal-title i[b-s6ti85vnbf] {
            color: var(--secondary-color);
            font-size: 1.5rem;
        }

    .modal-header .btn-close[b-s6ti85vnbf] {
        filter: brightness(0) invert(1);
        opacity: 0.8;
    }

        .modal-header .btn-close:hover[b-s6ti85vnbf] {
            opacity: 1;
        }

.modal-body[b-s6ti85vnbf] {
    padding: 2rem;
}

.modal-footer[b-s6ti85vnbf] {
    padding: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.form-label[b-s6ti85vnbf] {
    color: #495057;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.form-control[b-s6ti85vnbf], .form-select[b-s6ti85vnbf] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control:focus[b-s6ti85vnbf], .form-select:focus[b-s6ti85vnbf] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

.btn-primary[b-s6ti85vnbf] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-primary:hover[b-s6ti85vnbf] {
        background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    }

.btn-secondary[b-s6ti85vnbf] {
    background-color: #6c757d;
    border: none;
    padding: 0.65rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

    .btn-secondary:hover[b-s6ti85vnbf] {
        background-color: #5c636a;
        transform: translateY(-2px);
    }

/* Pagination */
.pagination-wrapper[b-s6ti85vnbf] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e9ecef;
}

.showing-entries[b-s6ti85vnbf] {
    color: #6c757d;
    font-size: 0.9rem;
}

.pagination[b-s6ti85vnbf] {
    margin: 0;
}

.page-link[b-s6ti85vnbf] {
    color: var(--primary-color);
    border: 1px solid #dee2e6;
    padding: 0.5rem 0.75rem;
    transition: all 0.3s ease;
}

    .page-link:hover[b-s6ti85vnbf] {
        background-color: var(--secondary-color);
        color: var(--primary-color);
        border-color: var(--secondary-color);
    }

.page-item.active .page-link[b-s6ti85vnbf] {
    color: #dee2e6;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Empty State */
.empty-state[b-s6ti85vnbf] {
    text-align: center;
    padding: 3rem 2rem;
    color: #6c757d;
}

    .empty-state i[b-s6ti85vnbf] {
        font-size: 4rem;
        color: #dee2e6;
        margin-bottom: 1rem;
    }



/* User avatar in table */
.dashboard-card[b-s6ti85vnbf] {
    background: white;
    border-radius: 12px;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid rgba(0,0,0,0.05);
    height: 100%;
}

    .dashboard-card:hover[b-s6ti85vnbf] {
        transform: translateY(-5px);
        box-shadow: 0 6px 20px rgba(0,0,0,0.12);
    }

.card-icon[b-s6ti85vnbf] {
    width: 60px;
    height: 60px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-s6ti85vnbf] {
    color: #6c757d;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-s6ti85vnbf] {
    color: #212529;
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.card-change[b-s6ti85vnbf] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
}

    .card-change.positive[b-s6ti85vnbf] {
        color: #2E7D32;
    }

    .card-change i[b-s6ti85vnbf] {
        margin-right: 0.25rem;
    }

/* Enhanced modal styling */
.modal-lg[b-s6ti85vnbf] {
    max-width: 800px;
}

.alert-info[b-s6ti85vnbf] {
    background-color: #e3f2fd;
    border-color: #90caf9;
    color: #1565c0;
    border-radius: 8px;
}

.alert-warning[b-s6ti85vnbf] {
    border-radius: 8px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .dashboard-card[b-s6ti85vnbf] {
        margin-bottom: 1rem;
    }

    .card-value[b-s6ti85vnbf] {
        font-size: 1.5rem;
    }

    .filter-group[b-s6ti85vnbf] {
        flex-direction: column;
        width: 100%;
    }

        .filter-group select[b-s6ti85vnbf] {
            width: 100%;
        }
}
/* _content/AccountingSystem.Web/Components/Pages/UserManagement/UserManagement.razor.rz.scp.css */
/* ======================================================
   PAGE HEADER
   ====================================================== */
.page-header[b-69b5ycbgki] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid #e9ecef;
}

.page-title[b-69b5ycbgki] {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--primary-color);
    margin: 0 0 0.2rem;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.page-title i[b-69b5ycbgki] {
    color: var(--secondary-color);
}

.breadcrumb[b-69b5ycbgki] {
    background: none;
    padding: 0;
    margin: 0.3rem 0 0;
    font-size: 0.85rem;
}

.breadcrumb-item + .breadcrumb-item[b-69b5ycbgki]::before {
    color: #adb5bd;
}

.breadcrumb-item a[b-69b5ycbgki] {
    color: var(--primary-color);
    text-decoration: none;
}

.breadcrumb-item a:hover[b-69b5ycbgki] {
    color: var(--secondary-color);
}

.breadcrumb-item.active[b-69b5ycbgki] {
    color: #6c757d;
}

/* ======================================================
   ADD NEW BUTTON
   ====================================================== */
.add-new-btn[b-69b5ycbgki] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border: none;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.9rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: opacity 0.2s, transform 0.15s;
    white-space: nowrap;
}

.add-new-btn:hover:not(:disabled)[b-69b5ycbgki] {
    opacity: 0.9;
    transform: translateY(-1px);
}

.add-new-btn:disabled[b-69b5ycbgki] {
    opacity: 0.55;
    cursor: not-allowed;
}

/* ======================================================
   STATISTICS CARDS
   ====================================================== */
.dashboard-card[b-69b5ycbgki] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    border: 1px solid #e9ecef;
    height: 100%;
    transition: box-shadow 0.2s, transform 0.2s;
}

.dashboard-card:hover[b-69b5ycbgki] {
    transform: translateY(-3px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
}

.card-icon[b-69b5ycbgki] {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    margin-bottom: 1rem;
    color: white;
}

.card-title[b-69b5ycbgki] {
    color: #6c757d;
    font-size: 0.8rem;
    font-weight: 600;
    margin-bottom: 0.4rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.card-value[b-69b5ycbgki] {
    color: #212529;
    font-size: 1.85rem;
    font-weight: 700;
    margin-bottom: 0.4rem;
    line-height: 1;
}

.card-change[b-69b5ycbgki] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.card-change.positive[b-69b5ycbgki] {
    color: #2E7D32;
}

/* ======================================================
   CONTENT CARD
   ====================================================== */
.content-card[b-69b5ycbgki] {
    background: white;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    border: 1px solid #e9ecef;
}

/* ======================================================
   SEARCH AND FILTER BAR
   ====================================================== */
.search-filter-bar[b-69b5ycbgki] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.25rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.search-box[b-69b5ycbgki] {
    position: relative;
    flex: 1;
    min-width: 200px;
    max-width: 380px;
}

.search-box i[b-69b5ycbgki] {
    position: absolute;
    left: 0.85rem;
    top: 50%;
    transform: translateY(-50%);
    color: #adb5bd;
    font-size: 0.9rem;
    pointer-events: none;
}

.search-box input[b-69b5ycbgki] {
    width: 100%;
    padding: 0.6rem 1rem 0.6rem 2.5rem;
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    font-size: 0.9rem;
    transition: border-color 0.2s, box-shadow 0.2s;
    background: #fff;
    color: #212529;
}

.search-box input:focus[b-69b5ycbgki] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.12);
}

.search-box input[b-69b5ycbgki]::placeholder {
    color: #adb5bd;
}

.filter-group[b-69b5ycbgki] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.entries-select[b-69b5ycbgki] {
    padding: 0.55rem 0.85rem;
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    font-size: 0.875rem;
    cursor: pointer;
    transition: border-color 0.2s, box-shadow 0.2s;
    background: #fff;
    color: #212529;
}

.entries-select:focus[b-69b5ycbgki] {
    outline: none;
    border-color: var(--secondary-color);
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.12);
}

/* ======================================================
   TABLE
   ====================================================== */
.positions-table[b-69b5ycbgki] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin-bottom: 0;
}

.positions-table thead th[b-69b5ycbgki] {
    background: var(--primary-color);
    color: #fff;
    font-weight: 600;
    padding: 0.85rem 1rem;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: none;
    white-space: nowrap;
}

.positions-table thead th:first-child[b-69b5ycbgki] {
    border-radius: 8px 0 0 0;
}

.positions-table thead th:last-child[b-69b5ycbgki] {
    border-radius: 0 8px 0 0;
}

.positions-table tbody tr[b-69b5ycbgki] {
    transition: background 0.15s;
    vertical-align: middle;
}

.positions-table tbody tr:hover[b-69b5ycbgki] {
    background-color: #f8f9fa;
}

.positions-table tbody td[b-69b5ycbgki] {
    padding: 0.85rem 1rem;
    vertical-align: middle;
    color: #495057;
    font-size: 0.9rem;
    border-bottom: 1px solid #f0f0f0;
}

.positions-table tbody tr:last-child td[b-69b5ycbgki] {
    border-bottom: none;
}

.position-name[b-69b5ycbgki] {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 0.92rem;
}

/* ======================================================
   BADGES
   ====================================================== */
.badge[b-69b5ycbgki] {
    font-size: 0.72rem;
    padding: 0.28rem 0.65rem;
    border-radius: 8px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: inline-block;
}

.badge.bg-secondary[b-69b5ycbgki] {
    background: rgba(108, 117, 125, 0.12) !important;
    color: #5a636a;
    border: 1px solid rgba(108, 117, 125, 0.25);
}

/* ======================================================
   BUTTONS — .btn must come BEFORE .btn-action-icon
   ====================================================== */
.btn[b-69b5ycbgki] {
    padding: 0.6rem 1.25rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.9rem;
    cursor: pointer;
}

.btn-primary[b-69b5ycbgki] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border: none;
}

.btn-primary:hover[b-69b5ycbgki] {
    opacity: 0.9;
    transform: translateY(-1px);
    color: var(--primary-color);
}

.btn-secondary[b-69b5ycbgki] {
    background: #6c757d;
    color: #fff;
    border: none;
}

.btn-secondary:hover[b-69b5ycbgki] {
    background: #5c636a;
    transform: translateY(-1px);
    color: #fff;
}

.btn-danger[b-69b5ycbgki] {
    background: #dc3545;
    color: #fff;
    border: none;
}

.btn-danger:hover[b-69b5ycbgki] {
    background: #bb2d3b;
    transform: translateY(-1px);
}

.btn:disabled[b-69b5ycbgki] {
    opacity: 0.55;
    cursor: not-allowed;
    transform: none !important;
}

/* ── Action icon buttons — AFTER .btn:disabled ── */
.action-buttons[b-69b5ycbgki] {
    display: flex;
    gap: 0.4rem;
    align-items: center;
}

.btn-action-icon[b-69b5ycbgki] {
    width: 36px;
    height: 36px;
    padding: 0;
    border-radius: 50%;
    background: var(--secondary-color);
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.82rem;
    color: var(--primary-color);
    cursor: pointer;
    transition: background 0.18s, transform 0.15s;
    flex-shrink: 0;
}

.btn-action-icon:disabled[b-69b5ycbgki] {
    opacity: 0.45;
    cursor: not-allowed;
    transform: none !important;
}

.btn-edit:hover:not(:disabled)[b-69b5ycbgki] {
    background: #0d6efd;
    color: #fff;
}

.btn-delete:hover:not(:disabled)[b-69b5ycbgki] {
    background: #dc3545;
    color: #fff;
}

/* ======================================================
   ALERTS
   ====================================================== */
.alert-info[b-69b5ycbgki] {
    background: linear-gradient(135deg, #fff8e1 0%, #fff3cd 100%);
    border: 1px solid var(--secondary-color);
    color: var(--primary-color);
    border-radius: 10px;
    padding: 0.9rem 1.1rem;
}

.alert-info i[b-69b5ycbgki] {
    color: var(--secondary-color);
}

.alert-danger[b-69b5ycbgki] {
    border-radius: 8px;
    padding: 0.9rem 1.1rem;
}

.alert-warning[b-69b5ycbgki] {
    border-radius: 8px;
}

/* ======================================================
   PAGINATION
   ====================================================== */
.pagination-wrapper[b-69b5ycbgki] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid #e9ecef;
    gap: 2rem;
    border-radius: 0 0 12px 12px;
    flex-wrap: wrap;
}

.showing-entries[b-69b5ycbgki] {
    color: #6c757d;
    font-size: 0.875rem;
}

.showing-entries span[b-69b5ycbgki] {
    font-weight: 600;
    color: #495057;
}

.pagination[b-69b5ycbgki] {
    margin: 0;
    display: flex;
    gap: 0.25rem;
    list-style: none;
    padding: 0;
}

.page-link[b-69b5ycbgki] {
    color: var(--primary-color);
    border: 1.5px solid #e2e8f0;
    border-radius: 6px;
    padding: 0.4rem 0.75rem;
    font-size: 0.875rem;
    transition: background 0.15s, border-color 0.15s;
    background: #fff;
    cursor: pointer;
    display: inline-block;
}

.page-link:hover[b-69b5ycbgki] {
    background: var(--secondary-color);
    color: var(--primary-color);
    border-color: var(--secondary-color);
}

.page-item.active .page-link[b-69b5ycbgki] {
    background: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
}

.page-item.disabled .page-link[b-69b5ycbgki] {
    color: #adb5bd;
    pointer-events: none;
    opacity: 0.6;
}

/* ======================================================
   RESPONSIVE
   ====================================================== */
@media (max-width: 768px) {
    .page-header[b-69b5ycbgki] {
        flex-direction: column;
        gap: 0.75rem;
    }

    .content-card[b-69b5ycbgki] {
        padding: 1rem;
    }

    .search-filter-bar[b-69b5ycbgki] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-box[b-69b5ycbgki] {
        max-width: 100%;
    }

    .filter-group[b-69b5ycbgki] {
        flex-direction: column;
        align-items: stretch;
    }

    .entries-select[b-69b5ycbgki] {
        width: 100%;
    }

    .add-new-btn[b-69b5ycbgki] {
        width: 100%;
        justify-content: center;
    }

    .pagination-wrapper[b-69b5ycbgki] {
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
    }

    .card-value[b-69b5ycbgki] {
        font-size: 1.5rem;
    }
}
/* _content/AccountingSystem.Web/Components/Shared/AutocompleteInput.razor.rz.scp.css */
/* ============================================================
   AutocompleteInput — Mobile-first custom autocomplete
   Replaces <datalist> for full iOS/Android support
   ============================================================ */

/* Backdrop — fixed overlay to capture outside clicks/taps */
.autocomplete-backdrop[b-2n8tjn2t75] {
	position: fixed;
	inset: 0;
	z-index: 499;
	background: transparent;
}

/* Wrapper — establishes stacking context above backdrop when open */
.autocomplete-wrapper[b-2n8tjn2t75] {
	position: relative;
}

.autocomplete-wrapper.is-open[b-2n8tjn2t75] {
	z-index: 500;
}

/* Input container — position:relative only; icon and clear btn are absolute */
.autocomplete-input-wrapper[b-2n8tjn2t75] {
	position: relative;
}

/* Search icon inside input */
.autocomplete-search-icon[b-2n8tjn2t75] {
	position: absolute;
	left: 0.85rem;
	top: 50%;
	transform: translateY(-50%);
	color: #adb5bd;
	font-size: 0.85rem;
	pointer-events: none;
	z-index: 1;
}

/* Shift input text right to make room for search icon — normal size */
.autocomplete-input[b-2n8tjn2t75] {
	padding-left: 2.4rem !important;
	padding-right: 2.4rem !important;
}

/* Small variant — matches .entry-account input padding/font-size */
.autocomplete-input-sm[b-2n8tjn2t75] {
	padding: 0.5rem !important;
	padding-left: 1.7rem !important;
	padding-right: 1.5rem !important;
	font-size: 0.9rem !important;
}

.autocomplete-sm .autocomplete-search-icon[b-2n8tjn2t75] {
	font-size: 0.7rem;
	left: 0.45rem;
}

.autocomplete-sm .autocomplete-clear-btn[b-2n8tjn2t75] {
	right: 0.25rem;
	width: 16px;
	height: 16px;
	font-size: 0.6rem;
}

/* Clear (×) button inside input */
.autocomplete-clear-btn[b-2n8tjn2t75] {
	position: absolute;
	right: 0.65rem;
	top: 50%;
	transform: translateY(-50%);
	background: none;
	border: none;
	padding: 0.25rem;
	color: #adb5bd;
	font-size: 0.75rem;
	cursor: pointer;
	line-height: 1;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	width: 22px;
	height: 22px;
	transition: background 0.15s ease, color 0.15s ease;
}

.autocomplete-clear-btn:hover[b-2n8tjn2t75] {
	background: #f0f0f0;
	color: #495057;
}

/* Dropdown panel */
.autocomplete-dropdown[b-2n8tjn2t75] {
	position: absolute;
	top: calc(100% + 2px);
	left: 0;
	right: 0;
	background: #fff;
	border: 2px solid var(--secondary-color, #d4af37);
	border-radius: 0 0 10px 10px;
	max-height: 260px;
	overflow-y: auto;
	overflow-x: hidden;
	z-index: 501;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
	-webkit-overflow-scrolling: touch;
}

/* Dropdown items */
.autocomplete-item[b-2n8tjn2t75] {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	padding: 0.65rem 1rem;
	cursor: pointer;
	transition: background 0.15s ease;
	border-bottom: 1px solid #f0f0f0;
	-webkit-tap-highlight-color: transparent;
	user-select: none;
}

.autocomplete-item:last-child[b-2n8tjn2t75] {
	border-bottom: none;
}

/* Hover — subtle highlight */
.autocomplete-item:hover[b-2n8tjn2t75] {
	background: #f8f9fa;
}

/* Keyboard-active — strong, unmistakable highlight */
.autocomplete-item.is-active[b-2n8tjn2t75] {
	background: var(--secondary-color, #d4af37);
	border-left: 3px solid rgba(0, 0, 0, 0.15);
}

.autocomplete-item.is-active .autocomplete-item-label[b-2n8tjn2t75] {
	color: #000;
	font-weight: 600;
}

.autocomplete-item.is-active .autocomplete-item-description[b-2n8tjn2t75] {
	color: rgba(0, 0, 0, 0.65);
}

/* Currently selected value — checkmark indicator */
.autocomplete-item.is-selected[b-2n8tjn2t75] {
	position: relative;
	background: #fffbf0;
}

.autocomplete-item.is-selected[b-2n8tjn2t75]::after {
	content: '✓';
	position: absolute;
	right: 1rem;
	top: 50%;
	transform: translateY(-50%);
	color: var(--secondary-color, #d4af37);
	font-weight: 700;
}

/* Selected + active together */
.autocomplete-item.is-selected.is-active[b-2n8tjn2t75] {
	background: var(--secondary-color, #d4af37);
}

.autocomplete-item.is-selected.is-active[b-2n8tjn2t75]::after {
	color: rgba(0, 0, 0, 0.5);
}

/* Item text */
.autocomplete-item-label[b-2n8tjn2t75] {
	font-size: 0.9rem;
	font-weight: 500;
	color: #212529;
	line-height: 1.3;
}

.autocomplete-item-description[b-2n8tjn2t75] {
	font-size: 0.78rem;
	color: #6c757d;
	line-height: 1.2;
}

/* No results message */
.autocomplete-no-results[b-2n8tjn2t75] {
	padding: 1rem;
	text-align: center;
	color: #6c757d;
	font-size: 0.88rem;
}

/* Input open state — match top border radius to open panel */
.autocomplete-wrapper.is-open .autocomplete-input[b-2n8tjn2t75] {
	border-bottom-left-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
	border-color: var(--secondary-color, #d4af37) !important;
	box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15) !important;
}

/* Scrollbar styling for dropdown */
.autocomplete-dropdown[b-2n8tjn2t75]::-webkit-scrollbar {
	width: 4px;
}

.autocomplete-dropdown[b-2n8tjn2t75]::-webkit-scrollbar-track {
	background: #f8f9fa;
}

.autocomplete-dropdown[b-2n8tjn2t75]::-webkit-scrollbar-thumb {
	background: #dee2e6;
	border-radius: 2px;
}

/* Mobile touch target minimum size */
@media (max-width: 768px) {
	.autocomplete-item[b-2n8tjn2t75] {
		padding: 0.85rem 1rem;
		min-height: 48px;
		justify-content: center;
	}
}
/* _content/AccountingSystem.Web/Components/Shared/FailedModal.razor.rz.scp.css */
.failed-modal-content[b-ttnw62k96j] {
    border: none;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
}

.failed-modal-header[b-ttnw62k96j] {
    background: linear-gradient(135deg, #C62828 0%, #D32F2F 100%);
    border: none;
    padding: 1.5rem 1.5rem 1rem;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.failed-icon-wrapper[b-ttnw62k96j] {
    width: 65px;
    height: 65px;
    background: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 15px rgba(255, 255, 255, 0.3);
    animation: shake-error 0.5s ease-in-out;
}

.failed-icon[b-ttnw62k96j] {
    font-size: 2rem;
    color: #C62828;
}

@@keyframes shake-error {
    0%[b-ttnw62k96j], 100%[b-ttnw62k96j] {
        transform: translateX(0);
    }

    10%[b-ttnw62k96j], 30%[b-ttnw62k96j], 50%[b-ttnw62k96j], 70%[b-ttnw62k96j], 90%[b-ttnw62k96j] {
        transform: translateX(-5px);
    }

    20%[b-ttnw62k96j], 40%[b-ttnw62k96j], 60%[b-ttnw62k96j], 80%[b-ttnw62k96j] {
        transform: translateX(5px);
    }
}

.failed-modal-body[b-ttnw62k96j] {
    padding: 2rem 1.5rem;
    text-align: center;
    background: white;
}

.failed-title[b-ttnw62k96j] {
    color: #C62828;
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.failed-message[b-ttnw62k96j] {
    color: #6c757d;
    font-size: 1rem;
    line-height: 1.6;
    margin: 0;
}

/* Intro sentence shown above the bullet list */
.failed-intro[b-ttnw62k96j] {
    color: #495057;
    font-size: 0.95rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
}

/* Bullet list container — inline-block so the parent's text-align:center
   centers the list block, while text inside stays left-aligned */
.failed-error-list[b-ttnw62k96j] {
    list-style: none;
    display: inline-block;
    margin: 0;
    padding: 0;
    text-align: left;
    max-height: 260px;
    overflow-y: auto;
    max-width: 100%;
    min-width: min(100%, 220px);
}

    .failed-error-list li[b-ttnw62k96j] {
        position: relative;
        padding: 0.3rem 0.75rem 0.3rem 1.4rem;
        color: #6c757d;
        font-size: 0.9rem;
        line-height: 1.5;
        border-bottom: 1px solid #f0f0f0;
        white-space: normal;
    }

        .failed-error-list li:last-child[b-ttnw62k96j] {
            border-bottom: none;
        }

        .failed-error-list li[b-ttnw62k96j]::before {
            content: '•';
            position: absolute;
            left: 0;
            color: #C62828;
            font-weight: 700;
        }

.failed-modal-footer[b-ttnw62k96j] {
    background: #f8f9fa;
    border: none;
    padding: 1.5rem;
    display: flex;
    justify-content: center;
}

.btn-close-failed[b-ttnw62k96j] {
    background: linear-gradient(135deg, var(--primary-color) 0%, var(--accent-color) 100%);
    border: none;
    color: white;
    padding: 0.75rem 1.5rem;
    border-radius: 10px;
    font-weight: 700;
    font-size: 0.95rem;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(139, 0, 0, 0.3);
    display: flex;
    align-items: center;
}

    .btn-close-failed:hover[b-ttnw62k96j] {
        background: linear-gradient(135deg, var(--accent-color) 0%, var(--primary-color) 100%);
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(139, 0, 0, 0.4);
    }

    .btn-close-failed:active[b-ttnw62k96j] {
        transform: translateY(0);
    }

@@media (max-width: 576px) {
    .btn-close-failed[b-ttnw62k96j] {
        width: 100%;
        justify-content: center;
    }
}
/* _content/AccountingSystem.Web/Components/Shared/PrintModal.razor.rz.scp.css */
.btn[b-flcw3upqvv] {
padding: 0.65rem 1.5rem;
font-weight: 600;
border-radius: 8px;
transition: all 0.3s ease;
display: inline-flex;
align-items: center;
gap: 0.5rem;
}

.btn-primary[b-flcw3upqvv] {
background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
color: var(--primary-color);
border: none;
}

.btn-primary:hover[b-flcw3upqvv] {
    background: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-color) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.4);
    color: var(--primary-color);
}

.btn-secondary[b-flcw3upqvv] {
background-color: #6c757d;
border: none;
}

.btn-secondary:hover[b-flcw3upqvv] {
    background-color: #5c636a;
    transform: translateY(-2px);
}

.btn-warning[b-flcw3upqvv] {
background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
color: #495057;
border: none;
}

.btn-warning:hover[b-flcw3upqvv] {
    background: linear-gradient(135deg, #e0a800 0%, #ffc107 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(255, 193, 7, 0.4);
    color: #495057;
}

.btn-info[b-flcw3upqvv] {
background: linear-gradient(135deg, #0dcaf0 0%, #0aa2c0 100%);
color: white;
border: none;
}

.btn-info:hover[b-flcw3upqvv] {
    background: linear-gradient(135deg, #0aa2c0 0%, #0dcaf0 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(13, 202, 240, 0.4);
    color: white;
}

/* Modal Styles */
.modal-content[b-flcw3upqvv] {
	border: none;
	border-radius: 12px;
	box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.modal-xl[b-flcw3upqvv] {
	max-width: 900px;
}

.modal-header[b-flcw3upqvv] {
	padding: 1.5rem;
	border-bottom: 2px solid #dee2e6;
}

.modal-body[b-flcw3upqvv] {
	padding: 0;
	max-height: 70vh;
	overflow-y: auto;
}

.modal-footer[b-flcw3upqvv] {
	padding: 1.5rem;
	border-top: 1px solid #e9ecef;
}

/* Print Voucher Styles */
.print-voucher[b-flcw3upqvv] {
	padding: 40px;
	background: #e8f0f8;
	font-family: Arial, sans-serif;
}

.voucher-header[b-flcw3upqvv] {
	text-align: center;
	margin-bottom: 10px;
}

.company-name[b-flcw3upqvv] {
	font-size: 24px;
	font-weight: bold;
	margin: 0;
	color: #000;
}

.company-address[b-flcw3upqvv] {
	font-size: 16px;
	margin: 5px 0 0;
	color: #000;
}

.document-title[b-flcw3upqvv] {
	text-align: center;
	margin: 20px 0;
}

	.document-title h4[b-flcw3upqvv] {
		font-size: 20px;
		font-weight: bold;
		margin: 0;
		color: #000;
	}

.voucher-divider[b-flcw3upqvv] {
	border: none;
	border-top: 2px solid #000;
	margin: 20px 0;
}

.voucher-details[b-flcw3upqvv] {
	margin: 25px 0;
}

.detail-row[b-flcw3upqvv] {
	display: flex;
	justify-content: flex-start;
	margin-bottom: 12px;
	flex-wrap: wrap;
	gap: 20px;
}

.detail-item[b-flcw3upqvv] {
	flex: 1;
	display: flex;
	gap: 10px;
	min-width: 200px;
}

	.detail-item.full-width[b-flcw3upqvv] {
		flex: 2;
	}

.detail-label[b-flcw3upqvv] {
	font-weight: bold;
	min-width: 80px;
	color: #000;
}

.detail-value[b-flcw3upqvv] {
	color: #000;
}

.particulars-section[b-flcw3upqvv] {
	margin: 25px 0;
}

.section-heading[b-flcw3upqvv] {
	font-weight: bold;
	margin-bottom: 15px;
	color: #000;
	font-size: 16px;
}

.particulars-section p[b-flcw3upqvv] {
	margin: 0.5rem 0;
	font-size: 14px;
	color: #000;
}

	.particulars-section p strong[b-flcw3upqvv] {
		color: #000;
		font-weight: bold;
	}

.particulars-table[b-flcw3upqvv] {
	width: 100%;
	border-collapse: collapse;
	margin-top: 15px;
	background: white;
}

	.particulars-table th[b-flcw3upqvv],
	.particulars-table td[b-flcw3upqvv] {
		border: 1px solid #000;
		padding: 10px;
		text-align: left;
		color: #000;
	}

	.particulars-table th[b-flcw3upqvv] {
		background-color: #d0d0d0;
		font-weight: bold;
	}

	.particulars-table .text-end[b-flcw3upqvv] {
		text-align: right;
	}

	.particulars-table .total-row[b-flcw3upqvv] {
		background-color: #f0f0f0;
		font-weight: bold;
	}

.signatures-section[b-flcw3upqvv] {
	display: flex;
	justify-content: space-between;
	margin-top: 50px;
	gap: 20px;
}

.signature-box[b-flcw3upqvv] {
	flex: 1;
	text-align: center;
}

.signature-label[b-flcw3upqvv] {
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 40px;
	color: #000;
}

.signature-line[b-flcw3upqvv] {
	/*border-bottom: 2px solid #000;*/
	margin: 0 10px 8px;
}

.signature-name[b-flcw3upqvv] {
	font-size: 13px;
	color: #000;
}

.signature-subtitle[b-flcw3upqvv] {
	font-size: 11px;
	font-style: italic;
	margin-top: 5px;
	color: #000;
}


/* Print Styles */
@media print {
	body *[b-flcw3upqvv] {
		visibility: hidden;
	}

	.print-voucher[b-flcw3upqvv], .print-voucher *[b-flcw3upqvv] {
		visibility: visible;
	}

	.print-voucher[b-flcw3upqvv] {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		background: white;
	}
}
/* _content/AccountingSystem.Web/Components/Shared/SignatoryDropdown_v2.razor.rz.scp.css */
.form-control-custom[b-z64nudkc9d], .form-select-custom[b-z64nudkc9d] {
    border: 2px solid #e9ecef;
    border-radius: 8px;
    padding: 0.65rem 1rem;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

    .form-control-custom:focus[b-z64nudkc9d], .form-select-custom:focus[b-z64nudkc9d] {
        border-color: var(--secondary-color);
        box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.15);
    }

