/* /Components/Layout/MainLayout.razor.rz.scp.css */
#blazor-error-ui[b-an7xftcwe2] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-an7xftcwe2] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Shared/BannerCarousel.razor.rz.scp.css */
.banner-carousel:not([data-ready]) [data-controls][b-zuo60ysngq] {
    display: none;
}

.banner-carousel [data-dot][data-active="true"][b-zuo60ysngq] {
    width: 1.5rem;
    background-color: #fff;
}

.banner-carousel[data-paused="true"] [data-icon="pause"][b-zuo60ysngq],
.banner-carousel:not([data-paused="true"]) [data-icon="play"][b-zuo60ysngq] {
    display: none;
}
/* /Components/Shared/BannerSlide.razor.rz.scp.css */
/*
 * وضعیت نمایش اسلایدها با attributeهای data-active / data-leaving تعیین می‌شود که JS (Vitrina.carousel در
 * site.js) تنظیم می‌کند؛ بدون JS (قبل از اتصال Circuit، یا JS غیرفعال) رندر اولیه‌ی Blazor فقط اسلاید اول را
 * data-active می‌کند و همان کامل و قابل‌کلیک دیده می‌شود.
 */
.banner-slide[b-dazhhwpc6k] {
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    z-index: 0;
    transition: opacity var(--bn-dur, 700ms) ease, visibility 0s linear var(--bn-dur, 700ms);
}

.banner-slide[data-active="true"][b-dazhhwpc6k] {
    opacity: 1;
    visibility: visible;
    z-index: 10;
    transition-delay: 0s;
}

/* حالت Slide: اسلایدها با translateX جابه‌جا می‌شوند. --bn-sign (۱ یا ۱-) جهت ورود اسلاید جدید است و
   JS آن را با در نظر گرفتن RTL تنظیم می‌کند. */
.banner-carousel[data-transition="slide"] .banner-slide[b-dazhhwpc6k] {
    opacity: 1;
    transform: translateX(calc(var(--bn-sign, 1) * 100%));
    transition: transform var(--bn-dur, 500ms) ease, visibility 0s linear var(--bn-dur, 500ms);
}

.banner-carousel[data-transition="slide"] .banner-slide[data-active="true"][b-dazhhwpc6k] {
    transform: none;
    transition-delay: 0s;
}

.banner-carousel[data-transition="slide"] .banner-slide[data-leaving="true"][b-dazhhwpc6k] {
    visibility: visible;
    z-index: 5;
    transform: translateX(calc(var(--bn-sign, 1) * -100%));
    transition-delay: 0s;
}

@media (prefers-reduced-motion: reduce) {
    .banner-slide[b-dazhhwpc6k],
    .banner-carousel[data-transition="slide"] .banner-slide[b-dazhhwpc6k] {
        transition: none;
    }
}
/* /Components/Shared/BrandLogoSlider.razor.rz.scp.css */
.brand-marquee[b-umqdjs4zhl] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.brand-marquee-viewport[b-umqdjs4zhl] {
    overflow: hidden;
    padding: 0.5rem 0;
    -webkit-mask-image: linear-gradient(to right, transparent, black 6%, black 94%, transparent);
    mask-image: linear-gradient(to right, transparent, black 6%, black 94%, transparent);
}

.brand-marquee-track[b-umqdjs4zhl] {
    display: flex;
    width: max-content;
    animation: brand-marquee-scroll-b-umqdjs4zhl var(--brand-duration, 40s) linear infinite;
}

.brand-marquee-track.is-reverse[b-umqdjs4zhl] {
    animation-direction: reverse;
}

.brand-marquee-viewport:hover .brand-marquee-track[b-umqdjs4zhl],
.brand-marquee-viewport:focus-within .brand-marquee-track[b-umqdjs4zhl] {
    animation-play-state: paused;
}

.brand-marquee-half[b-umqdjs4zhl] {
    display: flex;
    flex: 0 0 auto;
    gap: 0.75rem;
    padding-inline-end: 0.75rem;
}

/* کاشی لوگو: زمینه‌ی سفید ثابت (لوگوها معمولاً برای زمینه‌ی روشن‌اند؛ در تم تیره هم خوانا می‌ماند) */
.brand-tile[b-umqdjs4zhl] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 9.5rem;
    height: 5rem;
    padding: 0.875rem 1.25rem;
    border-radius: 1rem;
    border: 1px solid rgb(0 0 0 / 0.08);
    background: #fff;
    transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
}

.brand-tile img[b-umqdjs4zhl] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    filter: grayscale(1);
    opacity: 0.65;
    transition: filter 0.2s, opacity 0.2s;
}

.brand-tile:hover[b-umqdjs4zhl],
.brand-tile:focus-visible[b-umqdjs4zhl] {
    transform: translateY(-3px);
    border-color: rgb(0 0 0 / 0.18);
    box-shadow: 0 10px 24px rgb(0 0 0 / 0.1);
}

.brand-tile:hover img[b-umqdjs4zhl],
.brand-tile:focus-visible img[b-umqdjs4zhl] {
    filter: grayscale(0);
    opacity: 1;
}

.brand-tile:focus-visible[b-umqdjs4zhl] {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

@media (max-width: 640px) {
    .brand-tile[b-umqdjs4zhl] {
        width: 7.5rem;
        height: 4rem;
        padding: 0.625rem 1rem;
    }
}

@keyframes brand-marquee-scroll-b-umqdjs4zhl {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}

/* دکمه‌ی توقف/ادامه (WCAG 2.2.2: حرکت خودکار بیش از ۵ ثانیه باید قابل توقف باشد) */
.brand-marquee.is-paused .brand-marquee-track[b-umqdjs4zhl] {
    animation-play-state: paused;
}

/* با «کاهش حرکت» سیستم‌عامل هم ردیف حرکت می‌کند (طبق خواسته‌ی فروشگاه‌ساز)، ولی کندتر و با دکمه‌ی توقف.
   کتابخانه‌ی UI در این حالت برای همه‌ی عناصر animation-duration:.01ms!important می‌گذارد؛ پس اینجا هم !important لازم است. */
@media (prefers-reduced-motion: reduce) {
    .brand-marquee .brand-marquee-track[b-umqdjs4zhl] {
        animation-duration: calc(var(--brand-duration, 40s) * 1.6) !important;
        animation-iteration-count: infinite !important;
    }
}
/* /Components/Shared/RecommendedProductsSlider.razor.rz.scp.css */
.recommended-slider-viewport[b-ldc4ey5u3t] {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 0.25rem;
    scroll-behavior: smooth;
    padding: 0.25rem;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
}

.recommended-slider-viewport[b-ldc4ey5u3t]::-webkit-scrollbar {
    display: none;
}

.recommended-slider-viewport:focus-visible[b-ldc4ey5u3t] {
    outline: 2px solid var(--ring);
    outline-offset: 2px;
    border-radius: 1rem;
}

.recommended-slider-item[b-ldc4ey5u3t] {
    flex: 0 0 auto;
    width: 11rem;
    scroll-snap-align: start;
}

@media (min-width: 640px) {
    .recommended-slider-item[b-ldc4ey5u3t] {
        width: 13rem;
    }
}

.recommended-slider-btn[b-ldc4ey5u3t] {
    position: absolute;
    top: 40%;
    z-index: 10;
    display: none;
    height: 2.5rem;
    width: 2.5rem;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--foreground);
    box-shadow: 0 4px 14px rgb(0 0 0 / 0.12);
    transition: background-color 0.15s, color 0.15s, transform 0.15s;
}

.recommended-slider-btn:hover[b-ldc4ey5u3t] {
    background: var(--primary);
    color: var(--primary-foreground);
}

.recommended-slider-btn:active[b-ldc4ey5u3t] {
    transform: scale(0.94);
}

@media (min-width: 768px) {
    .recommended-slider-btn[b-ldc4ey5u3t] {
        display: inline-flex;
    }
}