.content:has(.party-basket-details) header .row {
    margin-right: 0;
    margin-left: 0;
}

.party-basket-details summary {
    cursor: pointer;
    font-weight: 600;
}

.party-basket-details summary:focus-visible {
    outline: 3px solid #123f3a;
    outline-offset: 3px;
}

.party-basket-details h3 {
    font-size: 1rem;
    margin-top: 1rem;
}

@media (max-width: 575.98px) {
    #basketBox table:has(.party-basket-details),
    #basketBox table:has(.party-basket-details) tbody {
        display: block;
        width: 100%;
    }

    #basketBox table:has(.party-basket-details) thead {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip-path: inset(50%);
    }

    #basketBox table:has(.party-basket-details) tr:has(.quantityInputGroup) {
        display: grid;
        grid-template-columns: 1.4fr 1fr 1fr;
        margin-bottom: 1rem;
    }

    #basketBox table:has(.party-basket-details) tr:has(.quantityInputGroup) td:first-child {
        grid-column: 1 / -1;
    }

    #basketBox table:has(.party-basket-details) tr:has(.quantityInputGroup) td:nth-child(2)::before {
        content: "Quantity";
        display: block;
        font-weight: 600;
    }

    #basketBox table:has(.party-basket-details) tr:has(.quantityInputGroup) td:nth-child(3)::before {
        content: "Price";
        display: block;
        font-weight: 600;
    }

    #basketBox table:has(.party-basket-details) tr:has(.quantityInputGroup) td:nth-child(4)::before {
        content: "Total";
        display: block;
        font-weight: 600;
    }

    #basketBox table:has(.party-basket-details) tr:not(:has(.quantityInputGroup)) {
        display: flex;
        justify-content: flex-end;
    }

    #basketBox table:has(.party-basket-details) tr:not(:has(.quantityInputGroup)) td:first-child {
        flex: 1;
    }
}