.cart{
    width: max-content;
    max-width: 1200px;
    min-height: 100vh;
    margin: auto;

    padding: 2rem;
    box-shadow: 1px 1px 4px rgb(210, 210, 210);
}

@media (max-width: 425px){
    .cart{
        padding: 2rem 0rem;
    }
}

header{
    margin-top:0.1rem;
}

.cart h1{
    font-size:1.3rem;
    text-align: center;
    margin: 1rem auto;
}

.cart .underline{
    margin: 1rem auto 2rem auto;
}

.cart-table{
    border-collapse: collapse;
}

.cart-table tr th, .cart-table tr td{
    border: 1px solid rgb(210, 210, 210);
    width: max-content;
    
    text-align: center;
    padding: 1rem;
}

.cart-table tr th:nth-of-type(3), .cart-table tr td:nth-of-type(3){
    min-width: 300px; 
}

.cart-table tr th:nth-of-type(6), .cart-table tr td:nth-of-type(6){
    min-width: 150px;
}

.cart-table tr th:nth-of-type(4), .cart-table tr td:nth-of-type(4){
    min-width: 150px;
}
.cart-table tr td:nth-of-type(3){
    text-align: left;
}

.cart-table tr img{
    width: auto;
    height: auto;
    max-width: 100px;
    max-height: 100px;
}

.edit-quantity{
    display: grid;
    display: -ms-grid;
    display: -moz-grid;
}

.edit-quantity{
    grid-template-columns: repeat(3, max-content);
}

.edit-quantity button{
    padding: 1rem 1.2rem;
    border-radius: 50%;
    border: none;

    background-color: #eb98c0e0;
}

.checkout-button{
    background-color: #eb98c0e0;
    padding: 1rem 2rem;
    border: none;
    border-radius: 5px;
    margin: 3rem 0rem 3rem auto;
    width: max-content;
    display: block;
}

.checkout-button{
    display: grid;
    display: -ms-grid;
    display: -moz-grid;
}

.checkout-button{
    grid-template-columns: auto max-content;
    align-items: center;
    column-gap: 0.5rem;
}

.checkout-button img{
    width: 40px;
}

.edit-quantity button:hover{
    background-color: #eb98c0;
    cursor: pointer;
}

.edit-quantity button:first-of-type{
    padding: 1rem 1.3rem;
}

.edit-quantity input{
    width: 60px;
    background-color: transparent;
    border: none;
    text-align: center;
}

.edit-quantity input::-webkit-outer-spin-button,
.edit-quantity input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.responsive-table{
    margin: auto;
    white-space: nowrap;
    overflow: auto;
    max-width: 90vw;
}