/* ============================================================
   TURPAH (تربة) - Custom CSS for Salla Store
   Warm Dark Theme - Smart Heating Pad
   ============================================================ */

:root {
    --1: #c47a3a;
    --2: #8B4513;
    --main-bg: #1a0f0a;
    --main-bg-dark: #110a06;
    --card-bg: #261a12;
    --accent: #c47a3a;
    --accent-light: #d4924e;
    --accent-dark: #8B4513;
    --warm-glow: rgba(196,122,58,0.4);
    --border: rgba(196,122,58,0.12);
}

/* ==========================================================================
   1. GLOBAL DARK BACKGROUND
   ========================================================================== */
body, main#main-content, .main-wrapper, #app {
    background-color: var(--main-bg) !important;
}

header, footer, .site-header, .site-footer,
.global-separator, hr, .border-b, .border-t {
    border-top: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

.top-navbar,
body.index .s-block .s-block__title,
.s-infinite-scroll-status, .infinite-scroll-last, .infinite-scroll-error {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

label { color: #fff !important; }
body, .text-gray-800, .form-label, .s-slider-nav-arrow,
.tamara-product-widget, .spotii-wrapper { color: #fff !important; }
a { color: #fff !important; }

/* ==========================================================================
   2. HOMEPAGE EDGE-TO-EDGE BANNERS (ZERO GAPS)
   ========================================================================== */
body.index #main-content .s-block--fixed-banner,
body.index #main-content .wide-placeholder,
body.index #main-content .container {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

body.index .banner--fixed,
body.index .banner,
body.index .s-block--fixed-banner .overflow-hidden {
    display: block !important;
    border-radius: 0px !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    font-size: 0 !important;
}

body.index #main-content .banner--fixed picture {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
}

body.index #main-content .banner--fixed img,
body.index .wide-placeholder img,
body.index .s-block--fixed-banner picture img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    border-radius: 0px !important;
    border: none !important;
    outline: none !important;
    margin: 0 !important;
    padding: 0 !important;
    image-rendering: auto !important;
    transform: translateZ(0);
    backface-visibility: hidden;
}

body.index #main-content .s-block,
body.index #main-content .s-block::before,
body.index #main-content .s-block::after,
body.index #main-content .container::before,
body.index #main-content .container::after {
    border: none !important;
    box-shadow: none !important;
    content: none !important;
}

img.w-full.object-contain.rounded-md { border-radius: 0; }

/* Force ALL banners full width - no side margins */
body.index .s-block--fixed-banner .container,
body.index section.s-block .container {
    max-width: 100vw !important;
    width: 100vw !important;
    padding: 0 !important;
    margin: 0 !important;
}

body.index .s-block--fixed-banner img,
body.index .banner--fixed img {
    width: 100vw !important;
    max-width: 100vw !important;
    object-fit: cover !important;
}

/* ==========================================================================
   3. REMOVE ALL INTER-BLOCK SPACES
   ========================================================================== */
body.index #main-content .s-block,
body.index .s-block-sections, body.index .s-block-wrapper,
body.index [id^="block_"] {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    outline: none !important;
}

body.index .section-title::after, body.index .section-title::before,
body.index .s-block-separator, body.index .separator-line,
body.index div[class*="separator"], body.index div[class*="divider"] {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

body.index #main-content .grid, body.index #main-content .flex,
body.index .s-products-list-wrapper { row-gap: 0 !important; }

body.index .s-block + .s-block { margin-top: 0 !important; }

/* Hide products list + viewed section on home */
body.index .s-products-list-wrapper { display: none !important; }
#viewed-section { display: none !important; }

/* ==========================================================================
   4. HEADER / NAVBAR
   ========================================================================== */
div#s-theme_edit_bar,
salla-maintenance-alert.s-maintenance-alert-wrapper.hydrated {
    display: none !important;
}

/* Logo - hide orange background, show only text with glow */
.navbar-brand img {
    max-height: 7rem !important;
    height: auto !important;
    display: block !important;
    background: transparent !important;
    mix-blend-mode: lighten !important;
    filter: brightness(1.5) drop-shadow(0 0 8px rgba(196,122,58,0.5)) drop-shadow(0 0 18px rgba(196,122,58,0.35)) drop-shadow(0 0 35px rgba(196,122,58,0.15)) !important;
}

.navbar-brand {
    display: flex !important;
    align-items: center;
    justify-content: center !important;
    height: auto;
    margin: 0 auto !important;
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    right: auto !important;
}

@media only screen and (max-width: 700px) {
    .navbar-brand img { max-height: 5rem !important; }
    .navbar-brand { margin-left: 30px !important; }
}

i.header-btn__icon.sicon-user-circle,
i.header-btn__icon.icon.sicon-shopping-bag { color: #ffffff; transition: all .5s; }

.main-nav-container .inner,
.main-nav-container.fixed-pinned .inner,
#mainnav, #mainnav .inner,
#mainnav .bg-inherit, .bg-white.flex.items-center {
    background: var(--main-bg) !important;
    background-color: var(--main-bg) !important;
}

.main-nav-container.shadow-default { box-shadow: none; }
.main-nav-container.fixed-pinned .inner {
    position: fixed; width: 100%; backdrop-filter: blur(40px);
}

salla-cart-summary { margin-right: .5rem !important; }
.s-cart-summary-content { display: none; }
.s-cart-summary-count { top: -0.425rem; }
.s-cart-summary-total { color: #fff !important; }

i.sicon-menu.text-primary.text-2xl { color: #ffffff; padding: 6px; border-radius: 22px; }
nav#mobile-menu { display: block !important; }
.index div#mainnav, .index.inner.bg-inherit { background: 0 0 !important; }

@media(min-width: 1024px) {
    .navbar-brand img { max-height: 5rem !important; }
    .index .main-menu li.root-level>a {
        position: relative; z-index: 1; color: #fff !important;
        padding-bottom: 20px; padding-top: 7px; font-size: 15px; transition: all .5s;
    }
    .main-menu li.root-level>a:hover { color: #fff !important; }
    .main-menu li.root-level>a:after {
        background: var(--accent) !important; content: ""; inset: 0; position: absolute;
        transform: scaleX(0); transform-origin: right; transition: transform .5s ease-in-out;
        z-index: -1; border-radius: 5px;
    }
    .main-menu li.root-level>a:hover:after { transform: scaleX(1); transform-origin: left; }
    .navbar-brand { position: relative !important; right: 105px; left: auto !important; transform: none !important; }
    section.s-block.s-block--fixed-banner.wide-placeholder:first-of-type { margin-top: -9.5rem !important; }
}

@media(max-width: 768px) {
    .index div#mainnav, .index.inner.bg-inherit { background: transparent !important; }
}

/* ==========================================================================
   5. WHATSAPP BUTTON
   ========================================================================== */
.sicon-whatsapp2::after,
a[href*="whatsapp"].s-contacts-item::after {
    content: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.84 32'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23fff; stroke-width: 0px; %7D %3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M27.2,4.65C24.21,1.65,20.22,0,15.98,0,7.24,0,.13,7.11.13,15.86c0,2.79.73,5.53,2.12,7.93l-2.25,8.22,8.41-2.21c2.32,1.26,4.93,1.93,7.58,1.93h0c8.74,0,15.86-7.11,15.86-15.86,0-4.24-1.65-8.22-4.64-11.22h0ZM15.99,29.05h0c-2.37,0-4.69-.64-6.71-1.84l-.48-.29-4.99,1.31,1.33-4.86-.31-.5c-1.33-2.09-2.02-4.52-2.02-7.01,0-7.27,5.91-13.18,13.19-13.18,3.52,0,6.83,1.38,9.32,3.86,2.49,2.49,3.86,5.8,3.86,9.32,0,7.27-5.92,13.19-13.18,13.19ZM23.21,19.17c-.39-.2-2.34-1.16-2.71-1.29s-.62-.2-.89.2c-.26.39-1.02,1.29-1.26,1.56-.23.26-.46.3-.86.1s-1.68-.62-3.19-1.97c-1.18-1.05-1.98-2.35-2.21-2.74s-.02-.61.18-.81c.18-.18.39-.46.59-.69s.26-.39.39-.66c.13-.26.07-.49-.03-.69s-.89-2.15-1.22-2.94c-.32-.77-.65-.67-.89-.68-.23-.01-.49-.01-.76-.01s-.69.1-1.06.49c-.36.39-1.39,1.36-1.39,3.31s1.42,3.83,1.62,4.1c.2.26,2.79,4.27,6.77,5.98.94.41,1.68.65,2.26.84.95.3,1.81.26,2.49.16.76-.11,2.34-.96,2.67-1.88s.33-1.72.23-1.88c-.09-.17-.36-.27-.76-.48h0Z'/%3E%3C/svg%3E");
    text-align: center; cursor: pointer; background: #46a51e; z-index: 999;
    display: block; font-size: 0px; color: #fff;
    box-shadow: #0000006b 2px 2px 8px; width: 56px; height: 56px;
    border-radius: 32.5px; position: fixed; bottom: 19px; right: 17px;
    transition: all .2s ease-in-out;
}
body:not(.index) .sicon-whatsapp2::after,
body:not(.index) a[href*="whatsapp"].s-contacts-item::after { bottom: 131px; }
.sicon-whatsapp2:hover::after,
a[href*="whatsapp"].s-contacts-item:hover::after {
    content: "     في خدمتك ؟ "; font-family: var(--font-main) !important;
    width: 260px !important; animation: trns 1s; font-size: 20px !important; color: #fff;
    display: flex; justify-content: center; align-items: center;
}
@keyframes trns { 0% { color: #ffffff00; } 100% { color: #ffffff99; } }

/* ==========================================================================
   6. PRODUCT PAGE - DARK
   ========================================================================== */
article#more-content { max-height: unset !important; }
a#btn-show-more { display: none; }

body.product-single .bg-white,
body.product-single .lg\:bg-white,
body.product-single .bg-gray-100 {
    background-color: var(--main-bg) !important;
}

.s-quantity-input-input { color: #fff !important; }
.s-quantity-input-container {
    border: 1px solid rgba(196,122,58,0.2) !important;
    border-radius: 10px !important;
}

.product__description, .product__description .article--main,
.product__description p, .product__description span,
.product__description li, .product__description article { color: #ffffff !important; }
h1.text-xl.md\:text-2xl { color: #ffffff !important; }

/* Product page price glow */
body.product-single h4:has(.sicon-sar),
body.product-single .gap-4 h4,
body.product-single .items-center h4 {
    color: var(--accent) !important;
    font-size: 1.6rem !important;
    font-weight: 800 !important;
    text-shadow: 0 0 10px var(--warm-glow), 0 0 20px rgba(196,122,58,0.3) !important;
}

/* Hide share + wishlist on product page */
body.product-single .s-social-share-wrapper,
body.product-single .flex.rtl\:space-x-reverse.space-x-3 { display: none !important; }

/* Hide suggestions */
salla-products-slider[source="related"],
salla-products-slider[block-title="منتجات قد تعجبك"] { display: none !important; }
body.product-single section:has(.s-slider-block__title h2) { display: none !important; }

/* Breadcrumb */
.s-breadcrumb-wrapper, .s-breadcrumb-item,
.s-breadcrumb-item a, .s-breadcrumb-item span { color: #ffffff !important; opacity: 1 !important; }
.s-breadcrumb-arrow svg, .s-breadcrumb-arrow svg path { fill: #ffffff !important; }

/* ==========================================================================
   7. BUTTONS
   ========================================================================== */
.s-button-element, .s-button-btn,
salla-add-product-button .s-button-element { border-radius: 12px !important; }
.s-button-primary { border-width: 1px; border-color: var(--accent); background-color: var(--accent-dark); }

/* Product card add to cart - only on homepage */
body.index .s-product-card-content-footer,
body.index .s-product-card-content-footer salla-add-product-button {
    display: block !important; visibility: visible !important; opacity: 1 !important;
}

/* ==========================================================================
   8. TAMARA & TABBY - WARM DARK
   ========================================================================== */
div[class*="snippetContentWrapper"] {
    background: linear-gradient(135deg, #261a12 0%, var(--main-bg) 100%) !important;
}
.tamara-summary-widget--inline-outlined {
    background: linear-gradient(135deg, #261a12 0%, var(--main-bg) 100%) !important;
}

/* ==========================================================================
   9. REVIEWS - DARK
   ========================================================================== */
.s-comments.s-comments-product, .s-comments-container,
salla-comment-form, salla-reviews-summary, .s-comments-header {
    background: var(--main-bg) !important; color: #fff !important;
}
.s-comments.s-comments-product *, .s-comments-container *,
salla-reviews-summary *, .s-comments-header * {
    color: #fff !important; background-color: transparent !important;
}
salla-reviews-summary {
    background: linear-gradient(135deg, #261a12 0%, var(--main-bg) 100%) !important;
    border-radius: 12px !important; padding: 20px !important;
    border: 1px solid var(--border) !important;
}
salla-comment-form input, salla-comment-form textarea {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid rgba(196,122,58,0.15) !important;
    color: #fff !important; border-radius: 10px !important;
}

/* ==========================================================================
   TESTIMONIALS / REVIEWS SECTION - DARK
   ========================================================================== */
/* Section container */
.s-block--testimonials,
.s-block--custom-testimonials {
    background: var(--main-bg) !important;
}

/* Section header */
.s-reviews-header {
    color: #fff !important;
}

/* Review cards - border only on inner */
.s-reviews-swiper-slide,
.s-reviews-testimonial {
    background: transparent !important;
    border: none !important;
}

.s-reviews-testimonial__inner {
    background: var(--card-bg) !important;
    background-color: var(--card-bg) !important;
    border: 1px solid var(--border) !important;
    border-radius: 16px !important;
}

.s-reviews-container {
    background: var(--main-bg) !important;
}

/* Review text centered */
.s-reviews-testimonial__text {
    text-align: center !important;
}

.s-reviews-testimonial__text p {
    text-align: center !important;
}

.s-reviews-testimonial__name_wrapper {
    justify-content: center !important;
    text-align: center !important;
}

.s-reviews-testimonial__info {
    text-align: center !important;
}

.s-reviews-testimonial__rating {
    justify-content: center !important;
}

/* Review text */
.s-reviews-testimonial__text p,
.s-reviews-testimonial__text .text-gray-700 {
    color: rgba(255,255,255,0.85) !important;
}

/* Review author name */
.s-reviews-testimonial__info h2,
.s-reviews-testimonial__info .text-gray-900 {
    color: #fff !important;
}

/* Quote icon */
.s-reviews-testimonial__icon {
    color: var(--accent) !important;
    opacity: 0.2 !important;
}

.s-reviews-testimonial__icon svg {
    fill: var(--accent) !important;
}

/* Avatar background */
.s-reviews-testimonial__avatar img {
    background: rgba(196,122,58,0.15) !important;
    border-radius: 50% !important;
}

/* Slider arrows */
.s-block--testimonials .s-slider-nav-arrow,
.s-block--custom-testimonials .s-slider-nav-arrow {
    color: #fff !important;
    background: rgba(196,122,58,0.15) !important;
    border: 1px solid var(--border) !important;
}

.s-block--testimonials .s-slider-nav-arrow svg,
.s-block--custom-testimonials .s-slider-nav-arrow svg {
    fill: #fff !important;
}

/* Dots/pagination */
.swiper-pagination-bullet {
    background: rgba(196,122,58,0.3) !important;
}
.swiper-pagination-bullet-active {
    background: var(--accent) !important;
}

/* Section title */
.s-block__title h2,
body.index .s-block__title {
    color: #fff !important;
}

/* ==========================================================================
   10. FOOTER - WARM DARK GRADIENT
   ========================================================================== */
footer.store-footer, .store-footer, .store-footer__inner {
    background: linear-gradient(180deg, #231410 0%, #1a0e0a 30%, #0f0a08 70%, #050302 100%) !important;
    border: none !important; box-shadow: none !important;
    color: #ffffff !important; position: relative; overflow: hidden;
}

footer.store-footer::before {
    content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
    background: linear-gradient(90deg, transparent 5%, var(--accent-dark) 30%, var(--accent) 50%, var(--accent-dark) 70%, transparent 95%);
    opacity: 0.7;
}

footer.store-footer::after {
    content: 'تربة'; position: absolute; bottom: -20px; right: -10px;
    font-size: 12rem; font-weight: 900; color: rgba(196,122,58,0.04);
    pointer-events: none; z-index: 0; line-height: 1;
}

.store-footer .container.grid {
    background: transparent !important; color: #ffffff !important;
    padding: 60px 50px 40px !important; max-width: 1200px !important;
    width: 100% !important; margin: 0 auto !important; border: none !important;
    position: relative; z-index: 1;
}

footer.store-footer a.flex.items-center img {
    max-height: 110px !important; height: auto !important; display: block !important;
    filter: brightness(1.1) drop-shadow(0 0 8px var(--warm-glow)) drop-shadow(0 0 25px rgba(196,122,58,0.3)) !important;
}

.store-footer .container.grid h3, .store-footer .s-contacts-title {
    font-size: 1.1rem !important; font-weight: 700 !important;
    margin-bottom: 18px !important; color: #ffffff !important; text-align: center !important;
}

.store-footer h3, .store-footer .s-contacts-title,
.store-footer a, .store-footer p, .store-footer span,
.s-menu-footer-item, .s-contacts-item span { color: rgba(255,255,255,0.7) !important; }

.s-menu-footer-item {
    display: block !important; padding: 6px 0 !important;
    color: rgba(255,255,255,0.55) !important; font-size: 0.9rem !important;
    transition: all 0.3s ease !important; text-align: center !important;
}
.s-menu-footer-item:hover { color: #ffffff !important; }

/* Contact buttons */
.s-contacts-list, .s-contacts-list-vertical {
    display: flex !important; flex-direction: column !important; align-items: center !important;
}
a.s-contacts-item {
    width: 100% !important; display: flex !important; flex-direction: row-reverse !important;
    align-items: center !important; justify-content: flex-start !important;
    gap: 12px !important; margin-top: 10px !important; color: rgba(255,255,255,0.9) !important;
    transition: all 0.3s ease !important;
    background: linear-gradient(135deg, var(--accent-dark) 0%, #5c2e0a 100%) !important;
    padding: 12px 20px !important; border-radius: 50px !important;
    border: 1px solid rgba(196,122,58,0.2) !important;
}
a.s-contacts-item:hover {
    background: linear-gradient(135deg, #a05020 0%, #6a3510 100%) !important;
    box-shadow: 0 4px 15px rgba(196,122,58,0.3) !important;
}
a.s-contacts-item .s-contacts-icon svg { fill: #fff !important; width: 20px !important; height: 20px !important; }

/* Social icons */
div#contact-slot { width: auto !important; }
.s-social-link {
    display: inline-flex !important; visibility: visible !important; opacity: 1 !important;
    width: 38px !important; height: 38px !important; align-items: center !important;
    justify-content: center !important; background: rgba(255,255,255,0.06) !important;
    border-radius: 8px !important; transition: all 0.3s ease !important;
}
.s-social-link:hover { background: rgba(196,122,58,0.3) !important; transform: translateY(-2px) !important; }
.s-social-list { display: flex !important; gap: 10px !important; flex-wrap: wrap !important; justify-content: center !important; }
.s-social-link svg { fill: rgba(255,255,255,0.7) !important; width: 18px !important; height: 18px !important; }
.s-social-link:hover svg { fill: #ffffff !important; }

.copyright-text, .copyright-text p { color: rgba(255,255,255,0.35) !important; text-align: center !important; }
.md\:flex.items-center.justify-between.py-4.container {
    background: rgba(0,0,0,0.3) !important; max-width: 100% !important;
    border: none !important; border-top: 1px solid rgba(196,122,58,0.05) !important;
}
.s-payments-list { display: flex !important; justify-content: center !important; gap: 8px !important; }
.s-payments-list-item img { background-color: rgba(255,255,255,0.9) !important; padding: 3px !important; border-radius: 4px !important; }

#main-content { margin-bottom: 0 !important; padding-bottom: 0 !important; }
.store-footer { margin-top: 0 !important; }

/* Hide trust badges */
salla-trust-badges.s-trust-badges-wrapper, .store-footer salla-trust-badges {
    display: none !important; height: 0 !important; margin: 0 !important; padding: 0 !important;
}

@media (max-width: 1024px) {
    .store-footer .container.grid {
        grid-template-columns: 1fr !important; padding: 40px 20px !important;
        gap: 30px !important; text-align: center !important;
    }
    .s-social-list { justify-content: center !important; }
    footer.store-footer::after { font-size: 6rem; }
}

/* ==========================================================================
   11. MODALS & UI DARK
   ========================================================================== */
.s-modal-close, .s-notifications-item-icon, .s-notifications-item,
.s-rating-stars-label, .s-rating-modal-comment, .s-modal-body,
.s-button-light, .lg\:bg-white, .s-orders-table-head {
    background-color: rgb(255 255 255 / 19%);
}
.s-user-settings-section-title, .s-modal-title,
span.s-orders-status-container, .text-gray-600, span, .text-gray-500 {
    color: rgb(255 255 255) !important;
}
.s-modal-body { background-color: var(--accent-dark) !important; }
.s-add-product-toast { background-color: var(--main-bg-dark); }
.s-user-menu-login-btn svg { fill: #ffffff; }
div#tabbyPromo { background: var(--main-bg-dark) !important; }

/* User menu dropdown */
.s-user-menu-dropdown, .s-user-menu-wrapper { background: var(--main-bg) !important; color: #fff !important; border: none !important; }
.s-user-menu-dropdown-header { background: rgba(196,122,58,0.15) !important; border-bottom: 1px solid var(--border) !important; }
.s-user-menu-dropdown-header span, .s-user-menu-dropdown-header p { color: #fff !important; }
.s-user-menu-dropdown-header img { background: transparent !important; border: 2px solid rgba(196,122,58,0.3) !important; border-radius: 50% !important; }
.s-user-menu-dropdown-list { background: var(--main-bg) !important; }
.s-user-menu-dropdown-item-link { color: rgba(255,255,255,0.8) !important; }
.s-user-menu-dropdown-item:hover { background: rgba(196,122,58,0.2) !important; }
.s-user-menu-dropdown-item-title { color: rgba(255,255,255,0.8) !important; }

/* User avatar */
img.s-user-menu-trigger-avatar, img[src*="avatar"],
.s-user-menu-avatar-wrap, .s-user-menu-trigger {
    background: var(--main-bg) !important; border-radius: 50% !important;
}

/* Mobile menu */
.mm-ocd__content { background: var(--main-bg) !important; }
.mm-ocd__content *, .mm-spn a, .mm-spn li, #mobile-menu a, #mobile-menu span {
    color: #fff !important; visibility: visible !important; opacity: 1 !important;
}
.mm-spn, .mm-spn ul, #mobile-menu, #mobile-menu ul { background: var(--main-bg) !important; }
#mobile-menu a {
    border-bottom: 1px solid rgba(196,122,58,0.08) !important;
    padding: 12px 15px !important; display: block !important;
}
#mobile-menu li.lg\:hidden { display: list-item !important; }

/* ==========================================================================
   12. CART PAGE - DARK
   ========================================================================== */
body.cart .bg-white, body.cart .bg-gray-100, body.cart .bg-gray-50,
body.cart main .container > div {
    background: var(--main-bg) !important; color: #fff !important;
    border: 1px solid var(--border) !important; border-radius: 12px !important; box-shadow: none !important;
}
body.cart h1, body.cart h2, body.cart p, body.cart span, body.cart a { color: #fff !important; }
body.cart .s-quantity-input-input { color: #fff !important; background: transparent !important; }
body.cart .s-quantity-input-btn { background: transparent !important; color: #fff !important; }
body.cart .s-quantity-input-container {
    border: 1px solid rgba(196,122,58,0.2) !important; border-radius: 10px !important;
}

/* Cart summary card */
.s-cart-summary-card { background-color: rgb(38, 26, 18) !important; }
salla-cart-summary-card.s-cart-summary-card--mobile.hydrated { background: #3a2218 !important; }
.s-cart-summary-card-bar { background: transparent !important; }
.s-cart-summary-card-bar-total { color: #fff !important; }
.s-cart-summary-card-sheet-wrap { background: #3a2218 !important; }
.s-cart-summary-card-line b { color: #fff !important; }

/* Thank you page */
.thankyou-block {
    background: linear-gradient(135deg, #261a12 0%, var(--main-bg) 100%) !important;
    border: 1px solid var(--border) !important; border-radius: 12px !important;
    padding: 20px !important; color: #fff !important;
}
.thankyou-block * { color: #fff !important; }
.thankyou-block .bg-gray-100 { background: rgba(196,122,58,0.2) !important; }
.thankyou-block input {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid rgba(196,122,58,0.15) !important; color: #fff !important;
}

/* ==========================================================================
   13. iPHONE SAFE AREA
   ========================================================================== */
#home-sticky-bar {
    padding-bottom: calc(12px + env(safe-area-inset-bottom)) !important;
}

/* Hide home sticky bar on desktop */
@media (min-width: 769px) {
    #home-sticky-bar { display: none !important; }
}

/* Home sticky bar buttons same size */
#home-sticky-bar .s-button-element,
#home-sticky-bar .s-button-btn,
#home-sticky-bar .s-button-primary,
#home-sticky-bar button,
#home-sticky-bar salla-button button {
    height: 46px !important; max-height: 46px !important; min-height: 46px !important;
    border-radius: 10px !important; font-size: 0.9rem !important; font-weight: 600 !important;
    box-sizing: border-box !important; padding: 0 20px !important; line-height: 46px !important;
}
#home-sticky-bar .s-button-primary,
#home-sticky-bar salla-button button {
    background: linear-gradient(135deg, var(--accent-dark) 0%, #5c2e0a 100%) !important;
    border: 1px solid rgba(196,122,58,0.2) !important;
}
#home-buy-now { border: 1px solid rgba(196,122,58,0.2) !important; }
#home-sticky-bar > div > div,
#home-sticky-bar > div > button { flex: 1 1 50% !important; width: 50% !important; }

/* Sticky product bar dark */
.sticky-product-bar {
    background: rgba(26,15,10,0.85) !important;
    backdrop-filter: blur(20px) !important;
    border-top: 1px solid var(--border) !important;
}
.sticky-product-bar .s-quantity-input-container {
    background: rgba(255,255,255,0.08) !important;
    border: 1px solid rgba(196,122,58,0.15) !important; border-radius: 10px !important;
}
.sticky-product-bar .s-quantity-input-input { color: #fff !important; background: transparent !important; }
.sticky-product-bar .s-quantity-input-btn { color: #fff !important; background: transparent !important; }

/* ==========================================================================
   14. INTERNAL PAGES - DARK
   ========================================================================== */
.bg-white, .lg\:bg-white, .bg-gray-100, .bg-gray-50 {
    background-color: var(--main-bg) !important;
    background: var(--main-bg) !important;
    color: #fff !important;
}

.rounded-md, .shadow, .shadow-sm {
    border: 1px solid var(--border) !important;
    box-shadow: none !important;
}

.text-gray-700, .text-gray-800, .text-gray-900,
.text-gray-600, .text-gray-500, .prose, .prose p,
.prose h1, .prose h2, .prose h3, .prose li,
article, article p, article h1, article h2, article h3 {
    color: #fff !important;
}

/* ==========================================================================
   15. SCROLLBAR
   ========================================================================== */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background-color: var(--main-bg-dark); }
::-webkit-scrollbar-thumb { background-color: var(--accent-dark); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background-color: #a05020; }

/* Continuous background */
#main-content, main#main-content { background-color: var(--main-bg) !important; }
.s-block-separator { background-color: var(--main-bg) !important; border: none !important; height: 0 !important; margin: 0 !important; }

/* Hardware rendering */
html, body, * {
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    text-rendering: optimizeLegibility !important;
}

/* ==========================================================================
   16. LISTING PAGE + CART HOTFIX V2
   مخصص لصفحات عرض المنتجات والسلة فقط
   لا يغيّر صفحة المنتج المفردة
   ========================================================================== */

/* --------------------------------------------------------------------------
   A) PRODUCT LISTING / CATEGORY CARDS
   -------------------------------------------------------------------------- */

/* الكرت نفسه */
html body:not(.product-single) .s-products-list-wrapper custom-salla-product-card.s-product-card-entry,
html body:not(.product-single) salla-products-list custom-salla-product-card.s-product-card-entry,
html body:not(.product-single) custom-salla-product-card.s-product-card-entry.s-product-card-vertical {
    background: #fffaf7 !important;
    border: 1px solid rgba(196,122,58,0.20) !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    box-shadow: 0 8px 24px rgba(17,10,6,0.10) !important;
    color: #2a1a12 !important;
    transition: transform .25s ease, box-shadow .25s ease !important;
}

html body:not(.product-single) .s-products-list-wrapper custom-salla-product-card.s-product-card-entry:hover,
html body:not(.product-single) salla-products-list custom-salla-product-card.s-product-card-entry:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 13px 30px rgba(17,10,6,0.16) !important;
}

/* الصورة */
html body:not(.product-single) custom-salla-product-card .s-product-card-image {
    background: #f6eee8 !important;
    overflow: hidden !important;
}

html body:not(.product-single) custom-salla-product-card img.s-product-card-image-cover {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    width: 100% !important;
    object-fit: cover !important;
    transition: transform .35s ease !important;
}

html body:not(.product-single) custom-salla-product-card:hover img.s-product-card-image-cover {
    transform: scale(1.015) !important;
}

/* منطقة بيانات المنتج */
html body:not(.product-single) custom-salla-product-card .s-product-card-content {
    background: #fffaf7 !important;
    color: #2a1a12 !important;
    padding: 14px 14px 16px !important;
    min-height: 154px !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
}

/* إجبار النصوص داخل الكرت على لون واضح بدل الأبيض العام */
html body:not(.product-single) custom-salla-product-card .s-product-card-content h1,
html body:not(.product-single) custom-salla-product-card .s-product-card-content h2,
html body:not(.product-single) custom-salla-product-card .s-product-card-content h3,
html body:not(.product-single) custom-salla-product-card .s-product-card-content h4,
html body:not(.product-single) custom-salla-product-card .s-product-card-content p,
html body:not(.product-single) custom-salla-product-card .s-product-card-content a:not(.s-button-element):not(.s-button-btn),
html body:not(.product-single) custom-salla-product-card .s-product-card-content span:not(.s-button-text),
html body:not(.product-single) custom-salla-product-card .s-product-card-content div:not(.s-button-element):not(.s-button-btn) {
    color: #2a1a12 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* اسم المنتج */
html body:not(.product-single) custom-salla-product-card .s-product-card-content-title,
html body:not(.product-single) custom-salla-product-card .s-product-card-content-title a,
html body:not(.product-single) custom-salla-product-card a[class*="content-title"] {
    color: #2a1a12 !important;
    font-weight: 800 !important;
    line-height: 1.55 !important;
    text-decoration: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}

html body:not(.product-single) custom-salla-product-card .s-product-card-content-title a:hover {
    color: #8B4513 !important;
}

/* السعر الحالي */
html body:not(.product-single) custom-salla-product-card .s-product-card-sale-price,
html body:not(.product-single) custom-salla-product-card [class*="sale-price"],
html body:not(.product-single) custom-salla-product-card [class*="special-price"] {
    color: #8B4513 !important;
    font-weight: 900 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* السعر السابق */
html body:not(.product-single) custom-salla-product-card .s-product-card-regular-price,
html body:not(.product-single) custom-salla-product-card [class*="regular-price"],
html body:not(.product-single) custom-salla-product-card [class*="old-price"] {
    color: #8c817b !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* شارة العرض */
html body:not(.product-single) custom-salla-product-card .s-product-card-promotion-title,
html body:not(.product-single) custom-salla-product-card .s-product-card-promotion-title *,
html body:not(.product-single) custom-salla-product-card [class*="promotion"] {
    opacity: 1 !important;
    visibility: visible !important;
}

/* أسفل الكرت */
html body:not(.product-single) custom-salla-product-card .s-product-card-content-footer {
    width: 100% !important;
    margin-top: auto !important;
    padding-top: 12px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* زر الإضافة للسلة: ظاهر دائمًا وليس فقط عند Hover */
html body:not(.product-single) custom-salla-product-card salla-add-product-button,
html body:not(.product-single) custom-salla-product-card .s-product-card-content-footer salla-add-product-button {
    display: block !important;
    width: 100% !important;
    opacity: 1 !important;
    visibility: visible !important;
}

html body:not(.product-single) custom-salla-product-card salla-add-product-button .s-button-element,
html body:not(.product-single) custom-salla-product-card salla-add-product-button .s-button-btn,
html body:not(.product-single) custom-salla-product-card salla-add-product-button button,
html body:not(.product-single) custom-salla-product-card .s-product-card-content-footer button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 44px !important;
    padding: 0 14px !important;
    border-radius: 11px !important;
    background: linear-gradient(135deg,#c47a3a 0%,#8B4513 100%) !important;
    border: 1px solid rgba(139,69,19,0.28) !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    opacity: 1 !important;
    visibility: visible !important;
    box-shadow: 0 5px 14px rgba(139,69,19,0.17) !important;
}

/* النص والأيقونة داخل الزر */
html body:not(.product-single) custom-salla-product-card salla-add-product-button .s-button-element *,
html body:not(.product-single) custom-salla-product-card salla-add-product-button .s-button-btn *,
html body:not(.product-single) custom-salla-product-card salla-add-product-button button *,
html body:not(.product-single) custom-salla-product-card .s-product-card-content-footer button * {
    color: #ffffff !important;
    fill: currentColor !important;
    opacity: 1 !important;
    visibility: visible !important;
}

html body:not(.product-single) custom-salla-product-card salla-add-product-button .s-button-element:hover,
html body:not(.product-single) custom-salla-product-card salla-add-product-button button:hover {
    background: linear-gradient(135deg,#d58a49 0%,#9b4e1b 100%) !important;
}

/* المسافات بين الكروت */
html body:not(.product-single) .s-products-list-wrapper .grid,
html body:not(.product-single) salla-products-list .grid {
    gap: 18px !important;
}

/* --------------------------------------------------------------------------
   B) CART — KEEP TEXT VISIBLE
   -------------------------------------------------------------------------- */

html body.cart salla-cart-item,
html body.cart .s-cart-item,
html body.cart .s-cart-summary-card,
html body.cart .s-cart-summary-card-sheet,
html body.cart .s-cart-summary-card-sheet-wrap {
    background: #261a12 !important;
    color: #ffffff !important;
    border: 1px solid rgba(196,122,58,0.12) !important;
}

html body.cart salla-cart-item h1,
html body.cart salla-cart-item h2,
html body.cart salla-cart-item h3,
html body.cart salla-cart-item h4,
html body.cart salla-cart-item p,
html body.cart salla-cart-item a,
html body.cart salla-cart-item span,
html body.cart .s-cart-item h1,
html body.cart .s-cart-item h2,
html body.cart .s-cart-item h3,
html body.cart .s-cart-item h4,
html body.cart .s-cart-item p,
html body.cart .s-cart-item a,
html body.cart .s-cart-item span,
html body.cart .s-cart-summary-card *,
html body.cart .s-cart-summary-card-line * {
    color: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* زر إتمام الطلب */
html body.cart #cart-submit button,
html body.cart .s-cart-summary-card button,
html body.cart .s-cart-summary-card .s-button-element,
html body.cart .s-button-primary {
    background: linear-gradient(135deg,#c47a3a 0%,#8B4513 100%) !important;
    color: #ffffff !important;
    border-color: rgba(196,122,58,0.28) !important;
    opacity: 1 !important;
    visibility: visible !important;
}

html body.cart #cart-submit button *,
html body.cart .s-cart-summary-card button *,
html body.cart .s-cart-summary-card .s-button-element *,
html body.cart .s-button-primary * {
    color: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* --------------------------------------------------------------------------
   C) MOBILE
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
    html body:not(.product-single) custom-salla-product-card.s-product-card-entry {
        border-radius: 13px !important;
    }

    html body:not(.product-single) custom-salla-product-card .s-product-card-content {
        padding: 11px 11px 13px !important;
        min-height: 145px !important;
    }

    html body:not(.product-single) custom-salla-product-card .s-product-card-content-title,
    html body:not(.product-single) custom-salla-product-card .s-product-card-content-title a {
        font-size: .88rem !important;
        line-height: 1.5 !important;
    }

    html body:not(.product-single) custom-salla-product-card salla-add-product-button .s-button-element,
    html body:not(.product-single) custom-salla-product-card salla-add-product-button button {
        min-height: 40px !important;
        font-size: .82rem !important;
    }

    html body:not(.product-single) .s-products-list-wrapper .grid,
    html body:not(.product-single) salla-products-list .grid {
        gap: 12px !important;
    }
}

/* ==========================================================================
   17. TURPAH FLOATING WHATSAPP BUTTON
   زر واتساب صغير ثابت في يمين الشاشة
   مرتبط بالزر الذي يتم إنشاؤه من JavaScript
   ========================================================================== */
#turpah-whatsapp-float {
    position: fixed !important;
    right: 16px !important;
    bottom: 24px !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    max-width: 44px !important;
    max-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #25D366 !important;
    color: #ffffff !important;
    box-shadow: 0 5px 18px rgba(0,0,0,0.28) !important;
    text-decoration: none !important;
    line-height: 1 !important;
    overflow: hidden !important;
    z-index: 99999 !important;
    cursor: pointer !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateZ(0) !important;
    transition: transform .2s ease, box-shadow .2s ease !important;
    -webkit-tap-highlight-color: transparent !important;
}

#turpah-whatsapp-float:hover,
#turpah-whatsapp-float:focus {
    width: 44px !important;
    height: 44px !important;
    background: #20bd5a !important;
    color: #ffffff !important;
    transform: scale(1.06) translateZ(0) !important;
    box-shadow: 0 7px 22px rgba(0,0,0,0.34) !important;
    outline: none !important;
}

#turpah-whatsapp-float::before,
#turpah-whatsapp-float::after {
    content: none !important;
    display: none !important;
}

#turpah-whatsapp-float svg {
    display: block !important;
    width: 25px !important;
    height: 25px !important;
    flex: 0 0 25px !important;
    fill: #ffffff !important;
    color: #ffffff !important;
    pointer-events: none !important;
}

#turpah-whatsapp-float svg path {
    fill: #ffffff !important;
}

/* على الجوال نرفعه فوق أشرطة الشراء السفلية حتى لا يتداخل معها */
@media (max-width: 768px) {
    #turpah-whatsapp-float {
        right: 12px !important;
        bottom: calc(92px + env(safe-area-inset-bottom)) !important;
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        min-height: 42px !important;
        max-width: 42px !important;
        max-height: 42px !important;
    }

    #turpah-whatsapp-float:hover,
    #turpah-whatsapp-float:focus {
        width: 42px !important;
        height: 42px !important;
    }

    #turpah-whatsapp-float svg {
        width: 24px !important;
        height: 24px !important;
        flex-basis: 24px !important;
    }
}

/* ==========================================================================
   18. TURPAH PRODUCT — 100 DAY EXPERIENCE BENEFITS
   يظهر فقط عندما ينشئ JavaScript القسم داخل المنتجين المحددين
   متجاوب مع الجوال والتابلت والكمبيوتر ومتوافق مع ثيم تربة الداكن
   ========================================================================== */
#turpah-product-trial {
    width: 100% !important;
    max-width: 100% !important;
    margin: 16px 0 18px !important;
    padding: 0 !important;
    direction: rtl !important;
    box-sizing: border-box !important;
    color: #ffffff !important;
}

#turpah-product-trial,
#turpah-product-trial * {
    box-sizing: border-box !important;
}

#turpah-product-trial .trp-trial-shell {
    position: relative !important;
    overflow: hidden !important;
    width: 100% !important;
    padding: 20px !important;
    border-radius: 22px !important;
    border: 1px solid rgba(196,122,58,0.20) !important;
    background:
        radial-gradient(circle at 8% 10%, rgba(196,122,58,0.13), transparent 30%),
        radial-gradient(circle at 92% 90%, rgba(139,69,19,0.10), transparent 32%),
        linear-gradient(145deg, #261a12 0%, #1a0f0a 58%, #110a06 100%) !important;
    box-shadow: 0 16px 40px rgba(0,0,0,0.24) !important;
}

#turpah-product-trial .trp-trial-shell::before {
    content: "100" !important;
    position: absolute !important;
    left: -18px !important;
    top: -42px !important;
    font-size: 150px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    color: rgba(196,122,58,0.045) !important;
    pointer-events: none !important;
    z-index: 0 !important;
}

#turpah-product-trial .trp-trial-head {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 22px !important;
    padding-bottom: 22px !important;
    margin-bottom: 18px !important;
    border-bottom: 1px solid rgba(196,122,58,0.12) !important;
}

#turpah-product-trial .trp-trial-copy {
    min-width: 0 !important;
    flex: 1 1 auto !important;
}

#turpah-product-trial .trp-trial-kicker {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 6px 12px !important;
    margin: 0 0 10px !important;
    border-radius: 999px !important;
    background: rgba(196,122,58,0.12) !important;
    border: 1px solid rgba(196,122,58,0.18) !important;
    color: #e2a66c !important;
    font-size: 0.72rem !important;
    font-weight: 800 !important;
    line-height: 1.4 !important;
}

#turpah-product-trial .trp-trial-kicker::before {
    content: "" !important;
    width: 7px !important;
    height: 7px !important;
    border-radius: 50% !important;
    background: #c47a3a !important;
    box-shadow: 0 0 0 4px rgba(196,122,58,0.10) !important;
}

#turpah-product-trial .trp-trial-title {
    margin: 0 !important;
    padding: 0 !important;
    color: #ffffff !important;
    font-size: clamp(1.35rem, 2.6vw, 2rem) !important;
    line-height: 1.45 !important;
    font-weight: 900 !important;
    text-align: right !important;
}

#turpah-product-trial .trp-trial-title span {
    color: #d4924e !important;
}

#turpah-product-trial .trp-trial-subtitle {
    margin: 7px 0 0 !important;
    padding: 0 !important;
    color: rgba(255,255,255,0.62) !important;
    font-size: 0.9rem !important;
    line-height: 1.85 !important;
    text-align: right !important;
}

#turpah-product-trial .trp-trial-badge {
    flex: 0 0 104px !important;
    width: 104px !important;
    height: 104px !important;
    border-radius: 50% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(145deg, #c47a3a 0%, #8B4513 100%) !important;
    border: 4px solid rgba(255,255,255,0.06) !important;
    box-shadow: 0 12px 30px rgba(0,0,0,0.28), 0 0 28px rgba(196,122,58,0.12) !important;
}

#turpah-product-trial .trp-trial-badge strong {
    color: #ffffff !important;
    font-size: 2.15rem !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

#turpah-product-trial .trp-trial-badge span {
    color: rgba(255,255,255,0.90) !important;
    margin-top: 5px !important;
    font-size: 0.72rem !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
}

#turpah-product-trial .trp-trial-grid {
    position: relative !important;
    z-index: 1 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
}

#turpah-product-trial .trp-trial-card {
    min-width: 0 !important;
    min-height: 124px !important;
    padding: 15px 14px !important;
    border-radius: 16px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    background: rgba(255,255,255,0.035) !important;
    border: 1px solid rgba(196,122,58,0.10) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.02) !important;
    transition: transform .22s ease, border-color .22s ease, background .22s ease !important;
}

#turpah-product-trial .trp-trial-card:hover {
    transform: translateY(-3px) !important;
    border-color: rgba(196,122,58,0.26) !important;
    background: rgba(196,122,58,0.06) !important;
}

#turpah-product-trial .trp-trial-icon {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    border-radius: 12px !important;
    margin: 0 0 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #d4924e !important;
    background: rgba(196,122,58,0.11) !important;
    border: 1px solid rgba(196,122,58,0.10) !important;
}

#turpah-product-trial .trp-trial-icon 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;
}

#turpah-product-trial .trp-trial-card strong {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    color: #ffffff !important;
    font-size: 0.91rem !important;
    line-height: 1.65 !important;
    font-weight: 900 !important;
    text-align: right !important;
}

#turpah-product-trial .trp-trial-card span {
    display: block !important;
    width: 100% !important;
    margin-top: 3px !important;
    color: rgba(255,255,255,0.48) !important;
    font-size: 0.73rem !important;
    line-height: 1.6 !important;
    text-align: right !important;
}

#turpah-product-trial .trp-trial-foot {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin-top: 14px !important;
    padding-top: 14px !important;
    border-top: 1px solid rgba(196,122,58,0.10) !important;
    color: rgba(255,255,255,0.58) !important;
    font-size: 0.77rem !important;
    font-weight: 700 !important;
    text-align: center !important;
}

#turpah-product-trial .trp-trial-foot svg {
    width: 17px !important;
    height: 17px !important;
    flex: 0 0 17px !important;
    fill: none !important;
    stroke: #d4924e !important;
    stroke-width: 1.8 !important;
}

/* تابلت */
@media (max-width: 900px) {
    #turpah-product-trial .trp-trial-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    #turpah-product-trial .trp-trial-card {
        min-height: 128px !important;
    }
}

/* جوال */
@media (max-width: 600px) {
    #turpah-product-trial {
        margin: 14px 0 12px !important;
    }

    #turpah-product-trial .trp-trial-shell {
        padding: 16px 13px !important;
        border-radius: 18px !important;
    }

    #turpah-product-trial .trp-trial-shell::before {
        font-size: 105px !important;
        top: -28px !important;
        left: -12px !important;
    }

    #turpah-product-trial .trp-trial-head {
        gap: 13px !important;
        padding-bottom: 16px !important;
        margin-bottom: 14px !important;
    }

    #turpah-product-trial .trp-trial-badge {
        flex-basis: 78px !important;
        width: 78px !important;
        height: 78px !important;
        border-width: 3px !important;
    }

    #turpah-product-trial .trp-trial-badge strong {
        font-size: 1.6rem !important;
    }

    #turpah-product-trial .trp-trial-badge span {
        font-size: 0.62rem !important;
    }

    #turpah-product-trial .trp-trial-title {
        font-size: 1.22rem !important;
        line-height: 1.5 !important;
    }

    #turpah-product-trial .trp-trial-subtitle {
        font-size: 0.78rem !important;
        line-height: 1.7 !important;
    }

    #turpah-product-trial .trp-trial-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 9px !important;
    }

    #turpah-product-trial .trp-trial-card {
        min-height: 118px !important;
        padding: 14px 12px !important;
        border-radius: 14px !important;
    }

    #turpah-product-trial .trp-trial-icon {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        margin-bottom: 9px !important;
    }

    #turpah-product-trial .trp-trial-icon svg {
        width: 19px !important;
        height: 19px !important;
    }

    #turpah-product-trial .trp-trial-card strong {
        font-size: 0.78rem !important;
        line-height: 1.55 !important;
    }

    #turpah-product-trial .trp-trial-card span {
        font-size: 0.65rem !important;
        line-height: 1.45 !important;
    }

    #turpah-product-trial .trp-trial-foot {
        font-size: 0.69rem !important;
        line-height: 1.6 !important;
    }
}

/* جوالات ضيقة جدًا */
@media (max-width: 380px) {
    #turpah-product-trial .trp-trial-head {
        align-items: flex-start !important;
    }

    #turpah-product-trial .trp-trial-badge {
        flex-basis: 68px !important;
        width: 68px !important;
        height: 68px !important;
    }

    #turpah-product-trial .trp-trial-grid {
        grid-template-columns: 1fr !important;
    }

    #turpah-product-trial .trp-trial-card {
        min-height: 0 !important;
        display: grid !important;
        grid-template-columns: 36px minmax(0, 1fr) !important;
        column-gap: 10px !important;
        align-items: center !important;
    }

    #turpah-product-trial .trp-trial-icon {
        grid-row: 1 / span 2 !important;
        margin: 0 !important;
    }
}