/* =========================================================
   JBM CUSTOM SHOP
   Custom WooCommerce shop grid voor Jewels by Marthje
   ========================================================= */

.jbm-shop,
.jbm-shop *,
.jbm-shop *::before,
.jbm-shop *::after {
    box-sizing: border-box;
}

.jbm-shop {
    --jbm-bg: #eee7dd;
    --jbm-text: #283342;
    --jbm-muted: rgba(40, 51, 66, 0.72);
    --jbm-border: rgba(40, 51, 66, 0.88);
    --jbm-border-soft: rgba(40, 51, 66, 0.18);
    --jbm-coral: #ed7458;
    --jbm-coral-dark: #dd654d;
    --jbm-sage: #9fbebb;
    --jbm-taupe: #d5bbad;
    --jbm-cream: #f5efe6;
    --jbm-white: #ffffff;
    --jbm-font-body: inherit;
    --jbm-font-heading: inherit;

    width: 100%;
    max-width: 980px;
    margin: 0 auto;
    padding: clamp(32px, 4vw, 56px) clamp(18px, 3vw, 42px) clamp(42px, 5vw, 68px);
    color: var(--jbm-text);
    background: transparent;
    font-family: var(--jbm-font-body);
}

.jbm-shop a {
    color: inherit;
    text-decoration: none;
}

.jbm-shop button,
.jbm-shop select {
    font: inherit;
}

.jbm-shop__header {
    margin: 0 0 28px;
}

.jbm-shop .jbm-shop__title {
    margin: 0 0 18px !important;
    color: var(--jbm-text) !important;
    font-family: var(--jbm-font-heading) !important;
    font-size: var(--jbm-title-font-size, 54px) !important;
    font-weight: 400 !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

.jbm-shop__intro {
    max-width: 820px;
    margin: 0;
    color: var(--jbm-text);
    font-size: clamp(15px, 1.3vw, 18px);
    font-weight: 400;
    line-height: 1.55;
    letter-spacing: 0.13em;
}

.jbm-shop__circles {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: clamp(18px, 2.3vw, 30px);
    margin: 30px 0 34px;
}

.jbm-circle {
    appearance: none;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    width: 120px;
    margin: 0;
    padding: 0;
    border: 0;
    color: var(--jbm-text);
    background: transparent;
    cursor: pointer;
    text-align: center;
}

.jbm-circle__image {
    position: relative;
    display: block;
    width: clamp(82px, 8.4vw, 118px);
    aspect-ratio: 1 / 1;
    border-radius: 999px;
    overflow: hidden;
    background-color: var(--jbm-taupe);
    background-position: center;
    background-size: cover;
    box-shadow: 0 0 0 0 rgba(40, 51, 66, 0);
    transition: transform 180ms ease, box-shadow 180ms ease;
}

.jbm-circle__image::before,
.jbm-circle__image::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    transition: opacity 180ms ease, transform 180ms ease;
}

.jbm-circle__image::before {
    background: rgba(213, 187, 173, 0.18);
    opacity: 1;
}

.jbm-circle__image::after {
    background: var(--jbm-sage);
    mix-blend-mode: multiply;
    opacity: 0;
}

.jbm-circle--2 .jbm-circle__image::after {
    background: var(--jbm-taupe);
}

.jbm-circle--3 .jbm-circle__image::after {
    background: var(--jbm-coral);
}

.jbm-circle__label {
    display: block;
    width: 100%;
    color: var(--jbm-text);
    font-size: 13px;
    line-height: 1.2;
    letter-spacing: 0.01em;
}

.jbm-circle:hover .jbm-circle__image,
.jbm-circle:focus-visible .jbm-circle__image,
.jbm-circle.is-active .jbm-circle__image {
    transform: translateY(-2px);
    box-shadow: 0 0 0 3px var(--jbm-bg), 0 0 0 5px rgba(40, 51, 66, 0.16);
}

.jbm-circle:hover .jbm-circle__image::after,
.jbm-circle:focus-visible .jbm-circle__image::after,
.jbm-circle.is-active .jbm-circle__image::after {
    opacity: 0.45;
}

.jbm-circle.is-active .jbm-circle__label {
    font-weight: 700;
}

.jbm-shop__filters {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin: 0 0 36px;
}

.jbm-filter {
    position: relative;
    display: block;
    min-width: 0;
}

.jbm-filter::after {
    content: "";
    position: absolute;
    right: 18px;
    top: 50%;
    width: 12px;
    height: 12px;
    border-right: 2px solid var(--jbm-text);
    border-bottom: 2px solid var(--jbm-text);
    transform: translateY(-62%) rotate(45deg);
    pointer-events: none;
}

.jbm-filter__select {
    appearance: none;
    width: 100%;
    min-height: 42px;
    padding: 8px 42px 8px 16px;
    border: 1.5px solid var(--jbm-border);
    border-radius: 999px;
    color: var(--jbm-text);
    background: transparent;
    font-size: 15px;
    line-height: 1.2;
    letter-spacing: 0.08em;
    cursor: pointer;
    outline: none;
    transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

.jbm-filter__select:hover,
.jbm-filter__select:focus-visible {
    border-color: var(--jbm-text);
    background: rgba(255, 255, 255, 0.22);
    box-shadow: 0 0 0 3px rgba(40, 51, 66, 0.08);
}

.jbm-filter__select.is-active {
    background: rgba(255, 255, 255, 0.35);
    font-weight: 700;
}

.jbm-shop__status {
    min-height: 1px;
    margin: 0;
}

.jbm-shop__count {
    display: none;
}

.jbm-shop__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(28px, 3vw, 40px) clamp(10px, 1.2vw, 14px);
    align-items: start;
    margin: 0;
}

.jbm-shop.is-loading .jbm-shop__grid {
    opacity: 0.48;
    pointer-events: none;
}

.jbm-product-card {
    min-width: 0;
    text-align: center;
}

.jbm-product-card__media {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1.34;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.28);
}

.jbm-product-card__image,
.jbm-product-card__hover-image {
    display: block;
    width: 100%;
    height: 100%;
}

.jbm-product-card__hover-image {
    position: absolute;
    inset: 0;
    z-index: 1;
    opacity: 0;
    transition: opacity 240ms ease;
}

.jbm-product-card__image img,
.jbm-product-card__hover-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.jbm-product-card__media:hover .jbm-product-card__hover-image,
.jbm-product-card__media:focus-visible .jbm-product-card__hover-image {
    opacity: 1;
}

.jbm-product-card__title {
    max-width: 92%;
    margin: 14px auto 0;
    color: var(--jbm-text);
    font-family: var(--jbm-font-body);
    font-size: clamp(13px, 1.15vw, 16px);
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: 0.08em;
}

.jbm-product-card__title a:hover,
.jbm-product-card__title a:focus-visible {
    color: var(--jbm-coral-dark);
}

.jbm-product-card__price {
    margin: 18px 0 0;
    color: var(--jbm-text);
    font-size: clamp(13px, 1.05vw, 15px);
    font-weight: 400;
    line-height: 1.25;
    letter-spacing: 0.06em;
}

.jbm-product-card__price del {
    opacity: 0.6;
}

.jbm-product-card__price ins {
    text-decoration: none;
}

.jbm-shop__empty {
    grid-column: 1 / -1;
    margin: 26px 0;
    color: var(--jbm-text);
    text-align: center;
    font-size: 16px;
}

.jbm-shop__actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    margin: clamp(42px, 5vw, 70px) 0 0;
    text-align: center;
}

.jbm-shop__actions:empty {
    display: none;
}

.jbm-shop__actions::before {
    content: attr(data-count-label);
    display: block;
    min-height: 16px;
    margin: 0 0 6px;
    color: rgba(40, 51, 66, 0.72);
    font-size: 12px;
    line-height: 1.3;
    letter-spacing: 0.08em;
}

.jbm-shop__load-more {
    appearance: none;
    min-width: 190px;
    margin: 0;
    padding: 11px 26px 12px;
    border: 0;
    border-radius: 999px;
    color: #ffffff;
    background: var(--jbm-coral);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.1;
    letter-spacing: 0.08em;
    cursor: pointer;
    transition: transform 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

.jbm-shop__load-more:hover,
.jbm-shop__load-more:focus-visible {
    background: var(--jbm-coral-dark);
    transform: translateY(-1px);
    box-shadow: 0 9px 24px rgba(237, 116, 88, 0.22);
}

.jbm-shop__all {
    appearance: none;
    margin: 0;
    padding: 0;
    border: 0;
    color: rgba(40, 51, 66, 0.86);
    background: transparent;
    font-size: 12px;
    line-height: 1.4;
    letter-spacing: 0.08em;
    cursor: pointer;
}

.jbm-shop__all:hover,
.jbm-shop__all:focus-visible {
    color: var(--jbm-coral-dark);
    text-decoration: underline;
}

.jbm-shop-error {
    padding: 16px 18px;
    border: 1px solid #cc0000;
    color: #cc0000;
    background: #fff7f7;
}

.screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (max-width: 1180px) {
    .jbm-shop {
        max-width: 100%;
    }

    .jbm-shop__filters {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .jbm-shop__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .jbm-shop {
        padding: 28px 16px 48px;
    }


    .jbm-shop__intro {
        letter-spacing: 0.06em;
    }

    .jbm-shop__circles {
        justify-content: flex-start;
        gap: 16px;
        margin-top: 24px;
    }

    .jbm-circle {
        width: 94px;
    }

    .jbm-shop__filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .jbm-filter__select {
        min-height: 40px;
        padding-left: 14px;
        font-size: 14px;
        letter-spacing: 0.04em;
    }

    .jbm-shop__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 26px 10px;
    }

    .jbm-product-card__media {
        aspect-ratio: 1 / 1.22;
    }

    .jbm-product-card__title {
        max-width: 96%;
        font-size: 13px;
        letter-spacing: 0.04em;
    }

    .jbm-product-card__price {
        margin-top: 10px;
    }
}

@media (max-width: 480px) {
    .jbm-shop__filters {
        grid-template-columns: 1fr;
    }

    .jbm-shop__grid {
        grid-template-columns: 1fr 1fr;
    }

    .jbm-shop__load-more {
        width: 100%;
        max-width: 260px;
    }
}


.jbm-shop-debug {
    margin: 0 0 18px;
    padding: 14px 16px;
    border: 1px solid rgba(36, 49, 64, 0.22);
    background: rgba(255, 255, 255, 0.55);
    color: var(--jbm-text);
    border-radius: 12px;
    font-size: 14px;
}


/* =========================================================
   JBM CUSTOM SHOP 1.0.3
   Full-width layout + always readable filters
   ========================================================= */

.jbm-shop,
.jbm-shop *,
.jbm-shop *::before,
.jbm-shop *::after {
    box-sizing: border-box;
}

.jbm-shop {
    width: 100%;
    max-width: none;
}

.jbm-shop--full-width {
    width: 100%;
    max-width: none;
}

.fusion-builder-row .jbm-shop--full-width,
.fusion-row .jbm-shop--full-width,
.post-content .jbm-shop--full-width,
.entry-content .jbm-shop--full-width {
    width: 100%;
    max-width: none;
}

.jbm-shop__filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: clamp(10px, 1vw, 18px);
    width: 100%;
    max-width: none;
    overflow: visible;
}

.jbm-filter {
    flex: 0 1 auto;
    min-width: max-content;
    max-width: 100%;
}

.jbm-filter__select {
    width: auto;
    min-width: max-content;
    max-width: 100%;
    white-space: nowrap;
    text-overflow: clip;
    overflow: visible;
}

.jbm-shop__grid {
    width: 100%;
    max-width: none;
}

@media (min-width: 1180px) {
    .jbm-shop__grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        column-gap: clamp(28px, 3.2vw, 72px);
        row-gap: clamp(38px, 4vw, 78px);
    }
}

@media (max-width: 980px) {
    .jbm-shop__filters {
        gap: 10px 12px;
    }

    .jbm-filter,
    .jbm-filter__select {
        min-width: max-content;
    }
}

@media (max-width: 640px) {
    .jbm-shop__filters {
        display: grid;
        grid-template-columns: 1fr 1fr;
        align-items: stretch;
    }

    .jbm-filter,
    .jbm-filter__select {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 420px) {
    .jbm-shop__filters {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   JBM CUSTOM SHOP 1.0.4
   Full-width shop + complete filter labels
   ========================================================= */

.jbm-shop,
.jbm-shop *,
.jbm-shop *::before,
.jbm-shop *::after {
    box-sizing: border-box;
}

.jbm-shop {
    width: 100%;
    max-width: none;
}

/*
   Voor full-width pagina's met een linker zijmenu.
   Standaard is --jbm-left-menu-width 0px.
   Zet via shortcode bijvoorbeeld left_menu_width="300px".
*/
.jbm-shop--full-width {
    width: 100%;
    max-width: none;
}

@media (min-width: 1280px) {
    .jbm-shop--full-width {
        width: calc(100vw - var(--jbm-left-menu-width, 0px));
        max-width: calc(100vw - var(--jbm-left-menu-width, 0px));
    }
}

/* Avada containers mogen de shop niet extra begrenzen. */
.fusion-builder-row .jbm-shop--full-width,
.fusion-row .jbm-shop--full-width,
.post-content .jbm-shop--full-width,
.entry-content .jbm-shop--full-width {
    max-width: none;
}

/* Filters: altijd volledig leesbaar, dus flex-wrap in plaats van afkappen. */
.jbm-shop__filters {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center;
    justify-content: flex-start;
    gap: clamp(10px, 1vw, 18px);
    width: 100%;
    max-width: none;
    overflow: visible;
}

.jbm-filter {
    flex: 0 0 auto;
    min-width: max-content;
    max-width: 100%;
}

.jbm-filter__select {
    width: auto;
    min-width: max-content;
    max-width: 100%;
    white-space: nowrap;
    text-overflow: clip;
    overflow: visible;
}

.jbm-shop__grid {
    width: 100%;
    max-width: none;
}

@media (min-width: 1180px) {
    .jbm-shop__grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        column-gap: clamp(28px, 3.2vw, 72px);
        row-gap: clamp(38px, 4vw, 78px);
    }
}

/* Op kleinere schermen liever twee of meer rijen dan afgekorte labels. */
@media (max-width: 760px) {
    .jbm-shop__filters {
        gap: 10px 12px;
    }

    .jbm-filter,
    .jbm-filter__select {
        min-width: max-content;
    }
}

@media (max-width: 430px) {
    .jbm-filter,
    .jbm-filter__select {
        width: 100%;
        min-width: 0;
    }
}


/* =========================================================
   JBM CUSTOM SHOP 1.0.5
   Max-width boxed behavior op grote schermen
   ========================================================= */

/*
   Gebruik max_width in plaats van left_menu_width.
   De shop vult tot aan de max-width 100% van de beschikbare ruimte.
   Boven die max-width wordt hij netjes boxed/gecentreerd.
*/
.jbm-shop--full-width {
    width: 100% !important;
    max-width: var(--jbm-shop-max-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

@media (min-width: 1280px) {
    .jbm-shop--full-width {
        width: 100% !important;
        max-width: var(--jbm-shop-max-width) !important;
    }
}

/*
   Oude left_menu_width-regel uit eerdere versie overschrijven:
   geen calc(100vw - menu) meer.
*/
.fusion-builder-row .jbm-shop--full-width,
.fusion-row .jbm-shop--full-width,
.post-content .jbm-shop--full-width,
.entry-content .jbm-shop--full-width {
    width: 100% !important;
    max-width: var(--jbm-shop-max-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Filters blijven volledig zichtbaar en breken naar nieuwe regels. */
.jbm-shop__filters {
    width: 100%;
    max-width: none;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center;
    justify-content: flex-start;
    overflow: visible !important;
}

.jbm-filter {
    flex: 0 0 auto;
    min-width: max-content;
}

.jbm-filter__select {
    width: auto;
    min-width: max-content;
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
}


/* =========================================================
   JBM CUSTOM SHOP 1.0.6
   Circles 50% groter + circle-categorieën niet in dropdown
   ========================================================= */

/* 50% grotere categorie-cirkels. */
.jbm-shop__circles {
    gap: clamp(30px, 4.8vw, 78px);
}

.jbm-circle {
    width: clamp(195px, 18vw, 330px);
}

.jbm-circle__image {
    width: clamp(165px, 15vw, 285px);
    height: clamp(165px, 15vw, 285px);
}

.jbm-circle__label {
    font-size: clamp(15px, 1.15vw, 21px);
}

/* Op mobiel iets minder extreem, maar nog steeds groter dan voorheen. */
@media (max-width: 760px) {
    .jbm-shop__circles {
        gap: 22px;
    }

    .jbm-circle {
        width: clamp(145px, 42vw, 210px);
    }

    .jbm-circle__image {
        width: clamp(132px, 38vw, 190px);
        height: clamp(132px, 38vw, 190px);
    }
}

@media (max-width: 430px) {
    .jbm-circle {
        width: 100%;
        max-width: 230px;
    }

    .jbm-circle__image {
        width: min(70vw, 210px);
        height: min(70vw, 210px);
    }
}


/* =========================================================
   JBM CUSTOM SHOP 1.0.7
   Circles dichter op elkaar
   ========================================================= */

/* De cirkels blijven groot, maar staan weer dichter tegen elkaar aan. */
.jbm-shop__circles {
    gap: clamp(8px, 1.35vw, 26px) !important;
    justify-content: center;
}

.jbm-circle {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.jbm-shop__intro {
    font-size: clamp(17px, 1.25vw, 24px) !important;
    line-height: 1.45;
}

/* Op tablet en mobiel blijven de cirkels ruim genoeg klikbaar, maar zonder grote gaten. */
@media (max-width: 760px) {
    .jbm-shop__circles {
        gap: 12px !important;
    }

}

@media (max-width: 430px) {
    .jbm-shop__circles {
        gap: 10px !important;
    }
}


/* =========================================================
   JBM CUSTOM SHOP 1.0.8
   Circles kleiner/rechts + producttitel/prijs verhouding
   ========================================================= */

/*
   Circles weer kleiner en rechts uitgelijnd.
   Deze regels staan bewust onderaan, zodat eerdere circle-vergrotingen
   uit 1.0.6/1.0.7 worden overschreven.
*/
.jbm-shop__circles {
    justify-content: flex-end !important;
    align-items: flex-start;
    gap: clamp(8px, 1vw, 18px) !important;
    margin-left: auto;
}

.jbm-circle {
    width: clamp(98px, 8.6vw, 165px) !important;
    max-width: 165px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.jbm-circle__image {
    width: clamp(86px, 7.4vw, 142px) !important;
    height: clamp(86px, 7.4vw, 142px) !important;
}

.jbm-circle__label {
    font-size: clamp(12px, 0.82vw, 15px) !important;
    line-height: 1.15;
}

/* Producttitels iets kleiner, prijs juist iets groter en steviger. */
.jbm-product-card__title {
    font-size: clamp(15px, 0.96vw, 18px) !important;
    line-height: 1.16 !important;
    margin-top: clamp(10px, 0.9vw, 16px);
}

.jbm-product-card__price {
    font-size: clamp(17px, 1.08vw, 22px) !important;
    line-height: 1.12 !important;
    font-weight: 600;
    margin-top: clamp(5px, 0.45vw, 9px);
}

/* Mobile check: rechts uitlijnen op desktop, maar mobiel netjes centreren/wrappen. */
@media (max-width: 760px) {
    .jbm-shop__circles {
        justify-content: center !important;
        gap: 10px !important;
    }

    .jbm-circle {
        width: clamp(92px, 28vw, 128px) !important;
        max-width: 128px !important;
    }

    .jbm-circle__image {
        width: clamp(82px, 25vw, 112px) !important;
        height: clamp(82px, 25vw, 112px) !important;
    }

    .jbm-circle__label {
        font-size: 12px !important;
    }

    .jbm-product-card__title {
        font-size: 15px !important;
    }

    .jbm-product-card__price {
        font-size: 18px !important;
    }
}

@media (max-width: 430px) {
    .jbm-shop__circles {
        justify-content: center !important;
        gap: 8px !important;
    }

    .jbm-circle {
        width: calc(33.333% - 6px) !important;
        max-width: 110px !important;
    }

    .jbm-circle__image {
        width: min(24vw, 96px) !important;
        height: min(24vw, 96px) !important;
    }
}


/* =========================================================
   JBM CUSTOM SHOP 1.1.1
   Circle uitlijning via shortcode
   ========================================================= */

.jbm-shop--circles-left .jbm-shop__circles {
    justify-content: flex-start !important;
    margin-left: 0 !important;
    margin-right: auto !important;
}

.jbm-shop--circles-center .jbm-shop__circles {
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.jbm-shop--circles-right .jbm-shop__circles {
    justify-content: flex-end !important;
    margin-left: auto !important;
    margin-right: 0 !important;
}

/* Op mobiel blijft center het veiligst, ongeacht desktop-uitlijning. */
@media (max-width: 760px) {
    .jbm-shop--circles-left .jbm-shop__circles,
    .jbm-shop--circles-center .jbm-shop__circles,
    .jbm-shop--circles-right .jbm-shop__circles {
        justify-content: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}


/* =========================================================
   JBM CUSTOM SHOP 1.1.2
   Grootte-instellingen via shortcode
   ========================================================= */

/*
   Instelbaar via shortcode:
   circle_size
   tekst_font_size
   dropdown_font_size
   product_titel_font_size
   prijs_font_size
*/

.jbm-shop__intro {
    font-size: var(--jbm-text-font-size, clamp(17px, 1.25vw, 24px)) !important;
}

.jbm-filter__select {
    font-size: var(--jbm-dropdown-font-size, 16px) !important;
}

.jbm-circle {
    width: calc(var(--jbm-circle-size, 142px) + 20px) !important;
    max-width: calc(var(--jbm-circle-size, 142px) + 20px) !important;
}

.jbm-circle__image {
    width: var(--jbm-circle-size, 142px) !important;
    height: var(--jbm-circle-size, 142px) !important;
}

.jbm-product-card__title {
    font-size: var(--jbm-product-title-font-size, clamp(15px, 0.96vw, 18px)) !important;
}

.jbm-product-card__price {
    font-size: var(--jbm-product-price-font-size, clamp(17px, 1.08vw, 22px)) !important;
}

/*
   Mobiel: de shortcode-instellingen blijven leidend,
   maar de circles mogen nooit breder worden dan veilig is.
*/
@media (max-width: 760px) {
    .jbm-circle {
        width: min(calc(var(--jbm-circle-size, 112px) + 12px), 31vw) !important;
        max-width: min(calc(var(--jbm-circle-size, 112px) + 12px), 31vw) !important;
    }

    .jbm-circle__image {
        width: min(var(--jbm-circle-size, 112px), 28vw) !important;
        height: min(var(--jbm-circle-size, 112px), 28vw) !important;
    }
}

@media (max-width: 430px) {
    .jbm-circle {
        width: min(calc(var(--jbm-circle-size, 96px) + 8px), 31vw) !important;
        max-width: min(calc(var(--jbm-circle-size, 96px) + 8px), 31vw) !important;
    }

    .jbm-circle__image {
        width: min(var(--jbm-circle-size, 96px), 27vw) !important;
        height: min(var(--jbm-circle-size, 96px), 27vw) !important;
    }
}


/* =========================================================
   JBM CUSTOM SHOP 1.1.3
   Max-width volledig via shortcode
   ========================================================= */

/*
   max_width wordt nu alleen nog via de shortcode/inline CSS-var bepaald.
   Voorbeeld:
   max_width bepaalt nu de daadwerkelijke maximale breedte.
*/
.jbm-shop--full-width {
    width: 100% !important;
    max-width: var(--jbm-shop-max-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.fusion-builder-row .jbm-shop--full-width,
.fusion-row .jbm-shop--full-width,
.post-content .jbm-shop--full-width,
.entry-content .jbm-shop--full-width {
    width: 100% !important;
    max-width: var(--jbm-shop-max-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}


/* =========================================================
   JBM CUSTOM SHOP 1.1.5
   Custom dropdowns zoals ontwerp + kleurbolletjes
   ========================================================= */

.jbm-shop__filters--custom {
    position: relative;
    z-index: 30;
    overflow: visible !important;
}

.jbm-filter--custom {
    position: relative;
    display: inline-flex;
    min-width: max-content;
    overflow: visible;
}

.jbm-filter__toggle {
    appearance: none;
    -webkit-appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    min-height: 54px;
    min-width: 175px;
    padding: 0 23px;
    border: 2px solid var(--jbm-text);
    border-radius: 999px;
    background: transparent;
    color: var(--jbm-text);
    font-family: inherit;
    font-size: var(--jbm-dropdown-font-size, 16px) !important;
    font-weight: 400;
    letter-spacing: 0.16em;
    line-height: 1;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color 180ms ease, border-color 180ms ease;
}

.jbm-filter__toggle:hover,
.jbm-filter.is-open .jbm-filter__toggle {
    background: rgba(255, 255, 255, 0.2);
}

.jbm-filter__chevron {
    position: relative;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
}

.jbm-filter__chevron::before {
    content: "";
    position: absolute;
    left: 3px;
    top: 3px;
    width: 16px;
    height: 16px;
    border-right: 3px solid currentColor;
    border-bottom: 3px solid currentColor;
    transform: rotate(45deg);
    transform-origin: 50% 50%;
}

.jbm-filter.is-open .jbm-filter__chevron::before {
    top: 8px;
    transform: rotate(225deg);
}

.jbm-filter__menu {
    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    z-index: 999;
    display: none;
    min-width: max(100%, 360px);
    max-width: min(92vw, 430px);
    max-height: min(72vh, 720px);
    overflow: auto;
    padding: 14px 16px 16px;
    border: 2px solid var(--jbm-text);
    border-radius: 42px;
    background: var(--jbm-bg, #f3eadf);
    color: var(--jbm-text);
    box-shadow: 0 18px 34px rgba(36, 49, 64, 0.12);
}

.jbm-filter.is-open .jbm-filter__menu {
    display: block;
}

.jbm-filter__option {
    appearance: none;
    -webkit-appearance: none;
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 20px;
    width: 100%;
    min-height: 58px;
    padding: 0 20px 0 10px;
    border: 0;
    border-bottom: 2px solid rgba(36, 49, 64, 0.72);
    background: transparent;
    color: var(--jbm-text);
    font-family: inherit;
    font-size: calc(var(--jbm-dropdown-font-size, 16px) * 1.18) !important;
    font-weight: 400;
    letter-spacing: 0.16em;
    line-height: 1.15;
    text-align: left;
    cursor: pointer;
}

.jbm-filter__option:last-child {
    border-bottom: 0;
}

.jbm-filter__option:hover,
.jbm-filter__option:focus {
    outline: none;
    background: rgba(255, 255, 255, 0.22);
}

.jbm-filter__option.is-selected .jbm-filter__option-label {
    font-weight: 700;
}

.jbm-filter__option-label {
    min-width: 0;
}

.jbm-filter__check {
    position: relative;
    width: 28px;
    height: 28px;
    opacity: 0;
}

.jbm-filter__option.is-selected .jbm-filter__check {
    opacity: 1;
}

.jbm-filter__check::before {
    content: "";
    position: absolute;
    left: 7px;
    top: 1px;
    width: 11px;
    height: 22px;
    border-right: 4px solid currentColor;
    border-bottom: 4px solid currentColor;
    transform: rotate(45deg);
}

.jbm-filter__color-dot {
    width: 38px;
    height: 38px;
    border-radius: 999px;
    background: var(--jbm-option-color);
    box-shadow: inset 0 0 0 1px rgba(36, 49, 64, 0.08);
}

.jbm-filter__color-dot[style*="#ffffff"],
.jbm-filter__color-dot[style*="#fff"],
.jbm-filter__color-dot[style*="white"] {
    box-shadow: inset 0 0 0 1px rgba(36, 49, 64, 0.18);
}

/* Sorteren heeft geen kleurbolletjes, dus label/check moeten netjes uitlijnen. */
.jbm-filter--sort .jbm-filter__option,
.jbm-filter--price .jbm-filter__option,
.jbm-filter--taxonomy:not(.jbm-filter--pa_kleur) .jbm-filter__option {
    grid-template-columns: minmax(0, 1fr) auto;
    padding-left: 14px;
}

/* Op kleinere schermen blijven de menu's bruikbaar en breken filters netjes. */
@media (max-width: 760px) {
    .jbm-filter--custom {
        min-width: 0;
    }

    .jbm-filter__toggle {
        min-width: 0;
        width: 100%;
        min-height: 50px;
        padding: 0 18px;
        gap: 14px;
        letter-spacing: 0.11em;
    }

    .jbm-filter__menu {
        min-width: min(92vw, 390px);
        max-width: 92vw;
        border-radius: 32px;
    }

    .jbm-filter__option {
        min-height: 54px;
        font-size: calc(var(--jbm-dropdown-font-size, 16px) * 1.05) !important;
        letter-spacing: 0.11em;
    }

    .jbm-filter__color-dot {
        width: 32px;
        height: 32px;
    }
}

@media (max-width: 430px) {
    .jbm-filter__menu {
        position: fixed;
        left: 12px;
        right: 12px;
        top: auto;
        bottom: 18px;
        min-width: 0;
        width: auto;
        max-width: none;
        max-height: 68vh;
    }
}


/* =========================================================
   JBM CUSTOM SHOP 1.1.6
   Dropdown font gelijk + dubbele indicator weg
   ========================================================= */

/*
   In de open dropdown is de optie-font nu gelijk aan de font
   van de gesloten dropdownknop.
*/
.jbm-filter__option {
    font-size: var(--jbm-dropdown-font-size, 16px) !important;
}

/*
   Oude dropdown-indicatoren uit eerdere select-styling/Avada mogen niet
   meer zichtbaar zijn bij de custom dropdowns.
*/
.jbm-filter--custom::before,
.jbm-filter--custom::after,
.jbm-shop__filters--custom .jbm-filter::before,
.jbm-shop__filters--custom .jbm-filter::after {
    content: none !important;
    display: none !important;
}

.jbm-shop__filters--custom .jbm-filter__select,
.jbm-shop__filters--custom select {
    background-image: none !important;
}

/* Alleen de nieuwe indicator blijft zichtbaar. */
.jbm-filter--custom .jbm-filter__chevron {
    display: inline-block !important;
}

.jbm-filter--custom .jbm-filter__toggle::before,
.jbm-filter--custom .jbm-filter__toggle::after {
    content: none !important;
    display: none !important;
}

@media (max-width: 760px) {
    .jbm-filter__option {
        font-size: var(--jbm-dropdown-font-size, 16px) !important;
    }
}


/* =========================================================
   JBM CUSTOM SHOP 1.1.9
   Actieve filters + subtiele verwijderknop
   ========================================================= */

.jbm-shop__active-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 14px;
    width: 100%;
    margin: clamp(14px, 1.5vw, 24px) 0 clamp(18px, 1.8vw, 30px);
}

.jbm-shop__active-filters[hidden] {
    display: none !important;
}

.jbm-active-filters__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9px;
}

.jbm-active-filter,
.jbm-active-filters__clear {
    appearance: none;
    -webkit-appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 34px;
    padding: 7px 13px;
    border: 1.5px solid rgba(36, 49, 64, 0.55);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.18);
    color: var(--jbm-text);
    font-family: inherit;
    font-size: max(12px, calc(var(--jbm-dropdown-font-size, 16px) * 0.78)) !important;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.08em;
    cursor: pointer;
    transition: background-color 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.jbm-active-filter:hover,
.jbm-active-filter:focus,
.jbm-active-filters__clear:hover,
.jbm-active-filters__clear:focus {
    outline: none;
    background: rgba(255, 255, 255, 0.34);
    border-color: var(--jbm-text);
}

.jbm-active-filter__x {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    font-size: 18px;
    line-height: 1;
    transform: translateY(-1px);
}

.jbm-active-filters__clear {
    border-color: transparent;
    background: transparent;
    text-decoration: underline;
    text-underline-offset: 4px;
    opacity: 0.78;
    padding-left: 4px;
    padding-right: 4px;
}

.jbm-active-filters__clear:hover,
.jbm-active-filters__clear:focus {
    opacity: 1;
    background: transparent;
    border-color: transparent;
}

@media (max-width: 760px) {
    .jbm-shop__active-filters {
        gap: 8px 10px;
        margin-top: 12px;
    }

    .jbm-active-filter,
    .jbm-active-filters__clear {
        min-height: 32px;
        font-size: 12px !important;
        letter-spacing: 0.05em;
    }
}


/* =========================================================
   JBM CUSTOM SHOP 1.2.0
   Multi-select dropdowns
   ========================================================= */

.jbm-filter.is-multiple .jbm-filter__option.is-selected {
    background: rgba(255, 255, 255, 0.24);
}

.jbm-filter.is-multiple .jbm-filter__menu {
    padding-bottom: 18px;
}

.jbm-filter.is-multiple .jbm-filter__option {
    cursor: pointer;
}

/* Bij multi-select blijft het dropdown-paneel open na kiezen; vinkjes tonen de actieve keuzes. */
.jbm-filter.is-multiple .jbm-filter__check::before {
    border-right-width: 4px;
    border-bottom-width: 4px;
}


/* =========================================================
   JBM CUSTOM SHOP 1.2.2
   Extra harde beveiliging voor show_circles="no"
   ========================================================= */

.jbm-shop--no-circles .jbm-shop__circles {
    display: none !important;
}


/* =========================================================
   JBM CUSTOM SHOP 1.2.3
   Definitieve fallback: circles echt verbergen
   ========================================================= */

/* Ook als een oude template of cache de markup nog rendert, verdwijnt het blok zodra data-show-circles no is. */
.jbm-shop[data-show-circles="no"] .jbm-shop__circles,
.jbm-shop--no-circles .jbm-shop__circles {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}


/* =========================================================
   JBM CUSTOM SHOP 1.2.4
   Intro breedte gelijk aan shop max-width
   ========================================================= */

/*
   De intro had in eerdere styling nog een beperkende max-width.
   Deze regels zetten header/intro gelijk met de volledige shopbreedte.
*/
.jbm-shop__header,
.jbm-shop__intro {
    width: 100% !important;
    max-width: none !important;
}

.jbm-shop__intro {
    display: block;
    margin-left: 0 !important;
    margin-right: 0 !important;
}


/* =========================================================
   JBM CUSTOM SHOP 1.3.4
   Typografie lock: shortcode en categoriepagina's gelijk houden
   ========================================================= */

/*
   Avada/Fusion voegt soms fusion-responsive-typography-calculated toe aan headings.
   Binnen de JBM shop mag die globale heading-styling niet winnen.
   Deze regels zetten intro, filters, producttitels en prijzen terug naar
   exact de shortcode-variabelen.
*/

.jbm-shop .fusion-responsive-typography-calculated {
    text-transform: none !important;
}

.jbm-shop .jbm-shop__intro,
.jbm-shop p.jbm-shop__intro,
html body.tax-product_cat .jbm-shop .jbm-shop__intro,
html body.tax-product_cat .jbm-shop p.jbm-shop__intro {
    width: 100% !important;
    max-width: none !important;
    margin-top: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    color: var(--jbm-text) !important;
    font-family: var(--jbm-font-body) !important;
    font-size: var(--jbm-text-font-size, 21px) !important;
    font-weight: 400 !important;
    line-height: 1.55 !important;
    letter-spacing: 0.13em !important;
    text-transform: none !important;
}

.jbm-shop .jbm-filter__toggle,
.jbm-shop .jbm-filter__select,
html body.tax-product_cat .jbm-shop .jbm-filter__toggle,
html body.tax-product_cat .jbm-shop .jbm-filter__select {
    font-family: var(--jbm-font-body) !important;
    font-size: var(--jbm-dropdown-font-size, 16px) !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    letter-spacing: 0.16em !important;
    text-transform: none !important;
}

.jbm-shop .jbm-filter__option,
.jbm-shop .jbm-filter__option-label,
html body.tax-product_cat .jbm-shop .jbm-filter__option,
html body.tax-product_cat .jbm-shop .jbm-filter__option-label {
    font-family: var(--jbm-font-body) !important;
    font-size: calc(var(--jbm-dropdown-font-size, 16px) * 1.18) !important;
    font-weight: 400 !important;
    line-height: 1.15 !important;
    letter-spacing: 0.16em !important;
    text-transform: none !important;
}

.jbm-shop .jbm-product-card__title,
.jbm-shop h2.jbm-product-card__title,
.jbm-shop .jbm-product-card__title.fusion-responsive-typography-calculated,
.jbm-shop h2.jbm-product-card__title.fusion-responsive-typography-calculated,
html body.tax-product_cat .jbm-shop .jbm-product-card__title,
html body.tax-product_cat .jbm-shop h2.jbm-product-card__title {
    max-width: 92% !important;
    margin: 14px auto 0 !important;
    color: var(--jbm-text) !important;
    font-family: var(--jbm-font-body) !important;
    font-size: var(--jbm-product-title-font-size, 20px) !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.08em !important;
    text-align: center !important;
    text-transform: none !important;
}

.jbm-shop .jbm-product-card__title a,
.jbm-shop h2.jbm-product-card__title a,
.jbm-shop .jbm-product-card__title.fusion-responsive-typography-calculated a,
html body.tax-product_cat .jbm-shop .jbm-product-card__title a {
    color: inherit !important;
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
    text-transform: none !important;
}

.jbm-shop .jbm-product-card__price,
.jbm-shop .jbm-product-card__price *,
html body.tax-product_cat .jbm-shop .jbm-product-card__price,
html body.tax-product_cat .jbm-shop .jbm-product-card__price * {
    color: var(--jbm-text) !important;
    font-family: var(--jbm-font-body) !important;
    font-size: var(--jbm-product-price-font-size, 22px) !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    letter-spacing: 0.06em !important;
    text-transform: none !important;
}

/* Count/status en knoppen ook binnen dezelfde shop-typografie houden. */
.jbm-shop .jbm-shop__count,
.jbm-shop .jbm-shop__load-more,
.jbm-shop .jbm-shop__all,
.jbm-shop .jbm-active-filter,
.jbm-shop .jbm-active-filters__clear {
    font-family: var(--jbm-font-body) !important;
    text-transform: none !important;
}

/* Op categoriepagina's dezelfde productkaartverhoudingen als shortcode behouden. */
html body.tax-product_cat .jbm-shop .jbm-product-card__media {
    width: 100% !important;
}

html body.tax-product_cat .jbm-shop .jbm-product-card__image img {
    width: 100% !important;
    height: auto !important;
}





/* =========================================================
   JBM CUSTOM SHOP 1.4.0
   Geen eigen Woo categorie-template meer
   ========================================================= */

/*
   Vanaf 1.4.0 neemt de plugin WooCommerce categoriepagina's niet meer over.
   Gebruik in Avada een Woo Category Page Layout met de shortcode:
   [jbm_custom_shop use_current_category="yes" ...]
   Avada bepaalt dan de pagina/wide-layout; de plugin rendert alleen de shopinhoud.
*/

/* =========================================================
   JBM CUSTOM SHOP 1.4.3
   Full-width zonder extra zijpadding
   ========================================================= */

/*
   Avada bepaalt de buitenste pagina/layout. De shortcode zelf vult de
   beschikbare Avada-ruimte zonder extra zijpadding.
   max_width blijft als shortcode-attribuut bestaan voor compatibiliteit,
   maar begrenst full_width="yes" niet meer.
*/
.jbm-shop--full-width,
.fusion-builder-row .jbm-shop--full-width,
.fusion-row .jbm-shop--full-width,
.post-content .jbm-shop--full-width,
.entry-content .jbm-shop--full-width {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

@media (max-width: 760px) {
    .jbm-shop--full-width,
    .fusion-builder-row .jbm-shop--full-width,
    .fusion-row .jbm-shop--full-width,
    .post-content .jbm-shop--full-width,
    .entry-content .jbm-shop--full-width {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}


/* =========================================================
   JBM CUSTOM SHOP 1.4.8
   Compacte filters en menu's binnen het scherm
   ========================================================= */

.jbm-shop .jbm-shop__filters--custom {
    gap: 10px !important;
}

.jbm-shop .jbm-filter__toggle {
    min-width: 148px;
    min-height: 46px;
    padding: 0 16px;
    gap: 12px;
    font-size: 16px !important;
    letter-spacing: 0.12em !important;
}

.jbm-shop .jbm-filter__chevron {
    width: 18px;
    height: 18px;
    flex-basis: 18px;
}

.jbm-shop .jbm-filter__chevron::before {
    left: 3px;
    top: 2px;
    width: 12px;
    height: 12px;
    border-right-width: 2px;
    border-bottom-width: 2px;
}

.jbm-shop .jbm-filter.is-open .jbm-filter__chevron::before {
    top: 6px;
}

.jbm-shop .jbm-filter__menu {
    min-width: max(100%, 280px);
    max-width: min(88vw, 340px);
    padding: 10px 12px 12px;
    border-radius: 30px;
}

.jbm-shop .jbm-filter__option,
.jbm-shop .jbm-filter__option-label {
    font-size: 16px !important;
    letter-spacing: 0.12em !important;
}

.jbm-shop .jbm-filter__option {
    min-height: 46px;
    padding: 0 12px 0 8px;
    gap: 12px;
}

.jbm-shop .jbm-filter--sort .jbm-filter__option,
.jbm-shop .jbm-filter--price .jbm-filter__option,
.jbm-shop .jbm-filter--taxonomy:not(.jbm-filter--pa_kleur) .jbm-filter__option {
    padding-left: 10px;
}

.jbm-shop .jbm-filter__check {
    width: 22px;
    height: 22px;
}

.jbm-shop .jbm-filter__check::before {
    left: 6px;
    width: 8px;
    height: 16px;
    border-right-width: 3px;
    border-bottom-width: 3px;
}

.jbm-shop .jbm-filter__color-dot {
    width: 30px;
    height: 30px;
}

.jbm-shop .jbm-filter__page-icon {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    margin-left: auto;
    color: currentColor;
}

.jbm-shop .jbm-filter__page-icon svg {
    display: block;
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* De laatste dropdown opent naar links en blijft zo binnen de pagina. */
.jbm-shop .jbm-filter--price .jbm-filter__menu {
    right: 0;
    left: auto;
}

@media (max-width: 760px) {
    .jbm-shop .jbm-filter__toggle {
        min-height: 44px;
        padding: 0 14px;
        font-size: 16px !important;
    }

    .jbm-shop .jbm-filter__option,
    .jbm-shop .jbm-filter__option-label {
        font-size: 16px !important;
    }

    .jbm-shop .jbm-filter__option {
        min-height: 44px;
    }
}

/* Filteropties duidelijk markeren bij hover en wanneer ze geselecteerd zijn. */
html body .jbm-shop .jbm-filter__option:hover .jbm-filter__option-label,
html body .jbm-shop .jbm-filter__option:focus-visible .jbm-filter__option-label,
html body .jbm-shop .jbm-filter__option.is-selected .jbm-filter__option-label,
html body .jbm-shop .jbm-filter__option[aria-selected="true"] .jbm-filter__option-label {
    font-weight: 700 !important;
}

/* =========================================================
   JBM SINGLE PRODUCT SHORTCODES
   ========================================================= */

.jbm-google-rating,
.jbm-product-attributes,
.jbm-product-usps,
.jbm-product-faqs,
.jbm-color-related,
.jbm-review-carousel {
    --jbm-product-text: #283342;
    --jbm-product-border: rgba(40, 51, 66, 0.78);
    --jbm-product-border-soft: rgba(40, 51, 66, 0.22);
    --jbm-product-cream: #f5efe6;
    --jbm-product-sage: #9fbebb;
    --jbm-product-gold: #d6a33d;
    box-sizing: border-box;
    color: var(--jbm-product-text);
}

.jbm-google-rating *,
.jbm-product-attributes *,
.jbm-product-usps *,
.jbm-product-faqs *,
.jbm-color-related *,
.jbm-review-carousel * {
    box-sizing: border-box;
}

.jbm-google-rating {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    width: fit-content;
    margin: 10px 0;
    color: var(--jbm-product-text);
    font-size: 15px;
    line-height: 1.4;
    text-decoration: none;
}

a.jbm-google-rating:hover,
a.jbm-google-rating:focus-visible {
    color: var(--jbm-product-text);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.jbm-google-rating__label {
    font-weight: 600;
}

.jbm-stars {
    position: relative;
    display: inline-block;
    overflow: hidden;
    font-size: 20px;
    line-height: 1;
    letter-spacing: 1px;
    white-space: nowrap;
}

.jbm-stars__base {
    color: rgba(40, 51, 66, 0.2);
}

.jbm-stars__fill {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    display: block;
    overflow: hidden;
    color: var(--jbm-product-gold);
    white-space: nowrap;
}

.jbm-google-rating__score {
    font-weight: 700;
}

.jbm-google-rating__count {
    opacity: 0.76;
}

.jbm-product-attributes {
    display: grid;
    gap: 0;
    margin: 0;
    padding: clamp(18px, 2vw, 28px);
    border: 1px solid var(--jbm-product-border);
}

.jbm-product-attributes__row {
    display: grid;
    grid-template-columns: minmax(105px, 0.85fr) minmax(0, 1.6fr);
    gap: 14px;
    padding: 9px 0;
    border-bottom: 1px solid var(--jbm-product-border-soft);
    font-size: 16px;
    line-height: 1.45;
}

.jbm-product-attributes__row:first-child {
    padding-top: 0;
}

.jbm-product-attributes__row:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.jbm-product-attributes dt,
.jbm-product-attributes dd {
    margin: 0;
}

.jbm-product-attributes dt {
    font-weight: 700;
}

.jbm-product-usps {
    margin: 22px 0;
}

.jbm-product-usps__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 28px;
    padding: 20px 0;
    border-top: 1px solid var(--jbm-product-border-soft);
    border-bottom: 1px solid var(--jbm-product-border-soft);
}

.jbm-product-usps__item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
}

.jbm-product-usps__icon {
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    object-fit: contain;
}

.jbm-product-usps__icon--svg {
    overflow: visible;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.jbm-product-usps__item h3 {
    margin: 0 0 3px !important;
    color: var(--jbm-product-text) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
}

.jbm-product-usps__item p {
    margin: 0;
    font-size: 13px;
    line-height: 1.4;
}

.jbm-product-usps__payments {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

.jbm-product-usps__payments img,
.jbm-product-usps__gateway img {
    display: block;
    width: auto;
    max-width: 68px;
    height: 28px;
    object-fit: contain;
}

.jbm-product-usps__gateway {
    display: inline-flex;
}

.jbm-payment-brand {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-width: 66px;
    height: 34px;
    padding: 4px 8px;
    overflow: hidden;
    border: 1px solid rgba(40, 51, 66, 0.12);
    border-radius: 3px;
    color: #26334a;
    background: #fff;
    font-family: Arial, sans-serif;
    font-size: 12px;
    line-height: 1;
}

.jbm-payment-brand strong {
    font: 800 12px/1 Arial, sans-serif;
    letter-spacing: -0.03em;
}

.jbm-payment-brand--ideal {
    min-width: 56px;
}

.jbm-payment-brand__ideal-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 25px;
    border-radius: 10px 10px 3px 10px;
    color: #fff;
    background: #cc1971;
    font-size: 9px;
    font-weight: 800;
}

.jbm-payment-brand--wero {
    color: #101010;
    background: #efe62c;
}

.jbm-payment-brand--wero strong {
    font-size: 14px;
}

.jbm-payment-circles {
    position: relative;
    display: block;
    width: 32px;
    height: 20px;
}

.jbm-payment-circles i {
    position: absolute;
    top: 1px;
    width: 19px;
    height: 19px;
    border-radius: 50%;
}

.jbm-payment-circles i:first-child {
    left: 0;
    background: #e51b32;
}

.jbm-payment-circles i:last-child {
    right: 0;
    background: #f29b1a;
    opacity: 0.92;
}

.jbm-payment-brand--maestro {
    flex-direction: column;
    gap: 0;
    padding-top: 2px;
    padding-bottom: 1px;
}

.jbm-payment-brand--maestro .jbm-payment-circles {
    height: 19px;
}

.jbm-payment-brand--maestro .jbm-payment-circles i:first-child {
    background: #e51b32;
}

.jbm-payment-brand--maestro .jbm-payment-circles i:last-child {
    background: #1684c7;
}

.jbm-payment-brand--maestro small {
    color: #26334a;
    font-size: 7px;
    line-height: 1;
}

.jbm-payment-brand--visa strong {
    color: #1a4a9a;
    font-size: 18px;
    font-style: italic;
}

.jbm-payment-brand--sepa strong {
    color: #225397;
    font-size: 15px;
}

.jbm-payment-brand--sepa strong span {
    color: #f2b820;
}

.jbm-product-faqs,
.jbm-color-related,
.jbm-review-carousel {
    margin: clamp(42px, 6vw, 90px) 0;
}

.jbm-product-faqs > h2,
.jbm-color-related > h2,
.jbm-review-carousel > h2 {
    margin: 0 0 24px !important;
    color: var(--jbm-product-text) !important;
    font-size: clamp(28px, 3vw, 44px) !important;
    font-weight: 400 !important;
    line-height: 1.15 !important;
    text-align: center;
}

.jbm-product-faqs__list {
    max-width: 920px;
    margin: 0 auto;
    border-top: 1px solid var(--jbm-product-border);
}

.jbm-product-faq {
    border-bottom: 1px solid var(--jbm-product-border);
}

.jbm-product-faq summary {
    position: relative;
    padding: 18px 42px 18px 0;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.4;
    cursor: pointer;
    list-style: none;
}

.jbm-product-faq summary::-webkit-details-marker {
    display: none;
}

.jbm-product-faq summary span::before,
.jbm-product-faq summary span::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 8px;
    width: 16px;
    height: 1px;
    background: currentColor;
    transition: transform 180ms ease;
}

.jbm-product-faq summary span::after {
    transform: rotate(90deg);
}

.jbm-product-faq[open] summary span::after {
    transform: rotate(0deg);
}

.jbm-product-faq__answer {
    max-width: 780px;
    padding: 0 42px 18px 0;
    font-size: 16px;
    line-height: 1.65;
}

.jbm-product-faq__answer p {
    margin: 0 0 12px;
}

.jbm-product-faq__answer p:last-child {
    margin-bottom: 0;
}

.jbm-color-related__grid {
    display: grid;
    grid-template-columns: minmax(210px, 1.3fr) repeat(3, minmax(0, 1fr));
    gap: clamp(18px, 2.5vw, 38px);
    align-items: center;
    padding: clamp(22px, 3vw, 42px);
    background: rgba(213, 187, 173, 0.2);
}

.jbm-color-related__intro {
    align-self: center;
}

.jbm-color-related__intro h2 {
    margin: 0 0 8px !important;
    color: var(--jbm-product-text) !important;
    font-size: clamp(20px, 2vw, 28px) !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-align: left;
    text-transform: uppercase;
}

.jbm-color-related__intro p {
    margin: 0;
    font-size: clamp(16px, 1.5vw, 20px);
    line-height: 1.4;
}

.jbm-related-card__media {
    position: relative;
    display: block;
    overflow: hidden;
    aspect-ratio: 3 / 4;
    background: var(--jbm-product-cream);
}

.jbm-related-card__media img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 260ms ease, transform 360ms ease;
}

.jbm-related-card__hover {
    opacity: 0;
}

.jbm-related-card__media:hover .jbm-related-card__primary,
.jbm-related-card__media:focus-visible .jbm-related-card__primary {
    opacity: 0;
}

.jbm-related-card__media:hover .jbm-related-card__hover,
.jbm-related-card__media:focus-visible .jbm-related-card__hover {
    opacity: 1;
    transform: scale(1.02);
}

.jbm-related-card h3 {
    margin: 12px 0 5px !important;
    color: var(--jbm-product-text) !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;
}

.jbm-related-card h3 a {
    color: inherit;
    text-decoration: none;
}

.jbm-related-card__price {
    color: var(--jbm-product-text);
    font-size: 17px;
    line-height: 1.35;
}

.jbm-review-carousel {
    position: relative;
    max-width: 680px;
    margin-right: auto;
    margin-left: auto;
    padding: clamp(20px, 3vw, 34px);
    border: 1px solid var(--jbm-product-border);
    box-shadow: 0 12px 34px rgba(40, 51, 66, 0.1);
}

.jbm-review-carousel__viewport {
    min-height: 0;
}

.jbm-review-carousel__slide {
    margin: 0;
    text-align: center;
}

.jbm-review-carousel__slide[hidden] {
    display: none;
}

.jbm-review-carousel__slide blockquote {
    max-width: 760px;
    margin: 0 auto;
    padding: 0;
    border: 0;
    color: var(--jbm-product-text);
    font-size: clamp(17px, 1.8vw, 22px);
    font-family: Georgia, 'Times New Roman', serif;
    font-style: italic;
    line-height: 1.65;
}

.jbm-review-carousel__slide figcaption {
    margin-top: 16px;
    font-size: 15px;
    font-weight: 400;
}

.jbm-review-carousel__controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-top: 24px;
}

.jbm-review-carousel__arrow,
.jbm-review-carousel__dots button {
    appearance: none;
    padding: 0;
    border: 0;
    color: var(--jbm-product-text);
    background: transparent;
    cursor: pointer;
}

.jbm-review-carousel__arrow {
    width: 34px;
    height: 34px;
    font-size: 28px;
    line-height: 30px;
}

.jbm-review-carousel__dots {
    display: flex;
    align-items: center;
    gap: 8px;
}

.jbm-review-carousel__dots button {
    width: 9px;
    height: 9px;
    border: 1px solid var(--jbm-product-text);
    border-radius: 50%;
}

.jbm-review-carousel__dots button.is-active {
    background: var(--jbm-product-text);
}

@media (max-width: 760px) {
    .jbm-product-usps__list,
    .jbm-color-related__grid {
        grid-template-columns: 1fr;
    }

    .jbm-product-usps__list {
        gap: 16px;
    }

    .jbm-color-related__grid {
        max-width: 520px;
        margin: 0 auto;
    }

    .jbm-product-attributes__row {
        grid-template-columns: 96px minmax(0, 1fr);
    }

    .jbm-review-carousel {
        padding: 26px 20px;
    }
}

@media (min-width: 761px) and (max-width: 1100px) {
    .jbm-color-related__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .jbm-color-related__intro {
        grid-column: 1 / -1;
    }
}

/* =========================================================
   PRODUCT DETAIL DESIGN REFINEMENTS — 1.6.3
   ========================================================= */

.jbm-product-attributes,
.jbm-product-usps,
.jbm-product-faqs,
.jbm-color-related,
.jbm-review-carousel {
    font-family: inherit;
}

/* Productkenmerken horen zonder kader onder de korte omschrijving. */
.jbm-product-attributes {
    padding: 0;
    border: 0;
    background: transparent;
}

.jbm-product-attributes__row,
.jbm-product-attributes__row:first-child,
.jbm-product-attributes__row:last-child {
    padding: 3px 0;
    border: 0;
}

/* De betaalmerken zijn rechtstreeks uit het aangeleverde ontwerp gehaald. */
.jbm-product-usps__payments {
    gap: 8px;
}

.jbm-product-usps__payments img.jbm-payment-logo {
    display: block;
    width: auto;
    max-width: none;
    height: 38px;
    object-fit: contain;
}

.jbm-product-usps__payments img.jbm-payment-logo--ideal-wero {
    width: 101px;
}

/* FAQ: links uitgelijnd en typografisch gelijk aan het ontwerp. */
.jbm-product-faqs {
    width: 100%;
    text-align: left;
}

.jbm-product-faqs > h2 {
    margin-bottom: 20px !important;
    font-family: inherit !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
}

.jbm-product-faqs__list {
    width: 100%;
    max-width: none;
    margin: 0;
}

.jbm-product-faq summary {
    font-family: inherit;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    text-align: left;
}

.jbm-product-faq__answer {
    font-family: inherit;
    font-size: 15px;
    line-height: 1.55;
    text-align: left;
}

/* Collectieblok: compacte ontwerp-typografie, vierkante beelden en centrering. */
.jbm-color-related__intro h2 {
    font-family: inherit !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
}

.jbm-color-related__intro p {
    font-family: inherit;
    font-size: 17px;
}

.jbm-related-card__media {
    aspect-ratio: 1 / 1;
}

.jbm-related-card h3 {
    font-family: inherit !important;
    font-size: 15px !important;
    text-align: center;
}

.jbm-related-card__price {
    font-family: inherit;
    font-size: 15px;
    text-align: center;
}

/* Quote: lichte ontwerp-rand, geen Avada-blockquote-rand of schaduw. */
.jbm-review-carousel {
    max-width: 610px;
    padding: 22px 40px;
    border: 1px solid #dfcfc1;
    box-shadow: none;
}

.jbm-review-carousel__slide {
    max-width: 520px;
    margin: 0 auto;
}

.jbm-review-carousel__slide blockquote {
    max-width: none;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-left: 0 !important;
    color: var(--jbm-product-text) !important;
    background: transparent !important;
    box-shadow: none !important;
    font-family: Georgia, 'Times New Roman', serif !important;
    font-size: 17px !important;
    font-style: italic !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    text-align: center;
    quotes: none;
}

.jbm-review-carousel__slide blockquote::before,
.jbm-review-carousel__slide blockquote::after {
    display: none !important;
    content: none !important;
}

.jbm-review-carousel__slide figcaption {
    margin-top: 12px;
    font-family: inherit;
    font-size: 15px;
    font-weight: 400;
    text-align: left;
}

/* Avada + TI Wishlist: bestelknop en verlanglijstje op één regel. */
.single-product .fusion-woo-cart form.cart {
    display: flex !important;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px 22px;
}

.single-product .fusion-woo-cart form.cart .fusion-button-wrapper {
    display: inline-flex;
    flex: 0 0 auto;
    margin: 0 !important;
}

.single-product .fusion-woo-cart form.cart .quantity {
    display: none !important;
}

.single-product .fusion-woo-cart .single_add_to_cart_button {
    margin: 0 !important;
    text-transform: none !important;
}

.single-product .fusion-woo-cart form.cart .tinv-wraper.tinv-wishlist {
    display: inline-flex !important;
    align-items: center;
    flex: 0 1 auto;
    width: auto !important;
    margin: 0 !important;
}

.single-product .fusion-woo-cart form.cart .tinvwl_add_to_wishlist_button {
    display: inline-flex !important;
    align-items: center;
    width: auto !important;
    margin: 0 !important;
    font-family: inherit;
    text-transform: none;
}

.single-product .fusion-woo-cart form.cart .tinv-wishlist-clear,
.single-product .fusion-woo-cart form.cart .tinvwl-tooltip {
    display: none !important;
}

@media (max-width: 760px) {
    .jbm-review-carousel {
        padding: 22px 20px;
    }
}

/* =========================================================
   PRODUCT DETAIL DESIGN REFINEMENTS — 1.6.4
   ========================================================= */

/* FAQ: dezelfde begrensde kolombreedte als in het ontwerp. */
.jbm-product-faqs {
    width: calc(100% - 32px);
    max-width: 920px;
    margin-right: auto;
    margin-left: auto;
}

.jbm-product-faqs__list {
    width: 100%;
    max-width: 920px;
    margin: 0;
}

/* Eén caret die gesloten naar beneden en geopend naar boven wijst. */
.jbm-product-faq summary span::before {
    content: "^";
    top: 50%;
    right: 8px;
    width: auto;
    height: auto;
    color: currentColor;
    background: transparent;
    font-family: Arial, sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 1;
    transform: translateY(-35%) rotate(180deg);
    transform-origin: center;
}

.jbm-product-faq summary span::after {
    display: none;
    content: none;
}

.jbm-product-faq[open] summary span::before {
    transform: translateY(-35%) rotate(0deg);
}

/* USP's: één typografische regel per punt, grotere iconen en geen lijnen. */
.jbm-product-usps__list {
    gap: 18px 34px;
    padding: 8px 0;
    border-top: 0;
    border-bottom: 0;
}

.jbm-product-usps__item {
    align-items: center;
    gap: 14px;
}

.jbm-product-usps__icon {
    flex-basis: 44px;
    width: 44px;
    height: 44px;
}

.jbm-product-usps__item p {
    margin: 0 !important;
    color: var(--jbm-product-text);
    font-family: inherit;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.45;
}

@media (max-width: 760px) {
    .jbm-product-faqs {
        width: 100%;
    }

    .jbm-product-usps__icon {
        flex-basis: 40px;
        width: 40px;
        height: 40px;
    }
}

/* =========================================================
   FAQ ALIGNMENT REFINEMENT — 1.6.5
   ========================================================= */

.jbm-product-faqs {
    margin-right: auto;
    margin-left: 0;
}

.jbm-product-faq summary span {
    position: absolute;
    top: 50%;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    transform: translateY(-50%);
    pointer-events: none;
}

.jbm-product-faq summary span::before {
    position: static;
    display: block;
    width: 14px;
    height: 14px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    background: transparent;
    content: "";
    transform: translateY(-3px) rotate(45deg);
    transform-origin: center;
}

.jbm-product-faq[open] summary span::before {
    transform: translateY(3px) rotate(-135deg);
}

/* =========================================================
   CONTACT CTA — centered divider
   ========================================================= */

.jbm-contact-cta {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
}

.jbm-contact-cta-left,
.jbm-contact-cta-right {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
}

.jbm-contact-cta-right {
    position: relative !important;
    border-left: 0 !important;
}

.jbm-contact-cta-right::before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: -36px;
    width: 2px;
    background: #e5755b;
    content: '';
}

@media (max-width: 800px) {
    .jbm-contact-cta {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .jbm-contact-cta-right::before {
        display: none;
    }
}

/* =========================================================
   EVENTS PAGE — 1.7.5
   ========================================================= */

.jbm-events,
.jbm-events *,
.jbm-events *::before,
.jbm-events *::after {
    box-sizing: border-box;
}

.jbm-events {
    --jbm-events-text: #283342;
    --jbm-events-card: #eee1d5;
    --jbm-events-date: #d9b8a8;
    --jbm-events-coral: #ed6652;
    width: 100%;
    margin: 0 auto;
    padding: clamp(18px, 2vw, 30px) 0 clamp(54px, 7vw, 100px);
    color: var(--jbm-events-text);
}

.jbm-events a {
    color: inherit;
    text-decoration: none;
}

.jbm-events__section {
    margin: 0 0 clamp(66px, 7vw, 108px);
}

.jbm-events--overview {
    padding-bottom: 0;
}

.jbm-events--overview .jbm-events__section:last-child {
    margin-bottom: 0;
}

.jbm-events__section-title {
    margin: 0 0 clamp(20px, 2.2vw, 32px) !important;
    color: var(--jbm-events-text) !important;
    font-family: var(--h3_typography-font-family, Georgia, 'Times New Roman', serif) !important;
    font-size: clamp(25px, 2vw, 34px) !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

.jbm-events__featured-list {
    display: grid;
    gap: 24px;
}

.jbm-events__featured-card {
    display: grid;
    grid-template-columns: minmax(260px, 31%) minmax(0, 1fr);
    min-height: 350px;
    overflow: hidden;
    background: var(--jbm-events-card);
}

.jbm-events__featured-card--no-image {
    grid-template-columns: 1fr;
}

.jbm-events__featured-media {
    display: block;
    min-height: 100%;
    overflow: hidden;
}

.jbm-events__featured-media img,
.jbm-events__card-media img,
.jbm-events__past-card img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 300ms ease;
}

.jbm-events__featured-card:hover .jbm-events__featured-media img,
.jbm-events__card:hover .jbm-events__card-media img,
.jbm-events__past-card:hover img {
    transform: scale(1.025);
}

.jbm-events__featured-content {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.jbm-events__date {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 64px;
    padding: 10px 18px;
    color: #fff;
    background: var(--jbm-events-date);
    font-size: clamp(22px, 2.25vw, 34px);
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.18em;
    text-align: center;
}

.jbm-events__featured-body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: center;
    padding: clamp(28px, 3vw, 50px);
}

.jbm-events__featured-body h3,
.jbm-events__card-body h3 {
    margin: 0 !important;
    color: var(--jbm-events-text) !important;
    font-family: var(--h3_typography-font-family, Georgia, 'Times New Roman', serif) !important;
    font-size: clamp(20px, 1.55vw, 27px) !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

.jbm-events__featured-body p,
.jbm-events__card-body p {
    margin: 24px 0 0;
    color: var(--jbm-events-text);
    font-size: clamp(15px, 1.05vw, 18px);
    font-weight: 400;
    line-height: 1.55;
    letter-spacing: 0.105em;
}

.jbm-events__meta {
    margin-top: auto;
    padding-top: 26px;
    color: var(--jbm-events-text);
    font-size: clamp(13px, 0.95vw, 16px);
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: 0.08em;
}

.jbm-events__meta span {
    display: block;
}

.jbm-events__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(22px, 2.2vw, 34px);
    align-items: stretch;
}

.jbm-events__card {
    display: flex;
    min-width: 0;
    min-height: 590px;
    flex-direction: column;
    overflow: hidden;
    background: var(--jbm-events-card);
}

.jbm-events__card-media {
    display: block;
    width: 100%;
    aspect-ratio: 1.9 / 1;
    overflow: hidden;
    background: var(--jbm-events-date);
}

.jbm-events__card .jbm-events__date {
    min-height: 66px;
}

.jbm-events__card-body {
    display: flex;
    min-height: 300px;
    flex: 1 1 auto;
    flex-direction: column;
    padding: clamp(26px, 2.4vw, 38px) clamp(22px, 2vw, 32px) 24px;
}

.jbm-events__card-body h3 {
    font-size: clamp(19px, 1.4vw, 24px) !important;
}

.jbm-events__card-body .jbm-events__meta {
    text-align: center;
}

.jbm-events__past-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(14px, 1.6vw, 24px);
}

.jbm-events__past-card {
    position: relative;
    display: block;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: var(--jbm-events-date);
}

.jbm-events__past-overlay {
    position: absolute;
    inset: auto 0 0;
    display: flex;
    align-items: flex-end;
    min-height: 45%;
    padding: 18px;
    color: #fff;
    background: linear-gradient(transparent, rgba(40, 51, 66, 0.78));
    font-size: 15px;
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: 0.06em;
    opacity: 0;
    transition: opacity 200ms ease;
}

.jbm-events__past-card:hover .jbm-events__past-overlay,
.jbm-events__past-card:focus-visible .jbm-events__past-overlay {
    opacity: 1;
}

.jbm-events__shop-cta {
    display: flex;
    justify-content: center;
    margin-top: clamp(48px, 6vw, 92px);
}

.jbm-events--button-only {
    padding-top: 0;
}

.jbm-events__shop-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: min(100%, 640px);
    min-height: 72px;
    padding: 18px 36px;
    border-radius: 999px;
    color: #fff !important;
    background: var(--jbm-events-coral);
    font-size: clamp(16px, 1.35vw, 21px);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.1em;
    text-align: center;
    white-space: nowrap;
    transition: background-color 180ms ease, transform 180ms ease;
}

.jbm-events__shop-button:hover,
.jbm-events__shop-button:focus-visible {
    color: #fff !important;
    background: #dc5c49;
    transform: translateY(-2px);
}

.jbm-events__notice {
    margin: 0 0 40px;
    color: var(--jbm-events-text);
    font-size: 17px;
}

/* =========================================================
   SINGLE EVENT — JBM layout
   The Avada Page Title Bar supplies the page title.
   ========================================================= */

body.single-tribe_events #tribe-events-content .tribe-events-back,
body.single-tribe_events #tribe-events-content .tribe-events-single-event-title,
body.single-tribe_events #tribe-events-content .tribe-events-schedule,
body.single-tribe_events #tribe-events-content .tribe-events-event-image,
body.single-tribe_events #tribe-events-content .tribe-events-cal-links,
body.single-tribe_events #tribe-events-content .tribe-events-event-meta,
body.single-tribe_events #tribe-events-content .tribe-events-single-event-footer,
body.single-tribe_events #tribe-events-content .tribe-events-nav-pagination,
body.single-tribe_events #tribe-events-content .tribe-events-sub-nav,
body.single-tribe_events .fusion-events-single-title-content,
body.single-tribe_events .fusion-sharing-box {
    display: none !important;
}

body.single-tribe_events #content {
    width: 100% !important;
    margin-right: 0 !important;
}

body.single-tribe_events #sidebar {
    display: none !important;
}

body.single-tribe_events .tribe-events-single-event-description {
    width: 100%;
    max-width: none;
    margin: 0;
}

.jbm-single-event,
.jbm-single-event *,
.jbm-single-event *::before,
.jbm-single-event *::after {
    box-sizing: border-box;
}

.jbm-single-event {
    --jbm-single-text: #283342;
    --jbm-single-card: #eee1d5;
    --jbm-single-date: #d9b8a8;
    --jbm-single-coral: #ed6652;
    width: 100%;
    padding: clamp(20px, 2.5vw, 40px) 0 clamp(64px, 7vw, 110px);
    color: var(--jbm-single-text);
}

.jbm-single-event__layout {
    display: grid;
    grid-template-columns: minmax(0, 52%) minmax(0, 48%);
    min-height: clamp(500px, 45vw, 680px);
    overflow: hidden;
    background: var(--jbm-single-card);
}

.jbm-single-event__layout--no-image {
    grid-template-columns: 1fr;
    min-height: 0;
}

.jbm-single-event__media {
    min-width: 0;
    overflow: hidden;
    background: var(--jbm-single-date);
}

.jbm-single-event__media img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 100%;
    object-fit: cover;
}

.jbm-single-event__panel {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.jbm-single-event__date {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 84px;
    padding: 14px 24px;
    color: #fff;
    background: var(--jbm-single-date);
    font-size: clamp(24px, 2.3vw, 37px);
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.18em;
    text-align: center;
}

.jbm-single-event__body {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: center;
    padding: clamp(34px, 4.2vw, 68px);
}

.jbm-single-event__copy,
.jbm-single-event__copy p {
    color: var(--jbm-single-text);
    font-size: clamp(16px, 1.15vw, 19px);
    font-weight: 400;
    line-height: 1.65;
    letter-spacing: 0.075em;
}

.jbm-single-event__copy p {
    margin: 0 0 1.35em;
}

.jbm-single-event__copy > :last-child {
    margin-bottom: 0;
}

.jbm-single-event__meta {
    margin-top: clamp(28px, 3vw, 46px);
    color: var(--jbm-single-text);
    font-size: clamp(14px, 1vw, 17px);
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.075em;
}

.jbm-single-event__meta span {
    display: block;
}

.jbm-single-event__map-button {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    justify-content: center;
    min-height: 54px;
    margin-top: 30px;
    padding: 15px 31px;
    border: 0 !important;
    border-radius: 999px;
    color: #fff !important;
    background: var(--jbm-single-coral) !important;
    box-shadow: none !important;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.08em;
    text-decoration: none !important;
    white-space: nowrap;
    transition: background-color 180ms ease, transform 180ms ease;
}

.jbm-single-event__map-button::before,
.jbm-single-event__map-button::after {
    display: none !important;
    content: none !important;
}

.jbm-single-event__map-button:hover,
.jbm-single-event__map-button:focus-visible {
    color: #fff !important;
    background: #dc5c49 !important;
    transform: translateY(-2px);
}

.jbm-single-event__upcoming.jbm-events {
    margin: clamp(64px, 7vw, 108px) 0 0;
    padding: 0;
}

.jbm-single-event__upcoming .jbm-events__section-title {
    margin-bottom: clamp(22px, 2.3vw, 34px) !important;
}

@media (max-width: 980px) {
    .jbm-events__featured-card {
        grid-template-columns: minmax(220px, 38%) minmax(0, 1fr);
    }

    .jbm-events__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .jbm-events__past-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .jbm-single-event__layout {
        grid-template-columns: minmax(0, 48%) minmax(0, 52%);
    }
}

@media (max-width: 700px) {
    .jbm-events {
        padding-top: 8px;
    }

    .jbm-events__section {
        margin-bottom: 56px;
    }

    .jbm-events__featured-card {
        display: flex;
        min-height: 0;
        flex-direction: column;
    }

    .jbm-events__featured-media {
        aspect-ratio: 1.45 / 1;
    }

    .jbm-events__featured-body {
        min-height: 290px;
        padding: 28px 22px;
    }

    .jbm-events__grid {
        grid-template-columns: 1fr;
    }

    .jbm-events__card {
        min-height: 0;
    }

    .jbm-events__card-body {
        min-height: 290px;
    }

    .jbm-events__past-grid {
        gap: 12px;
    }

    .jbm-events__past-overlay {
        display: none;
    }

    .jbm-events__shop-button {
        min-height: 60px;
        padding: 16px 12px;
        font-size: 11px;
        letter-spacing: 0.04em;
    }

    .jbm-single-event {
        padding-top: 8px;
    }

    .jbm-single-event__layout {
        display: flex;
        min-height: 0;
        flex-direction: column;
    }

    .jbm-single-event__media {
        aspect-ratio: 1 / 1;
    }

    .jbm-single-event__date {
        min-height: 68px;
    }

    .jbm-single-event__body {
        padding: 32px 24px 38px;
    }
}