/* ========================================
   BETTERSUPPORT PREMIUM SECURITY THEME
   Primary: #032A4A
   Secondary: #0A3D66
   Accent: #FF8A00
   White: #FFFFFF
   Light BG: #F8FAFC
   Border: #E2E8F0
======================================== */


/* ---------------- HEADER ---------------- */
.sh-header-main {
    background: linear-gradient(90deg, #032A4A 0%, #0A3D66 100%) !important;
    color: #FFFFFF !important;
    border-bottom: 2px solid #FF8A00 !important;
    box-shadow: 0 8px 24px rgba(3, 42, 74, 0.18) !important;
}

.sh-header-menu {
    background: transparent !important;
    color: #FFFFFF !important;
}

.sh-header-location-icon,
.sh-header-arrow-icon,
.sh-header-account-icon,
.sh-header-cart-icon,
.sh-header-search-icon {
    color: #FF8A00 !important;
    stroke: #FF8A00 !important;
    fill: #FF8A00 !important;
}

.sh-header-cart-badge {
    background: #FF8A00 !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 10px rgba(255, 138, 0, 0.35) !important;
}


/* ---------------- NAVIGATION ---------------- */
.sh-bottom-nav-main {
    background: #FFFFFF !important;
    border-top: 1px solid #E2E8F0 !important;
    box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.05) !important;
}

.sh-bottom-nav-selected {
    color: #FF8A00 !important;
    stroke: #FF8A00 !important;
    font-weight: 700 !important;
}

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


/* ---------------- CATEGORY + PRODUCT CARDS ---------------- */
.sh-product-wishlist-desktop,
.sh-categories-container {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 6px 20px rgba(15, 23, 42, 0.06) !important;
}

.sh-product-wishlist-desktop:hover,
.sh-categories-container:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 14px 30px rgba(3, 42, 74, 0.12) !important;
}


/* ---------------- PRODUCT TEXT ---------------- */
.sh-product-card-name {
    color: #032A4A !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    line-height: 1.4 !important;
}

.sh-product-card-price {
    color: #FF8A00 !important;
    font-size: 20px !important;
    font-weight: 800 !important;
}

.sh-product-card-mrp {
    color: #94A3B8 !important;
    font-size: 14px !important;
}


/* ---------------- DISCOUNT TAGS ---------------- */
.sh-product-card-discount-tag,
.sh-product-discount-tag {
    background: linear-gradient(90deg, #FF8A00, #F97316) !important;
    color: #FFFFFF !important;
    padding: 4px 10px !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}


/* ---------------- BUTTONS ---------------- */
.sh-solid-button,
.sh-product-buy-now-button {
    background: linear-gradient(90deg, #FF8A00, #F97316) !important;
    border: none !important;
    color: #FFFFFF !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    padding: 12px 18px !important;
    letter-spacing: 0.3px !important;
    text-transform: none !important;
    box-shadow: 0 8px 18px rgba(255, 138, 0, 0.25) !important;
    transition: all 0.3s ease !important;
}

.sh-solid-button:hover,
.sh-product-buy-now-button:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 12px 24px rgba(255, 138, 0, 0.35) !important;
}

.sh-outlined-button {
    background: transparent !important;
    border: 2px solid #FF8A00 !important;
    color: #FF8A00 !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
}

.sh-outlined-button:hover {
    background: #FFF7ED !important;
}


/* ---------------- QUANTITY BUTTONS ---------------- */
.sh-product-plus-minus-button {
    background: #032A4A !important;
    color: #FFFFFF !important;
    border-radius: 8px !important;
    border: none !important;
}


/* ---------------- FOOTER ---------------- */
.sh-footer-main {
    background: linear-gradient(90deg, #021D36 0%, #032A4A 100%) !important;
    color: #CBD5E1 !important;
    border-top: 3px solid #FF8A00 !important;
    padding-top: 30px !important;
}

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


/* ---------------- GLOBAL ---------------- */
body {
    background: #F8FAFC !important;
    font-family: 'Poppins', sans-serif !important;
}
/* PROFILE + CART ICON VISIBILITY FIX */
.sh-header-account-icon,
.sh-header-cart-icon {
    stroke: #FFFFFF !important;
    color: #FFFFFF !important;
    fill: none !important;
    stroke-width: 2.2px !important;
    width: 24px !important;
    height: 24px !important;
}

/* Add orange circular background for better visibility */
.sh-header-account-container,
.sh-header-cart-container {
    background: rgba(255, 138, 0, 0.15) !important;
    border: 1px solid rgba(255, 138, 0, 0.35) !important;
    border-radius: 12px !important;
    padding: 10px !important;
    backdrop-filter: blur(8px) !important;
}

/* Hover effect */
.sh-header-account-container:hover,
.sh-header-cart-container:hover {
    background: #FF8A00 !important;
    transform: translateY(-2px) !important;
    transition: all 0.3s ease !important;
}

/* On hover make icon dark for contrast */
.sh-header-account-container:hover .sh-header-account-icon,
.sh-header-cart-container:hover .sh-header-cart-icon {
    stroke: #032A4A !important;
    color: #032A4A !important;
}

/* Cart badge improvement */
.sh-header-cart-badge {
    background: #FF8A00 !important;
    color: #FFFFFF !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    min-width: 18px !important;
    min-height: 18px !important;
    border: 2px solid #032A4A !important;
}

/* DESKTOP LOCATION POPUP THEME FIX */
.sh-location-modal,
.sh-location-popup,
.sh-location-dropdown,
.sh-desktop-location-modal {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 16px !important;
    box-shadow: 0 20px 40px rgba(3, 42, 74, 0.15) !important;
    overflow: hidden !important;
}

/* Header of popup */
.sh-location-modal-header,
.sh-location-popup-header,
.sh-location-title {
    background: linear-gradient(90deg, #032A4A 0%, #0A3D66 100%) !important;
    color: #FFFFFF !important;
    padding: 16px !important;
    font-weight: 700 !important;
}

/* Search input */
.sh-location-search-input,
.sh-location-input,
input[type="search"] {
    border: 2px solid #E2E8F0 !important;
    border-radius: 10px !important;
    padding: 12px 14px !important;
    color: #032A4A !important;
    background: #F8FAFC !important;
}

.sh-location-search-input:focus,
.sh-location-input:focus {
    border-color: #FF8A00 !important;
    box-shadow: 0 0 0 4px rgba(255, 138, 0, 0.12) !important;
    outline: none !important;
}

/* City/location items */
.sh-location-item,
.sh-location-option {
    color: #032A4A !important;
    padding: 12px 16px !important;
    border-bottom: 1px solid #F1F5F9 !important;
    transition: all 0.3s ease !important;
}

.sh-location-item:hover,
.sh-location-option:hover {
    background: #FFF7ED !important;
    color: #FF8A00 !important;
}

/* Selected location */
.sh-location-selected {
    background: rgba(255, 138, 0, 0.1) !important;
    color: #FF8A00 !important;
    font-weight: 600 !important;
}

/* Buttons inside popup */
.sh-location-modal button,
.sh-location-popup button {
    background: linear-gradient(90deg, #FF8A00, #F97316) !important;
    color: #FFFFFF !important;
    border: none !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    padding: 10px 16px !important;
}

/* DESKTOP SELECT LOCATION BUTTON FIX */
.sh-header-location,
.sh-header-location-selector,
.sh-location-selector,
.sh-desktop-location {
    background: rgba(255, 255, 255, 0.12) !important;
    border: 1px solid rgba(255, 138, 0, 0.35) !important;
    border-radius: 10px !important;
    padding: 8px 14px !important;
    color: #FFFFFF !important;
    font-weight: 600 !important;
    backdrop-filter: blur(8px) !important;
}

/* Location text */
.sh-header-location *,
.sh-header-location-selector *,
.sh-location-selector * {
    color: #FFFFFF !important;
    fill: #FFFFFF !important;
}

/* Location icon orange */
.sh-header-location-icon,
.sh-location-icon {
    fill: #FF8A00 !important;
    color: #FF8A00 !important;
}

/* Hover */
.sh-header-location:hover,
.sh-header-location-selector:hover,
.sh-location-selector:hover {
    background: #FF8A00 !important;
    border-color: #FF8A00 !important;
    transition: all 0.3s ease !important;
}

/* Hover text dark for contrast */
.sh-header-location:hover *,
.sh-header-location-selector:hover *,
.sh-location-selector:hover * {
    color: #032A4A !important;
    fill: #032A4A !important;
}

