.icon-wrapper .input-field[name="event_type"],
.icon-wrapper .input-field[name="reservation_date"] {
    padding-inline-start: 1.5rem;
}
.icon-wrapper .input-field[name="reservation_date"] {
padding-inline-end: .8rem;
}
input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    filter: invert(1);
}

/* reveal effect */

[data-reveal="left"] {
    clip-path: inset(0 100% 0 0);
}

[data-reveal="left"].revealed {
    animation: reveal-left 1.2s cubic-bezier(0.17, 0.97, 0.38, 1) forwards 300ms;
}

@keyframes reveal-left {
    0% {
        clip-path: inset(0 100% 0 0);
    }

    100% {
        clip-path: inset(0 0 0 0);
    }
}

[data-reveal="right"] {
    clip-path: inset(0 0 0 100%);
}

[data-reveal="right"].revealed {
    animation: reveal-right 1.2s cubic-bezier(0.17, 0.97, 0.38, 1) forwards 300ms;
}

@keyframes reveal-right {
    0% {
        clip-path: inset(0 0 0 100%);
    }

    100% {
        clip-path: inset(0 0 0 0);
    }
}
@media (min-width: 992px) {
    .special-dish-content:not(.special-dish-content__reversed) .container {
        margin-inline: 0;
        text-align: left;
    }

    .special-dish-content .container {
        margin-inline: auto;
        text-align: right;
    }

    .special-dish .abs-img__reversed {
        margin-inline: auto;
        margin-block-end: 1.2rem;
    }

    .special-dish .abs-img__reversed {
        position: absolute;
        top: 1rem;
        right: -4rem;
        left: unset;
        animation: move 5s linear infinite;
    }

    .section-subtitle__reversed {
        display: grid;
        justify-items: end;
    }

    .wrapper__reversed {
        justify-content: flex-end !important;
    }

    .btn__reversed {
        float: right;
    }
}

.products {
    margin-top: 2rem;
}

.toast-container {
    bottom: 6.5rem;
}

.toast {
    background-color: var(--smoky-black-2);
}

address {
    margin-bottom: unset;
}

/* validation inputs */

input[name="full_name"]:invalid,
input[name="phone"]:invalid,
input[name="street_address"]:invalid {
    border: 0.2rem solid rgb(98, 3, 3);
}

input[name="full_name"]:valid,
input[name="phone"]:valid,
input[name="street_address"]:valid {
    border: 0.2rem solid var(--gold-crayola);
}

/* google map */

.card-container {
    display: grid;
    grid-template-rows: 1fr 1fr;
    height: auto;
    padding-bottom: 4rem;
}

.panel {
    padding: 1rem;
}

.panel form{
    margin-top: 1rem;
}

@media (min-width: 575px) {
    .panel form{
        margin-top: 5rem;
    }
}

@media (min-width: 768px) {
    .card-container{
        grid-template-rows: auto;
        grid-template-columns: 1fr 0.5fr;
        width:120rem;
        margin: 0 auto;
    }

    .map{
        margin-top: 15rem;
    }
}