/* =========================================================
   LUMEKH™ — SHOOPY CUSTOM CSS
   ========================================================= */


/* =========================================================
   HEADER
   ========================================================= */

.sh-header-main {
    background-color: #FFFFFF !important;
    color: #000000 !important;
    box-shadow: none !important;
    border-bottom: 1px solid #000000 !important;
}

.sh-header-location-icon {
    fill: #000000 !important;
}

.sh-header-account-icon {
    stroke: #000000 !important;
}

.sh-header-cart-icon {
    stroke: #000000 !important;
    fill: none !important;
}

.sh-header-arrow-icon {
    fill: #000000 !important;
}

.sh-header-search-icon {
    stroke: #1A2B44 !important;
}

.sh-header-cart-badge {
    background-color: #29A56C !important;
    color: #FFFFFF !important;
}

.sh-header-mob-menu-icon {
    color: #000000 !important;
}


/* =========================================================
   ALL BUTTONS
   ========================================================= */

button,
.sh-solid-button,
.sh-outlined-button,
.sh-product-buy-now-button,
.sh-product-card-enquiry,
.sh-product-enquiry {

    border-radius: 999px !important;
    border: 3px solid #000000 !important;
    background-color: #FFFFFF !important;
    color: #000000 !important;

    box-shadow:
        0 4px 8px rgba(0, 0, 0, 0.20) !important;

    transition:
        all 0.2s ease !important;

    cursor: pointer;
}


/* =========================================================
   BUTTON HOVER
   ========================================================= */

button:hover,
.sh-solid-button:hover,
.sh-outlined-button:hover,
.sh-product-buy-now-button:hover,
.sh-product-card-enquiry:hover,
.sh-product-enquiry:hover {

    background-color: #000000 !important;
    color: #FFFFFF !important;
    border-color: #000000 !important;

    box-shadow:
        0 5px 12px rgba(0, 0, 0, 0.30) !important;

    transform: translateY(-1px);
}


/* =========================================================
   SOLID BUTTON
   ========================================================= */

.sh-solid-button {
    background-color: #FFFFFF !important;
    color: #000000 !important;
    border: 3px solid #000000 !important;
    border-radius: 999px !important;
    padding: 10px 24px !important;
}


/* =========================================================
   OUTLINED BUTTON
   ========================================================= */

.sh-outlined-button {
    background-color: #FFFFFF !important;
    color: #000000 !important;
    border: 3px solid #000000 !important;
    border-radius: 999px !important;
    padding: 10px 24px !important;
}


/* =========================================================
   BUY NOW
   ========================================================= */

.sh-product-buy-now-button {
    background-color: #FFFFFF !important;
    color: #000000 !important;
    border: 3px solid #000000 !important;
    border-radius: 999px !important;
    padding: 11px 25px !important;
    white-space: nowrap;
}


/* =========================================================
   ENQUIRY BUTTONS
   ========================================================= */

.sh-product-card-enquiry,
.sh-product-enquiry {
    background-color: #FFFFFF !important;
    color: #000000 !important;
    border: 3px solid #000000 !important;
    border-radius: 999px !important;
    padding: 9px 20px !important;
}


/* =========================================================
   PRODUCT CARDS
   ========================================================= */

.sh-product-card {
    background-color: #FFFFFF !important;
    border: 1px solid #E5E5E5 !important;
    border-radius: 8px !important;

    transition:
        box-shadow 0.2s ease,
        transform 0.2s ease;
}

.sh-product-card:hover {
    box-shadow:
        0 4px 12px rgba(0, 0, 0, 0.15) !important;
}


/* =========================================================
   PRODUCT PRICE
   ========================================================= */

.sh-product-card-price {
    color: #29A56C !important;
}


/* =========================================================
   PRODUCT MRP
   ========================================================= */

.sh-product-card-mrp {
    color: #666666 !important;
}


/* =========================================================
   PRODUCT NAME
   ========================================================= */

.sh-product-card-name {
    color: #1A1A1A !important;
}


/* =========================================================
   DISCOUNT BADGE
   ========================================================= */

.sh-product-card-discount-tag {
    background-color: #29A56C !important;
    color: #FFFFFF !important;
    font-weight: 500 !important;

    border-radius: 8px 0 8px 0 !important;

    right: auto !important;
    top: 0 !important;
    left: 0 !important;
}

.sh-product-discount-tag {
    background-color: #29A56C !important;
    color: #FFFFFF !important;
    font-weight: 500 !important;
    border-radius: 4px !important;
}


/* =========================================================
   PLUS / MINUS
   ========================================================= */

.sh-product-plus-minus-button {
    background-color: #FFFFFF !important;
    color: #000000 !important;

    border: 2px solid #000000 !important;
    border-radius: 999px !important;

    box-shadow:
        0 2px 5px rgba(0, 0, 0, 0.15) !important;

    fill: #000000 !important;
}


/* =========================================================
   CATEGORY CARDS
   ========================================================= */

.sh-category-card {
    margin: 0 10px 10px !important;
    padding-top: 8px !important;
    border-radius: 8px !important;
}

.sh-categories-container {
    background-color: #FFFFFF !important;
}


/* =========================================================
   CATEGORY TITLE DIVIDER
   ========================================================= */

.sh-row-title-divider {
    display: none !important;
}


/* =========================================================
   WISHLIST
   ========================================================= */

.sh-product-wishlist-desktop {
    border-color: #FF0000 !important;
}

.sh-product-wishlisted-icon {
    fill: #FF0000 !important;
}

.sh-product-not-wishlisted-icon {
    stroke: #FF0000 !important;
}


/* =========================================================
   SHARE
   ========================================================= */

.sh-product-share-icon {
    stroke: #29A56C !important;
}

.sh-product-social-button {
    background-color: #29A56C !important;
    fill: #29A56C !important;
}


/* =========================================================
   MOBILE BOTTOM NAVIGATION
   ========================================================= */

.sh-bottom-nav-main {
    background-color: #FFFFFF !important;
    border-top: 1px solid #000000 !important;
}

.sh-bottom-nav-selected {
    stroke: #000000 !important;
    color: #000000 !important;
    fill: none !important;
}

.sh-bottom-nav-unselected {
    stroke: #888888 !important;
    color: #888888 !important;
}

.sh-bottom-nav-cart-badge {
    background-color: #000000 !important;
    color: #FFFFFF !important;
}


/* =========================================================
   FOOTER
   ========================================================= */

.sh-footer-main {
    background-color: #FFFFFF !important;
    color: #000000 !important;

    border-top: none !important;
    box-shadow: none !important;
}

.sh-footer-icon {
    color: #29A56C !important;
}


/* =========================================================
   FOOTER SOCIAL ICON HOVER
   ========================================================= */

.sh-footer-main a {
    transition:
        transform 0.2s ease,
        opacity 0.2s ease !important;
}

.sh-footer-main a:hover {
    transform: translateY(-2px);
    opacity: 0.75;
}


/* =========================================================
   INPUTS
   ========================================================= */

input,
textarea,
select {
    border-radius: 8px !important;
}


/* =========================================================
   LINKS
   ========================================================= */

a {
    transition: color 0.2s ease;
}


/* =========================================================
   LUMEKH COLOUR VARIABLES
   ========================================================= */

:root {
    --lumekh-green: #29A56C;
    --lumekh-dark-green: #0E4B35;
    --lumekh-black: #000000;
    --lumekh-white: #FFFFFF;
}


/* =========================================================
   END
   ========================================================= */