/* ================================================================
   NBCC Products — Public CSS v33
   Production carousel engine for category-specific product heroes.
   Ringo preset: 3-product stage with large center image and smaller sides.
================================================================ */

.nbcc-section,
.nbcc-section *{box-sizing:border-box;}
.nbcc-section{position:relative;isolation:isolate;overflow:hidden;}
.nbcc-section:not(.nbcc-section--boxed){width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);}
.nbcc-section--boxed{max-width:1240px;margin-inline:auto;border-radius:22px;overflow:hidden;}
.nbcc-vector{position:absolute;pointer-events:none;max-width:100%;height:auto;}

/* Grid mode */
.nbcc-grid{display:grid;gap:20px;padding:30px;}
.nbcc-grid--cols-1{grid-template-columns:1fr;}
.nbcc-grid--cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.nbcc-grid--cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.nbcc-grid--cols-4{grid-template-columns:repeat(4,minmax(0,1fr));}
.nbcc-grid .nbcc-slide{position:relative!important;left:auto!important;top:auto!important;transform:none!important;opacity:1!important;pointer-events:auto!important;width:auto!important;}
@media(max-width:900px){.nbcc-grid--cols-3,.nbcc-grid--cols-4{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:520px){.nbcc-grid{grid-template-columns:1fr!important;padding:18px;}}

/* Slider foundation */
.nbcc-slider-section{
    position:relative;
    width:100%;
    min-height:540px;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:54px 0 28px;
}
.nbcc-slider-track-wrap{
    position:relative;
    width:100%;
    flex:1 1 auto;
    min-height:430px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
}
.nbcc-slider-track{
    position:absolute;
    inset:0;
    z-index:3;
    width:100%;
    height:100%;
}

/* Decorative circle behind active product */
.nbcc-circle-bg{
    display:none;
    position:absolute;
    left:50%;
    top:50%;
    width:560px;
    height:560px;
    border-radius:50%;
    transform:translate(-50%,-50%) rotate(-4deg) scaleX(1.04);
    background:radial-gradient(ellipse at 44% 46%,var(--nbcc-spotlight-start,#4AA8FF) 0%,var(--nbcc-spotlight-end,#4AA8FF) 68%,var(--nbcc-spotlight-deep,#4AA8FF) 100%);
    filter:blur(2px);
    transition:background .55s ease, filter .55s ease, opacity .55s ease;
    z-index:1;
    pointer-events:none;
}
.nbcc-circle-bg::before,
.nbcc-circle-bg::after{
    content:'';
    position:absolute;
    border-radius:50%;
    pointer-events:none;
}
.nbcc-circle-bg::before{inset:-10px;border:3px solid rgba(74,168,255,.56);transform:rotate(-13deg) scaleX(1.05) scaleY(.96);}
.nbcc-circle-bg::after{inset:16px;border:2px solid rgba(74,168,255,.24);transform:rotate(16deg) scaleX(.97);}

/* Slide state engine: JS only assigns active/prev/next classes. */
.nbcc-slide{
    position:absolute;
    top:50%;
    left:50%;
    width:var(--nbcc-slide-width, clamp(260px,38vw,600px));
    max-width:78vw;
    transform:translate(-50%,-50%) scale(.45);
    opacity:0;
    pointer-events:none;
    cursor:pointer;
    z-index:0;
    overflow:visible;
    will-change:transform,opacity,left;
    transition:left .62s cubic-bezier(.22,.8,.2,1), transform .62s cubic-bezier(.22,.8,.2,1), opacity .38s ease, filter .38s ease;
}
.nbcc-slide.no-transition{transition:none!important;}
.nbcc-slide img{width:100%;height:auto;display:block;object-fit:contain;filter:drop-shadow(0 18px 34px rgba(0,0,0,.24));user-select:none;-webkit-user-drag:none;}
.nbcc-slide.active{left:50%;transform:translate(-50%,-50%) scale(var(--nbcc-active-scale,1));opacity:1;pointer-events:auto;z-index:5;}
.nbcc-slide.prev{left:var(--nbcc-slide-side-left,24%);transform:translate(-50%,-50%) scale(var(--nbcc-side-scale,.72)) rotateY(0deg);opacity:var(--nbcc-side-opacity,.75);pointer-events:auto;z-index:3;}
.nbcc-slide.next{left:var(--nbcc-slide-side-right,76%);transform:translate(-50%,-50%) scale(var(--nbcc-side-scale,.72)) rotateY(0deg);opacity:var(--nbcc-side-opacity,.75);pointer-events:auto;z-index:3;}
.nbcc-slide.prev img,.nbcc-slide.next img{filter:drop-shadow(0 12px 24px rgba(0,0,0,.20)) brightness(.96);}

/* Arrow controls */
.nbcc-arrow{
    position:absolute;
    z-index:20;
    width:var(--nbcc-arrow-size,56px);
    height:var(--nbcc-arrow-size,56px);
    min-width:38px;
    min-height:38px;
    border-radius:var(--nbcc-arrow-radius,50%);
    border:var(--nbcc-arrow-border,2px solid currentColor);
    color:var(--nbcc-arrow-color,#fff);
    background:var(--nbcc-arrow-bg,rgba(255,255,255,.08));
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0;
    font-size:var(--nbcc-arrow-font-size,26px);
    line-height:1;
    cursor:pointer;
    user-select:none;
    transition:transform .24s ease, background .24s ease, opacity .2s ease, box-shadow .24s ease;
    box-shadow:0 10px 24px rgba(0,30,90,.18);
    -webkit-tap-highlight-color:transparent;
}
.nbcc-arrow span{display:block;line-height:1;pointer-events:none;}
.nbcc-arrow:hover{opacity:.94;box-shadow:0 14px 34px rgba(0,30,90,.28);}
.nbcc-arrows-middle .nbcc-arrow{top:calc(50% + var(--nbcc-arrow-vertical-offset,0px));transform:translateY(-50%);}
.nbcc-arrows-middle .nbcc-arrow:hover{transform:translateY(-50%) scale(1.08);}
.nbcc-arrows-middle .nbcc-arrow--prev{left:var(--nbcc-arrow-middle-offset,8vw);}
.nbcc-arrows-middle .nbcc-arrow--next{right:var(--nbcc-arrow-middle-offset,8vw);}
.nbcc-arrows-top .nbcc-arrow{top:calc(clamp(18px,4vw,54px) + var(--nbcc-arrow-vertical-offset,0px));transform:none;}
.nbcc-arrows-top .nbcc-arrow:hover{transform:scale(1.08);}
.nbcc-arrows-top .nbcc-arrow--prev{left:calc(50% - var(--nbcc-arrow-size,56px) - 10px);}
.nbcc-arrows-top .nbcc-arrow--next{left:calc(50% + 10px);}
.nbcc-arrows-bottom .nbcc-arrow{top:auto;bottom:calc(clamp(18px,4vw,54px) - var(--nbcc-arrow-vertical-offset,0px));transform:none;}
.nbcc-arrows-bottom .nbcc-arrow:hover{transform:scale(1.08);}
.nbcc-arrows-bottom .nbcc-arrow--prev{left:calc(50% - var(--nbcc-arrow-size,56px) - 10px);}
.nbcc-arrows-bottom .nbcc-arrow--next{left:calc(50% + 10px);}
.nbcc-arrow-style-minimal{background:transparent!important;border:none!important;box-shadow:none!important;}
.nbcc-arrow-style-square{border-radius:8px!important;}
.nbcc-arrow-style-chevron{background:transparent!important;border:none!important;box-shadow:none!important;}

/* Dots */
.nbcc-dots{position:relative;z-index:22;display:flex;align-items:center;justify-content:center;gap:14px;padding:12px 0 8px;}
.nbcc-dot{border:none;padding:0;cursor:pointer;transition:opacity .25s ease,width .25s ease,transform .25s ease;background:#fff;}
.nbcc-dot.active{opacity:1;}
.nbcc-dots--bars .nbcc-dot{width:44px;height:7px;border-radius:999px;opacity:.42;}
.nbcc-dots--bars .nbcc-dot.active{width:62px;}
.nbcc-dots--dots .nbcc-dot{width:16px;height:16px;border-radius:50%;opacity:.72;}
.nbcc-dots--dots .nbcc-dot.active{transform:scale(1.05);}
.nbcc-dots--lines .nbcc-dot{width:36px;height:4px;border-radius:0;opacity:.45;}
.nbcc-dots--lines .nbcc-dot.active{transform:scaleX(1.25);}

/* Ringo production preset */
.nbcc-preset-ringo .nbcc-slider-section,
.nbcc-category-ringo .nbcc-slider-section{min-height:clamp(520px,56vw,760px);}
.nbcc-preset-ringo .nbcc-circle-bg,
.nbcc-category-ringo .nbcc-circle-bg{display:block;}


/* Ringo v19 enhanced brushed vector spotlight mask.
   The mask keeps the blue circle as a real scalable vector with hand-painted edges. */
.nbcc-preset-ringo .nbcc-circle-bg,
.nbcc-category-ringo .nbcc-circle-bg{
    -webkit-mask-image:url(../../assets/ringo-brush-circle-mask.svg);
    mask-image:url(../../assets/ringo-brush-circle-mask.svg);
    -webkit-mask-repeat:no-repeat;
    mask-repeat:no-repeat;
    -webkit-mask-position:center;
    mask-position:center;
    -webkit-mask-size:contain;
    mask-size:contain;
    filter:none;
    opacity:1;
}
.nbcc-preset-ringo .nbcc-circle-bg::before,
.nbcc-preset-ringo .nbcc-circle-bg::after,
.nbcc-category-ringo .nbcc-circle-bg::before,
.nbcc-category-ringo .nbcc-circle-bg::after{
    display:none;
}
.nbcc-preset-ringo .nbcc-circle-bg{
    transform:translate(-50%,-50%) rotate(-2deg) scaleX(1.03);
}



/* Memories production preset
   Target: dark maroon stage, warm #8E4617 glow, gold-bordered product frames, center hero product with side previews. */
.nbcc-preset-memories,
.nbcc-category-memories{
    background:
        radial-gradient(circle at 50% 35%, rgba(142,70,23,.95) 0%, rgba(126,11,5,.94) 34%, rgba(78,5,2,.98) 72%, #3A0200 100%) !important;
    overflow:hidden !important;
}
.nbcc-preset-memories::before,
.nbcc-category-memories::before{
    content:'';
    position:absolute;
    inset:-18% -10%;
    background:
        radial-gradient(ellipse at 50% 45%, rgba(255,65,34,.28), transparent 42%),
        radial-gradient(ellipse at 50% 100%, rgba(142,70,23,.55), transparent 48%);
    z-index:0;
    pointer-events:none;
}
.nbcc-preset-memories .nbcc-slider-section,
.nbcc-category-memories .nbcc-slider-section{
    min-height:clamp(430px,45vw,640px);
    padding:clamp(36px,4.2vw,68px) 0 clamp(22px,3vw,42px);
    position:relative;
    z-index:1;
}
.nbcc-preset-memories .nbcc-slider-track-wrap,
.nbcc-category-memories .nbcc-slider-track-wrap{
    min-height:clamp(330px,34vw,500px);
}
.nbcc-preset-memories .nbcc-circle-bg,
.nbcc-category-memories .nbcc-circle-bg{
    display:none !important;
}
.nbcc-preset-memories .nbcc-slide,
.nbcc-category-memories .nbcc-slide{
    width:var(--nbcc-slide-width, clamp(420px,55vw,760px));
    height:clamp(260px,32vw,430px);
    max-width:82vw;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:clamp(22px,3vw,46px);
    border:clamp(2px,.22vw,4px) solid rgba(142,70,23,.88);
    border-radius:clamp(18px,2vw,32px);
    background:
        radial-gradient(circle at 50% 43%, rgba(202,38,24,.44) 0%, rgba(128,8,3,.66) 46%, rgba(63,2,0,.72) 100%);
    box-shadow:
        inset 0 0 85px rgba(255,80,38,.12),
        0 28px 70px rgba(42,0,0,.28);
    overflow:hidden;
}
.nbcc-preset-memories .nbcc-slide.active,
.nbcc-category-memories .nbcc-slide.active{
    z-index:8;
    opacity:1;
}
.nbcc-preset-memories .nbcc-slide.prev,
.nbcc-preset-memories .nbcc-slide.next,
.nbcc-category-memories .nbcc-slide.prev,
.nbcc-category-memories .nbcc-slide.next{
    opacity:var(--nbcc-side-opacity,.70);
}
.nbcc-preset-memories .nbcc-slide img,
.nbcc-category-memories .nbcc-slide img{
    width:min(78%, 620px);
    max-height:82%;
    object-fit:contain;
    filter:drop-shadow(0 22px 26px rgba(0,0,0,.38));
}
.nbcc-preset-memories .nbcc-slide.active img,
.nbcc-category-memories .nbcc-slide.active img{
    width:min(82%, 680px);
    max-height:86%;
    filter:drop-shadow(0 30px 34px rgba(0,0,0,.42));
}
.nbcc-preset-memories .nbcc-slide.prev img,
.nbcc-preset-memories .nbcc-slide.next img,
.nbcc-category-memories .nbcc-slide.prev img,
.nbcc-category-memories .nbcc-slide.next img{
    width:82%;
    max-height:80%;
    filter:drop-shadow(0 18px 22px rgba(0,0,0,.34)) brightness(.86) saturate(.92);
}
.nbcc-preset-memories .nbcc-dots,
.nbcc-category-memories .nbcc-dots{
    gap:18px;
    padding-top:18px;
}
.nbcc-preset-memories .nbcc-dots--bars .nbcc-dot,
.nbcc-category-memories .nbcc-dots--bars .nbcc-dot{
    width:82px;
    height:10px;
    border-radius:0;
    background:#E21918 !important;
    opacity:.90;
}
.nbcc-preset-memories .nbcc-dots--bars .nbcc-dot.active,
.nbcc-category-memories .nbcc-dots--bars .nbcc-dot.active{
    width:82px;
    background:#FFFFFF !important;
    opacity:1;
}
.nbcc-preset-memories .nbcc-arrow,
.nbcc-category-memories .nbcc-arrow{
    color:#fff !important;
    background:rgba(142,70,23,.24) !important;
    border:2px solid rgba(201,168,76,.80) !important;
    box-shadow:0 18px 38px rgba(40,0,0,.30);
}
@media(max-width:900px){
    .nbcc-preset-memories .nbcc-slide,
    .nbcc-category-memories .nbcc-slide{height:clamp(230px,40vw,360px);padding:22px;}
    .nbcc-preset-memories .nbcc-dots--bars .nbcc-dot,
    .nbcc-category-memories .nbcc-dots--bars .nbcc-dot{width:52px;height:8px;}
}
@media(max-width:560px){
    .nbcc-preset-memories .nbcc-slide,
    .nbcc-category-memories .nbcc-slide{width:min(82vw,360px);height:260px;}
    .nbcc-preset-memories .nbcc-dots,
    .nbcc-category-memories .nbcc-dots{gap:10px;}
}

/* Responsive slider */
@media(max-width:1100px){
    .nbcc-slider-section{min-height:480px;}
    .nbcc-slider-track-wrap{min-height:380px;}
    .nbcc-section{--nbcc-slide-width:clamp(250px,46vw,480px);--nbcc-slide-side-left:20%;--nbcc-slide-side-right:80%;--nbcc-side-scale:.58;}
}
@media(max-width:760px){
    .nbcc-slider-section{min-height:390px;padding:34px 0 18px;}
    .nbcc-slider-track-wrap{min-height:320px;}
    .nbcc-section{--nbcc-slide-width:min(76vw,360px);--nbcc-slide-side-left:10%;--nbcc-slide-side-right:90%;--nbcc-side-scale:.44;--nbcc-side-opacity:.58;--nbcc-arrow-size:44px;}
    .nbcc-circle-bg{width:300px!important;height:300px!important;}
    .nbcc-arrows-middle .nbcc-arrow--prev{left:10px;}
    .nbcc-arrows-middle .nbcc-arrow--next{right:10px;}
}
@media(max-width:520px){
    .nbcc-slider-section{min-height:340px;}
    .nbcc-slider-track-wrap{min-height:280px;}
    .nbcc-section{--nbcc-slide-width:min(82vw,300px);--nbcc-side-scale:.36;}
    .nbcc-dots{gap:10px;}
}

/* Popup */
.nbcc-popup-overlay{position:fixed;inset:0;background:rgba(0,0,0,.82);z-index:99999;display:none;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(6px);}
.nbcc-popup-overlay.open{display:flex;}
.nbcc-popup-overlay.closing .nbcc-popup-inner{animation:nbcc-pop-out .22s ease forwards;}
@keyframes nbcc-pop-out{to{opacity:0;transform:scale(.9)}}
.nbcc-popup-close{position:fixed;z-index:100002;width:48px;height:48px;border-radius:50%;background:#C41E3A;color:#fff;border:3px solid #fff;font-size:18px;font-weight:900;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 18px rgba(0,0,0,.4);transition:background .2s;line-height:1;}
.nbcc-popup-close:hover{background:#8B0000;}
.nbcc-popup-inner{position:relative;border-radius:14px;overflow:hidden;max-height:90vh;overflow-y:auto;box-shadow:0 28px 72px rgba(0,0,0,.45);animation:nbcc-pop-in .32s cubic-bezier(.34,1.56,.64,1);background:#fff;}
@keyframes nbcc-pop-in{from{opacity:0;transform:scale(.88)}to{opacity:1;transform:scale(1)}}
.nbcc-popup-header{display:flex;align-items:center;gap:12px;padding:14px 20px;flex-wrap:wrap;}
.nbcc-popup-header__brand{font-style:italic;font-size:22px;line-height:1;}
.nbcc-popup-header__name{font-size:15px;font-weight:800;color:#fff;line-height:1.2;}
.nbcc-popup-header__name span{display:block;font-size:12px;font-weight:400;opacity:.8;direction:rtl;}
.nbcc-popup-header__sep{width:1px;height:32px;background:rgba(255,255,255,.3);flex-shrink:0;}
.nbcc-popup-imgs{display:flex;}
.nbcc-popup-imgs .nbcc-popup-img{flex:1;width:50%;object-fit:cover;display:block;}
.nbcc-popup-imgs.nbcc-popup-imgs--one .nbcc-popup-img{width:100%;}
.nbcc-popup-html{padding:18px 22px;direction:rtl;}
.nbcc-pop-loader-wrap{display:flex;align-items:center;justify-content:center;padding:80px 40px;}
.nbcc-pop-loader{width:40px;height:40px;border:3px solid rgba(0,0,0,.08);border-top-color:#8B0000;border-radius:50%;animation:nbcc-spin .7s linear infinite;}
@keyframes nbcc-spin{to{transform:rotate(360deg)}}
.nbcc-empty{text-align:center;color:#888;padding:40px 0;}


/* =========================================================
   V22 - Memories production image scaling fix
   Purpose: make Memories product image fill the golden frame like the reference,
   while preserving transparent product artwork and category controls.
========================================================= */
.nbcc-preset-memories .nbcc-slide,
.nbcc-category-memories .nbcc-slide{
    overflow:visible !important;
}

.nbcc-preset-memories .nbcc-slide img,
.nbcc-category-memories .nbcc-slide img{
    display:block !important;
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    max-height:none !important;
    object-fit:contain !important;
    object-position:center center !important;
    padding:0 !important;
    background:transparent !important;
    transform-origin:center center;
}

.nbcc-preset-memories .nbcc-slide.active img,
.nbcc-category-memories .nbcc-slide.active img{
    transform:scale(var(--nbcc-memories-active-image-scale,1.42)) !important;
    filter:drop-shadow(0 34px 38px rgba(0,0,0,.44));
}

.nbcc-preset-memories .nbcc-slide.prev img,
.nbcc-preset-memories .nbcc-slide.next img,
.nbcc-category-memories .nbcc-slide.prev img,
.nbcc-category-memories .nbcc-slide.next img{
    transform:scale(var(--nbcc-memories-side-image-scale,1.18)) !important;
    filter:drop-shadow(0 22px 26px rgba(0,0,0,.36)) brightness(.88) saturate(.94);
}

/* Keep the frame clean while allowing product artwork to visually fill it. */
.nbcc-preset-memories .nbcc-slide::after,
.nbcc-category-memories .nbcc-slide::after{
    content:'';
    position:absolute;
    inset:0;
    border-radius:inherit;
    pointer-events:none;
    box-shadow:inset 0 0 0 1px rgba(255,210,95,.10), inset 0 0 70px rgba(255,64,32,.08);
}

@media(max-width:900px){
    .nbcc-preset-memories .nbcc-slide.active img,
    .nbcc-category-memories .nbcc-slide.active img{
        transform:scale(1.28) !important;
    }
    .nbcc-preset-memories .nbcc-slide.prev img,
    .nbcc-preset-memories .nbcc-slide.next img,
    .nbcc-category-memories .nbcc-slide.prev img,
    .nbcc-category-memories .nbcc-slide.next img{
        transform:scale(1.08) !important;
    }
}


/* =========================================================
   V23 - Category-level product image control engine
   Every category now reads Product Image settings independently:
   Image Max Height, Width, Height, Padding, Fit, and Position.
========================================================= */
.nbcc-slider-track .nbcc-slide img,
.nbcc-grid .nbcc-slide img{
    width:var(--nbcc-product-img-width,100%) !important;
    height:var(--nbcc-product-img-height,auto) !important;
    max-width:none !important;
    max-height:var(--nbcc-product-img-max-height,100%) !important;
    padding:var(--nbcc-product-img-padding,0) !important;
    object-fit:var(--nbcc-product-img-fit,contain) !important;
    object-position:var(--nbcc-product-img-position,center) !important;
    background:transparent !important;
    transform-origin:center center !important;
}

/* Memories must not lock product artwork to a fixed size.
   The product size is now controlled from Category > Product Image. */
.nbcc-preset-memories .nbcc-slide img,
.nbcc-category-memories .nbcc-slide img{
    width:var(--nbcc-product-img-width,100%) !important;
    height:var(--nbcc-product-img-height,auto) !important;
    max-height:var(--nbcc-product-img-max-height,150%) !important;
    object-fit:var(--nbcc-product-img-fit,contain) !important;
    object-position:var(--nbcc-product-img-position,center) !important;
    padding:var(--nbcc-product-img-padding,0) !important;
}

.nbcc-preset-memories .nbcc-slide.active img,
.nbcc-category-memories .nbcc-slide.active img{
    transform:scale(var(--nbcc-product-img-scale,1.5)) !important;
}

.nbcc-preset-memories .nbcc-slide.prev img,
.nbcc-preset-memories .nbcc-slide.next img,
.nbcc-category-memories .nbcc-slide.prev img,
.nbcc-category-memories .nbcc-slide.next img{
    transform:scale(var(--nbcc-product-img-side-scale,1.23)) !important;
}

.nbcc-preset-ringo .nbcc-slide.active img,
.nbcc-category-ringo .nbcc-slide.active img{
    transform:scale(var(--nbcc-product-img-scale,1)) !important;
}

.nbcc-preset-ringo .nbcc-slide.prev img,
.nbcc-preset-ringo .nbcc-slide.next img,
.nbcc-category-ringo .nbcc-slide.prev img,
.nbcc-category-ringo .nbcc-slide.next img{
    transform:scale(var(--nbcc-product-img-scale,1)) !important;
}


/* =========================================================
   V24 - Additional production brand presets
   TeaShop, GoFit, and Al Batal are isolated by category class.
   The global image control engine remains active per category.
========================================================= */

/* Default wrappers added in V24. Existing categories remain visually unchanged. */
.nbcc-slide-media{
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    z-index:2;
    pointer-events:none;
}
.nbcc-slide-caption{display:none;position:relative;z-index:3;text-align:center;pointer-events:none;}
.nbcc-slide-title{font-family:Montserrat,Arial,sans-serif;font-weight:800;line-height:1.15;}

/* ------------------------- TeaShop -------------------------
   Reference: clean white page, three colorful product cards, title at bottom. */
.nbcc-category-teashop .nbcc-slide,
.nbcc-category-tea-shop .nbcc-slide,
.nbcc-preset-teashop .nbcc-slide,
.nbcc-preset-tea-shop .nbcc-slide{
    height:clamp(320px,34vw,500px);
    padding:0;
    border-radius:14px;
    overflow:hidden;
    background:#C61518;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    box-shadow:0 18px 34px rgba(0,0,0,.08);
}
.nbcc-category-teashop .nbcc-slide::before,
.nbcc-category-tea-shop .nbcc-slide::before,
.nbcc-preset-teashop .nbcc-slide::before,
.nbcc-preset-tea-shop .nbcc-slide::before{
    content:'';
    position:absolute;
    inset:0;
    background:
        linear-gradient(135deg,rgba(255,255,255,.16),transparent 42%),
        repeating-linear-gradient(135deg,rgba(0,0,0,.10) 0 18px,transparent 18px 42px);
    opacity:.32;
    pointer-events:none;
}
.nbcc-category-teashop .nbcc-slide:nth-child(3n+1),
.nbcc-category-tea-shop .nbcc-slide:nth-child(3n+1),
.nbcc-preset-teashop .nbcc-slide:nth-child(3n+1),
.nbcc-preset-tea-shop .nbcc-slide:nth-child(3n+1){background:#C93263;}
.nbcc-category-teashop .nbcc-slide:nth-child(3n+2),
.nbcc-category-tea-shop .nbcc-slide:nth-child(3n+2),
.nbcc-preset-teashop .nbcc-slide:nth-child(3n+2),
.nbcc-preset-tea-shop .nbcc-slide:nth-child(3n+2){background:#C90D0D;}
.nbcc-category-teashop .nbcc-slide:nth-child(3n),
.nbcc-category-tea-shop .nbcc-slide:nth-child(3n),
.nbcc-preset-teashop .nbcc-slide:nth-child(3n),
.nbcc-preset-tea-shop .nbcc-slide:nth-child(3n){background:#FEBB10;}
.nbcc-category-teashop .nbcc-slide-media,
.nbcc-category-tea-shop .nbcc-slide-media,
.nbcc-preset-teashop .nbcc-slide-media,
.nbcc-preset-tea-shop .nbcc-slide-media{
    flex:1 1 auto;
    height:72%;
    padding:clamp(18px,2.5vw,34px) clamp(22px,3vw,38px) 0;
}
.nbcc-category-teashop .nbcc-slide img,
.nbcc-category-tea-shop .nbcc-slide img,
.nbcc-preset-teashop .nbcc-slide img,
.nbcc-preset-tea-shop .nbcc-slide img{
    transform:scale(var(--nbcc-product-img-scale,1.08)) !important;
    filter:drop-shadow(0 14px 18px rgba(0,0,0,.25));
}
.nbcc-category-teashop .nbcc-slide-caption,
.nbcc-category-tea-shop .nbcc-slide-caption,
.nbcc-preset-teashop .nbcc-slide-caption,
.nbcc-preset-tea-shop .nbcc-slide-caption{
    display:block;
    padding:0 clamp(14px,2vw,24px) clamp(26px,3vw,40px);
    color:#fff;
}
.nbcc-category-teashop .nbcc-slide-title,
.nbcc-category-tea-shop .nbcc-slide-title,
.nbcc-preset-teashop .nbcc-slide-title,
.nbcc-preset-tea-shop .nbcc-slide-title{
    font-size:clamp(24px,2.1vw,36px);
    letter-spacing:-.02em;
    text-shadow:0 2px 12px rgba(0,0,0,.12);
}
.nbcc-category-teashop .nbcc-slide.prev,
.nbcc-category-teashop .nbcc-slide.next,
.nbcc-category-tea-shop .nbcc-slide.prev,
.nbcc-category-tea-shop .nbcc-slide.next,
.nbcc-preset-teashop .nbcc-slide.prev,
.nbcc-preset-teashop .nbcc-slide.next,
.nbcc-preset-tea-shop .nbcc-slide.prev,
.nbcc-preset-tea-shop .nbcc-slide.next{filter:none;}

/* ------------------------- GoFit -------------------------
   Reference: red hero stage with geometric glowing lines and one large box. */
.nbcc-category-gofit::before,
.nbcc-category-go-fit::before,
.nbcc-preset-gofit::before,
.nbcc-preset-go-fit::before{
    content:'';
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    background:
        linear-gradient(115deg,transparent 0 15%,rgba(255,255,255,.18) 15.4%,transparent 16.2% 100%),
        linear-gradient(65deg,transparent 0 76%,rgba(255,255,255,.16) 76.4%,transparent 77.4% 100%),
        radial-gradient(circle at 50% 35%,rgba(255,120,80,.24),transparent 34%);
    mix-blend-mode:screen;
    opacity:.9;
}
.nbcc-category-gofit .nbcc-slide,
.nbcc-category-go-fit .nbcc-slide,
.nbcc-preset-gofit .nbcc-slide,
.nbcc-preset-go-fit .nbcc-slide{
    background:transparent!important;
    height:clamp(280px,31vw,450px);
    padding:0;
    overflow:visible;
}
.nbcc-category-gofit .nbcc-slide-media,
.nbcc-category-go-fit .nbcc-slide-media,
.nbcc-preset-gofit .nbcc-slide-media,
.nbcc-preset-go-fit .nbcc-slide-media{height:100%;}
.nbcc-category-gofit .nbcc-slide.active img,
.nbcc-category-go-fit .nbcc-slide.active img,
.nbcc-preset-gofit .nbcc-slide.active img,
.nbcc-preset-go-fit .nbcc-slide.active img{
    transform:scale(var(--nbcc-product-img-scale,1.18)) !important;
    filter:drop-shadow(0 30px 36px rgba(30,0,0,.45));
}
.nbcc-category-gofit .nbcc-slide.prev img,
.nbcc-category-gofit .nbcc-slide.next img,
.nbcc-category-go-fit .nbcc-slide.prev img,
.nbcc-category-go-fit .nbcc-slide.next img,
.nbcc-preset-gofit .nbcc-slide.prev img,
.nbcc-preset-gofit .nbcc-slide.next img,
.nbcc-preset-go-fit .nbcc-slide.prev img,
.nbcc-preset-go-fit .nbcc-slide.next img{
    transform:scale(var(--nbcc-product-img-side-scale,.8)) !important;
    opacity:calc(.34 * var(--nbcc-teashop-pattern-enabled,1));
    filter:blur(.3px) drop-shadow(0 18px 26px rgba(0,0,0,.30));
}

/* ------------------------- Al Batal -------------------------
   Reference: red background, white cards, active center card larger. */
.nbcc-category-albatal .nbcc-slide,
.nbcc-category-al-batal .nbcc-slide,
.nbcc-preset-albatal .nbcc-slide,
.nbcc-preset-al-batal .nbcc-slide{
    height:clamp(330px,36vw,520px);
    padding:clamp(18px,2vw,32px);
    border-radius:22px;
    background:#fff;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    box-shadow:0 24px 46px rgba(65,0,0,.18);
    overflow:hidden;
}
.nbcc-category-albatal .nbcc-slide-media,
.nbcc-category-al-batal .nbcc-slide-media,
.nbcc-preset-albatal .nbcc-slide-media,
.nbcc-preset-al-batal .nbcc-slide-media{
    height:68%;
    border-radius:18px;
    background:#B80000;
    padding:clamp(18px,2.4vw,36px);
}
.nbcc-category-albatal .nbcc-slide.active .nbcc-slide-media,
.nbcc-category-al-batal .nbcc-slide.active .nbcc-slide-media,
.nbcc-preset-albatal .nbcc-slide.active .nbcc-slide-media,
.nbcc-preset-al-batal .nbcc-slide.active .nbcc-slide-media{height:70%;}
.nbcc-category-albatal .nbcc-slide img,
.nbcc-category-al-batal .nbcc-slide img,
.nbcc-preset-albatal .nbcc-slide img,
.nbcc-preset-al-batal .nbcc-slide img{
    transform:scale(var(--nbcc-product-img-scale,1.02)) !important;
    filter:drop-shadow(0 16px 22px rgba(0,0,0,.24));
}
.nbcc-category-albatal .nbcc-slide-caption,
.nbcc-category-al-batal .nbcc-slide-caption,
.nbcc-preset-albatal .nbcc-slide-caption,
.nbcc-preset-al-batal .nbcc-slide-caption{
    display:block;
    padding:clamp(14px,2vw,24px) 8px 2px;
    color:#881008;
    text-transform:uppercase;
}
.nbcc-category-albatal .nbcc-slide-title,
.nbcc-category-al-batal .nbcc-slide-title,
.nbcc-preset-albatal .nbcc-slide-title,
.nbcc-preset-al-batal .nbcc-slide-title{
    font-size:clamp(24px,2vw,34px);
    letter-spacing:.01em;
}

@media(max-width:760px){
    .nbcc-category-teashop .nbcc-slide,
    .nbcc-category-tea-shop .nbcc-slide,
    .nbcc-preset-teashop .nbcc-slide,
    .nbcc-preset-tea-shop .nbcc-slide,
    .nbcc-category-albatal .nbcc-slide,
    .nbcc-category-al-batal .nbcc-slide,
    .nbcc-preset-albatal .nbcc-slide,
    .nbcc-preset-al-batal .nbcc-slide{height:clamp(300px,72vw,390px);}
    .nbcc-category-gofit .nbcc-slide.active img,
    .nbcc-category-go-fit .nbcc-slide.active img,
    .nbcc-preset-gofit .nbcc-slide.active img,
    .nbcc-preset-go-fit .nbcc-slide.active img{transform:scale(1.02)!important;}
}


/* =========================================================
   V26 - Al Batal production focus refinements
   Goal: final reference layout with a larger center white card,
   smaller side cards, larger product artwork, and bottom arrows.
   This block is isolated to Al Batal only.
========================================================= */
.nbcc-category-albatal,
.nbcc-category-al-batal,
.nbcc-preset-albatal,
.nbcc-preset-al-batal{
    --nbcc-albatal-card-red:#B90000;
    --nbcc-albatal-text:#8A0D05;
}

.nbcc-category-albatal .nbcc-slider-section,
.nbcc-category-al-batal .nbcc-slider-section,
.nbcc-preset-albatal .nbcc-slider-section,
.nbcc-preset-al-batal .nbcc-slider-section{
    justify-content:center;
}

.nbcc-category-albatal .nbcc-slide,
.nbcc-category-al-batal .nbcc-slide,
.nbcc-preset-albatal .nbcc-slide,
.nbcc-preset-al-batal .nbcc-slide{
    border-radius:22px;
    background:#ffffff;
    padding:clamp(16px,1.8vw,28px);
    height:clamp(330px,35vw,520px);
    box-shadow:none;
    transform-origin:center center;
}

.nbcc-category-albatal .nbcc-slide.active,
.nbcc-category-al-batal .nbcc-slide.active,
.nbcc-preset-albatal .nbcc-slide.active,
.nbcc-preset-al-batal .nbcc-slide.active{
    height:clamp(400px,40vw,630px);
    border-radius:26px;
    box-shadow:0 28px 70px rgba(45,0,0,.16);
}

.nbcc-category-albatal .nbcc-slide.prev,
.nbcc-category-albatal .nbcc-slide.next,
.nbcc-category-al-batal .nbcc-slide.prev,
.nbcc-category-al-batal .nbcc-slide.next,
.nbcc-preset-albatal .nbcc-slide.prev,
.nbcc-preset-albatal .nbcc-slide.next,
.nbcc-preset-al-batal .nbcc-slide.prev,
.nbcc-preset-al-batal .nbcc-slide.next{
    height:clamp(310px,31vw,460px);
}

.nbcc-category-albatal .nbcc-slide-media,
.nbcc-category-al-batal .nbcc-slide-media,
.nbcc-preset-albatal .nbcc-slide-media,
.nbcc-preset-al-batal .nbcc-slide-media{
    height:70%;
    width:100%;
    border-radius:18px;
    background:var(--nbcc-albatal-card-red);
    padding:clamp(18px,2.2vw,34px);
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
}

.nbcc-category-albatal .nbcc-slide.active .nbcc-slide-media,
.nbcc-category-al-batal .nbcc-slide.active .nbcc-slide-media,
.nbcc-preset-albatal .nbcc-slide.active .nbcc-slide-media,
.nbcc-preset-al-batal .nbcc-slide.active .nbcc-slide-media{
    height:72%;
    border-radius:22px;
    padding:clamp(18px,2.4vw,38px);
}

.nbcc-category-albatal .nbcc-slide img,
.nbcc-category-al-batal .nbcc-slide img,
.nbcc-preset-albatal .nbcc-slide img,
.nbcc-preset-al-batal .nbcc-slide img{
    width:var(--nbcc-product-img-width,100%) !important;
    height:var(--nbcc-product-img-height,auto) !important;
    max-height:var(--nbcc-product-img-max-height,155%) !important;
    object-fit:var(--nbcc-product-img-fit,contain) !important;
    object-position:var(--nbcc-product-img-position,center) !important;
    padding:var(--nbcc-product-img-padding,0) !important;
    filter:drop-shadow(0 18px 24px rgba(0,0,0,.22));
}

.nbcc-category-albatal .nbcc-slide.active img,
.nbcc-category-al-batal .nbcc-slide.active img,
.nbcc-preset-albatal .nbcc-slide.active img,
.nbcc-preset-al-batal .nbcc-slide.active img{
    transform:scale(calc(var(--nbcc-product-img-scale,1.5) * 1.08)) !important;
    filter:drop-shadow(0 24px 32px rgba(0,0,0,.26));
}

.nbcc-category-albatal .nbcc-slide.prev img,
.nbcc-category-albatal .nbcc-slide.next img,
.nbcc-category-al-batal .nbcc-slide.prev img,
.nbcc-category-al-batal .nbcc-slide.next img,
.nbcc-preset-albatal .nbcc-slide.prev img,
.nbcc-preset-albatal .nbcc-slide.next img,
.nbcc-preset-al-batal .nbcc-slide.prev img,
.nbcc-preset-al-batal .nbcc-slide.next img{
    transform:scale(calc(var(--nbcc-product-img-side-scale,1.23) * .94)) !important;
    filter:drop-shadow(0 14px 20px rgba(0,0,0,.20));
}

.nbcc-category-albatal .nbcc-slide-caption,
.nbcc-category-al-batal .nbcc-slide-caption,
.nbcc-preset-albatal .nbcc-slide-caption,
.nbcc-preset-al-batal .nbcc-slide-caption{
    min-height:28%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:var(--nbcc-albatal-text);
    padding:clamp(14px,1.7vw,24px) 8px 4px;
}

.nbcc-category-albatal .nbcc-slide-title,
.nbcc-category-al-batal .nbcc-slide-title,
.nbcc-preset-albatal .nbcc-slide-title,
.nbcc-preset-al-batal .nbcc-slide-title{
    font-family:Montserrat,Arial,sans-serif;
    font-weight:800;
    font-size:clamp(24px,2vw,36px);
    line-height:1.12;
    color:var(--nbcc-albatal-text);
    text-transform:uppercase;
}

.nbcc-category-albatal .nbcc-slide.active .nbcc-slide-title,
.nbcc-category-al-batal .nbcc-slide.active .nbcc-slide-title,
.nbcc-preset-albatal .nbcc-slide.active .nbcc-slide-title,
.nbcc-preset-al-batal .nbcc-slide.active .nbcc-slide-title{
    font-size:clamp(30px,2.6vw,44px);
}

/* Keep Al Batal arrows always at the bottom center like the reference,
   regardless of the selected arrow position in the category settings. */
.nbcc-category-albatal .nbcc-arrow,
.nbcc-category-al-batal .nbcc-arrow,
.nbcc-preset-albatal .nbcc-arrow,
.nbcc-preset-al-batal .nbcc-arrow{
    top:auto !important;
    bottom:clamp(18px,2.8vw,38px) !important;
    transform:none !important;
    color:#ffffff !important;
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    font-size:clamp(42px,4.6vw,64px) !important;
}

.nbcc-category-albatal .nbcc-arrow:hover,
.nbcc-category-al-batal .nbcc-arrow:hover,
.nbcc-preset-albatal .nbcc-arrow:hover,
.nbcc-preset-al-batal .nbcc-arrow:hover{
    transform:scale(1.08) !important;
}

.nbcc-category-albatal .nbcc-arrow--prev,
.nbcc-category-al-batal .nbcc-arrow--prev,
.nbcc-preset-albatal .nbcc-arrow--prev,
.nbcc-preset-al-batal .nbcc-arrow--prev{
    left:calc(50% - 68px) !important;
    right:auto !important;
}

.nbcc-category-albatal .nbcc-arrow--next,
.nbcc-category-al-batal .nbcc-arrow--next,
.nbcc-preset-albatal .nbcc-arrow--next,
.nbcc-preset-al-batal .nbcc-arrow--next{
    left:calc(50% + 18px) !important;
    right:auto !important;
}

@media(max-width:760px){
    .nbcc-category-albatal .nbcc-slide.active,
    .nbcc-category-al-batal .nbcc-slide.active,
    .nbcc-preset-albatal .nbcc-slide.active,
    .nbcc-preset-al-batal .nbcc-slide.active{height:clamp(340px,75vw,430px);}

    .nbcc-category-albatal .nbcc-slide.prev,
    .nbcc-category-albatal .nbcc-slide.next,
    .nbcc-category-al-batal .nbcc-slide.prev,
    .nbcc-category-al-batal .nbcc-slide.next,
    .nbcc-preset-albatal .nbcc-slide.prev,
    .nbcc-preset-albatal .nbcc-slide.next,
    .nbcc-preset-al-batal .nbcc-slide.prev,
    .nbcc-preset-al-batal .nbcc-slide.next{height:clamp(280px,62vw,360px);}
}


/* =========================================================
   V27 - Final Al Batal production control engine
   Purpose:
   - Detects Al Batal by the unified class added from PHP: .nbcc-is-albatal
   - Makes the center product card visually larger than the side cards
   - Keeps arrows fixed at the bottom center
   - Keeps all values controllable from category settings through CSS variables
========================================================= */
.nbcc-is-albatal{
    --nbcc-albatal-card-red: var(--nbcc-albatal-card-red, #C40000);
    --nbcc-albatal-text: var(--nbcc-albatal-text, #8A0D05);
    --nbcc-active-scale: var(--nbcc-active-scale, 1.28);
    --nbcc-side-scale: var(--nbcc-side-scale, .82);
    --nbcc-slide-side-left: var(--nbcc-slide-side-left, 24%);
    --nbcc-slide-side-right: var(--nbcc-slide-side-right, 76%);
}

.nbcc-is-albatal .nbcc-slider-section{
    min-height:clamp(560px,50vw,760px) !important;
    padding:clamp(45px,4vw,70px) 0 clamp(92px,7vw,130px) !important;
}

.nbcc-is-albatal .nbcc-slider-track-wrap{
    min-height:clamp(420px,39vw,610px) !important;
    overflow:hidden !important;
}

.nbcc-is-albatal .nbcc-slide{
    width:var(--nbcc-slide-width, clamp(300px,29vw,470px)) !important;
    max-width:86vw !important;
    height:clamp(330px,34vw,510px) !important;
    border-radius:22px !important;
    background:#ffffff !important;
    padding:clamp(16px,1.8vw,28px) !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:space-between !important;
    box-shadow:none !important;
    overflow:hidden !important;
    transform-origin:center center !important;
}

.nbcc-is-albatal .nbcc-slide.active{
    width:calc(var(--nbcc-slide-width, clamp(300px,29vw,470px)) * 1.12) !important;
    height:clamp(410px,40vw,630px) !important;
    border-radius:26px !important;
    box-shadow:0 32px 72px rgba(45,0,0,.18) !important;
}

.nbcc-is-albatal .nbcc-slide.prev,
.nbcc-is-albatal .nbcc-slide.next{
    width:calc(var(--nbcc-slide-width, clamp(300px,29vw,470px)) * .92) !important;
    height:clamp(315px,31vw,460px) !important;
}

.nbcc-is-albatal .nbcc-slide-media{
    position:relative !important;
    width:100% !important;
    height:70% !important;
    border-radius:18px !important;
    background:var(--nbcc-albatal-card-red,#C40000) !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    overflow:hidden !important;
}

.nbcc-is-albatal .nbcc-slide.active .nbcc-slide-media{
    height:72% !important;
    border-radius:22px !important;
}

.nbcc-is-albatal .nbcc-slide img{
    display:block !important;
    width:auto !important;
    height:72% !important;
    max-width:92% !important;
    max-height:none !important;
    object-fit:contain !important;
    object-position:center center !important;
    padding:0 !important;
    background:transparent !important;
    transform-origin:center center !important;
    filter:drop-shadow(0 18px 24px rgba(0,0,0,.22)) !important;
}

.nbcc-is-albatal .nbcc-slide.active img{
    height:82% !important;
    transform:scale(var(--nbcc-albatal-active-product-scale,1.72)) !important;
    filter:drop-shadow(0 26px 34px rgba(0,0,0,.28)) !important;
}

.nbcc-is-albatal .nbcc-slide.prev img,
.nbcc-is-albatal .nbcc-slide.next img{
    height:72% !important;
    transform:scale(var(--nbcc-albatal-side-product-scale,1.20)) !important;
    filter:drop-shadow(0 14px 20px rgba(0,0,0,.20)) !important;
}

.nbcc-is-albatal .nbcc-slide-caption{
    min-height:28% !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    padding:clamp(14px,1.7vw,24px) 8px 4px !important;
    color:var(--nbcc-albatal-text,#8A0D05) !important;
    background:#ffffff !important;
}

.nbcc-is-albatal .nbcc-slide-title{
    font-family:Montserrat,Arial,sans-serif !important;
    font-weight:var(--nbcc-teashop-title-weight,800) !important;
    font-size:clamp(24px,2vw,34px) !important;
    line-height:1.12 !important;
    color:var(--nbcc-albatal-text,#8A0D05) !important;
    text-transform:uppercase !important;
    letter-spacing:.01em !important;
}

.nbcc-is-albatal .nbcc-slide.active .nbcc-slide-title{
    font-size:clamp(30px,2.6vw,44px) !important;
}

.nbcc-is-albatal .nbcc-arrow{
    top:auto !important;
    bottom:clamp(22px,3vw,44px) !important;
    transform:none !important;
    color:#ffffff !important;
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    font-size:clamp(46px,4.8vw,68px) !important;
    width:auto !important;
    height:auto !important;
    min-width:44px !important;
    min-height:44px !important;
    line-height:1 !important;
}

.nbcc-is-albatal .nbcc-arrow:hover{
    transform:scale(1.08) !important;
}

.nbcc-is-albatal .nbcc-arrow--prev{
    left:calc(50% - 70px) !important;
    right:auto !important;
}

.nbcc-is-albatal .nbcc-arrow--next{
    left:calc(50% + 18px) !important;
    right:auto !important;
}

@media(max-width:900px){
    .nbcc-is-albatal .nbcc-slide.active{
        width:min(82vw,420px) !important;
        height:clamp(350px,78vw,500px) !important;
    }
    .nbcc-is-albatal .nbcc-slide.prev,
    .nbcc-is-albatal .nbcc-slide.next{
        width:min(70vw,340px) !important;
        height:clamp(290px,64vw,390px) !important;
    }
    .nbcc-is-albatal .nbcc-slide.prev{left:10% !important;}
    .nbcc-is-albatal .nbcc-slide.next{left:90% !important;}
    .nbcc-is-albatal .nbcc-slide.active img{transform:scale(1.34) !important;}
    .nbcc-is-albatal .nbcc-slide.prev img,
    .nbcc-is-albatal .nbcc-slide.next img{transform:scale(1.02) !important;}
}


/* =========================================================
   V29 - Al Batal final production refinements
   - Top-aligned side and center cards
   - Arrows fixed below the carousel stage, never inside the center card
   - Center card has a clean white frame and consistent proportions
   - Product names split into bold main line and regular flavor line by JS
   - Uses CSS variables so the category controls remain the source of truth
========================================================= */
.nbcc-is-albatal{
    --nbcc-albatal-bg-red-1:#D80000;
    --nbcc-albatal-bg-red-2:#B60000;
    --nbcc-albatal-bg-red-3:#780000;
    --nbcc-albatal-card-red:#C90000;
    --nbcc-albatal-text:#8A0D05;
    --nbcc-albatal-stage-top:clamp(26px,3vw,48px);
    --nbcc-albatal-arrow-bottom:clamp(28px,3.4vw,54px);
    --nbcc-albatal-side-card-w:clamp(270px,24vw,430px);
    --nbcc-albatal-side-card-h:clamp(330px,29vw,460px);
    --nbcc-albatal-center-card-w:clamp(410px,36vw,610px);
    --nbcc-albatal-center-card-h:clamp(455px,42vw,650px);
}

.nbcc-is-albatal .nbcc-slider-section{
    min-height:clamp(610px,54vw,820px) !important;
    padding:clamp(40px,4vw,66px) 0 clamp(118px,8vw,150px) !important;
    background:
        radial-gradient(circle at 50% 72%, rgba(255,35,35,.38) 0%, rgba(209,0,0,.28) 24%, transparent 54%),
        radial-gradient(circle at 50% 22%, rgba(255,0,0,.35) 0%, transparent 38%),
        linear-gradient(140deg,var(--nbcc-albatal-bg-red-3) 0%,var(--nbcc-albatal-bg-red-2) 48%,var(--nbcc-albatal-bg-red-3) 100%) !important;
}

.nbcc-is-albatal .nbcc-slider-track-wrap{
    min-height:clamp(450px,42vw,660px) !important;
    overflow:visible !important;
    align-items:flex-start !important;
}

.nbcc-is-albatal .nbcc-slider-track{
    overflow:visible !important;
}

/* Top alignment: all visible cards share the same top baseline. */
.nbcc-is-albatal .nbcc-slide,
.nbcc-is-albatal .nbcc-slide.active,
.nbcc-is-albatal .nbcc-slide.prev,
.nbcc-is-albatal .nbcc-slide.next{
    top:var(--nbcc-albatal-stage-top) !important;
    transform:translateX(-50%) scale(1) !important;
    transform-origin:top center !important;
    opacity:1 !important;
}

.nbcc-is-albatal .nbcc-slide{
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-start !important;
    background:#ffffff !important;
    border-radius:clamp(18px,1.7vw,28px) !important;
    padding:clamp(14px,1.55vw,24px) !important;
    overflow:hidden !important;
    box-shadow:none !important;
    pointer-events:none;
}

.nbcc-is-albatal .nbcc-slide.active{
    left:50% !important;
    width:var(--nbcc-albatal-center-card-w) !important;
    height:var(--nbcc-albatal-center-card-h) !important;
    z-index:8 !important;
    pointer-events:auto !important;
    box-shadow:0 32px 70px rgba(60,0,0,.18) !important;
}

.nbcc-is-albatal .nbcc-slide.prev,
.nbcc-is-albatal .nbcc-slide.next{
    width:var(--nbcc-albatal-side-card-w) !important;
    height:var(--nbcc-albatal-side-card-h) !important;
    z-index:4 !important;
    pointer-events:auto !important;
    box-shadow:0 20px 48px rgba(60,0,0,.12) !important;
}

.nbcc-is-albatal .nbcc-slide.prev{left:20% !important;}
.nbcc-is-albatal .nbcc-slide.next{left:80% !important;}

.nbcc-is-albatal .nbcc-slide-media{
    flex:0 0 auto !important;
    width:100% !important;
    height:66% !important;
    border-radius:clamp(14px,1.3vw,22px) !important;
    background:var(--nbcc-albatal-card-red,#C90000) !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    overflow:hidden !important;
    padding:clamp(14px,1.4vw,24px) !important;
}

.nbcc-is-albatal .nbcc-slide.active .nbcc-slide-media{
    height:70% !important;
    border-radius:clamp(16px,1.45vw,24px) !important;
}

.nbcc-is-albatal .nbcc-slide img{
    width:auto !important;
    height:auto !important;
    max-width:88% !important;
    max-height:86% !important;
    object-fit:contain !important;
    object-position:center center !important;
    padding:0 !important;
    background:transparent !important;
    transform:none !important;
    filter:drop-shadow(0 16px 22px rgba(0,0,0,.22)) !important;
}

.nbcc-is-albatal .nbcc-slide.active img{
    max-width:94% !important;
    max-height:92% !important;
    transform:scale(var(--nbcc-product-img-scale,1)) !important;
    filter:drop-shadow(0 24px 34px rgba(0,0,0,.28)) !important;
}

.nbcc-is-albatal .nbcc-slide.prev img,
.nbcc-is-albatal .nbcc-slide.next img{
    max-width:86% !important;
    max-height:84% !important;
    transform:scale(var(--nbcc-product-img-side-scale,.82)) !important;
}

.nbcc-is-albatal .nbcc-slide-caption{
    flex:1 1 auto !important;
    width:100% !important;
    min-height:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    background:#ffffff !important;
    padding:clamp(14px,1.6vw,24px) 6px 2px !important;
}

.nbcc-is-albatal .nbcc-slide-title{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:.22em !important;
    font-family:Montserrat,Arial,sans-serif !important;
    color:var(--nbcc-albatal-text,#8A0D05) !important;
    text-transform:uppercase !important;
    letter-spacing:.015em !important;
    line-height:1.08 !important;
}

.nbcc-is-albatal .nbcc-title-main{
    display:block !important;
    font-weight:900 !important;
    font-size:clamp(23px,1.75vw,34px) !important;
    line-height:1.05 !important;
}

.nbcc-is-albatal .nbcc-title-sub{
    display:block !important;
    font-weight:400 !important;
    font-size:clamp(21px,1.62vw,31px) !important;
    line-height:1.05 !important;
}

.nbcc-is-albatal .nbcc-slide.active .nbcc-title-main{
    font-size:clamp(31px,2.7vw,48px) !important;
}

.nbcc-is-albatal .nbcc-slide.active .nbcc-title-sub{
    font-size:clamp(29px,2.35vw,42px) !important;
}

/* Keep arrows below the complete card group. */
.nbcc-is-albatal .nbcc-arrow{
    top:auto !important;
    bottom:calc(-1 * var(--nbcc-albatal-arrow-bottom) - var(--nbcc-arrow-vertical-offset,0px)) !important;
    transform:none !important;
    color:#ffffff !important;
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    width:58px !important;
    height:58px !important;
    font-size:clamp(48px,4.8vw,70px) !important;
    line-height:1 !important;
    z-index:20 !important;
}

.nbcc-is-albatal .nbcc-arrow:hover{
    transform:scale(1.08) !important;
    box-shadow:none !important;
}

.nbcc-is-albatal .nbcc-arrow--prev{
    left:calc(50% - 78px) !important;
    right:auto !important;
}

.nbcc-is-albatal .nbcc-arrow--next{
    left:calc(50% + 20px) !important;
    right:auto !important;
}

.nbcc-is-albatal .nbcc-dots{
    display:none !important;
}

@media(max-width:1024px){
    .nbcc-is-albatal{
        --nbcc-albatal-side-card-w:clamp(220px,28vw,330px);
        --nbcc-albatal-center-card-w:clamp(330px,48vw,500px);
    }
    .nbcc-is-albatal .nbcc-slide.prev{left:18% !important;}
    .nbcc-is-albatal .nbcc-slide.next{left:82% !important;}
}

@media(max-width:760px){
    .nbcc-is-albatal .nbcc-slider-section{
        min-height:620px !important;
        padding-bottom:120px !important;
    }
    .nbcc-is-albatal .nbcc-slide.prev,
    .nbcc-is-albatal .nbcc-slide.next{
        opacity:.34 !important;
        transform:translateX(-50%) scale(.78) !important;
    }
    .nbcc-is-albatal .nbcc-slide.prev{left:2% !important;}
    .nbcc-is-albatal .nbcc-slide.next{left:98% !important;}
    .nbcc-is-albatal .nbcc-slide.active{
        width:min(88vw,430px) !important;
        height:clamp(430px,92vw,560px) !important;
    }
}

/* =========================================================
   V29 - Al Batal final arrow and stage correction
   Purpose:
   - Keep arrows visible below all cards, not inside the active card.
   - Reserve real vertical stage space for the center card + arrows.
   - Keep side cards aligned from the top baseline.
   - Keep product title split as bold main line + regular second line.
========================================================= */
.nbcc-is-albatal .nbcc-slider-section{
    min-height:clamp(680px,58vw,900px) !important;
    padding-top:clamp(42px,4vw,70px) !important;
    padding-bottom:clamp(110px,7vw,145px) !important;
    justify-content:flex-start !important;
    overflow:hidden !important;
}

.nbcc-is-albatal .nbcc-slider-track-wrap{
    position:relative !important;
    flex:0 0 auto !important;
    height:clamp(575px,48vw,760px) !important;
    min-height:clamp(575px,48vw,760px) !important;
    width:100% !important;
    overflow:visible !important;
    align-items:flex-start !important;
    justify-content:center !important;
}

.nbcc-is-albatal .nbcc-slider-track{
    position:absolute !important;
    inset:0 !important;
    height:100% !important;
    overflow:visible !important;
    z-index:3 !important;
}

.nbcc-is-albatal .nbcc-slide,
.nbcc-is-albatal .nbcc-slide.active,
.nbcc-is-albatal .nbcc-slide.prev,
.nbcc-is-albatal .nbcc-slide.next{
    top:clamp(10px,1.2vw,20px) !important;
    transform:translateX(-50%) scale(1) !important;
    transform-origin:top center !important;
}

.nbcc-is-albatal .nbcc-slide.active{
    left:50% !important;
    width:clamp(420px,36vw,610px) !important;
    height:clamp(470px,40vw,650px) !important;
}

.nbcc-is-albatal .nbcc-slide.prev,
.nbcc-is-albatal .nbcc-slide.next{
    width:clamp(280px,24vw,430px) !important;
    height:clamp(335px,28vw,455px) !important;
}

.nbcc-is-albatal .nbcc-slide.prev{left:20% !important;}
.nbcc-is-albatal .nbcc-slide.next{left:80% !important;}

/* Product image: larger and contained, never cropped. */
.nbcc-is-albatal .nbcc-slide-media{
    height:64% !important;
    padding:clamp(14px,1.2vw,24px) !important;
}
.nbcc-is-albatal .nbcc-slide.active .nbcc-slide-media{
    height:68% !important;
}
.nbcc-is-albatal .nbcc-slide img{
    width:auto !important;
    height:auto !important;
    max-width:92% !important;
    max-height:92% !important;
    object-fit:contain !important;
    object-position:center center !important;
    background:transparent !important;
}
.nbcc-is-albatal .nbcc-slide.active img{
    max-width:96% !important;
    max-height:96% !important;
}

/* Titles: main line bold, second line normal. */
.nbcc-is-albatal .nbcc-slide-title{
    font-family:Montserrat,Arial,sans-serif !important;
    color:#8A0D05 !important;
    text-transform:uppercase !important;
    letter-spacing:.02em !important;
    line-height:1.08 !important;
}
.nbcc-is-albatal .nbcc-title-main{
    display:block !important;
    font-weight:900 !important;
}
.nbcc-is-albatal .nbcc-title-sub{
    display:block !important;
    font-weight:400 !important;
}

/* Arrows: hard-positioned at the bottom of the carousel stage. */
.nbcc-is-albatal .nbcc-arrow{
    display:flex !important;
    position:absolute !important;
    top:auto !important;
    bottom:calc(clamp(2px,.8vw,16px) - var(--nbcc-arrow-vertical-offset,0px)) !important;
    transform:none !important;
    z-index:60 !important;
    width:clamp(52px,4vw,68px) !important;
    height:clamp(52px,4vw,68px) !important;
    color:#ffffff !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    font-size:clamp(48px,4.6vw,72px) !important;
    line-height:1 !important;
    opacity:1 !important;
    visibility:visible !important;
}
.nbcc-is-albatal .nbcc-arrow:hover{
    transform:scale(1.08) !important;
    background:transparent !important;
    box-shadow:none !important;
}
.nbcc-is-albatal .nbcc-arrow--prev{
    left:calc(50% - 82px) !important;
    right:auto !important;
}
.nbcc-is-albatal .nbcc-arrow--next{
    left:calc(50% + 24px) !important;
    right:auto !important;
}
.nbcc-is-albatal .nbcc-dots{display:none !important;}

@media(max-width:1024px){
    .nbcc-is-albatal .nbcc-slider-track-wrap{
        height:clamp(530px,64vw,680px) !important;
        min-height:clamp(530px,64vw,680px) !important;
    }
    .nbcc-is-albatal .nbcc-slide.prev{left:18% !important;}
    .nbcc-is-albatal .nbcc-slide.next{left:82% !important;}
}

@media(max-width:760px){
    .nbcc-is-albatal .nbcc-slider-section{
        min-height:650px !important;
        padding-bottom:105px !important;
    }
    .nbcc-is-albatal .nbcc-slider-track-wrap{
        height:560px !important;
        min-height:560px !important;
    }
    .nbcc-is-albatal .nbcc-slide.active{
        width:min(88vw,430px) !important;
        height:clamp(440px,92vw,560px) !important;
    }
    .nbcc-is-albatal .nbcc-slide.prev,
    .nbcc-is-albatal .nbcc-slide.next{
        opacity:.28 !important;
        transform:translateX(-50%) scale(.78) !important;
    }
    .nbcc-is-albatal .nbcc-slide.prev{left:0% !important;}
    .nbcc-is-albatal .nbcc-slide.next{left:100% !important;}
    .nbcc-is-albatal .nbcc-arrow--prev{left:calc(50% - 72px) !important;}
    .nbcc-is-albatal .nbcc-arrow--next{left:calc(50% + 16px) !important;}
}


/* =========================================================
   V30 - Al Batal production arrow placement and icon refinement
   Purpose:
   - Reserve a real arrow zone below the center card.
   - Keep arrows outside the product/card area in all desktop layouts.
   - Render arrows as clean thick line icons instead of plain text glyphs.
   - Preserve category-level controls for color, background, and size.
========================================================= */
.nbcc-section.nbcc-is-albatal{
    --nbcc-albatal-card-top: clamp(10px, 1.2vw, 20px);
    --nbcc-albatal-center-card-h: clamp(470px, 40vw, 650px);
    --nbcc-albatal-arrow-zone: clamp(105px, 7vw, 135px);
    --nbcc-albatal-arrow-size: var(--nbcc-arrow-size, 64px);
    --nbcc-albatal-arrow-color-final: var(--nbcc-arrow-color, #ffffff);
}

.nbcc-section.nbcc-is-albatal .nbcc-slider-section{
    min-height: calc(var(--nbcc-albatal-card-top) + var(--nbcc-albatal-center-card-h) + var(--nbcc-albatal-arrow-zone) + clamp(70px, 5vw, 95px)) !important;
    padding-top: clamp(42px, 4vw, 70px) !important;
    padding-bottom: clamp(34px, 3vw, 58px) !important;
    overflow: hidden !important;
}

.nbcc-section.nbcc-is-albatal .nbcc-slider-track-wrap{
    position: relative !important;
    height: calc(var(--nbcc-albatal-card-top) + var(--nbcc-albatal-center-card-h) + var(--nbcc-albatal-arrow-zone)) !important;
    min-height: calc(var(--nbcc-albatal-card-top) + var(--nbcc-albatal-center-card-h) + var(--nbcc-albatal-arrow-zone)) !important;
    overflow: visible !important;
}

.nbcc-section.nbcc-is-albatal .nbcc-slider-track{
    position:absolute !important;
    inset:0 !important;
    height:100% !important;
    overflow:visible !important;
}

.nbcc-section.nbcc-is-albatal .nbcc-slide,
.nbcc-section.nbcc-is-albatal .nbcc-slide.active,
.nbcc-section.nbcc-is-albatal .nbcc-slide.prev,
.nbcc-section.nbcc-is-albatal .nbcc-slide.next{
    top: var(--nbcc-albatal-card-top) !important;
    transform: translateX(-50%) scale(1) !important;
    transform-origin: top center !important;
}

.nbcc-section.nbcc-is-albatal .nbcc-slide.active{
    height: var(--nbcc-albatal-center-card-h) !important;
}

/* Force bottom navigation to sit below the product cards, not inside them. */
.nbcc-section.nbcc-is-albatal .nbcc-arrow{
    position:absolute !important;
    top:auto !important;
    bottom: calc(clamp(14px, 1.4vw, 24px) - var(--nbcc-arrow-vertical-offset,0px)) !important;
    transform:none !important;
    z-index:90 !important;
    width: var(--nbcc-albatal-arrow-size) !important;
    height: var(--nbcc-albatal-arrow-size) !important;
    min-width: var(--nbcc-albatal-arrow-size) !important;
    min-height: var(--nbcc-albatal-arrow-size) !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:0 !important;
    color: var(--nbcc-albatal-arrow-color-final) !important;
    background: transparent !important;
    border:0 !important;
    box-shadow:none !important;
    opacity:1 !important;
    visibility:visible !important;
}

.nbcc-section.nbcc-is-albatal .nbcc-arrow:hover{
    transform:scale(1.08) !important;
    background:transparent !important;
    box-shadow:none !important;
}

.nbcc-section.nbcc-is-albatal .nbcc-arrow--prev{
    left:calc(50% - var(--nbcc-albatal-arrow-size) - clamp(12px, 1.2vw, 22px)) !important;
    right:auto !important;
}

.nbcc-section.nbcc-is-albatal .nbcc-arrow--next{
    left:calc(50% + clamp(12px, 1.2vw, 22px)) !important;
    right:auto !important;
}

/* Replace text arrows with a clean custom line-arrow icon. */
.nbcc-section.nbcc-is-albatal .nbcc-arrow span{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    overflow:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
}

.nbcc-section.nbcc-is-albatal .nbcc-arrow::before,
.nbcc-section.nbcc-is-albatal .nbcc-arrow::after{
    content:'' !important;
    position:absolute !important;
    display:block !important;
    pointer-events:none !important;
}

.nbcc-section.nbcc-is-albatal .nbcc-arrow::before{
    width:72% !important;
    height:7px !important;
    top:50% !important;
    left:14% !important;
    transform:translateY(-50%) !important;
    border-radius:999px !important;
    background:currentColor !important;
}

.nbcc-section.nbcc-is-albatal .nbcc-arrow::after{
    width:24px !important;
    height:24px !important;
    top:50% !important;
    border-radius:3px !important;
}

.nbcc-section.nbcc-is-albatal .nbcc-arrow--prev::after{
    left:12% !important;
    border-left:7px solid currentColor !important;
    border-bottom:7px solid currentColor !important;
    transform:translateY(-50%) rotate(45deg) !important;
}

.nbcc-section.nbcc-is-albatal .nbcc-arrow--next::after{
    right:12% !important;
    border-right:7px solid currentColor !important;
    border-top:7px solid currentColor !important;
    transform:translateY(-50%) rotate(45deg) !important;
}

@media(max-width:760px){
    .nbcc-section.nbcc-is-albatal{
        --nbcc-albatal-center-card-h: clamp(430px, 92vw, 560px);
        --nbcc-albatal-arrow-zone: 105px;
        --nbcc-albatal-arrow-size: 56px;
    }
    .nbcc-section.nbcc-is-albatal .nbcc-slider-section{
        min-height: calc(var(--nbcc-albatal-card-top) + var(--nbcc-albatal-center-card-h) + var(--nbcc-albatal-arrow-zone) + 65px) !important;
        padding-bottom:34px !important;
    }
}


/* =========================================================
   V34 - TeaShop final production card system
   Reference: three equal premium cards with product-specific backgrounds.
   - Yellow cards use #FFBD0C.
   - Middle/red card uses #C7325C by default.
   - Each card keeps its own decorative pattern layer.
   - Product image size still respects the Category Product Image controls.
========================================================= */
.nbcc-is-teashop,
.nbcc-category-teashop,
.nbcc-category-tea-shop,
.nbcc-preset-teashop,
.nbcc-preset-tea-shop{
    --nbcc-teashop-yellow:var(--nbcc-teashop-card3,#FFBD0C);
    --nbcc-teashop-red:var(--nbcc-teashop-card2,#C7325C);
    --nbcc-teashop-title:#FFFFFF;
    background:#ffffff !important;
    overflow:hidden !important;
}

.nbcc-is-teashop .nbcc-slider-section,
.nbcc-category-teashop .nbcc-slider-section,
.nbcc-category-tea-shop .nbcc-slider-section,
.nbcc-preset-teashop .nbcc-slider-section,
.nbcc-preset-tea-shop .nbcc-slider-section{
    min-height:clamp(500px,44vw,680px) !important;
    padding:clamp(28px,3.5vw,52px) 0 clamp(78px,7vw,110px) !important;
}

.nbcc-is-teashop .nbcc-slider-track-wrap,
.nbcc-category-teashop .nbcc-slider-track-wrap,
.nbcc-category-tea-shop .nbcc-slider-track-wrap,
.nbcc-preset-teashop .nbcc-slider-track-wrap,
.nbcc-preset-tea-shop .nbcc-slider-track-wrap{
    min-height:clamp(390px,36vw,560px) !important;
    overflow:visible !important;
    --nbcc-teashop-card-gap-safe:var(--nbcc-teashop-card-gap,44px);
}

.nbcc-is-teashop .nbcc-slide,
.nbcc-category-teashop .nbcc-slide,
.nbcc-category-tea-shop .nbcc-slide,
.nbcc-preset-teashop .nbcc-slide,
.nbcc-preset-tea-shop .nbcc-slide{
    width:var(--nbcc-slide-width,clamp(285px,27vw,430px)) !important;
    height:clamp(380px,35vw,540px) !important;
    border-radius:12px !important;
    padding:clamp(22px,2vw,34px) !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:space-between !important;
    overflow:hidden !important;
    box-shadow:none !important;
    border:0 !important;
    background:var(--nbcc-teashop-card1,#C7325C) !important;
    color:var(--nbcc-teashop-title) !important;
}

/* Decorative background layer shared by all TeaShop cards. */
.nbcc-is-teashop .nbcc-slide::before,
.nbcc-category-teashop .nbcc-slide::before,
.nbcc-category-tea-shop .nbcc-slide::before,
.nbcc-preset-teashop .nbcc-slide::before,
.nbcc-preset-tea-shop .nbcc-slide::before{
    content:'';
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    opacity:.34;
    background-repeat:no-repeat;
    background-size:var(--nbcc-teashop-pattern-size,cover);
    background-position:var(--nbcc-teashop-pattern-position,center top);
}

/* Yellow cards: tribal/maze line pattern similar to the reference. */
.nbcc-is-teashop .nbcc-slide:nth-child(3n+1),
.nbcc-category-teashop .nbcc-slide:nth-child(3n+1),
.nbcc-category-tea-shop .nbcc-slide:nth-child(3n+1),
.nbcc-preset-teashop .nbcc-slide:nth-child(3n+1),
.nbcc-preset-tea-shop .nbcc-slide:nth-child(3n+1){
    background:var(--nbcc-teashop-card1,#C7325C) !important;
}
.nbcc-is-teashop .nbcc-slide:nth-child(3n),
.nbcc-category-teashop .nbcc-slide:nth-child(3n),
.nbcc-category-tea-shop .nbcc-slide:nth-child(3n),
.nbcc-preset-teashop .nbcc-slide:nth-child(3n),
.nbcc-preset-tea-shop .nbcc-slide:nth-child(3n){
    background:var(--nbcc-teashop-card3,#FFBD0C) !important;
}

.nbcc-is-teashop .nbcc-slide:nth-child(3n+1)::before,
.nbcc-is-teashop .nbcc-slide:nth-child(3n)::before,
.nbcc-category-teashop .nbcc-slide:nth-child(3n+1)::before,
.nbcc-category-teashop .nbcc-slide:nth-child(3n)::before,
.nbcc-category-tea-shop .nbcc-slide:nth-child(3n+1)::before,
.nbcc-category-tea-shop .nbcc-slide:nth-child(3n)::before,
.nbcc-preset-teashop .nbcc-slide:nth-child(3n+1)::before,
.nbcc-preset-teashop .nbcc-slide:nth-child(3n)::before,
.nbcc-preset-tea-shop .nbcc-slide:nth-child(3n+1)::before,
.nbcc-preset-tea-shop .nbcc-slide:nth-child(3n)::before{
    background-image:
        linear-gradient(45deg,transparent 0 20%,rgba(151,83,0,.34) 20.5% 25%,transparent 25.5% 100%),
        linear-gradient(-45deg,transparent 0 20%,rgba(151,83,0,.34) 20.5% 25%,transparent 25.5% 100%),
        repeating-linear-gradient(45deg,transparent 0 28px,rgba(151,83,0,.20) 29px 36px,transparent 37px 70px);
    background-size:85% 58%,85% 58%,100% 62%;
    background-position:center 5%,center 5%,center 2%;
}

/* Red card: geometric pattern top-right and center, with #C7325C base. */
.nbcc-is-teashop .nbcc-slide:nth-child(3n+2),
.nbcc-category-teashop .nbcc-slide:nth-child(3n+2),
.nbcc-category-tea-shop .nbcc-slide:nth-child(3n+2),
.nbcc-preset-teashop .nbcc-slide:nth-child(3n+2),
.nbcc-preset-tea-shop .nbcc-slide:nth-child(3n+2){
    background:var(--nbcc-teashop-red) !important;
}

.nbcc-is-teashop .nbcc-slide:nth-child(3n+2)::before,
.nbcc-category-teashop .nbcc-slide:nth-child(3n+2)::before,
.nbcc-category-tea-shop .nbcc-slide:nth-child(3n+2)::before,
.nbcc-preset-teashop .nbcc-slide:nth-child(3n+2)::before,
.nbcc-preset-tea-shop .nbcc-slide:nth-child(3n+2)::before{
    opacity:.30;
    background-image:
        linear-gradient(135deg,transparent 0 44%,rgba(110,0,0,.34) 45% 52%,transparent 53% 100%),
        linear-gradient(45deg,transparent 0 44%,rgba(110,0,0,.32) 45% 52%,transparent 53% 100%),
        repeating-linear-gradient(18deg,transparent 0 64px,rgba(110,0,0,.26) 65px 88px,transparent 89px 150px);
    background-size:68% 42%,58% 38%,100% 56%;
    background-position:right top,center 4%,center top;
}

.nbcc-is-teashop .nbcc-slide-media,
.nbcc-category-teashop .nbcc-slide-media,
.nbcc-category-tea-shop .nbcc-slide-media,
.nbcc-preset-teashop .nbcc-slide-media,
.nbcc-preset-tea-shop .nbcc-slide-media{
    position:relative !important;
    z-index:1 !important;
    height:68% !important;
    width:100% !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    overflow:visible !important;
    padding:0 !important;
    background:transparent !important;
}

.nbcc-is-teashop .nbcc-slide img,
.nbcc-category-teashop .nbcc-slide img,
.nbcc-category-tea-shop .nbcc-slide img,
.nbcc-preset-teashop .nbcc-slide img,
.nbcc-preset-tea-shop .nbcc-slide img{
    width:var(--nbcc-product-img-width,112%) !important;
    height:var(--nbcc-product-img-height,auto) !important;
    max-width:118% !important;
    max-height:var(--nbcc-product-img-max-height,112%) !important;
    object-fit:var(--nbcc-product-img-fit,contain) !important;
    object-position:var(--nbcc-product-img-position,center) !important;
    padding:var(--nbcc-product-img-padding,0) !important;
    background:transparent !important;
    transform:scale(var(--nbcc-product-img-scale,1.05)) !important;
    filter:drop-shadow(0 18px 22px rgba(0,0,0,.24)) !important;
}

.nbcc-is-teashop .nbcc-slide-caption,
.nbcc-category-teashop .nbcc-slide-caption,
.nbcc-category-tea-shop .nbcc-slide-caption,
.nbcc-preset-teashop .nbcc-slide-caption,
.nbcc-preset-tea-shop .nbcc-slide-caption{
    position:relative !important;
    z-index:1 !important;
    min-height:24% !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    padding:0 8px 10px !important;
    color:#fff !important;
}

.nbcc-is-teashop .nbcc-slide-title,
.nbcc-category-teashop .nbcc-slide-title,
.nbcc-category-tea-shop .nbcc-slide-title,
.nbcc-preset-teashop .nbcc-slide-title,
.nbcc-preset-tea-shop .nbcc-slide-title{
    font-family:Montserrat,Arial,sans-serif !important;
    font-weight:800 !important;
    font-size:clamp(24px,2vw,36px) !important;
    line-height:1.15 !important;
    color:#fff !important;
    letter-spacing:-.015em !important;
    text-shadow:none !important;
}

/* TeaShop arrows stay as red bottom arrows like the provided reference. */
.nbcc-is-teashop .nbcc-arrow,
.nbcc-category-teashop .nbcc-arrow,
.nbcc-category-tea-shop .nbcc-arrow,
.nbcc-preset-teashop .nbcc-arrow,
.nbcc-preset-tea-shop .nbcc-arrow{
    top:auto !important;
    bottom:calc(clamp(14px,2vw,26px) - var(--nbcc-arrow-vertical-offset,0px)) !important;
    transform:none !important;
    color:#C61518 !important;
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    font-size:clamp(42px,4.4vw,62px) !important;
}
.nbcc-is-teashop .nbcc-arrow--prev,
.nbcc-category-teashop .nbcc-arrow--prev,
.nbcc-category-tea-shop .nbcc-arrow--prev,
.nbcc-preset-teashop .nbcc-arrow--prev,
.nbcc-preset-tea-shop .nbcc-arrow--prev{
    left:calc(50% - 64px) !important;
    right:auto !important;
}
.nbcc-is-teashop .nbcc-arrow--next,
.nbcc-category-teashop .nbcc-arrow--next,
.nbcc-category-tea-shop .nbcc-arrow--next,
.nbcc-preset-teashop .nbcc-arrow--next,
.nbcc-preset-tea-shop .nbcc-arrow--next{
    left:calc(50% + 18px) !important;
    right:auto !important;
}

@media(max-width:760px){
    .nbcc-is-teashop .nbcc-slide,
    .nbcc-category-teashop .nbcc-slide,
    .nbcc-category-tea-shop .nbcc-slide,
    .nbcc-preset-teashop .nbcc-slide,
    .nbcc-preset-tea-shop .nbcc-slide{
        width:min(86vw,360px) !important;
        height:clamp(340px,80vw,430px) !important;
    }
}

/* =========================================================
   V35 - TeaShop production controls
   Category-level controls for 3 card colors, decorative pattern position,
   pattern size, card spacing, and bold title weight.
========================================================= */
.nbcc-is-teashop .nbcc-slide:nth-child(3n+1),
.nbcc-category-teashop .nbcc-slide:nth-child(3n+1),
.nbcc-category-tea-shop .nbcc-slide:nth-child(3n+1),
.nbcc-preset-teashop .nbcc-slide:nth-child(3n+1),
.nbcc-preset-tea-shop .nbcc-slide:nth-child(3n+1){
    background:var(--nbcc-teashop-card1,#C7325C) !important;
}
.nbcc-is-teashop .nbcc-slide:nth-child(3n+2),
.nbcc-category-teashop .nbcc-slide:nth-child(3n+2),
.nbcc-category-tea-shop .nbcc-slide:nth-child(3n+2),
.nbcc-preset-teashop .nbcc-slide:nth-child(3n+2),
.nbcc-preset-tea-shop .nbcc-slide:nth-child(3n+2){
    background:var(--nbcc-teashop-card2,#C61518) !important;
}
.nbcc-is-teashop .nbcc-slide:nth-child(3n),
.nbcc-category-teashop .nbcc-slide:nth-child(3n),
.nbcc-category-tea-shop .nbcc-slide:nth-child(3n),
.nbcc-preset-teashop .nbcc-slide:nth-child(3n),
.nbcc-preset-tea-shop .nbcc-slide:nth-child(3n){
    background:var(--nbcc-teashop-card3,#FFBD0C) !important;
}
.nbcc-is-teashop .nbcc-slide::before,
.nbcc-category-teashop .nbcc-slide::before,
.nbcc-category-tea-shop .nbcc-slide::before,
.nbcc-preset-teashop .nbcc-slide::before,
.nbcc-preset-tea-shop .nbcc-slide::before{
    opacity:calc(.34 * var(--nbcc-teashop-pattern-enabled,1)) !important;
    background-size:var(--nbcc-teashop-pattern-size,cover) !important;
    background-position:var(--nbcc-teashop-pattern-position,center top) !important;
}
.nbcc-is-teashop .nbcc-slide-title,
.nbcc-category-teashop .nbcc-slide-title,
.nbcc-category-tea-shop .nbcc-slide-title,
.nbcc-preset-teashop .nbcc-slide-title,
.nbcc-preset-tea-shop .nbcc-slide-title{
    font-weight:var(--nbcc-teashop-title-weight,800) !important;
}
.nbcc-is-teashop .nbcc-slide.prev,
.nbcc-category-teashop .nbcc-slide.prev,
.nbcc-category-tea-shop .nbcc-slide.prev,
.nbcc-preset-teashop .nbcc-slide.prev,
.nbcc-preset-tea-shop .nbcc-slide.prev{
    left:calc(50% - var(--nbcc-slide-width,405px) - var(--nbcc-teashop-card-gap,44px)) !important;
}
.nbcc-is-teashop .nbcc-slide.next,
.nbcc-category-teashop .nbcc-slide.next,
.nbcc-category-tea-shop .nbcc-slide.next,
.nbcc-preset-teashop .nbcc-slide.next,
.nbcc-preset-tea-shop .nbcc-slide.next{
    left:calc(50% + var(--nbcc-slide-width,405px) + var(--nbcc-teashop-card-gap,44px)) !important;
}
@media(max-width:760px){
    .nbcc-is-teashop .nbcc-slide.prev,
    .nbcc-category-teashop .nbcc-slide.prev,
    .nbcc-category-tea-shop .nbcc-slide.prev,
    .nbcc-preset-teashop .nbcc-slide.prev,
    .nbcc-preset-tea-shop .nbcc-slide.prev{left:10% !important;}
    .nbcc-is-teashop .nbcc-slide.next,
    .nbcc-category-teashop .nbcc-slide.next,
    .nbcc-category-tea-shop .nbcc-slide.next,
    .nbcc-preset-teashop .nbcc-slide.next,
    .nbcc-preset-tea-shop .nbcc-slide.next{left:90% !important;}
}

/* =========================================================
   V36 - TeaShop per-box production background controls
   Adds real admin-driven background image / position / size per card.
   Each card can now have an independent color, image, placement and scale.
========================================================= */
.nbcc-is-teashop .nbcc-slider-track-wrap,
.nbcc-category-teashop .nbcc-slider-track-wrap,
.nbcc-category-tea-shop .nbcc-slider-track-wrap,
.nbcc-preset-teashop .nbcc-slider-track-wrap,
.nbcc-preset-tea-shop .nbcc-slider-track-wrap{
    --nbcc-teashop-card-gap-safe:var(--nbcc-teashop-card-gap,44px) !important;
}

.nbcc-is-teashop .nbcc-slide:nth-child(3n+1)::before,
.nbcc-category-teashop .nbcc-slide:nth-child(3n+1)::before,
.nbcc-category-tea-shop .nbcc-slide:nth-child(3n+1)::before,
.nbcc-preset-teashop .nbcc-slide:nth-child(3n+1)::before,
.nbcc-preset-tea-shop .nbcc-slide:nth-child(3n+1)::before{
    background-image:var(--nbcc-teashop-box1-bg,
        linear-gradient(25deg,transparent 0 30%,rgba(128,0,45,.22) 31% 38%,transparent 39% 100%),
        repeating-linear-gradient(55deg,transparent 0 42px,rgba(128,0,45,.22) 43px 52px,transparent 53px 96px)
    ) !important;
    background-position:var(--nbcc-teashop-box1-bg-position,center top) !important;
    background-size:var(--nbcc-teashop-box1-bg-size,cover) !important;
    opacity:calc(.42 * var(--nbcc-teashop-pattern-enabled,1)) !important;
}

.nbcc-is-teashop .nbcc-slide:nth-child(3n+2)::before,
.nbcc-category-teashop .nbcc-slide:nth-child(3n+2)::before,
.nbcc-category-tea-shop .nbcc-slide:nth-child(3n+2)::before,
.nbcc-preset-teashop .nbcc-slide:nth-child(3n+2)::before,
.nbcc-preset-tea-shop .nbcc-slide:nth-child(3n+2)::before{
    background-image:var(--nbcc-teashop-box2-bg,
        linear-gradient(135deg,transparent 0 44%,rgba(110,0,0,.34) 45% 52%,transparent 53% 100%),
        linear-gradient(45deg,transparent 0 44%,rgba(110,0,0,.32) 45% 52%,transparent 53% 100%),
        repeating-linear-gradient(18deg,transparent 0 64px,rgba(110,0,0,.26) 65px 88px,transparent 89px 150px)
    ) !important;
    background-position:var(--nbcc-teashop-box2-bg-position,right top) !important;
    background-size:var(--nbcc-teashop-box2-bg-size,cover) !important;
    opacity:calc(.34 * var(--nbcc-teashop-pattern-enabled,1)) !important;
}

.nbcc-is-teashop .nbcc-slide:nth-child(3n)::before,
.nbcc-category-teashop .nbcc-slide:nth-child(3n)::before,
.nbcc-category-tea-shop .nbcc-slide:nth-child(3n)::before,
.nbcc-preset-teashop .nbcc-slide:nth-child(3n)::before,
.nbcc-preset-tea-shop .nbcc-slide:nth-child(3n)::before{
    background-image:var(--nbcc-teashop-box3-bg,
        linear-gradient(45deg,transparent 0 20%,rgba(151,83,0,.34) 20.5% 25%,transparent 25.5% 100%),
        linear-gradient(-45deg,transparent 0 20%,rgba(151,83,0,.34) 20.5% 25%,transparent 25.5% 100%),
        repeating-linear-gradient(45deg,transparent 0 28px,rgba(151,83,0,.20) 29px 36px,transparent 37px 70px)
    ) !important;
    background-position:var(--nbcc-teashop-box3-bg-position,center top) !important;
    background-size:var(--nbcc-teashop-box3-bg-size,cover) !important;
    opacity:calc(.34 * var(--nbcc-teashop-pattern-enabled,1)) !important;
}

.nbcc-is-teashop .nbcc-slide-title,
.nbcc-category-teashop .nbcc-slide-title,
.nbcc-category-tea-shop .nbcc-slide-title,
.nbcc-preset-teashop .nbcc-slide-title,
.nbcc-preset-tea-shop .nbcc-slide-title{
    font-weight:var(--nbcc-teashop-title-weight,800) !important;
}