/* Dish image link wrapper */
.dish-img-link {
    position: relative;
}

.dish-img-link--single {
    height: 200px;
    width: 200px;
    display: block;
    margin: auto;
}

/* Dish image inner wrapper */
.dish-img-wrap--grid {
    height: 135px;
    position: relative;
}

.dish-img-wrap--single {
    height: 200px;
    width: 200px;
    margin: auto;
    position: relative;
}

/* Category image link wrapper */
.cat-img-link--single {
    height: 200px;
    width: 250px;
    display: block;
    margin: auto;
}

/* Category image inner wrapper */
.cat-img-wrap--grid {
    height: 135px;
}

.cat-img-wrap--single {
    height: 200px;
    width: 250px;
}

/* Banner */
.banner-card {
    height: 300px;
    border-radius: 15px !important;
    overflow: hidden !important;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.btn-custom-width{
    max-width: 270px;
}

/* Sum page */
.sum-dishes-container {
    margin-top: 5px;
    margin-left: 20px;
}

.sum-total-input {
    max-width: 60px;
}

.sum-total-row {
    max-height: 32px;
}

.sum-dish-img {
    height: 50px;
    width: 50px;
}

/* Desktop: taller heights (widths unchanged) */
@media (min-width: 992px) {
    .dish-img-link--single {
        height: 400px;
        width: 600px;
    }

    .dish-img-wrap--grid {
        height: 220px;
    }

    .dish-img-wrap--single {
        height: 400px;
        width: 600px;
    }

    .cat-img-link--single {
        height: 400px;
        width: 600px;
    }

    .cat-img-wrap--grid {
        height: 220px;
    }

    .cat-img-wrap--single {
        height: 400px;
        width: 600px;
    }

    .banner-card {
        height: auto;
        aspect-ratio: 16 / 9;
    }

    .sum-dish-img {
        height: 100px;
        width: 100px;
    }

    .sum-card {
        max-width: 800px;
        margin-left: auto;
        margin-right: auto;
        padding: 20px;
    }

    .sum-dishes-container {
        margin-top: 15px;
        margin-left: 30px;
    }

    .sum-total-input {
        max-width: 120px;
        font-size: 16px;
    }

    .sum-total-row {
        max-height: none;
        padding: 4px 0;
    }
}