.spares-link__container {
    display: flex;
    position: relative;
    min-height: 19rem;
}

.spares-link__container .f-carousel__slide {
    margin-bottom: 1px;
    padding: 0;
    box-sizing: content-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: solid 1px var(--theme-color-primary);


    border-radius: var(--block-border-radius);

    .f-carousel__text {
        flex-grow: 0;
        padding: 0 .5em;
    }

    .f-carousel__name {
        line-height: 1.2em;
        margin-bottom: .75rem;
    }

    .f-carousel__price {
        flex-grow: 2;
        text-align: right;
        color: var(--theme-color-dark);
        display: flex;
        flex-direction: column;
        justify-content: end;
        padding: 0 .5em .5em;
    }
}

.spares-link__container.f-carousel {
    --f-carousel-gap: 12px;
    --f-carousel-slide-width: calc((100% - 1.5rem) / 2);
    --f-arrow-hover-color: var(--theme-color-primary);
    --f-arrow-color: var(--theme-color-dark);

    transition: all 150ms ease;
    opacity: 0;
    position: relative;
    overflow: hidden;

    margin: 1px 0 0;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    gap: 1rem;
}

@media (min-width: 768px) {
    .spares-link__container.f-carousel {
        --f-carousel-gap: 12px;
        --f-carousel-slide-width: calc((100% - 3.5rem) / 4);
    }
}

@media (min-width: 992px) {
    .spares-link__container.f-carousel {
        --f-carousel-gap: 13px;
        --f-carousel-slide-width: calc((100% - 4.5rem - 2px) / 5);
    }
}

@media (min-width: 1200px) {
    .spares-link__container.f-carousel {
        --f-carousel-gap: 14px;
        --f-carousel-slide-width: calc((100% - 5.5rem - 2px) / 6);
    }
}

.spares-link__container .f-button {
    font-size: 2rem;
}

.spares-link-list {
    margin-top: 2rem;
    position: relative;
}

.spares-link-list .f-carousel__image {
    margin-bottom: 1rem;
    height: 11rem;

    a {
        display: block;
        inset: 0;
        width: 100%;
        height: 100%;
    }

    img {
        width: 100%;
        height: 100%;
        object-fit: cover;

        border-top-left-radius: var(--block-border-radius);
        border-top-right-radius: var(--block-border-radius);
    }
}

.f-carousel__features {
    line-height: 110%;
    word-break: break-all;
}