/* Make the store header transparent with shadow */
header.store-header {
    background-color: transparent !important;
    border: none !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Add shadow similar to header */
}

/* Hide Specific Elements in the Header */
.store-header .navbar-brand,   /* Hide the Navbar Brand */
.store-header [aria-label="btn-search"], .salla-add-product-button,
.btn--add-to-cart add-single-product-section flex-1 hydrated {  /* Hide the Search Button */
    display: none !important;
}

/* Keep the Cart Button and Profile Icon Visible */
.store-header .salla-cart-summary,
.store-header .profile-icon-class {  /* Replace 'profile-icon-class' with the actual class for the profile icon */
    display: block !important;
}

/* Font family for the entire document */
body {
    font-family: 'IBM Plex Sans Arabic', sans-serif;
}

/* Add custom animations */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
    40% { transform: translateY(-10px); }
    60% { transform: translateY(-5px); }
}

@keyframes pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

.fa-spin {
    animation: spin 2s linear infinite;
}

.fa-bounce {
    animation: bounce 2s infinite;
}

.fa-pulse {
    animation: pulse 2s infinite;
}

#sticky-bar {
    font-family: 'IBM Plex Sans Arabic', sans-serif;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Match header shadow */
    border-top: 1px solid rgba(0, 0, 0, 0.1);  /* Match header border style */
}

#sticky-button {
    animation: bounce 2s infinite;
}

#highlighted-text {
    background-color: yellow;
    color: #a24449;
    padding: 5px;
    border-radius: 3px;
}