/* Bazarban responsive media/text cards and selectable horizontal/vertical layouts. */
.bb-rbb-role--stack > .bb-rbb-grid {display:flex!important;flex-direction:column!important;gap:var(--bb-rbb-row-gap,22px)!important;align-items:stretch!important}
.bb-rbb-role--stack > .bb-rbb-grid > .bb-rbb-el {width:100%!important;max-width:100%!important;flex:0 0 auto}
.bb-rbb-preview.is-stack {display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:var(--rbb-row-gap,22px)!important}
.bb-rbb-preview.is-stack > .bb-rbb-prev-el {width:100%!important;max-width:100%!important;flex:0 0 auto}
.bb-rbb-el--split,.bb-rbb-prev-el--split {padding:0!important;min-width:0;isolation:isolate;}
.bb-rbb-split {display:flex;align-items:stretch;justify-content:stretch;width:100%;height:100%;min-height:inherit;overflow:hidden;direction:rtl}
.bb-rbb-split--left {flex-direction:row-reverse}
.bb-rbb-split--right {flex-direction:row}
.bb-rbb-split--top {flex-direction:column}
.bb-rbb-split--bottom {flex-direction:column-reverse}
.bb-rbb-split__media {position:relative;flex:0 0 var(--bb-rbb-media-share,42%);width:var(--bb-rbb-media-share,42%);min-width:0;min-height:0;display:block;overflow:hidden}
.bb-rbb-split--top .bb-rbb-split__media,.bb-rbb-split--bottom .bb-rbb-split__media {width:100%;height:var(--bb-rbb-media-share,42%)}
.bb-rbb-split__media img,.bb-rbb-split__media video {position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;object-position:center!important;border-radius:0!important;display:block}
.bb-rbb-split__media .bb-rbb-image-empty {position:absolute;inset:0}
.bb-rbb-split__copy {position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;flex:1 1 0;min-width:0;min-height:0;padding:clamp(12px,2.2vw,30px);text-align:inherit}
.bb-rbb-split__copy h2 {font-size:clamp(17px,1.8vw,30px)!important;margin:0 0 8px!important;line-height:1.5!important;font-weight:800!important;color:inherit!important}
.bb-rbb-split__copy .bb-rbb-copy {font-size:clamp(11px,1vw,15px)!important;line-height:1.85!important;color:inherit!important;opacity:.85}
.bb-rbb-split__copy .bb-rbb-button {margin-top:12px!important;padding:8px 15px!important;border-radius:6px!important;font-size:12px!important;max-width:100%}
.bb-rbb-el--image .bb-rbb-standalone-video,.bb-rbb-prev-el--image .bb-rbb-standalone-video {position:absolute!important;inset:0;width:100%!important;height:100%!important;display:block;z-index:1}
.bb-rbb-el--promo .bb-rbb-promo-bg-video,.bb-rbb-prev-el--promo .bb-rbb-promo-bg-video {position:absolute;inset:0;width:100%;height:100%;z-index:-1;object-fit:cover}
.bb-rbb-prev-el--split .bb-rbb-split__copy{padding:12px}
.bb-rbb-prev-el--split .bb-rbb-split__copy h2{font-size:clamp(15px,1.4vw,22px)!important}
.bb-rbb-prev-el--split .bb-rbb-split__copy .bb-rbb-copy{font-size:11px!important}
.bb-rbb-prev-el--split .bb-rbb-split__copy .bb-rbb-button{position:static!important;width:max-content}
@media(max-width:575.98px){
 .bb-rbb-split__copy{padding:12px}
 .bb-rbb-el--split{min-height:180px!important}
 .bb-rbb-split__copy h2{font-size:clamp(15px,4vw,23px)!important}
 .bb-rbb-split__copy .bb-rbb-copy{font-size:11px!important}
}

/* Legacy Role 7 banners also support playable media without nesting controls in a link. */
.bb-role-legacy-video {position:relative;width:100%;overflow:hidden;border-radius:8px}
.bb-role-legacy-video video {display:block;width:100%;height:auto;max-height:600px;object-fit:contain;background:#111}
.bb-role-legacy-video__link {position:absolute;inset-inline-end:9px;top:9px;z-index:3;background:rgba(0,0,0,.7);color:white!important;text-decoration:none!important;border-radius:5px;padding:6px 10px;font-size:12px}
/* Vertical variants need a nonzero media height when card height is automatic. */
.bb-rbb-split--top .bb-rbb-split__media,.bb-rbb-split--bottom .bb-rbb-split__media{min-height:110px}

/* Nested cards: one shared rendering contract for site and scaled admin preview. */
.bb-rbb-el--card,.bb-rbb-prev-el--card{
    display:block!important;padding:0!important;isolation:isolate;min-width:0;
    overflow:hidden;box-sizing:border-box;
    container:bbRbbCard / inline-size;
}
/* A grid may need extra rows when a child grows. Do not clip those rows even
   when an old exact-height setting was saved on the card container. */
.bb-rbb-el--card:has(>.bb-rbb-card-canvas[data-layout="grid"]),
.bb-rbb-prev-el--card:has(>.bb-rbb-card-canvas[data-layout="grid"]){
    height:auto!important;min-height:var(--bb-rbb-el-h,var(--bb-rbb-min-h,260px));
    overflow:hidden!important;
}
.bb-rbb-card-canvas{
    position:relative;display:block;width:100%;height:100%;min-height:inherit;
    box-sizing:border-box;direction:rtl;overflow:hidden;
    font-family:'Vazirmatn',Tahoma,Arial,sans-serif;
}
.bb-rbb-card-child{
    position:absolute;left:calc(var(--bb-card-x,0)*1%);top:calc(var(--bb-card-y,0)*1%);
    width:calc(var(--bb-card-w,45)*1%);height:calc(var(--bb-card-h,20)*1%);
    min-width:0;max-width:100%;box-sizing:border-box;display:block;
    margin:var(--bb-card-margin,0px);padding:var(--bb-card-pad,0px);
    border-radius:var(--bb-card-radius,0px);background:var(--bb-card-bg,transparent);
    color:var(--bb-card-color,#141414);font-size:var(--bb-card-font,20px)!important;
    font-weight:var(--bb-card-weight,600)!important;text-align:var(--bb-card-align,right);
    line-height:1.55;overflow:hidden;overflow-wrap:anywhere;white-space:normal;
}
.bb-rbb-card-canvas[data-layout="absolute"] .bb-rbb-card-child[style*="--bb-card-h:0;"]{
    height:auto;min-height:0;
}
.bb-rbb-card-canvas,.bb-rbb-card-canvas *{font-family:'Vazirmatn',Tahoma,Arial,sans-serif!important}
/* Grid mode converts X/Y and relative sizes to discrete cells. Cell coordinates
   are collision-resolved in the same way in PHP and JavaScript. */
.bb-rbb-card-canvas[data-layout="grid"]{
    display:grid!important;
    grid-template-columns:repeat(12,minmax(0,1fr)); /* fallback for older browsers */
    /* The 12 tracks may use 25–100% of the content width. Spacing is
       subtracted before dividing, so justify-content has real free space. */
    grid-template-columns:repeat(12,minmax(0,calc((var(--bb-card-track-width,100%) - 11 * var(--bb-card-gap,0px)) / 12)));
    grid-template-rows:repeat(12,minmax(12px,auto));
    grid-auto-rows:minmax(12px,auto);
    column-gap:var(--bb-card-gap,0px);
    row-gap:var(--bb-card-row-gap,0px);
    padding:var(--bb-card-inset,0px);
    min-height:inherit;height:auto;overflow:visible;
    align-content:var(--bb-card-align-content,stretch);
    justify-content:var(--bb-card-justify-content,start);
    align-items:var(--bb-card-align-items,stretch);
    justify-items:var(--bb-card-justify-items,stretch);direction:ltr;
}
.bb-rbb-card-canvas[data-layout="grid"]>.bb-rbb-card-child{
    position:relative!important;inset:auto!important;left:auto!important;top:auto!important;
    grid-column:var(--bb-card-grid-col,1) / span var(--bb-card-grid-span,6);
    grid-row:var(--bb-card-grid-row,1) / span var(--bb-card-grid-rows,3);
    width:var(--bb-card-cell-width,auto)!important;
    height:var(--bb-card-cell-height,auto)!important;
    max-width:100%;min-width:0;
    justify-self:var(--bb-card-justify-self,auto);
    align-self:var(--bb-card-align-self,auto);
    margin:max(0px,var(--bb-card-margin,0px));
    min-height:0;overflow:hidden;
    direction:rtl;
}
.bb-rbb-card-child--heading{display:flex!important;align-items:center}
.bb-rbb-card-child__heading{font-size:inherit!important;font-weight:inherit!important;line-height:inherit!important;margin:0!important;color:inherit!important;max-width:100%;white-space:normal}
.bb-rbb-card-child__text{width:100%;height:auto;max-height:100%;font:inherit;color:inherit!important;white-space:normal;line-height:inherit;overflow-wrap:anywhere}
.bb-rbb-card-canvas[data-layout="grid"]>.bb-rbb-card-child--heading,
.bb-rbb-card-canvas[data-layout="grid"]>.bb-rbb-card-child--text,
.bb-rbb-card-canvas[data-layout="grid"]>.bb-rbb-card-child--button{min-height:min-content}
.bb-rbb-card-child--media{display:block}
/* The media is positioned relative to its own cell, not the entire card.
   Cover fills right up to the card edge when cardInset/gap/margin are zero. */
.bb-rbb-card-child--media>img,.bb-rbb-card-child--media>video{
    position:absolute!important;inset:0!important;display:block!important;
    width:100%!important;height:100%!important;max-width:none!important;
    max-height:none!important;min-width:0!important;min-height:0!important;
    border:0!important;border-radius:inherit!important;margin:0!important;padding:0!important;
    object-fit:var(--bb-card-fit,cover)!important;
    object-position:var(--bb-card-position,center)!important;
}
.bb-rbb-card-canvas[data-layout="grid"]>.bb-rbb-card-child--media{min-height:0}
.bb-rbb-card-child--button{display:flex!important;justify-content:center;align-items:center}
.bb-rbb-card-child__button{display:flex;align-items:center;justify-content:center;width:100%;height:100%;margin:0!important;padding:0!important;text-decoration:none!important;box-sizing:border-box;cursor:pointer;color:inherit!important;font:inherit;line-height:inherit;text-align:inherit;border-radius:inherit}
.bb-rbb-card-child__button:hover{filter:brightness(.9);color:inherit!important}
.bb-rbb-card-media-empty{display:grid;width:100%;height:100%;min-height:70px;place-items:center;border:1px dashed #9daab2;border-radius:6px;color:#6b7280;font-size:12px;background:rgba(255,255,255,.5)}
.bb-rbb-card-canvas-empty{grid-column:1/-1;position:relative;display:grid;place-items:center;padding:14px;text-align:center;border:1px dashed rgba(14,84,88,.35);color:#718288;font-size:12px;line-height:1.8;min-height:170px}
.bb-rbb-card-canvas[data-layout="absolute"] .bb-rbb-card-canvas-empty{position:absolute;inset:16px}
.bb-rbb-preview .bb-rbb-card-child{touch-action:none;cursor:grab}
.bb-rbb-preview .bb-rbb-card-child.is-selected{outline:2px dashed #de1518;outline-offset:-1px;z-index:5}
.bb-rbb-preview .bb-rbb-card-child:active{cursor:grabbing}
.bb-rbb-card-resize{display:none;position:absolute;bottom:1px;right:1px;z-index:8;width:14px;height:14px;border:2px solid white;background:#de1518;border-radius:3px;cursor:nwse-resize;box-shadow:0 1px 4px #0004}
.bb-rbb-preview .bb-rbb-card-child:hover .bb-rbb-card-resize,.bb-rbb-preview .bb-rbb-card-child.is-selected .bb-rbb-card-resize{display:block}
/* Container queries depend on the ACTUAL card width, so scaled desktop,
   tablet and mobile preview are equivalent to the storefront. */
@container bbRbbCard (max-width:440px){
    .bb-rbb-card-canvas[data-layout="grid"][data-stack-mobile="1"]{
        display:flex!important;flex-direction:column;align-items:stretch;gap:var(--bb-card-row-gap,10px);
        height:auto!important;min-height:0!important;padding:var(--bb-card-inset,0px);
    }
    .bb-rbb-card-canvas[data-layout="grid"][data-stack-mobile="1"]>.bb-rbb-card-child{
        position:relative!important;inset:auto!important;width:100%!important;height:auto!important;
        flex:none!important;min-width:0;max-width:none;min-height:0!important;
        align-self:stretch!important;margin:0!important;
    }
    .bb-rbb-card-canvas[data-layout="grid"][data-stack-mobile="1"]>.bb-rbb-card-child--media{
        height:190px!important;min-height:190px!important;
    }
    .bb-rbb-card-canvas[data-layout="grid"][data-stack-mobile="1"]>.bb-rbb-card-child--button{min-height:42px!important}
}
@media(max-width:575.98px){
    /* The legacy absolute mode remains usable without changing stored cards. */
    .bb-rbb-el--card:has(.bb-rbb-card-canvas[data-layout="absolute"][data-stack-mobile="1"]){min-height:0!important;height:auto!important}
    .bb-rbb-card-canvas[data-layout="absolute"][data-stack-mobile="1"]{display:flex;flex-direction:column;min-height:0!important;height:auto!important;padding:12px;gap:8px}
    .bb-rbb-card-canvas[data-layout="absolute"][data-stack-mobile="1"] .bb-rbb-card-child{position:relative!important;left:auto!important;top:auto!important;width:100%!important;max-width:100%!important;height:auto!important;min-height:0!important;margin:0!important}
    .bb-rbb-card-canvas[data-layout="absolute"][data-stack-mobile="1"] .bb-rbb-card-child--media{height:190px!important;flex:none}
    .bb-rbb-card-canvas[data-layout="absolute"][data-stack-mobile="1"] .bb-rbb-card-child--button{height:auto!important;min-height:40px!important}
}