/* Wizzmall Product Mobile App UI V5.7 */
:root {
    --wiz-product-shell: 560px;
    --wiz-product-accent: var(--wiz-primary, #ff5a00);
    --wiz-product-accent-soft: #fff0e8;
    --wiz-product-bg: #f4f5f7;
    --wiz-product-card: #ffffff;
    --wiz-product-text: #1c1d21;
    --wiz-product-muted: #767981;
    --wiz-product-border: #e9eaee;
    --wiz-product-purchase-height: 76px;
    --wiz-product-safe-bottom: env(safe-area-inset-bottom, 0px);
}

html {
    min-height: 100%;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background: #e9edf2 !important;
}

body.wiz-product-body {
    min-height: 100%;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: auto !important;
    touch-action: pan-y pinch-zoom !important;
    -webkit-overflow-scrolling: touch;
    background: #e9edf2 !important;
    color: var(--wiz-product-text) !important;
}

body.wiz-product-body:not(.modal-open):not(.wiz-location-open) {
    overflow-y: auto !important;
}

body.wiz-product-body .wiz-app-header,
body.wiz-product-body .wiz-bottom-nav,
body.wiz-product-body .scrollup,
body.wiz-product-body .wiz-product-breadcrumb,
body.wiz-product-body .wiz-product-breadcrumb-row {
    display: none !important;
}

body.wiz-product-body #wrapper.wiz-product-page {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: min(100%, var(--wiz-product-shell)) !important;
    max-width: var(--wiz-product-shell) !important;
    min-height: 100dvh !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 0 0 var(--wiz-product-content-bottom, 118px) !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    background: var(--wiz-product-bg) !important;
}

body.wiz-product-body .wiz-product-screen,
body.wiz-product-body .wiz-product-gallery-section,
body.wiz-product-body .wiz-product-information-section,
body.wiz-product-body .wiz-product-content-section,
body.wiz-product-body .wiz-product-recommendations {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    clear: both !important;
}

/* Prevent Bootstrap desktop breakpoints from creating columns inside the narrow app shell. */
body.wiz-product-body .wiz-product-page .row {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}

body.wiz-product-body .wiz-product-page [class*="col-"] {
    display: block !important;
    float: none !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.wiz-product-body .wiz-product-gallery-card {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 0 24px 24px !important;
    background: var(--wiz-product-card) !important;
    box-shadow: 0 10px 30px rgba(20, 24, 32, .09) !important;
}

body.wiz-product-body .wiz-product-gallery-media,
body.wiz-product-body .product-slider-wrapper {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: #f1f2f4 !important;
}

body.wiz-product-body .slider-for-container {
    order: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    overflow: hidden !important;
    background: #f1f2f4 !important;
}

body.wiz-product-body #product-slider,
body.wiz-product-body #product-slider .swiper-wrapper {
    width: 100% !important;
    height: clamp(340px, 52svh, 440px) !important;
    min-height: 340px !important;
    max-height: 440px !important;
    margin: 0 !important;
    overflow: hidden !important;
    background: #f1f2f4 !important;
    touch-action: pan-y !important;
}

body.wiz-product-body #product-slider .swiper-slide {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
    background: #f1f2f4 !important;
    touch-action: pan-y !important;
}

body.wiz-product-body #product-slider .swiper-slide > a,
body.wiz-product-body #product-slider .swiper-slide > div {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
}

body.wiz-product-body #product-slider img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    object-fit: contain !important;
    object-position: center !important;
    opacity: 1 !important;
    visibility: visible !important;
    background: #f1f2f4 !important;
}

body.wiz-product-body .thumb-slider-wrapper {
    order: 2 !important;
    display: block !important;
    width: 100% !important;
    height: 70px !important;
    min-height: 70px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    overflow: hidden !important;
    border-top: 1px solid #eef0f2 !important;
    background: #fff !important;
}

body.wiz-product-body #product-thumb-slider,
body.wiz-product-body #product-thumb-slider .swiper-wrapper {
    width: 100% !important;
    height: 54px !important;
    min-height: 54px !important;
    overflow: visible !important;
    touch-action: pan-x pan-y !important;
}

body.wiz-product-body #product-thumb-slider .swiper-slide {
    flex: 0 0 52px !important;
    width: 52px !important;
    height: 52px !important;
    margin-inline-end: 7px !important;
    overflow: hidden !important;
    border: 1px solid #dfe1e6 !important;
    border-radius: 12px !important;
    background: #f5f6f7 !important;
    opacity: .72 !important;
}

body.wiz-product-body #product-thumb-slider .swiper-slide-thumb-active {
    border: 2px solid var(--wiz-product-accent) !important;
    opacity: 1 !important;
    box-shadow: 0 3px 12px rgba(255, 90, 0, .18) !important;
}

body.wiz-product-body #product-thumb-slider img {
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    object-fit: cover !important;
}

body.wiz-product-body .swiper-scrollbar,
body.wiz-product-body .product-slider-wrapper::-webkit-scrollbar,
body.wiz-product-body .slider-for-container::-webkit-scrollbar,
body.wiz-product-body #product-slider::-webkit-scrollbar,
body.wiz-product-body #product-thumb-slider::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

body.wiz-product-body .wiz-product-gallery-actions {
    position: absolute !important;
    z-index: 20 !important;
    top: max(12px, env(safe-area-inset-top)) !important;
    inset-inline: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    pointer-events: none !important;
}

body.wiz-product-body .wiz-product-gallery-actions > * {
    pointer-events: auto !important;
}

body.wiz-product-body .wiz-product-round-action,
body.wiz-product-body .swiper-button-next,
body.wiz-product-body .swiper-button-prev {
    display: inline-grid !important;
    place-items: center !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    padding: 0 !important;
    border: 1px solid rgba(24, 27, 34, .08) !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, .94) !important;
    color: #24262b !important;
    box-shadow: 0 7px 18px rgba(22, 24, 31, .13) !important;
    backdrop-filter: blur(12px) !important;
}

body.wiz-product-body .wiz-product-round-action svg {
    width: 21px !important;
    height: 21px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

body.wiz-product-body .swiper-button-next::after,
body.wiz-product-body .swiper-button-prev::after {
    font-size: 15px !important;
    font-weight: 900 !important;
}

body.wiz-product-body .wiz-product-gallery-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 0 13px 10px !important;
    background: #fff !important;
}

body.wiz-product-body .wiz-product-gallery-counter {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 42px !important;
    padding: 4px 9px !important;
    border-radius: 999px !important;
    background: #22242a !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    direction: ltr !important;
    unicode-bidi: isolate !important;
}

body.wiz-product-body .wiz-product-gallery-hint {
    color: #85878e !important;
    font-size: 11px !important;
    font-weight: 700 !important;
}

body.wiz-product-body .wiz-product-info-card,
body.wiz-product-body .wiz-product-description-card,
body.wiz-product-body .section-related-products {
    display: block !important;
    float: none !important;
    clear: both !important;
    width: auto !important;
    max-width: none !important;
    margin: 10px !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid var(--wiz-product-border) !important;
    border-radius: 20px !important;
    background: var(--wiz-product-card) !important;
    box-shadow: 0 7px 22px rgba(24, 27, 35, .055) !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
}

body.wiz-product-body .wiz-product-summary {
    padding: 17px 15px 8px !important;
}

body.wiz-product-body .wiz-product-title-row {
    display: flex !important;
    align-items: flex-start !important;
    gap: 8px !important;
}

body.wiz-product-body .wiz-product-title-row .product-title {
    flex: 1 1 auto !important;
    margin: 0 !important;
    color: var(--wiz-product-text) !important;
    font-size: clamp(21px, 5.2vw, 27px) !important;
    line-height: 1.35 !important;
    font-weight: 950 !important;
}

body.wiz-product-body .wiz-product-store-row {
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) auto 18px !important;
    align-items: center !important;
    gap: 9px !important;
    min-height: 60px !important;
    margin: 13px 0 10px !important;
    padding: 9px 10px !important;
    border: 1px solid #eceef1 !important;
    border-radius: 16px !important;
    background: #fafafb !important;
}

body.wiz-product-body .wiz-product-meta-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
}

body.wiz-product-body .wiz-product-meta-chip {
    min-height: 34px !important;
    padding: 7px 9px !important;
    border: 1px solid #eceef1 !important;
    border-radius: 11px !important;
    background: #fafafb !important;
    color: #45464d !important;
}

body.wiz-product-body .wiz-product-price-row {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin-top: 13px !important;
    padding-top: 13px !important;
    border-top: 1px solid #eff0f2 !important;
}

body.wiz-product-body .wiz-product-price-row .price,
body.wiz-product-body .wiz-product-price-row .price-discounted,
body.wiz-product-body .wiz-product-price-row .final-price {
    color: var(--wiz-product-accent) !important;
    font-size: clamp(26px, 6vw, 32px) !important;
    line-height: 1.1 !important;
    font-weight: 950 !important;
}

body.wiz-product-body .wiz-product-options-panel {
    margin: 8px 0 0 !important;
    padding: 15px !important;
    border-top: 1px solid #eff0f2 !important;
    background: #fff !important;
}

body.wiz-product-body .wiz-product-options-panel .product-options-container {
    min-height: 0 !important;
}

body.wiz-product-body #variant-options-container:empty::before {
    content: "جارٍ تجهيز الاختيارات…";
    display: block;
    padding: 14px;
    border-radius: 14px;
    background: #f7f7f9;
    color: #777981;
    text-align: center;
    font-size: 13px;
    font-weight: 800;
}

body.wiz-product-body.wiz-variants-ready #variant-options-container:empty::before,
body.wiz-product-body.wiz-product-no-variants #variant-options-container:empty::before {
    display: none;
}

body.wiz-product-body .product-variation-container,
body.wiz-product-body .product-variation-group,
body.wiz-product-body .form-group-product-variation {
    margin-bottom: 15px !important;
}

body.wiz-product-body .product-variation-container button,
body.wiz-product-body .product-variation-container .option-item,
body.wiz-product-body .product-variation-container .custom-control-label {
    min-height: 44px !important;
    border-radius: 12px !important;
}

body.wiz-product-body .wiz-product-service-card {
    margin: 10px 0 0 !important;
    padding: 0 !important;
    border: 1px solid #eceef1 !important;
    border-radius: 17px !important;
    background: #fff !important;
}

/* Mobile accordion instead of desktop tabs. */
body.wiz-product-body .wiz-product-description-card > .nav-tabs {
    display: none !important;
}

body.wiz-product-body .wiz-product-description-card .tab-content,
body.wiz-product-body .wiz-product-description-card .tab-pane {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
}

body.wiz-product-body .wiz-product-description-card .tab-pane > .card {
    margin: 0 !important;
    border: 0 !important;
    border-bottom: 1px solid #eceef1 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: #fff !important;
}

body.wiz-product-body .wiz-product-description-card .tab-pane:last-child > .card {
    border-bottom: 0 !important;
}

body.wiz-product-body .wiz-product-description-card .card-header {
    min-height: 56px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: #fff !important;
}

body.wiz-product-body .wiz-product-description-card .card-link {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    min-height: 56px !important;
    padding: 15px !important;
    color: #202126 !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    text-decoration: none !important;
}

body.wiz-product-body .wiz-product-description-card .tab-content-inner,
body.wiz-product-body .wiz-product-description-card #review-result,
body.wiz-product-body .wiz-product-description-card .comments-container,
body.wiz-product-body .wiz-product-description-card .form-add-comment {
    padding: 15px !important;
    color: #3e4046 !important;
    font-size: 14px !important;
    line-height: 1.85 !important;
}

body.wiz-product-body .wiz-product-description-card table,
body.wiz-product-body .wiz-product-description-card tbody,
body.wiz-product-body .wiz-product-description-card tr,
body.wiz-product-body .wiz-product-description-card td {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
}

body.wiz-product-body .wiz-product-description-card tr {
    padding: 11px 0 !important;
    border-bottom: 1px solid #eef0f2 !important;
}

body.wiz-product-body .wiz-product-description-card td {
    padding: 3px 0 !important;
    text-align: start !important;
}

body.wiz-product-body .wiz-product-description-card select,
body.wiz-product-body .wiz-product-description-card input,
body.wiz-product-body .wiz-product-description-card textarea {
    width: 100% !important;
    max-width: 100% !important;
}

body.wiz-product-body .wiz-product-purchase-bar {
    position: fixed !important;
    z-index: 1050 !important;
    left: 50% !important;
    bottom: max(8px, var(--wiz-product-safe-bottom)) !important;
    transform: translateX(-50%) !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 108px 48px !important;
    align-items: center !important;
    gap: 8px !important;
    width: min(calc(100% - 16px), calc(var(--wiz-product-shell) - 16px)) !important;
    min-height: var(--wiz-product-purchase-height) !important;
    margin: 0 !important;
    padding: 9px !important;
    overflow: hidden !important;
    border: 1px solid rgba(224, 226, 231, .96) !important;
    border-radius: 20px !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: 0 -8px 28px rgba(22, 25, 34, .14) !important;
    backdrop-filter: blur(20px) !important;
}

body.wiz-product-body .wiz-product-primary-container,
body.wiz-product-body .wiz-product-primary-action {
    width: 100% !important;
}

body.wiz-product-body .wiz-product-primary-action {
    min-height: 52px !important;
    padding: 9px 12px !important;
    border: 0 !important;
    border-radius: 15px !important;
    background: linear-gradient(135deg, var(--wiz-product-accent), #ff7334) !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 950 !important;
    box-shadow: 0 8px 20px rgba(255, 90, 0, .22) !important;
}

body.wiz-product-body .wiz-product-primary-action:disabled,
body.wiz-product-body .wiz-product-primary-action[aria-disabled="true"] {
    background: #cfd1d6 !important;
    color: #7d7f86 !important;
    box-shadow: none !important;
}

body.wiz-product-body .wiz-product-quantity .input-group {
    display: grid !important;
    grid-template-columns: 34px 40px 34px !important;
    width: 108px !important;
    height: 50px !important;
    border: 1px solid #dfe1e5 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    background: #fff !important;
}

body.wiz-product-body .wiz-product-quantity button,
body.wiz-product-body .wiz-product-quantity input {
    width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #24252a !important;
    font-size: 16px !important;
    font-weight: 900 !important;
}

body.wiz-product-body .wiz-product-wishlist-container,
body.wiz-product-body .wiz-product-wishlist-container button {
    width: 48px !important;
    height: 50px !important;
    margin: 0 !important;
}

body.wiz-product-body .wiz-product-wishlist-container button {
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    border: 1px solid #dfe1e5 !important;
    border-radius: 14px !important;
    background: #fff !important;
    color: #36373d !important;
}

body.wiz-product-body .wiz-product-wishlist-container button span {
    display: none !important;
}

body.wiz-product-body .wiz-product-recommendations > .section-related-products {
    padding: 14px !important;
}

body.wiz-product-body .section-related-products > .title {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin: 0 0 12px !important;
    font-size: 17px !important;
    font-weight: 950 !important;
}

body.wiz-product-body .section-related-products .row-product {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: minmax(156px, 46%) !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 0 4px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-x: contain !important;
    scroll-snap-type: x proximity !important;
    scrollbar-width: none !important;
    touch-action: pan-x pan-y !important;
}

body.wiz-product-body .section-related-products .row-product::-webkit-scrollbar {
    display: none !important;
}

body.wiz-product-body .section-related-products .row-product > .col-product {
    display: block !important;
    float: none !important;
    flex: none !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    scroll-snap-align: start !important;
}

body.wiz-product-body .section-related-products .product-card {
    height: 100% !important;
    border: 1px solid #eceef1 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    background: #fff !important;
    box-shadow: none !important;
}

body.wiz-product-body .wiz-product-recommendations > .ad-space,
body.wiz-product-body .wiz-product-recommendations > [class*="ad-space"],
body.wiz-product-body .wiz-product-recommendations > .mb-4:empty {
    display: none !important;
}

@media (max-width: 420px) {
    body.wiz-product-body #product-slider,
    body.wiz-product-body #product-slider .swiper-wrapper {
        height: clamp(320px, 48svh, 405px) !important;
        min-height: 320px !important;
        max-height: 405px !important;
    }

    body.wiz-product-body .wiz-product-purchase-bar {
        grid-template-columns: minmax(0, 1fr) 102px 44px !important;
        gap: 6px !important;
        width: calc(100% - 12px) !important;
        padding: 7px !important;
        border-radius: 17px !important;
    }

    body.wiz-product-body .wiz-product-quantity .input-group {
        grid-template-columns: 33px 36px 33px !important;
        width: 102px !important;
    }

    body.wiz-product-body .wiz-product-wishlist-container,
    body.wiz-product-body .wiz-product-wishlist-container button {
        width: 44px !important;
    }

    body.wiz-product-body .wiz-product-store-row {
        grid-template-columns: 42px minmax(0, 1fr) 18px !important;
    }

    body.wiz-product-body .wiz-product-store-open {
        display: none !important;
    }
}

@media (min-width: 700px) {
    body.wiz-product-body {
        padding: 18px 0 !important;
    }

    body.wiz-product-body #wrapper.wiz-product-page {
        overflow: hidden !important;
        border-radius: 28px !important;
        box-shadow: 0 24px 60px rgba(22, 26, 35, .14) !important;
    }

    body.wiz-product-body .wiz-product-gallery-card {
        border-radius: 28px 28px 24px 24px !important;
    }
}

@media (max-width: 699px) {
    body.wiz-product-body {
        background: var(--wiz-product-bg) !important;
    }

    body.wiz-product-body #wrapper.wiz-product-page {
        width: 100% !important;
        max-width: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.wiz-product-body *,
    body.wiz-product-body *::before,
    body.wiz-product-body *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}