.category-motorcycles {
    background                              : var(--theme-primary-color);
}

.na-container {
    padding                                 : 1%;
    text-align                              : center;
}

.bike-page {
    padding                                 : 48px;
    display                                 : grid;
    grid-template-columns                   : 1.2fr 1fr;
    align-items                             : center;
    gap                                     : 24px;
}

.image-placeholder {
    height                                  : 460px;
    display                                 : flex;
    align-items                             : center;
    justify-content                         : center;
    background                              : var(--theme-primary-color);
    color                                   : var(--theme-font-color);
    border-radius                           : 6px;
}

.bike-gallery img {
    width                                   : 100%;
    border-radius                           : 6px;
    object-fit                              : cover;
}

.image-placeholder {
    height                                  : 460px;
    background                              : var(--theme-primary-color-reverse);
    display                                 : flex;
    align-items                             : center;
    justify-content                         : center;
    border-radius                           : 6px;
}

.bike-header-mobile {
	display                                 : none;
    text-align                              : center;
}

.bike-header {
    top                                     : 1px;
    padding-top                             : 1px;
    position                                : relative;
	box-shadow                              : 2px 2px 12px var(--theme-primary-color-contrast-2);
    border-bottom                           : 1px solid var(--theme-primary-color-contrast-4);
	border-top-left-radius                  : 6px;
	border-top-right-radius                 : 6px;
	text-align                              : center;
}

.bike-title {
    font-size                               : calc(var(--theme-font-size) + 0.5em);
    margin-bottom                           : 10px;
}

.bike-price {
    font-size                               : 24px;
    font-weight                             : bold;
    color                                   : var(--theme-font-color);
    opacity                                 : 0.75;
}

.bike-specs {
    width                                   : 100%;
    border-collapse                         : collapse;
    box-shadow                              : 2px 2px 12px var(--theme-primary-color-contrast-1);
}

.bike-specs th {
    text-align                              : left;
    padding                                 : 10px;
    color                                   : var(--theme-primary-color-contrast-6);
}

.bike-specs tr {
    border-bottom                           : 1px dotted var(--theme-primary-color-contrast-3);
}

.bike-specs td:nth-child(2n) {
	text-shadow                             : 2px 2px 12px var(--theme-primary-color-contrast-6);
}

.bike-specs tr:nth-child(2n) {
	background                              : var(--theme-primary-color-contrast-1);
}

.bike-footer {
	display                                 : grid;
	grid-template-columns                   : auto auto;
	align-items                             : center;
	padding                                 : 0px 24px;
}

.embla {
    opacity                                 : 0;
    position                                : relative;
    overflow                                : hidden;
    visibility                              : hidden;
    transition                              : opacity 0.25s ease;
}

.embla.is-ready {
    opacity                                 : 1;
    visibility                              : visible;
    
}

.embla__viewport {
    overflow                                : hidden;
    
}

.embla__container {
    display                                 : flex;
    touch-action                            : pan-y pinch-zoom;
}

.embla__slide {
    flex                                    : 0 0 100%;
    min-width                               : 0;
   
}

.embla__slide img {
    width                                   : 100%;
    height                                  : 460px;
    object-fit                              : cover;
    border-radius                           : 6px;
    display                                 : block;
}

.embla__prev,
.embla__next {
    top                                     : 50%;
    position                                : absolute;
    transform                               : translateY(-50%);
    z-index                                 : 2;
    margin                                  : 12px;
    width                                   : 42px;
    height                                  : 42px;
    border                                  : 0;
    border-radius                           : 50%;
    background                              : rgba(0,0,0,0.5);
    color                                   : #fff;
    cursor                                  : pointer;
    
}

.embla__prev { 
    left                                    : 10px; 
    margin-left                             : 12px;
}

.embla__next { 
    right                                   : 10px; 
    margin-right                            : 12px;
}

.embla__dots {
    display                                 : flex;
    justify-content                         : center;
    margin-top                              : 16px;
    gap                                     : 8px;
}

.embla__dot {
    width                                   : 12px;
    height                                  : 12px;
    border-radius                           : 50%;
    border                                  : 0;
    background                              : var(--theme-primary-color-contrast-4);
    cursor                                  : pointer;
}

.embla__dot.is-selected {
    opacity                                 : 1;
    background                              : var(--theme-primary-color-contrast-6);
}

/*****************************************************************************************************************************************/
@media screen and (max-width: 1120px) {
    .bike-page {
        grid-template-columns               : 1fr;
    }

    .bike-header-mobile {
        display                             : block;
    }

    .bike-header {
        display                             : none;
    }
}

/*****************************************************************************************************************************************/
@media screen and (max-width: 780px) {
    .bike-page {
        padding                             : 24px;
        grid-template-columns               : 1fr;
    }

    .bike-header-mobile {
        display                             : block;
    }

    .bike-header {
        display                             : none;
    }
}

/*****************************************************************************************************************************************/
@media screen and (max-width: 420px) {
    .bike-page {
        padding                             : 6px;
        grid-template-columns               : 1fr;
    }

    .bike-header-mobile {
        display                             : block;
    }

    .embla__slide img {
        height                                  : 100%;
        object-fit                              : contain;
    }

    .embla__prev,
    .embla__next {
        display                             : none;
    }

    .bike-header {
        display                             : none;
    }

    .bike-footer {
        grid-template-columns               : auto;
        justify-items                       : center;
        padding                             : 12px 24px;
    }
}