/****************************
 * Restaurant Slider
****************************/
.vii-restaurant-slider {--rs-gap:10px; --slider-width:33.33%;}

/* Slider */
.vii-restaurant-slider__items {margin:0 calc(-1 * var(--rs-gap));}

/* Slider item */
.vii-restaurant-slider__item {
    width:var(--slider-width);
    padding:0 var(--rs-gap);
}

/* Thumbnail */
.vii-restaurant-slider__item-thumbnail {aspect-ratio:380/520;}
.vii-restaurant-slider__item-thumbnail img {transition:var(--vii-transition-slow);}

/* hover */
.vii-restaurant-slider__item__inner:hover .vii-restaurant-slider__item-thumbnail img,
.vii-restaurant-slider__item__inner:focus .vii-restaurant-slider__item-thumbnail img {transform:scale(1.03);}

/* Logo */
.vii-restaurant-slider__item-logo {top:10px; width:31%;}
.vii-restaurant-slider__item-logo:after {border:1px solid #fff; border-radius:50%;}

/* Decoration */
.vii-restaurant-slider.element-layout .seahorse {right:-2%; top:-18%;}

/* Flickity Custom Arrow */
.vii-restaurant-slider__items[data-flickity-custom-arrow] .panel {width:clamp(100px, 14vw, 200px);}

/* Title has been cut-off, maybe Flickity calculate wrong height problem */
.vii-restaurant-slider__item-info {padding-bottom:2px;}

/*******************************
 * Restaurant Slider Responsive
********************************/
@media only screen and (max-width:1380px) {
    /* Decoration */
    .vii-restaurant-slider.element-layout .seahorse {right:0;}
}
@media only screen and (max-width:768px) {
    .vii-restaurant-slider {--slider-width:300px;}

    /* Content */
    .vii-restaurant-slider__title br {display:none;}

    /* Slider */
    .vii-restaurant-slider__items {margin:0 calc(-1 * var(--vii-gap-container)); width:calc(100% + var(--vii-gap-container) * 2);}

    /* Slider item */
    .vii-restaurant-slider__item:first-child,
    .vii-restaurant-slider__item:last-child {width:calc(var(--slider-width) + var(--vii-gap-container) - var(--rs-gap));}

    .vii-restaurant-slider__item:first-child {padding-left:var(--vii-gap-container);}
    .vii-restaurant-slider__item:last-child {padding-right:var(--vii-gap-container);}
}


/*************************************
 * Restaurant Slider - Related layout
**************************************/
/* Related layout */
.vii-restaurant-slider.related-layout {--slider-width:44%;}

/* layout */
.vii-restaurant-slider.related-layout .vii-restaurant-slider__header {width:30.5%;}
.vii-restaurant-slider.related-layout .vii-restaurant-slider__items {width:70%;}

/* header */
.vii-restaurant-slider.related-layout .vii-restaurant-slider__title__inner {max-width:342px; text-align:left;}


/***********************************************
 * Restaurant Slider - Related layout responsive
************************************************/
@media only screen and (max-width:1280px) {
    /* layout */
    .vii-restaurant-slider.related-layout .vii-restaurant-slider__header {width:40%;}
    .vii-restaurant-slider.related-layout .vii-restaurant-slider__items {width:60%;}
}
@media only screen and (max-width:1024px) {
    .vii-restaurant-slider.related-layout {--slider-width:46%;}
}
@media only screen and (min-width:769px) {
    .vii-restaurant-slider.related-layout .vii-restaurant-slider__inner {padding-left:var(--vii-gap-side);}
    .vii-restaurant-slider.related-layout .vii-restaurant-slider__header {padding-right:var(--vii-gap-container);}
}
@media only screen and (max-width:768px) {
    .vii-restaurant-slider.related-layout {--slider-width:300px;}

    /* layout */
    .vii-restaurant-slider.related-layout .vii-restaurant-slider__header,
    .vii-restaurant-slider.related-layout .vii-restaurant-slider__items {width:100%;}

    /* header */
    .vii-restaurant-slider.related-layout .vii-restaurant-slider__title {
        padding-left:var(--vii-gap-container); padding-right:var(--vii-gap-container);
    }
    .vii-restaurant-slider.related-layout .vii-restaurant-slider__title__inner {
        max-width:500px; margin-left:auto; margin-right:auto;
        text-align:center;
    }

    /* Slider */
    .vii-restaurant-slider.related-layout .vii-restaurant-slider__items {margin:0;}

}