/* ==========================================================================
   CSS VARIABLES & ROOT CONFIGURATION
   ========================================================================== */
:root {
    --color-primary: #b9b9ba;
    --color-primary-dark: #b9b9ba;
    --color-primary-light: #b9b9ba;
    --color-primary-reverse: #b9b9ba;
    --1: #ffffff;
    --2: #ffffff;
    --2-2: #ffffff;
    --3: #ffffff;
    --4: #ffffff;
    --4-4-4: #ffffff;
    --4-4: #ffffff;
}

/* ==========================================================================
   ANIMATIONS & KEYFRAMES
   ========================================================================== */
@keyframes textclip {
    100% {
        background-position: 200% center;
    }
}

@keyframes signal {
    0% {
        box-shadow: 0 0 0 0 var(--2);
    }
    100% {
        box-shadow: 0 0 0 6px #ffffff21;
    }
}

/* ==========================================================================
   BODY & MAIN LAYOUT
   ========================================================================== */
body, 
.store-footer {
    background: #23314b !important;
}

.app-inner {
    background-image: url('https://i.suar.me/rpvYy/l');
    background-repeat: repeat;
    background-size: contain;
}

/* ==========================================================================
   HEADER & NAVIGATION
   ========================================================================== */
.top-navbar,
.main-nav-container {
    background: #23314b;
    box-shadow: none !important;
}

.top-navbar a,
.main-nav-container a,
.store-header__link,
ul li a {
    color: #ffffff !important;
}

.sicon-menu:before {
    color: #ffffff !important;
}

/* Main Menu Specific Styling */
ul.main-menu > li:nth-child(odd) a span {
    color: black;
}

/* Header Icons */
header i {
    color: #ffffff !important;
}

/* ==========================================================================
   TITLES & HEADINGS
   ========================================================================== */
.s-block__title h2 {
    text-transform: uppercase;
    font-size: 30px;
    font-weight: 600;
    line-height: 1.5;
    display: inline-block;
    color: #ffffff;
}

.s-block__title h2,
.s-block__title h3,
.section-header h2,
.section-header h3,
h2.section-title,
h3.section-title,
.s-slider-block__title h2 {
    color: #ffffff !important;
}

#page-main-title {
    color: white;
    font-weight: bold;
    font-size: 1.25rem; /* text-xl */
    padding-right: 0.75rem; /* ltr:pr-3 */
    padding-left: 0.75rem;  /* rtl:pl-3 */
}

/* Product Page Title */
h1.text-xl.md\:text-2xl.leading-10.font-bold.mb-6.text-gray-800 {
    color: #ffffff !important;
    background-color: #23314b !important;
    display: inline-block;
    padding: 8px 14px;
    border-radius: 6px;
}

/* ==========================================================================
   BUTTONS
   ========================================================================== */
.s-button-btn {
    background-color: #ffffff;
    color: var(--3);
    font-weight: 700;
    border-radius: 20px;
    box-shadow: rgb(0 0 0/15%) 0px 2px 4px, rgb(0 0 0/0%) 0px 7px 13px -3px, rgb(255 255 255/66%) 0px -3px 0px inset;
    animation: signal 1200ms infinite;
}

.s-button-btn,
.product-card__actions button,
button.s-button-btn {
    background-color: #23314b !important;
    color: #ffffff !important;
    border: none !important;
}

/* ==========================================================================
   PRODUCT CARDS & PRICING
   ========================================================================== */
.s-product-card-entry {
    border-radius: 30px;
    overflow: hidden;
    box-shadow: 0 1px 5px 0 rgb(162 103 171 / 44%) !important;
}

/* Product Title Styling */
.s-product-card-content-title a {
    color: #ffffff !important;
    background-color: #23314b !important;
    padding: 4px 8px;
    border-radius: 4px;
    text-decoration: none;
    display: inline-block;
}

/* Product Pricing */
.s-product-card-sale-price h4 {
    color: #ffffff !important;
    background-color: #23314b !important;
    padding: 4px 8px;
    border-radius: 6px;
    display: inline-block;
}

.s-product-card-sale-price span {
    color: #ff3131 !important;
}

.total-price {
    color: #23314b;
    font-weight: bold;
    font-size: 1.25rem; /* text-xl */
    display: inline-block;
    white-space: nowrap;
}

span.line-through {
    color: #ef4444; /* text-red-500 */
    text-decoration: line-through;
}

/* ==========================================================================
   CART & SHOPPING
   ========================================================================== */
.s-cart-summary-total {
    color: #ffffff !important;
}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.footer-is-light .store-footer .store-footer__inner {
    background: #ffffff;
    border-radius: 20px;
    margin: 15px;
    border-bottom: none !important;
}

.store-footer__inner * {
    color: #fff;
}

.footer-is-light .store-footer .social-link i {
    color: #ffffff;
}

/* Footer Text & Links */
footer p,
footer a,
.site-footer p,
.site-footer a,
#footer p,
#footer a,
footer * {
    color: #23314b !important;
}