/*
 * ==========================================
 * DANAAT - Custom Brand Identity Styles
 * ==========================================
 * Color Palette:
 * - Dusty Rose: #ad8083
 * - Deep Burgundy: #4e1e2e
 * - Warm Nude: #a6836d
 * - Soft Cream: #e0dbc8
 * - Dark Olive Green: #2f3a2f
 * ==========================================
 */

/* ==========================================
   CSS VARIABLES - BRAND COLORS
   ========================================== */
:root {
    --danaat-dusty-rose: #ad8083 !important;
    --danaat-burgundy: #4e1e2e !important;
    --danaat-warm-nude: #a6836d !important;
    --danaat-soft-cream: #e0dbc8 !important;
    --danaat-olive-green: #2f3a2f !important;

    /* Override Salla's primary color */
    --color-primary: #ad8083 !important;
    --color-primary-dark: #4e1e2e !important;
    --color-primary-light: #c9a5a8 !important;
    --color-primary-reverse: #e0dbc8 !important;

    /* Typography */
    --font-main: 'Tajawal', 'Noto Naskh Arabic', sans-serif !important;

    /* Shadows */
    --danaat-shadow-sm: 0 2px 8px rgba(78, 30, 46, 0.08) !important;
    --danaat-shadow-md: 0 4px 16px rgba(78, 30, 46, 0.12) !important;
    --danaat-shadow-lg: 0 8px 32px rgba(78, 30, 46, 0.16) !important;

    /* Border Radius */
    --danaat-radius-sm: 8px !important;
    --danaat-radius-md: 12px !important;
    --danaat-radius-lg: 20px !important;
}

/* ==========================================
   GOOGLE FONTS IMPORT
   ========================================== */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700;800&family=Noto+Naskh+Arabic:wght@400;500;600;700&display=swap');

/* ==========================================
   GLOBAL STYLES
   ========================================== */
html,
body {
    font-family: 'Tajawal', 'Noto Naskh Arabic', sans-serif !important;
    background-color: #f8f6f3 !important;
    color: #2f3a2f !important;
    line-height: 1.8 !important;
}

body {
    background: linear-gradient(135deg, #f8f6f3 0%, #e0dbc8 100%) !important;
    min-height: 100vh !important;
}

* {
    font-family: 'Tajawal', 'Noto Naskh Arabic', sans-serif !important;
}


/* ==========================================
   TYPOGRAPHY
   ========================================== */
h1,
h2,
h3,
h4,
h5,
h6,
.s-block__title h2,
.s-slider-block__title h2 {
    font-family: 'Tajawal', sans-serif !important;
    font-weight: 700 !important;
    color: #4e1e2e !important;
    letter-spacing: -0.02em !important;
}

h1 {
    font-size: 2.5rem !important;
}

h2 {
    font-size: 2rem !important;
}

h3 {
    font-size: 1.5rem !important;
}

p,
span,
a,
li,
td,
th,
label,
input,
textarea,
select,
button {
    font-family: 'Tajawal', sans-serif !important;
}

a {
    color: #ad8083 !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

a:hover {
    color: #4e1e2e !important;
}

/* ==========================================
   HEADER & NAVIGATION
   ========================================== */
.store-header,
header {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.main-nav-container,
#mainnav {
    background: #ece8e0 !important;
    border-bottom: 2px solid #ad8083 !important;
    box-shadow: 0 4px 15px rgba(78, 30, 46, 0.08) !important;
    width: 100% !important;
    padding: 5px 0 !important;
}

/* Inner container also needs solid background */
.main-nav-container .inner,
#mainnav .inner {
    background: transparent !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
}

.top-navbar {
    background: #4e1e2e !important;
    padding: 10px 0 !important;
}

.top-navbar .container {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.top-navbar .flex-1 {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
}

.top-navbar,
.top-navbar a,
.top-navbar span,
.top-navbar button,
.top-navbar i {
    color: #e0dbc8 !important;
}

.top-navbar .header-search {
    max-width: 450px !important;
    margin: 0 15px !important;
}

.top-navbar .header-buttons {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    white-space: nowrap !important;
}

/* Search Container */
.s-search-container,
.s-search-inline {
    position: relative !important;
}

.s-search-input-wrapper {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
}

/* Search input in top navbar - RTL padding for icon */
.top-navbar .s-search-input,
.s-search-input {
    background: rgba(255, 255, 255, 0.95) !important;
    border: none !important;
    border-radius: 25px !important;
    padding: 10px 45px 10px 20px !important;
    /* Extra padding on right for icon (RTL) */
    font-size: 0.9rem !important;
    width: 100% !important;
    color: #2f3a2f !important;
}

/* RTL - icon is on the right */
[dir="rtl"] .s-search-input,
.rtl .s-search-input {
    padding: 10px 20px 10px 45px !important;
    /* Extra padding on left for icon (RTL) */
}

.top-navbar .s-search-input::placeholder,
.s-search-input::placeholder {
    color: #a6836d !important;
}

.top-navbar .s-search-input:focus,
.s-search-input:focus {
    box-shadow: 0 0 0 3px rgba(173, 128, 131, 0.3) !important;
    outline: none !important;
}

/* Search icon positioning */
.s-search-icon-wrap {
    position: absolute !important;
    right: 15px !important;
    left: auto !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: #a6836d !important;
    pointer-events: none !important;
    z-index: 2 !important;
}

/* RTL - icon on left */
[dir="rtl"] .s-search-icon-wrap,
.rtl .s-search-icon-wrap {
    right: auto !important;
    left: 15px !important;
}

.s-search-icon-wrap svg,
.s-search-icon {
    width: 18px !important;
    height: 18px !important;
    fill: #a6836d !important;
}

.top-navbar .btn--rounded-gray:hover {
    background: rgba(224, 219, 200, 0.25) !important;
    transform: translateY(-2px) !important;
}

.navbar-brand img {
    max-height: 60px !important;
    filter: drop-shadow(0 2px 4px rgba(78, 30, 46, 0.2)) !important;
}

/* Header Buttons */
.header-btn,
.header-btn__icon {
    color: #4e1e2e !important;
    font-size: 1.5rem !important;
    transition: all 0.3s ease !important;
}

.header-btn:hover,
.header-btn:hover .header-btn__icon {
    color: #ad8083 !important;
    transform: scale(1.1) !important;
}

/* Cart Summary */
.s-cart-summary-wrapper {
    background: linear-gradient(135deg, #ad8083 0%, #4e1e2e 100%) !important;
    border-radius: 12px !important;
    padding: 8px 16px !important;
    color: #e0dbc8 !important;
    box-shadow: 0 4px 12px rgba(78, 30, 46, 0.3) !important;
    transition: all 0.3s ease !important;
}

.s-cart-summary-wrapper:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(78, 30, 46, 0.4) !important;
}

.s-cart-summary-count {
    background: #e0dbc8 !important;
    color: #4e1e2e !important;
    font-weight: 700 !important;
}

.s-cart-summary-icon,
.s-cart-summary-total {
    color: #e0dbc8 !important;
}

/* Search Box */
.s-search-input {
    background: #fff !important;
    border: 2px solid #e0dbc8 !important;
    border-radius: 25px !important;
    padding: 10px 20px !important;
    font-size: 0.95rem !important;
    transition: all 0.3s ease !important;
}

.s-search-input:focus {
    border-color: #ad8083 !important;
    box-shadow: 0 0 0 4px rgba(173, 128, 131, 0.2) !important;
    outline: none !important;
}

.s-search-icon-wrap {
    color: #a6836d !important;
}

/* ==========================================
   MAIN CONTENT AREA
   ========================================== */
main,
#main-content {
    background: transparent !important;
    padding: 30px 0 !important;
}

.container {
    max-width: 1280px !important;
    margin-right: auto !important;
    margin-left: auto !important;
    padding-right: 15px !important;
    padding-left: 15px !important;
}

/* ==========================================
   BANNERS
   ========================================== */
.banner,
.banner--fixed {
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow: 0 8px 32px rgba(78, 30, 46, 0.15) !important;
    transition: all 0.4s ease !important;
}

.banner:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 12px 40px rgba(78, 30, 46, 0.2) !important;
}

.banner img {
    transition: transform 0.6s ease !important;
}

.banner:hover img {
    transform: scale(1.03) !important;
}

/* ==========================================
   SECTION TITLES
   ========================================== */
.s-block__title,
.s-slider-block__title {
    margin-bottom: 30px !important;
    padding-bottom: 15px !important;
    border-bottom: 3px solid #e0dbc8 !important;
    position: relative !important;
}

.s-block__title::after,
.s-slider-block__title::after {
    content: '' !important;
    position: absolute !important;
    bottom: -3px !important;
    right: 0 !important;
    width: 80px !important;
    height: 3px !important;
    background: linear-gradient(90deg, #ad8083, #4e1e2e) !important;
}

.s-block__title h2,
.s-slider-block__title h2,
.s-slider-block__title-right h2 {
    font-size: 1.75rem !important;
    font-weight: 700 !important;
    color: #4e1e2e !important;
    margin: 0 !important;
}

.s-block__display-all,
.s-slider-block__display-all {
    background: linear-gradient(135deg, #ad8083 0%, #a6836d 100%) !important;
    color: #fff !important;
    padding: 10px 24px !important;
    border-radius: 25px !important;
    font-weight: 600 !important;
    font-size: 0.9rem !important;
    transition: all 0.3s ease !important;
    text-decoration: none !important;
    box-shadow: 0 4px 12px rgba(173, 128, 131, 0.3) !important;
}

.s-block__display-all:hover,
.s-slider-block__display-all:hover {
    background: linear-gradient(135deg, #4e1e2e 0%, #ad8083 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(78, 30, 46, 0.4) !important;
    color: #fff !important;
}

.s-block__display-all i,
.s-slider-block__display-all i {
    margin-right: 5px !important;
}

/* ==========================================
   PRODUCT CARDS
   ========================================== */
/* ==========================================
   PRODUCT CARDS - UNIFIED SYSTEM
   ========================================== */
.s-product-card-entry,
custom-salla-product-card,
.s-product-card,
.product-entry {
    background: #fff !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 15px rgba(78, 30, 46, 0.06) !important;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
    border: 1px solid rgba(173, 128, 131, 0.1) !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    position: relative !important;
}

.s-product-card-entry:hover,
custom-salla-product-card:hover,
.s-product-card:hover,
.product-entry:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 12px 30px rgba(78, 30, 46, 0.12) !important;
    border-color: #ad8083 !important;
}

.s-product-card-image {
    position: relative !important;
    overflow: hidden !important;
    background: #fff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    aspect-ratio: 1 / 1 !important;
    /* Mapped to square for better fit */
    width: 100% !important;
}

.s-product-card-image img {
    transition: transform 0.6s ease !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    /* Changed to contain to avoid cropping info graphics */
    display: block !important;
    padding: 10px !important;
}

.s-product-card-entry:hover .s-product-card-image img {
    transform: scale(1.08) !important;
}

.s-product-card-content {
    padding: 15px !important;
    background: #fff !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    justify-content: flex-start !important;
    /* Move content closer together */
}

.s-product-card-content-title,
.s-product-card-content-title a,
.product-entry__title a {
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: #4e1e2e !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    min-height: 2.8em !important;
    text-decoration: none !important;
}

.s-product-card-price,
.product-entry__price {
    font-size: 1.2rem !important;
    font-weight: 800 !important;
    color: #ad8083 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    margin: 5px 0 !important;
}

/* Badge System */
.s-product-card-out-of-stock::before,
.s-product-card-promotion,
.promotion-title,
.creative-badge {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    left: auto !important;
    background: #4e1e2e !important;
    color: #fff !important;
    padding: 4px 12px !important;
    border-radius: 4px !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    z-index: 10 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

.s-product-card-promotion,
.promotion-title,
.creative-badge {
    background: #ad8083 !important;
    right: auto !important;
    left: 10px !important;
}

/* Wishlist Button - Final Structural Fix */
.s-product-card-wishlist-btn.s-button-wrap,
.s-product-card-wishlist.s-button-wrap,
.btn--wishlist {
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    right: auto !important;
    z-index: 50 !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    background: #fff !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1) !important;
    transition: all 0.3s ease !important;
    border: 1px solid rgba(173, 128, 131, 0.1) !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
}

/* The real secret: Make the internal button completely invisible except the icon */
.s-product-card-wishlist-btn .s-button-element,
.s-product-card-wishlist .s-button-element,
salla-button.s-product-card-wishlist-btn {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
}

/* Ensure only the heart icon is visible and centered */
.s-product-card-wishlist-btn i,
.s-product-card-wishlist-btn svg,
.sicon-heart {
    font-size: 18px !important;
    color: #ad8083 !important;
    fill: #ad8083 !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Aggressively hide duplicate wrappers or secondary buttons */
.s-product-card-wishlist-btn.s-button-wrap~.s-product-card-wishlist-btn,
.s-product-card-wishlist-btn::before,
.s-product-card-wishlist-btn::after {
    display: none !important;
    content: none !important;
}

.s-product-card-wishlist-btn.s-button-wrap:hover {
    background: #ad8083 !important;
    border-color: #ad8083 !important;
}

.s-product-card-wishlist-btn.s-button-wrap:hover i,
.s-product-card-wishlist-btn.s-button-wrap:hover svg,
.s-product-card-wishlist-btn.s-button-wrap:hover .sicon-heart {
    color: #fff !important;
    fill: #fff !important;
}

/* Button Overrides */
.s-product-card-actions .s-button-element,
.s-product-card-content-footer .s-button-element {
    margin-top: auto !important;
}

/* ==========================================
   BUTTONS - PRIMARY
   ========================================== */
.s-button-element,
.salla-button,
button.s-button-element,
.s-button-primary-outline,
salla-add-product-button button,
.s-add-product-button {
    font-family: 'Tajawal', sans-serif !important;
    font-weight: 600 !important;
    font-size: 0.95rem !important;
    padding: 12px 24px !important;
    border-radius: 12px !important;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    cursor: pointer !important;
    text-align: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
}

/* Add to Cart Button */
.s-button-primary-outline,
button.s-button-primary-outline {
    background: transparent !important;
    border: 2px solid #ad8083 !important;
    color: #ad8083 !important;
}

.s-button-primary-outline:hover,
button.s-button-primary-outline:hover {
    background: linear-gradient(135deg, #ad8083 0%, #4e1e2e 100%) !important;
    border-color: #ad8083 !important;
    color: #fff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(173, 128, 131, 0.4) !important;
}

/* Sold Out Button */
.s-button-disabled,
.s-button-light-outline[disabled],
button[disabled] {
    background: #e0dbc8 !important;
    border: 2px solid #d1cbb8 !important;
    color: #a6836d !important;
    cursor: not-allowed !important;
    opacity: 0.8 !important;
}

/* ==========================================
   SLIDER NAVIGATION
   ========================================== */
.s-slider-nav-arrow,
.s-slider-prev,
.s-slider-next {
    background: #fff !important;
    border: 2px solid #e0dbc8 !important;
    color: #4e1e2e !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 3px 12px rgba(78, 30, 46, 0.1) !important;
}

.s-slider-nav-arrow:hover,
.s-slider-prev:hover,
.s-slider-next:hover {
    background: #ad8083 !important;
    border-color: #ad8083 !important;
    color: #fff !important;
    transform: scale(1.1) !important;
}

.s-slider-nav-arrow svg,
.s-slider-nav-arrow path {
    fill: currentColor !important;
}

/* ==========================================
   FEATURES SECTION
   ========================================== */
.s-block--features {
    background: linear-gradient(135deg, #4e1e2e 0%, #2f3a2f 100%) !important;
    padding: 60px 20px !important;
    border-radius: 24px !important;
    margin: 40px auto !important;
    box-shadow: 0 12px 40px rgba(78, 30, 46, 0.3) !important;
}

.s-block--features__item {
    background: rgba(255, 255, 255, 0.08) !important;
    backdrop-filter: blur(10px) !important;
    border-radius: 16px !important;
    padding: 30px 20px !important;
    text-align: center !important;
    border: 1px solid rgba(224, 219, 200, 0.2) !important;
    transition: all 0.4s ease !important;
}

.s-block--features__item:hover {
    background: rgba(255, 255, 255, 0.15) !important;
    transform: translateY(-5px) !important;
    border-color: rgba(173, 128, 131, 0.5) !important;
}

.s-block--features__item .feature-icon {
    width: 70px !important;
    height: 70px !important;
    background: linear-gradient(135deg, #ad8083 0%, #a6836d 100%) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 20px !important;
    box-shadow: 0 6px 20px rgba(173, 128, 131, 0.4) !important;
}

.s-block--features__item .feature-icon i {
    font-size: 1.8rem !important;
    color: #fff !important;
}

.s-block--features__item h2 {
    color: #e0dbc8 !important;
    font-size: 1.2rem !important;
    font-weight: 700 !important;
    margin-bottom: 10px !important;
}

.s-block--features__item p {
    color: rgba(224, 219, 200, 0.8) !important;
    font-size: 0.9rem !important;
    margin: 0 !important;
}

/* ==========================================
   FOOTER - CLEAN DESIGN
   ========================================== */
.store-footer,
footer,
footer.store-footer {
    background: #2f3a2f !important;
    color: #e0dbc8 !important;
    padding: 50px 0 0 !important;
    margin-top: 60px !important;
    border-top: 4px solid #ad8083 !important;
}

/* Reset any problematic styles */
.store-footer *,
footer * {
    background-color: transparent !important;
}

.store-footer::before,
.store-footer::after {
    display: none !important;
}

/* Footer inner wrapper */
.store-footer__inner,
.store-footer .container,
footer .container {
    background: transparent !important;
}

/* Footer columns wrapper */
.store-footer .grid,
.store-footer [class*="grid"],
footer .grid {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 40px !important;
    justify-content: space-between !important;
}

/* Individual footer columns */
.store-footer .grid>div,
.store-footer [class*="col"],
footer .grid>div {
    flex: 1 !important;
    min-width: 200px !important;
}

/* Footer Headings */
.store-footer h3,
footer h3 {
    color: #ad8083 !important;
    font-size: 1.3rem !important;
    font-weight: 700 !important;
    margin-bottom: 20px !important;
    padding-bottom: 10px !important;
    border-bottom: 2px solid rgba(173, 128, 131, 0.3) !important;
}

/* Footer description text */
.store-footer p,
footer p {
    color: rgba(224, 219, 200, 0.85) !important;
    font-size: 0.95rem !important;
    line-height: 1.7 !important;
}

/* Footer links */
.store-footer a,
footer a {
    color: rgba(224, 219, 200, 0.8) !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
}

.store-footer a:hover,
footer a:hover {
    color: #ad8083 !important;
}

/* Footer menu list */
.s-menu-footer-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.s-menu-footer-list li {
    margin-bottom: 10px !important;
}

.s-menu-footer-list a {
    display: inline-block !important;
    padding: 5px 0 !important;
    color: rgba(224, 219, 200, 0.8) !important;
    font-size: 0.95rem !important;
}

.s-menu-footer-list a:hover {
    color: #ad8083 !important;
}

/* Social Icons */
.s-social-list,
.store-footer .s-social-list {
    display: flex !important;
    gap: 12px !important;
    margin-top: 20px !important;
    flex-wrap: wrap !important;
    align-items: center !important;
}

.s-social-link,
salla-social-link {
    display: inline-block !important;
}

.s-social-link a,
.store-footer .s-social-link a {
    width: 44px !important;
    height: 44px !important;
    background: rgba(173, 128, 131, 0.25) !important;
    border: 2px solid rgba(173, 128, 131, 0.4) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.3s ease !important;
}

.s-social-link a:hover {
    background: #ad8083 !important;
    border-color: #ad8083 !important;
    transform: translateY(-3px) !important;
}

.s-social-icon,
.s-social-link svg {
    display: block !important;
}

.s-social-icon svg,
.s-social-link svg {
    width: 20px !important;
    height: 20px !important;
}

.s-social-icon svg path,
.s-social-link svg path {
    fill: #e0dbc8 !important;
}

/* Contact items */
.s-contacts-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

.s-contacts-item,
salla-contacts .s-contacts-item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 10px 0 !important;
    color: #e0dbc8 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
}

.s-contacts-item:hover {
    color: #ad8083 !important;
    transform: none !important;
}

.s-contacts-icon {
    width: 36px !important;
    height: 36px !important;
    background: #ad8083 !important;
    border-radius: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.s-contacts-icon svg {
    width: 18px !important;
    height: 18px !important;
}

.s-contacts-icon svg path {
    fill: #fff !important;
}

/* Footer Bottom Bar */
.store-footer>div:last-child,
footer>div:last-child,
.footer-bottom {
    background: rgba(0, 0, 0, 0.3) !important;
    margin-top: 40px !important;
    padding: 20px 0 !important;
    border-top: 1px solid rgba(224, 219, 200, 0.15) !important;
}

.store-footer>div:last-child .container,
footer>div:last-child .container {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
}

/* Payment Icons */
.store-footer img,
footer img,
.store-footer [class*="payment"] img,
footer [class*="payment"] img {
    height: 28px !important;
    opacity: 1 !important;
    filter: none !important;
    background: #fff !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    transition: transform 0.3s ease !important;
}

.store-footer img:hover,
footer img:hover {
    transform: scale(1.05) !important;
}

/* Copyright */
.store-footer>div:last-child span,
footer>div:last-child span {
    color: rgba(224, 219, 200, 0.6) !important;
    font-size: 0.85rem !important;
}

.store-footer>div:last-child a,
footer>div:last-child a {
    color: #ad8083 !important;
}

/* Mobile responsive */
@media (max-width: 768px) {

    .store-footer .grid,
    footer .grid {
        flex-direction: column !important;
        text-align: center !important;
    }

    .s-social-list {
        justify-content: center !important;
    }

    .store-footer>div:last-child .container {
        flex-direction: column !important;
        text-align: center !important;
    }
}

/* ==========================================
   MODALS & OVERLAYS
   ========================================== */
.swal2-popup,
.s-modal-body {
    background: #fff !important;
    border-radius: 20px !important;
    padding: 30px !important;
}

.swal2-title {
    color: #4e1e2e !important;
    font-family: 'Tajawal', sans-serif !important;
}

.swal2-confirm {
    background: linear-gradient(135deg, #ad8083 0%, #4e1e2e 100%) !important;
    border-radius: 10px !important;
    padding: 12px 30px !important;
    font-family: 'Tajawal', sans-serif !important;
    font-weight: 600 !important;
}

/* ==========================================
   LOADING ANIMATION
   ========================================== */
.loader-init::after {
    border-color: #e0dbc8 !important;
    border-top-color: #ad8083 !important;
}

.s-loading {
    fill: #ad8083 !important;
}

/* ==========================================
   SCROLLBAR STYLING
   ========================================== */
::-webkit-scrollbar {
    width: 10px !important;
    height: 10px !important;
}

::-webkit-scrollbar-track {
    background: #e0dbc8 !important;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #ad8083 0%, #a6836d 100%) !important;
    border-radius: 10px !important;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #4e1e2e 0%, #ad8083 100%) !important;
}

/* ==========================================
   ANIMATIONS
   ========================================== */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes pulse {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }
}

@keyframes shimmer {
    0% {
        background-position: -200% 0;
    }

    100% {
        background-position: 200% 0;
    }
}

.s-product-card-entry {
    animation: fadeInUp 0.6s ease forwards !important;
}

/* ==========================================
   RESPONSIVE DESIGN
   ========================================== */
@media (max-width: 1024px) {
    .container {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .s-block__title h2,
    .s-slider-block__title h2 {
        font-size: 1.5rem !important;
    }
}

@media (max-width: 768px) {
    .top-navbar {
        padding: 6px 0 !important;
    }

    .navbar-brand img {
        max-height: 50px !important;
    }

    h1 {
        font-size: 1.8rem !important;
    }

    h2 {
        font-size: 1.5rem !important;
    }

    h3 {
        font-size: 1.2rem !important;
    }

    .s-block__title,
    .s-slider-block__title {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 15px !important;
    }

    .s-block__display-all,
    .s-slider-block__display-all {
        padding: 8px 18px !important;
        font-size: 0.85rem !important;
    }

    .s-product-card-content {
        padding: 15px !important;
    }

    .s-product-card-price {
        font-size: 1.15rem !important;
    }

    .s-button-element,
    salla-add-product-button button {
        padding: 10px 18px !important;
        font-size: 0.85rem !important;
    }

    .s-block--features {
        padding: 40px 15px !important;
        margin: 30px 15px !important;
        border-radius: 16px !important;
    }

    .s-block--features__item {
        padding: 20px 15px !important;
    }

    .s-block--features__item .feature-icon {
        width: 60px !important;
        height: 60px !important;
    }

    .store-footer {
        padding: 40px 0 20px !important;
    }
}

@media (max-width: 480px) {
    .s-cart-summary-wrapper {
        padding: 6px 12px !important;
    }

    .s-product-card-wishlist-btn,
    .s-product-card-wishlist-btn button {
        width: 36px !important;
        height: 36px !important;
    }

    .banner {
        border-radius: 12px !important;
    }

    .s-slider-nav-arrow,
    .s-slider-prev,
    .s-slider-next {
        width: 38px !important;
        height: 38px !important;
    }
}

/* ==========================================
   SPECIAL ELEMENTS
   ========================================== */
/* Price Badge */
.s-product-card-price::before {
    content: '' !important;
    display: none !important;
}

/* Selection Highlight */
::selection {
    background: rgba(173, 128, 131, 0.3) !important;
    color: #4e1e2e !important;
}

/* Focus States */
*:focus {
    outline: 2px solid #ad8083 !important;
    outline-offset: 2px !important;
}

/* Placeholder Text */
::placeholder {
    color: #a6836d !important;
    opacity: 0.7 !important;
}

/* ==========================================
   ADDITIONAL SALLA OVERRIDES
   ========================================== */
/* Products List */
.s-products-list-wrapper {
    gap: 24px !important;
}

/* Swiper/Slider */
.swiper-slide {
    padding: 8px !important;
}

/* Menu */
.s-menu-topnav-list a,
.s-menu-footer-list a {
    color: inherit !important;
    padding: 8px 0 !important;
    display: block !important;
}

/* Trust Badges */
.s-trust-badges {
    opacity: 0.9 !important;
}

/* Breadcrumb */
.s-breadcrumb {
    color: #a6836d !important;
}

.s-breadcrumb a {
    color: #ad8083 !important;
}

/* Rating Stars */
.s-rating-stars {
    color: #a6836d !important;
}

/* Infinite Scroll */
.s-infinite-scroll-status {
    padding: 30px !important;
    text-align: center !important;
}

/* Fixes for RTL */
[dir="rtl"] .s-block__title::after,
[dir="rtl"] .s-slider-block__title::after {
    right: 0 !important;
    left: auto !important;
}

/* ==========================================
   PRODUCT DETAILS PAGE
   ========================================== */

/* Product Page Container */
.product-single .container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

/* Breadcrumb on Product Page */
.product-single .breadcrumbs {
    padding: 15px 0 !important;
    margin-bottom: 10px !important;
}

.s-breadcrumb-wrapper {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
}

.s-breadcrumb-item {
    color: #a6836d !important;
    font-size: 0.9rem !important;
}

.s-breadcrumb-item a {
    color: #ad8083 !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
}

.s-breadcrumb-item a:hover {
    color: #4e1e2e !important;
}

.s-breadcrumb-arrow {
    color: #a6836d !important;
    opacity: 0.6 !important;
}

.s-breadcrumb-arrow svg {
    width: 16px !important;
    height: 16px !important;
}

/* Product Layout */
.product-single .flex {
    gap: 30px !important;
}

/* Product Image Gallery Wrapper */
.product-single .sidebar {
    background: transparent !important;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
}

/* The Slider Container */
.details-slider {
    position: relative !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    margin: 0 !important;
}

/* Remove the line under the navigation */
.details-slider .s-slider-block__title::after,
.details-slider .s-slider-block__title::before {
    display: none !important;
    content: none !important;
    border: none !important;
}

/* Force Navigation Arrows to Overlay Image */
.details-slider .s-slider-block__title {
    position: absolute !important;
    top: 50% !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    transform: translateY(-50%) !important;
    z-index: 20 !important;
    pointer-events: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    display: flex !important;
    align-items: center !important;
    height: 0 !important;
    border: none !important;
}

.details-slider .s-slider-block__title-left {
    width: 100% !important;
    pointer-events: auto !important;
}

.details-slider .s-slider-block__title-nav {
    display: flex !important;
    justify-content: space-between !important;
    width: 100% !important;
    flex-direction: row-reverse !important;
    padding: 0 15px !important;
    /* Move arrows inward */
}

/* Arrow Buttons Styling */
.details-slider .s-slider-nav-arrow {
    width: 38px !important;
    height: 38px !important;
    background: rgba(255, 255, 255, 0.9) !important;
    border-radius: 50% !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 1 !important;
    transition: all 0.3s ease !important;
    border: 1px solid rgba(0, 0, 0, 0.05) !important;
}

.details-slider .s-slider-nav-arrow:hover {
    background: #ad8083 !important;
    transform: scale(1.1) !important;
}

.details-slider .s-slider-nav-arrow:hover svg path {
    fill: #fff !important;
}

.details-slider .s-slider-nav-arrow svg {
    width: 18px !important;
    height: 18px !important;
}

.details-slider .s-slider-nav-arrow svg path {
    fill: #4e1e2e !important;
}

/* ==========================================
   INFO COLUMN BUTTONS (Share & Wishlist)
   ========================================== */
/* Extremely specific and broad selectors to catch all instances */
.product-single .s-social-share-btn,
.product-single .btn--wishlist {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    background: #fff !important;
    border: 1px solid rgba(173, 128, 131, 0.2) !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05) !important;
    margin: 5px !important;
    padding: 0 !important;
    position: relative !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
    /* Prevent squishing */
}

/* Ensure inner elements are transparent for these specific buttons */
.product-single .s-social-share-btn salla-button,
.product-single .btn--wishlist salla-button,
.product-single .s-social-share-btn .s-button-element,
.product-single .btn--wishlist .s-button-element {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    position: static !important;
}

/* Hide pseudo-elements that create ghost circles for these specific buttons */
.product-single .s-social-share-btn::before,
.product-single .s-social-share-btn::after,
.product-single .btn--wishlist::before,
.product-single .btn--wishlist::after {
    display: none !important;
    content: none !important;
}

/* Force ALL child elements (icons) to be visible and correct color */
.product-single .s-social-share-btn *,
.product-single .btn--wishlist * {
    color: #4e1e2e !important;
    fill: #4e1e2e !important;
    stroke: none !important;
    /* Some icons use stroke, some fill. Reset stroke first */
    opacity: 1 !important;
    visibility: visible !important;
    font-style: normal !important;
}

/* Handle SVG specifics */
.product-single .s-social-share-btn svg,
.product-single .btn--wishlist svg {
    width: 22px !important;
    height: 22px !important;
    display: block !important;
}

.product-single .s-social-share-btn svg path,
.product-single .btn--wishlist svg path {
    fill: #4e1e2e !important;
    stroke: none !important;
}

/* Handle Font Icons (i tags) */
.product-single .s-social-share-btn i,
.product-single .btn--wishlist i {
    font-size: 20px !important;
    line-height: 1 !important;
    width: auto !important;
    height: auto !important;
}

/* Hover Effects */
.product-single .s-social-share-btn:hover,
.product-single .btn--wishlist:hover {
    background: #ad8083 !important;
    border-color: #ad8083 !important;
    transform: translateY(-2px) !important;
}

.product-single .s-social-share-btn:hover *,
.product-single .btn--wishlist:hover * {
    color: #fff !important;
    fill: #fff !important;
}

.product-single .s-social-share-btn:hover svg path,
.product-single .btn--wishlist:hover svg path {
    fill: #fff !important;
}

/* ==========================================
   IMAGE SLIDER FIXES
   ========================================== */

/* Fix double icons on product image and hide magnifier */
.img-magnifier-glass,
div.img-magnifier-glass {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

/* Unified Slider Wishlist Fix - Perfect Centering */
.details-slider .btn--wishlist {
    position: absolute !important;
    top: 15px !important;
    right: 15px !important;
    z-index: 50 !important;
    width: 44px !important;
    height: 44px !important;
    background: #fff !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
    border: 1px solid rgba(0, 0, 0, 0.05) !important;
    overflow: hidden !important;
}

.details-slider .btn--wishlist salla-button,
.details-slider .btn--wishlist .s-button-element,
.details-slider .btn--wishlist .s-button-wrap {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: static !important;
    /* Break the absolute link */
    padding: 0 !important;
    margin: 0 !important;
}

.details-slider .btn--wishlist i,
.details-slider .btn--wishlist svg,
.details-slider .sicon-heart {
    position: static !important;
    margin: 0 !important;
    font-size: 20px !important;
    color: #ad8083 !important;
    fill: #ad8083 !important;
    display: block !important;
}

/* Aggressively hide any other circles or fragments */
.details-slider .btn--wishlist::before,
.details-slider .btn--wishlist::after,
.details-slider .btn--wishlist *:not(i):not(svg):not(path)::before,
.details-slider .btn--wishlist *:not(i):not(svg):not(path)::after {
    display: none !important;
    content: none !important;
}

/* Hide any other floating action buttons on image to prevent clutter */
.details-slider .s-button-wrap:not(.btn--wishlist) {
    display: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Disable default title text if any */
.details-slider .s-slider-block__title-right {
    display: none !important;
}

/* Ensure Slides fit nicely */
.details-slider .swiper-slide {
    border-radius: 12px !important;
}

.details-slider .swiper-slide img {
    border-radius: 12px !important;
    width: 100% !important;
    display: block !important;
}

/* Thumbnail Slider */
.s-slider-thumbs {
    margin-top: 20px !important;
    padding: 5px !important;
}

.s-slider-thumbs .swiper-slider-wrapper {
    display: flex !important;
    justify-content: center !important;
}

.s-slider-thumbs .swiper-slide {
    width: 70px !important;
    height: 70px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    border: 2px solid transparent !important;
    transition: all 0.3s ease !important;
    opacity: 0.7 !important;
    cursor: pointer !important;
    flex: 0 0 auto !important;
    /* Prevent shrinking */
    background: #fff !important;
    margin: 0 5px !important;
}

.s-slider-thumbs .swiper-slide-thumb-active {
    border-color: #ad8083 !important;
    opacity: 1 !important;
    transform: scale(1.1) !important;
    box-shadow: 0 4px 10px rgba(173, 128, 131, 0.2) !important;
}

.s-slider-thumbs .swiper-slide:hover {
    opacity: 1 !important;
}

.s-slider-thumbs .swiper-slide img {
    border-radius: 50% !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* Wishlist Button on Product Image */
.details-slider .btn--wishlist {
    position: absolute !important;
    top: 15px !important;
    right: 15px !important;
    z-index: 10 !important;
    width: 44px !important;
    height: 44px !important;
    background: rgba(255, 255, 255, 0.95) !important;
    border: none !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.details-slider .btn--wishlist:hover {
    background: #fff !important;
    transform: scale(1.1) !important;
}

.details-slider .btn--wishlist .sicon-heart {
    color: #ad8083 !important;
    font-size: 1.3rem !important;
}

/* Product Main Content */
.product-single .main-content {
    padding: 0 !important;
}

/* Product Title */
.product-single h1 {
    color: #4e1e2e !important;
    font-size: 1.8rem !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    margin-bottom: 15px !important;
}

/* Product Price */
.product-single .font-bold.text-xl,
.product-single h2.font-bold {
    color: #ad8083 !important;
    font-size: 1.6rem !important;
    font-weight: 700 !important;
}

.product-single .line-through {
    color: #999 !important;
    font-size: 1rem !important;
}

.product-single .text-red-800 {
    color: #c44d4d !important;
}

/* Product Description */
.product__description {
    background: rgba(224, 219, 200, 0.2) !important;
    border-radius: 12px !important;
    padding: 20px !important;
    margin: 20px 0 !important;
    border-right: 4px solid #ad8083 !important;
}

.product__description ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 15px !important;
}

.product__description ul li {
    position: relative !important;
    padding-right: 20px !important;
    margin-bottom: 10px !important;
    color: #2f3a2f !important;
    line-height: 1.7 !important;
}

.product__description ul li::before {
    content: '✓' !important;
    position: absolute !important;
    right: 0 !important;
    color: #ad8083 !important;
    font-weight: bold !important;
}

.product__description p {
    color: #2f3a2f !important;
    line-height: 1.8 !important;
    margin-bottom: 10px !important;
}

.product__description img {
    max-width: 100% !important;
    border-radius: 8px !important;
    margin: 15px 0 !important;
}

/* Product Tags */
.product-single a.text-gray-500 {
    color: #a6836d !important;
    background: rgba(166, 131, 109, 0.1) !important;
    padding: 4px 12px !important;
    border-radius: 20px !important;
    font-size: 0.85rem !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

.product-single a.text-gray-500:hover {
    background: #ad8083 !important;
    color: #fff !important;
}

/* Share & Wishlist Buttons */
.s-social-share-btn,
.product-single .btn--wishlist.sm\\:inline-flex {
    width: 40px !important;
    height: 40px !important;
    background: rgba(224, 219, 200, 0.5) !important;
    border: 1px solid rgba(173, 128, 131, 0.3) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.3s ease !important;
}

.s-social-share-btn:hover,
.product-single .btn--wishlist.sm\\:inline-flex:hover {
    background: #ad8083 !important;
    border-color: #ad8083 !important;
}

.s-social-share-btn:hover svg path,
.product-single .btn--wishlist.sm\\:inline-flex:hover .sicon-heart {
    fill: #fff !important;
    color: #fff !important;
}

/* Social Share List */
.s-social-share-list {
    display: flex !important;
    gap: 8px !important;
    margin-top: 10px !important;
}

.s-social-share-list li a {
    width: 36px !important;
    height: 36px !important;
    background: rgba(224, 219, 200, 0.5) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.3s ease !important;
}

.s-social-share-list li a:hover {
    background: #ad8083 !important;
}

.s-social-share-icon {
    width: 18px !important;
    height: 18px !important;
}

.s-social-share-icon svg {
    fill: #4e1e2e !important;
}

.s-social-share-list li a:hover .s-social-share-icon svg {
    fill: #fff !important;
}

/* Product Options Form */
.s-product-options-wrapper {
    margin: 20px 0 !important;
}

.s-product-options-option-container {
    margin-bottom: 20px !important;
}

.s-product-options-option-label {
    display: block !important;
    margin-bottom: 10px !important;
    color: #4e1e2e !important;
    font-weight: 600 !important;
}

.s-product-options-option-label b {
    color: #4e1e2e !important;
}

.s-product-options-option-label span {
    color: #c44d4d !important;
}

.s-product-options-option-label small {
    color: #a6836d !important;
    font-weight: 400 !important;
}

/* Select Dropdown */
.s-product-options-option select,
.s-form-control {
    width: 100% !important;
    padding: 12px 15px !important;
    border: 2px solid rgba(173, 128, 131, 0.3) !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: #2f3a2f !important;
    font-size: 1rem !important;
    transition: all 0.3s ease !important;
    cursor: pointer !important;
}

.s-product-options-option select:focus,
.s-form-control:focus {
    border-color: #ad8083 !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(173, 128, 131, 0.2) !important;
}

/* Form Sections */
.product-form section.bg-white {
    background: #fff !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 10px rgba(78, 30, 46, 0.05) !important;
    margin-bottom: 15px !important;
}

.product-form .form-label b {
    color: #4e1e2e !important;
    font-weight: 600 !important;
}

/* Note/Attachments Section */
.btn-tab.btn--collapse {
    background: rgba(224, 219, 200, 0.5) !important;
    border: 1px solid rgba(173, 128, 131, 0.3) !important;
    border-radius: 8px !important;
    padding: 10px 15px !important;
    color: #4e1e2e !important;
    font-size: 0.9rem !important;
    transition: all 0.3s ease !important;
}

.btn-tab.btn--collapse:hover {
    background: rgba(173, 128, 131, 0.2) !important;
}

.form-input,
textarea.form-input {
    width: 100% !important;
    padding: 12px 15px !important;
    border: 2px solid rgba(173, 128, 131, 0.3) !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: #2f3a2f !important;
    font-size: 1rem !important;
    resize: vertical !important;
}

.form-input:focus,
textarea.form-input:focus {
    border-color: #ad8083 !important;
    outline: none !important;
}

/* Price Section */
.price-wrapper h2,
.total-price {
    color: #ad8083 !important;
    font-size: 1.5rem !important;
    font-weight: 700 !important;
}

.before-price {
    color: #999 !important;
    text-decoration: line-through !important;
}

/* Out of Stock Message */
.out-of-stock {
    color: #c44d4d !important;
    font-weight: 600 !important;
}

/* Sticky Product Bar */
.sticky-product-bar {
    background: #fff !important;
    border-radius: 12px 12px 0 0 !important;
    box-shadow: 0 -4px 20px rgba(78, 30, 46, 0.1) !important;
}

/* Add to Cart / Notify Button */
.sticky-product-bar__btn .s-button-element,
.s-product-availability-wrap .s-button-element {
    width: 100% !important;
    padding: 16px 30px !important;
    background: linear-gradient(135deg, #ad8083 0%, #4e1e2e 100%) !important;
    border: none !important;
    border-radius: 12px !important;
    color: #fff !important;
    font-size: 1.1rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(173, 128, 131, 0.4) !important;
}

.sticky-product-bar__btn .s-button-element:hover,
.s-product-availability-wrap .s-button-element:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 25px rgba(173, 128, 131, 0.5) !important;
}

.sticky-product-bar__btn .s-button-element:disabled,
.s-product-availability-wrap .s-button-element:disabled {
    background: linear-gradient(135deg, #a6836d 0%, #8a6b5d 100%) !important;
    cursor: not-allowed !important;
    opacity: 0.8 !important;
}

/* Quantity Input */
.s-quantity-input {
    display: flex !important;
    align-items: center !important;
    border: 2px solid rgba(173, 128, 131, 0.3) !important;
    border-radius: 10px !important;
    overflow: hidden !important;
}

.s-quantity-input button {
    width: 40px !important;
    height: 40px !important;
    background: rgba(224, 219, 200, 0.5) !important;
    border: none !important;
    color: #4e1e2e !important;
    font-size: 1.2rem !important;
    cursor: pointer !important;
    transition: background 0.3s ease !important;
}

.s-quantity-input button:hover {
    background: #ad8083 !important;
    color: #fff !important;
}

.s-quantity-input input {
    width: 60px !important;
    height: 40px !important;
    border: none !important;
    text-align: center !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    color: #4e1e2e !important;
}

/* Installment Section */
salla-installment {
    margin: 20px 0 !important;
}

/* Comments/Reviews Section */
.s-comments {
    margin-top: 40px !important;
    padding: 30px !important;
    background: #fff !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 20px rgba(78, 30, 46, 0.08) !important;
}

.s-comments-header {
    border-bottom: 2px solid rgba(173, 128, 131, 0.2) !important;
    padding-bottom: 15px !important;
    margin-bottom: 20px !important;
}

/* Related Products Slider */
.s-products-slider-wrapper {
    margin-top: 50px !important;
    padding: 30px 0 !important;
}

.s-products-slider-wrapper .s-slider-block__title h2 {
    color: #4e1e2e !important;
    font-size: 1.5rem !important;
    font-weight: 700 !important;
}

.s-products-slider-card {
    padding: 10px !important;
}

/* Mobile Responsive for Product Page */
@media (max-width: 768px) {
    .product-single .sidebar {
        margin-bottom: 30px !important;
        padding: 15px !important;
    }

    .product-single h1 {
        font-size: 1.4rem !important;
    }

    .product__description {
        padding: 15px !important;
    }

    .sticky-product-bar {
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 100 !important;
        border-radius: 16px 16px 0 0 !important;
        padding: 15px 20px !important;
    }

    .sticky-product-bar__btn .s-button-element {
        padding: 14px 20px !important;
        font-size: 1rem !important;
    }
}

/* Consolidated into Unified System at the top */

/* ==========================================
   MOBILE STICKY BAR REFINEMENTS
   ========================================== */
@media (max-width: 768px) {
    .sticky-product-bar {
        border-top: 1px solid rgba(0, 0, 0, 0.05) !important;
        background: rgba(255, 255, 255, 0.98) !important;
        backdrop-filter: blur(10px) !important;
    }

    /* Adjust padding to prevent overlap with footer if needed */
    .store-footer {
        padding-bottom: 80px !important;
    }
}

/* Page Fade In Animation */
.product-single {
    animation: fadeInPage 0.6s ease-out forwards;
}

@keyframes fadeInPage {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Consolidated into Unified System at the top */

/* ==========================================
   WHATSAPP FLOATING BUTTON
   ========================================== */
.whatsapp-fixed-btn {
    position: fixed;
    bottom: 25px;
    left: 25px;
    width: 60px;
    height: 60px;
    background-color: #25d366;
    color: #fff !important;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    z-index: 99999;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    text-decoration: none !important;
}

.whatsapp-fixed-btn:hover {
    transform: scale(1.1) rotate(10deg);
    background-color: #128c7e;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
}

.whatsapp-fixed-btn svg {
    width: 32px;
    height: 32px;
    fill: currentColor;
}

/* Tooltip on hover */
.whatsapp-fixed-btn::after {
    content: "تواصل معنا";
    position: absolute;
    right: 70px;
    background: #4e1e2e;
    color: #fff;
    padding: 6px 14px;
    border-radius: 10px;
    font-size: 14px;
    font-family: 'Tajawal', sans-serif;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    pointer-events: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.whatsapp-fixed-btn:hover::after {
    opacity: 1;
    visibility: visible;
    right: 80px;
}

@media (max-width: 768px) {
    .whatsapp-fixed-btn {
        bottom: 20px;
        left: 20px;
        width: 55px;
        height: 55px;
        font-size: 28px;
    }

    .whatsapp-fixed-btn svg {
        width: 28px;
        height: 28px;
    }

    .whatsapp-fixed-btn::after {
        display: none;
        /* Hide tooltip on mobile */
    }
}