.invoices-container {
    background-color: var(--base-box-bg);
    border-radius: 30px;
    min-height: 450px;
}

.invoices-container .box-theme {
    border: 2.4px solid rgba(255, 255, 255, 0.3);
    background: radial-gradient(ellipse at top left, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.1) 100%);
    backdrop-filter: blur(28.79px);
    --webkit-backdrop-filter: blur(28.79px); 
    opacity: 0.7;
    background-clip: padding-box;
    border-radius: 16px;
}

.invoice-filters .filter-box {
    border-inline-end: 2.4px solid rgba(255, 255, 255, 0.3);
}

.invoice-filters .filter-box, .invoice-filters .sort-box {
    width: 140px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.inoivce-search-header {
    height: 48px;
}

.invoice-search {
    width: 280px;
}

.invoice-search .search-input:focus {
    border-color: var(--base-dark-gray);
    outline: none;
}

.invoice-table thead {
    border: 2.4px solid rgba(255, 255, 255, 0.3);
}

.invoice-table thead th {
    border-width: 2.4px;
}

@media (max-width: 767.98px) {

    .invoice-table {
        text-align: start !important;
    }

    .invoice-table-body tr {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto auto;
        grid-template-areas: 
            "item1 item1"
            "item2 item2"
            "item3 item3"
            "item4 item4"
            "actions actions";
    }

    .invoice-table-body tr:not(:first-child) {
        margin-top: 16px;
    }

    .invoice-page .page-table {
        border: none;
    }

    .invoice-table-body td:nth-child(1) { grid-area: item1; }
    .invoice-table-body td:nth-child(2) { grid-area: item2; } 
    .invoice-table-body td:nth-child(3) { grid-area: item3; }
    .invoice-table-body td:nth-child(4) { grid-area: item4; }
    .invoice-table-body td:nth-child(5) { 
        grid-area: actions; 
        border: none !important;
    }

    .invoice-table-body td {
        min-width: 0;
        border: none;
        overflow-wrap: break-word;
        word-break: break-word;
        padding: 16px !important;
        border-bottom: 2.4px solid rgba(255, 255, 255, 0.3);
    }

    .invoice-filters .filter-box, .invoice-filters .sort-box {
        width: fit-content;
    }

}

@media (max-width: 449.98px) {
    .invoice-search {
        width: 210px;
    }
}