/*
 * njoodukani.com — Blue Theme Override
 * Beautiful baby-blue / light-blue palette
 * Replaces the original green (#1e40af) theme completely
 * Layout: full 100% width, large product images
 */

/* ═══════════════════════════════════════════
   CSS VARIABLES — Blue Palette
═══════════════════════════════════════════ */
:root {
  --blue-primary:   #1e40af;   /* vivid sky blue */
  --blue-deep:      #1e40af;   /* rich royal blue */
  --blue-medium:    #1e40af;   /* medium blue */
  --blue-light:     #66b8ff;   /* light cornflower */
  --blue-baby:      #b8daff;   /* baby blue */
  --blue-pale:      #dbeafe;   /* pale blue wash */
  --blue-mist:      #eff6ff;   /* almost white blue */
  --blue-accent:    #1e40af;   /* accent / hover */
  --blue-dark:      #1e40af;   /* deep navy links */
  --blue-navy:      #1e3a5f;   /* header dark navy */
  --blue-gradient:  linear-gradient(135deg,#1e40af 0%,#1a3697 100%);
  --blue-grad-soft: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 50%, #93c5fd 100%);
}

/* ═══════════════════════════════════════════
   FULL WIDTH LAYOUT
═══════════════════════════════════════════ */
.container {
  max-width: 100% !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
}

/* Keep header containers slightly constrained for readability on ultra-wide */
.header-top .container,
.header-middle .container {
  max-width: 1800px !important;
  margin: 0 auto;
}

/* Main content & footer go full width */
.main > .container,
section .container,
.featured .container,
.footer-mid .container,
.newsletter .container {
  max-width: 100% !important;
}

/* ═══════════════════════════════════════════
   BRAND COLOR OVERRIDES  (was #1e40af green)
═══════════════════════════════════════════ */
.text-brand,
.text-brand:hover { color: var(--blue-primary) !important; }

.text-brand-2 { color: var(--blue-light) !important; }

.bg-brand,
.btn-brand,
.background-brand { background-color: var(--blue-primary) !important; }

.border-brand { border-color: var(--blue-primary) !important; }

/* ═══════════════════════════════════════════
   HEADER — full blue gradient bar
═══════════════════════════════════════════ */
/* Top info bar */
.header-top-ptb-1 {
  background: var(--blue-pale) !important;
  border-bottom: 1px solid var(--blue-baby) !important;
}
.header-top-ptb-1 a,
.header-top-ptb-1 span,
.header-top-ptb-1 li { color: var(--blue-dark) !important; }

/* Middle (logo + search) bar */
.header-middle-ptb-1 {
  background: #ffffff !important;
  border-bottom: 2px solid var(--blue-pale) !important;
}

/* Bottom sticky nav bar — solid royal blue */
.header-style-1 .header-bottom-bg-color,
.header-style-1.header-style-5 .header-bottom-bg-color,
.header-bottom.header-bottom-bg-color,
.sticky-bar.header-bottom-bg-color {
  background: #1e40af !important;
  background-color: #1e40af !important;
  border-top: none !important;
  border-bottom: none !important;
  box-shadow: 0 4px 20px rgba(30,64,175, 0.3) !important;
}

/* Nav links on blue bar */
.header-style-1 .main-menu > nav > ul > li > a,
.header-style-1.header-style-5 .main-menu > nav > ul > li > a {
  color: #ffffff !important;
  font-weight: 600;
  letter-spacing: 0.3px;
}
.header-style-1 .main-menu > nav > ul > li > a:hover {
  color: var(--blue-baby) !important;
}

/* Categories button on nav */
.header-style-1 .main-categori-wrap > a,
.header-style-1.header-style-5 .header-bottom-bg-color .main-categori-wrap > a {
  background: rgba(255,255,255,0.15) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,0.3) !important;
  border-radius: 8px !important;
  backdrop-filter: blur(4px);
}
.header-style-1 .main-categori-wrap > a:hover {
  background: rgba(255,255,255,0.25) !important;
}
.header-style-1 .main-categori-wrap > a span { color: #fff !important; }
.header-style-1 .main-categori-wrap > a i   { color: #fff !important; }

/* Hotline text in header */
.header-style-1 .hotline p { color: var(--blue-baby) !important; }

/* Mobile promotion bar */
.mobile-promotion {
  background: var(--blue-deep) !important;
  color: #fff !important;
}

/* ═══════════════════════════════════════════
   SEARCH BAR
═══════════════════════════════════════════ */
.search-style-2 form input[type="text"] {
  border: 2px solid var(--blue-baby) !important;
  border-right: none !important;
}
.search-style-2 form input[type="text"]:focus {
  border-color: var(--blue-primary) !important;
  box-shadow: 0 0 0 3px rgba(30,64,175,0.15) !important;
}
.search-style-2 form button {
  background: var(--blue-primary) !important;
  border-color: var(--blue-primary) !important;
  color: #fff !important;
}
.search-style-2 form button:hover {
  background: var(--blue-deep) !important;
}

/* ═══════════════════════════════════════════
   BUTTONS — surgical overrides only
   Only plain .btn-primary gets royal blue fill.
   All outline/light/link/semantic variants
   keep their Bootstrap appearance so text
   is always visible against its background.
═══════════════════════════════════════════ */

/* ── Primary solid button → royal blue ── */
.btn-primary,
a.btn-primary,
button.btn-primary,
input[type="submit"].btn-primary {
  background-color: #1e40af !important;
  border-color: #1e40af !important;
  color: #fff !important;
}
.btn-primary:hover,
a.btn-primary:hover { background-color: #1a3697 !important; border-color: #1a3697 !important; }

/* Bare .btn with no variant class → royal blue */
.btn:not([class*="btn-"]):not(.button-add-to-cart) {
  background-color: #1e40af !important;
  border-color: #1e40af !important;
  color: #fff !important;
}

/* ── Explicit form submit buttons in our own pages ── */
button[type="submit"].btn-primary,
form .btn-primary { background-color: #1e40af !important; border-color: #1e40af !important; color: #fff !important; }

/* ── Outline variants — keep transparent, restore text colour ── */
.btn-outline-primary  { background-color: transparent !important; color: #1e40af !important; border-color: #1e40af !important; }
.btn-outline-secondary{ background-color: transparent !important; color: #6c757d !important; border-color: #6c757d !important; }
.btn-outline-success  { background-color: transparent !important; color: #1e40af !important; border-color: #1e40af !important; }
.btn-outline-danger   { background-color: transparent !important; color: #dc3545 !important; border-color: #dc3545 !important; }
.btn-outline-warning  { background-color: transparent !important; color: #d97706 !important; border-color: #d97706 !important; }
.btn-outline-info     { background-color: transparent !important; color: #0891b2 !important; border-color: #0891b2 !important; }
.btn-outline-dark     { background-color: transparent !important; color: #212529 !important; border-color: #212529 !important; }
/* btn-outline-light: used on dark/blue backgrounds → keep white */
.btn-outline-light    { background-color: transparent !important; color: #fff !important; border-color: rgba(255,255,255,0.7) !important; }

/* Hover/checked states for outline variants */
.btn-outline-primary:hover,  .btn-check:checked + .btn-outline-primary  { background-color: #1e40af !important; color: #fff !important; border-color: #1e40af !important; }
.btn-outline-secondary:hover,.btn-check:checked + .btn-outline-secondary { background-color: #6c757d !important; color: #fff !important; border-color: #6c757d !important; }
.btn-outline-success:hover,  .btn-check:checked + .btn-outline-success   { background-color: #1e40af !important; color: #fff !important; border-color: #1e40af !important; }
.btn-outline-danger:hover,   .btn-check:checked + .btn-outline-danger    { background-color: #dc3545 !important; color: #fff !important; }
.btn-outline-warning:hover,  .btn-check:checked + .btn-outline-warning   { background-color: #d97706 !important; color: #fff !important; }
.btn-outline-info:hover,     .btn-check:checked + .btn-outline-info      { background-color: #0891b2 !important; color: #fff !important; }
.btn-outline-dark:hover,     .btn-check:checked + .btn-outline-dark      { background-color: #212529 !important; color: #fff !important; }
.btn-outline-light:hover                                                  { background-color: rgba(255,255,255,0.15) !important; color: #fff !important; }

/* ── Light button — white fill, royal-blue text ── */
.btn-light { background-color: #fff !important; border-color: #e5e7eb !important; color: #1e40af !important; }
.btn-light:hover { background-color: #f1f5ff !important; color: #1a3697 !important; }

/* ── Link button — always transparent ── */
.btn-link { background-color: transparent !important; border-color: transparent !important;
            color: #1e40af !important; text-decoration: underline; box-shadow: none !important; }
.btn-link:hover { color: #1a3697 !important; }

/* ── Semantic variant buttons (warning, danger, info, secondary) ── */
.btn-secondary { background-color: #6c757d !important; border-color: #6c757d !important; color: #fff !important; }
.btn-warning   { background-color: #f59e0b !important; border-color: #f59e0b !important; color: #212529 !important; }
.btn-danger    { background-color: #dc3545 !important; border-color: #dc3545 !important; color: #fff !important; }
.btn-info      { background-color: #0891b2 !important; border-color: #0891b2 !important; color: #fff !important; }
.btn-dark      { background-color: #212529 !important; border-color: #212529 !important; color: #fff !important; }

/* ── Currency picker buttons — always transparent ── */
.njoo-curr-wrap button,
.njoo-curr-item-btn,
.flw-curr-item-btn,
#flw-curr-wrap button {
  background: transparent !important;
  background-color: transparent !important;
  border-color: transparent !important;
  color: inherit !important;
  box-shadow: none !important;
  transform: none !important;
}
.njoo-curr-wrap button:hover,
#flw-curr-wrap .njoo-curr-item-btn:hover,
#flw-curr-wrap .flw-curr-item-btn:hover {
  background: #f3f4f6 !important;
  background-color: #f3f4f6 !important;
  transform: none !important;
  box-shadow: none !important;
}
#flw-curr-btn { border: 2px solid #e8e8e8 !important; border-radius: 10px !important; }

/* ── Add to cart buttons (main store + local delivery) ── */
.button-add-to-cart,
.add-to-cart-btn,
.confirm-add-btn {
  background: #1e40af !important;
  border: none !important;
  border-radius: 50px !important;
  color: #fff !important;
  font-weight: 600 !important;
}
.button-add-to-cart:hover,
.add-to-cart-btn:hover,
.confirm-add-btn:hover {
  background: #1a3697 !important;
  color: #fff !important;
}
/* Override main.css `.btn-sm { padding: 8px 18px !important }` for the compact
   restaurant menu "+ Add" button so it keeps its intended small size */
.add-to-cart-btn.btn-sm {
  padding: 4px 14px !important;
  font-size: .78rem !important;
}
/* Safety net: ANY button element with an explicit blue inline background
   gets white text regardless of class or specificity battles */
button[style*="background:#1e40af"],
button[style*="background: #1e40af"] {
  color: #fff !important;
}

/* ── Links — royal blue default, low specificity so CSS classes can override ──
   Using simple `a {}` (specificity 0,0,1) so any class-based color rule
   (e.g. .visit-btn { color:#fff }, .nav-link { color:... }) wins over this.
   Header bar white links are handled by the specific header selectors below.
═══════════════════════════════════════════ */
a {
  color: #1e40af;
}
a:hover {
  color: #1a3697;
}
/* Anchor elements with explicit blue backgrounds must show white text.
   Covers inline-style anchor buttons lacking class-based color. */
a[style*="background:#1e40af"],
a[style*="background: #1e40af"] {
  color: #fff !important;
}
a[style*="background:#1e40af"]:hover,
a[style*="background: #1e40af"]:hover {
  color: #fff !important;
}

/* White text for direct links/icons in the blue header bar
   — excludes dropdown menus (white bg) to keep those readable */
.header-bottom-bg-color > .container > .header-wrap .main-menu > nav > ul > li > a,
.header-style-1 .header-bottom-bg-color .main-menu > nav > ul > li > a,
.header-bottom-bg-color .header-action-right a,
.header-bottom-bg-color .header-action-icon-2 span,
.header-bottom-bg-color .search-popup-wrap i {
  color: #fff !important;
}
/* Ensure dropdown items on white background stay dark */
.header-bottom-bg-color .categories-dropdown-wrap a,
.header-bottom-bg-color .dropdown-menu a,
.header-bottom-bg-color ul.sub-menu a {
  color: #253d4e !important;
}
.header-bottom-bg-color .categories-dropdown-wrap a:hover,
.header-bottom-bg-color .dropdown-menu a:hover {
  color: #1e40af !important;
}

/* Bootstrap utility overrides */
.text-primary { color: #1e40af !important; }
.bg-primary    { background-color: #1e40af !important; }

/* ═══════════════════════════════════════════
   PRODUCT CARDS — large images, blue accents
═══════════════════════════════════════════ */
.product-cart-wrap,
.product-card-small,
.product-list-small article {
  border-radius: 12px !important;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important;
  transition: box-shadow 0.3s ease, transform 0.3s ease !important;
  border: 1px solid var(--blue-pale) !important;
}
.product-cart-wrap:hover {
  box-shadow: 0 8px 30px rgba(30,64,175,0.18) !important;
  transform: translateY(-4px);
  border-color: var(--blue-baby) !important;
}

/* LARGE product images — expand to fill card width */
.product-cart-wrap .product-img-action-wrap,
.product-cart-wrap .product-img,
.product-cart-wrap .product-img a,
.product-cart-wrap .product-img a img {
  width: 100% !important;
  max-height: 320px !important;   /* was ~220px — bigger images */
  min-height: 260px !important;
}
.product-cart-wrap .product-img a img {
  object-fit: cover !important;
  height: 280px !important;
  width: 100% !important;
}

/* Product image containers on listing pages */
.product-list-small .product-img,
.products-grid .product-img { min-height: 200px; }

/* Sale/New badge */
.product-badge .hot,
.product-badge.hot { background: var(--blue-primary) !important; color: #fff !important; }
.product-badge .sale,
.product-badge.sale { background: var(--blue-accent) !important; color: #fff !important; }

/* Product price */
.product-price .current-price,
.product-price .price,
.current-price { color: var(--blue-primary) !important; }

/* Hover action buttons on product card */
.product-action-1 a,
.product-action-vertical a {
  color: var(--blue-primary) !important;
  border-color: var(--blue-baby) !important;
}
.product-action-1 a:hover,
.product-action-vertical a:hover {
  background: var(--blue-primary) !important;
  color: #fff !important;
  border-color: var(--blue-primary) !important;
}

/* ═══════════════════════════════════════════
   CAROUSEL / HERO SECTION
═══════════════════════════════════════════ */
.home-slider .hero-slider-1,
.carausel-10-columns-cover,
.slider-arrow,
.home-slide-cover {
  border-radius: 0 !important;
}
.slider-btn.slider-prev,
.slider-btn.slider-next {
  background: var(--blue-primary) !important;
  color: #fff !important;
  border-radius: 50% !important;
}
.slider-btn.slider-prev:hover,
.slider-btn.slider-next:hover {
  background: var(--blue-deep) !important;
}

/* ═══════════════════════════════════════════
   SECTION HEADINGS & DIVIDERS
═══════════════════════════════════════════ */
.section-title .title-heading,
.section-title h3,
.heading-tab h3 { color: var(--blue-navy) !important; }

.section-title .line { background: var(--blue-primary) !important; }

.nav-tabs .nav-link.active,
.nav-tabs .nav-link:hover {
  color: var(--blue-primary) !important;
  border-bottom-color: var(--blue-primary) !important;
}

/* ═══════════════════════════════════════════
   CATEGORIES DROPDOWN
═══════════════════════════════════════════ */
.categories-dropdown-wrap {
  border-top: 3px solid var(--blue-primary) !important;
  box-shadow: 0 10px 40px rgba(30,64,175,0.12) !important;
}
.categories-dropdown-wrap ul li a:hover {
  color: var(--blue-primary) !important;
}

/* ═══════════════════════════════════════════
   CART DROPDOWN
═══════════════════════════════════════════ */
.cart-dropdown-wrap {
  border-top: 3px solid var(--blue-primary) !important;
  box-shadow: 0 8px 30px rgba(30,64,175,0.15) !important;
}
.shopping-cart-button a {
  background: var(--blue-primary) !important;
  color: #fff !important;
  border-radius: 6px !important;
}
.shopping-cart-button a:hover { background: var(--blue-deep) !important; }

/* Cart count badge */
.pro-count.blue { background: var(--blue-primary) !important; }

/* ═══════════════════════════════════════════
   NEWSLETTER SECTION
═══════════════════════════════════════════ */
.newsletter-inner {
  background: var(--blue-gradient) !important;
  border-radius: 16px !important;
  overflow: hidden;
}
.newsletter-content h2,
.newsletter-content p { color: #fff !important; }
.form-subcriber input[type="email"] {
  border: 2px solid var(--blue-baby) !important;
  border-radius: 8px 0 0 8px !important;
}
.form-subcriber .btn {
  background: var(--blue-deep) !important;
  border-radius: 0 8px 8px 0 !important;
  font-weight: 700 !important;
}

/* ═══════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════ */
footer.main {
  background: #f0f7ff !important;
  border-top: 3px solid var(--blue-baby) !important;
}
.footer-mid {
  background: #e8f2ff !important;
}
.widget-title {
  color: var(--blue-navy) !important;
  border-bottom: 2px solid var(--blue-baby) !important;
  padding-bottom: 10px !important;
}
.footer-list li a {
  color: #4a6fa5 !important;
}
.footer-list li a:hover { color: var(--blue-primary) !important; }

/* Contact info icons */
.contact-infor img { filter: hue-rotate(120deg) saturate(1.5); }

/* Footer copyright */
.footer-bottom { border-color: var(--blue-baby) !important; }

/* ═══════════════════════════════════════════
   BREADCRUMB
═══════════════════════════════════════════ */
.breadcrumb-item.active,
.breadcrumb-item a { color: var(--blue-primary) !important; }

/* ═══════════════════════════════════════════
   PAGINATION
═══════════════════════════════════════════ */
.pagination .page-item.active .page-link {
  background: var(--blue-primary) !important;
  border-color: var(--blue-primary) !important;
}
.pagination .page-link { color: var(--blue-primary) !important; }
.pagination .page-link:hover {
  background: var(--blue-pale) !important;
  color: var(--blue-deep) !important;
}

/* ═══════════════════════════════════════════
   FORMS / INPUTS
═══════════════════════════════════════════ */
input:focus,
select:focus,
textarea:focus {
  border-color: var(--blue-primary) !important;
  box-shadow: 0 0 0 3px rgba(30,64,175,0.15) !important;
  outline: none !important;
}

/* ═══════════════════════════════════════════
   TABS / PILLS
═══════════════════════════════════════════ */
.nav-pills .nav-link.active,
.nav-pills .nav-link.show > .nav-link {
  background: var(--blue-primary) !important;
  color: #fff !important;
}

/* ═══════════════════════════════════════════
   ALERT / NOTIFICATION BOXES
═══════════════════════════════════════════ */
#alert-container .alert-success { background: var(--blue-pale) !important; color: var(--blue-dark) !important; }

/* ═══════════════════════════════════════════
   SIDEBAR FILTERS
═══════════════════════════════════════════ */
.sidebar-widget .widget-title {
  color: var(--blue-navy) !important;
  border-bottom: 2px solid var(--blue-baby) !important;
}
.filter-checkbox input[type="checkbox"]:checked + label::before,
.custome-checkbox input[type="checkbox"]:checked + label::before {
  background-color: var(--blue-primary) !important;
  border-color: var(--blue-primary) !important;
}

/* ═══════════════════════════════════════════
   PRODUCT DETAIL PAGE
═══════════════════════════════════════════ */
.detail-gallery .product-image-slider img {
  max-height: 500px !important;
  object-fit: contain !important;
  width: 100% !important;
}
.detail-info .current-price { color: var(--blue-primary) !important; font-size: 1.6rem !important; }
.detail-info .old-price { text-decoration: line-through; color: #999 !important; }

/* ═══════════════════════════════════════════
   DEAL-OF-DAY COUNTDOWN TIMER
═══════════════════════════════════════════ */
.deal-countdown .countdown-section .countdown-amount {
  background: var(--blue-primary) !important;
  color: #fff !important;
  border-radius: 8px !important;
}

/* ═══════════════════════════════════════════
   RATING STARS
═══════════════════════════════════════════ */
.product-rate-cover .product-rating { background: var(--blue-primary) !important; }

/* ═══════════════════════════════════════════
   STICKY HEADER SCROLL
═══════════════════════════════════════════ */
.sticky-bar.stick {
  background: var(--blue-gradient) !important;
  box-shadow: 0 4px 20px rgba(30,64,175,0.35) !important;
}

/* ═══════════════════════════════════════════
   MOBILE MENU PANEL
═══════════════════════════════════════════ */
.mobile-header-wrapper-style {
  background: var(--blue-navy) !important;
}
.mobile-menu li a { color: var(--blue-baby) !important; }
.mobile-menu li a:hover { color: #fff !important; }
.mobile-social-icon h6 { color: #fff !important; }

/* ═══════════════════════════════════════════
   VENDOR / SUPPLIER PAGE
═══════════════════════════════════════════ */
.vendor-info .vendor-name a { color: var(--blue-primary) !important; }
.vendor-des .info-list li a { color: var(--blue-primary) !important; }

/* ═══════════════════════════════════════════
   SCROLL TO TOP BUTTON
   Moved left of the chatbot button (which sits at right:28px)
   so the two don't stack on top of each other.
═══════════════════════════════════════════ */
#scrollUp,
.scrollup {
  background: var(--blue-primary) !important;
  border-radius: 50% !important;
  box-shadow: 0 4px 15px rgba(30,64,175,0.4) !important;
  right: 98px !important;  /* chatbot is at right:28px + 58px wide + 12px gap */
  bottom: 28px !important;
}
#scrollUp:hover { background: var(--blue-deep) !important; }

/* ═══════════════════════════════════════════
   PRELOADER
═══════════════════════════════════════════ */
#preloader-active { background: var(--blue-mist) !important; }

/* ═══════════════════════════════════════════
   GLOBAL PAGE BG
═══════════════════════════════════════════ */
body { background-color: #f8fbff !important; }

/* ═══════════════════════════════════════════
   SELECT DROPDOWNS (currency, category)
═══════════════════════════════════════════ */
.header-right select,
.search-style-2 select {
  border: 1px solid var(--blue-baby) !important;
  color: var(--blue-dark) !important;
  background: #fff !important;
}

/* ═══════════════════════════════════════════
   HOT DEAL SECTION BG
═══════════════════════════════════════════ */
.section-border-new,
.section-bg-color { background: var(--blue-mist) !important; }

/* Feature icon boxes */
.banner-left-icon .banner-icon img { filter: hue-rotate(120deg) saturate(1.3); }
.banner-text h3 { color: var(--blue-navy) !important; }

/* ═══════════════════════════════════════════
   BLOG / POSTS
═══════════════════════════════════════════ */
.post-title a:hover,
.entry-title a:hover { color: var(--blue-primary) !important; }
.blog-meta a { color: var(--blue-medium) !important; }

/* ═══════════════════════════════════════════════════════
   FULL WIDTH HERO SLIDER BANNERS
═══════════════════════════════════════════════════════ */
.home-slide-cover,
.hero-slider-1,
.single-hero-slider,
.home-slide-cover .col-lg-7,
.home-slide-cover .col-lg-7 .home-slide-cover,
section.home-slider { padding: 0 !important; margin: 0 !important; }

.hero-slider-1 .single-hero-slider { padding: 0 !important; background-size: cover !important; }

/* Make the banner column take full viewport width */
section.home-slider .container,
section.home-slider .row,
.home-slide-cover .container { max-width: 100% !important; padding: 0 !important; margin: 0 !important; }

section.home-slider .col-lg-7 { flex: 0 0 100%; max-width: 100%; padding: 0 !important; }
section.home-slider .col-xl-2,
section.home-slider .col-lg-2,
section.home-slider .col-lg-3 { display: none; } /* hide side columns on banner pages */

.hero-slider-1 img { border-radius: 0 !important; }

/* Reduce banner section margins */
section.home-slider { margin-bottom: 8px !important; }

/* ═══════════════════════════════════════════════════════
   REMOVE ALL GREEN — REPLACE WITH BLUE
   Original theme green: #1e40af → replaced by #1e40af
═══════════════════════════════════════════════════════ */
/* Product price — was green */
.product-price span:first-child,
.product-price .price-main,
.current-price,
span.current-price,
.product-card-bottom .product-price span { color: #1e40af !important; font-weight: 700; }

/* Product name links — blue */
.product-content-wrap h2 a,
.product-content-wrap h2 a:hover { color: #1e40af !important; }
.product-content-wrap h2 a:hover { color: #1e40af !important; }

/* Category links in products */
.product-category a { color: #1e40af !important; }

/* All .text-success → blue */
.text-success { color: #1e40af !important; }
.bg-success    { background-color: #1e40af !important; }

/* Badge colors */
.badge.bg-success, .badge-success { background-color: #1e40af !important; }

/* Buttons — ensure no green */
.btn-success, .button-success { background-color: #1e40af !important; border-color: #1e40af !important; color:#fff !important; }
.btn-success:hover { background-color: #1e40af !important; }

/* Progress bars */
.progress-bar { background-color: #1e40af !important; }
.product-rating { background-color: #1e40af !important; }

/* Product sold indicator */
.sold .progress-bar { background: #1e40af !important; }

/* Add to cart / view buttons */
.btn.hover-up, a.btn.hover-up {
  background: #1e40af !important;
  border-color: #1e40af !important;
  color: #fff !important;
}
.btn.hover-up:hover {
  background: #1e40af !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(30,64,175,0.35) !important;
}

/* Section titles */
.section-title h3, .section-title h4 { color: #1e40af !important; }

/* Tab active state */
.nav.nav-tabs .nav-link.active { color: #1e40af !important; border-bottom-color: #1e40af !important; }
.tab-pane .nav-link.active     { color: #1e40af !important; }

/* Daily Best Sellers full-width product cards */
#carausel-4-columns .product-cart-wrap,
.carausel-4-columns .product-cart-wrap {
  border: 1px solid #dbeafe !important;
  border-radius: 12px !important;
}

/* Ensure no #1e40af green anywhere */
/* Override inline styles that may use the original green */
[style*="#1e40af"] { color: #1e40af !important; }
[style*="3BB77E"]  { background-color: #1e40af !important; }

/* Popular categories section */
.popular-categories .cat-btn, .categori-btn { color: #1e40af !important; }

/* Sale badges */
.badge.hot { background: #1e40af !important; }
.badge.sale { background: #1e40af !important; }
.badge.new  { background: #1e40af !important; }

/* Deal countdown */
.countdown-amount { background: #1e40af !important; color: #fff !important; }

/* Newsletter subscribe button */
.form-subcriber .btn-sm { background: #1e40af !important; }

/* Product search tabs */
.heading-tab h3 { color: #1e40af !important; }
.heading-tab .nav-link.active { color: #1e40af !important; border-color: #1e40af !important; }

/* Banner section bg */
.section-border-new { background: #eff6ff !important; }

/* Remove right-side ad column gaps */
section.home-slider .container { padding-left: 0 !important; padding-right: 0 !important; max-width: 100% !important; }
section.home-slider .col-12 { padding: 0 !important; }
.home-slide-cover { margin: 0 !important; }

/* Product images placeholder */
.product-img img[src=""], .product-img img:not([src]),
.product-img img[src$="undefined"] {
  background: linear-gradient(135deg,#dbeafe,#bfdbfe);
  min-height: 200px;
}

/* ── Product badges — all green replaced with blue ────────────── */
.product-cart-wrap .product-badges span.new,
.vendor-wrap .product-badges.product-badges-position span.new {
  background-color: #1e40af !important;
}
.product-cart-wrap .product-badges span.hot,
.vendor-wrap .product-badges.product-badges-position span.hot {
  background-color: #1e40af !important;
}
.product-cart-wrap .product-badges span.sale {
  background-color: #1e40af !important;
}
/* All remaining green from original theme */
:root { --color-brand: #1e40af !important; }
.text-brand { color: #1e40af !important; }
.bg-brand   { background: #1e40af !important; }

/* ── Footer widget-title — consistent sizing, no color override ── */
.footer-link-widget .widget-title,
footer .widget-title {
  font-size: 1rem !important;
  font-weight: 600 !important;
  margin-bottom: 14px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid rgba(255,255,255,0.1) !important;
  display: block !important;
  /* color is inherited from original theme — do NOT override */
}
footer .contact-infor { margin-top: 8px; }
footer .contact-infor li { margin-bottom: 8px; font-size: 0.88rem; }

/* ═══════════════════════════════════════════
   ALL PRICE LISTINGS → ROYAL BLUE #1e40af
   Maximum specificity — overrides everything
═══════════════════════════════════════════ */

/* ── Product card prices (main store) ── */
.product-cart-wrap .product-content-wrap .product-price span,
.product-cart-wrap .product-content-wrap .product-price span.new-price,
.product-cart-wrap .product-content-wrap .product-price,
.product-card-bottom .product-price span,
.product-card-bottom .product-price,
.product-list-small .product-price,
.product-list-small .product-price span,
.product-list .product-cart-wrap .product-content-wrap .product-price span {
  color: #1e40af !important;
  font-weight: 700 !important;
}

/* ── Generic price elements ── */
.product-price,
.product-price span:not(.old-price),
.current-price,
span.current-price,
.price:not(.old-price),
p.price,
h4.price, h5.price, h6.price,
.price-main, .price-now, .price-amount,
.product-content-wrap .product-price span,
.product-price-cover .current-price,
.detail-info .current-price,
.detail-info .product-price .current-price {
  color: #1e40af !important;
  font-weight: 700 !important;
}

/* ── Cart & checkout totals ── */
td.price h4, td.price h5, td.price h6,
.cart-price, .order-total, .subtotal-price, .grand-total,
.cart-total, .cart-subtotal {
  color: #1e40af !important;
  font-weight: 700 !important;
}

/* ── text-body prices in cart table (override Bootstrap) ── */
td.price .text-body,
td.price h4.text-body { color: #1e40af !important; }

/* ── Old/strikethrough prices stay grey ── */
.old-price, span.old-price, .price-del, s.price,
.product-price span.old-price,
.product-cart-wrap .product-content-wrap .product-price span.old-price {
  color: #9ca3af !important;
  font-weight: 400 !important;
  text-decoration: line-through !important;
}

/* ── NEW badge — solid royal blue background ── */
.product-cart-wrap .product-badges span.new,
.product-badges span.new,
span.badge-new, .badge.new,
[class*="badge"] span.new {
  background-color: #1e40af !important;
  color: #fff !important;
  border: none !important;
}

/* ── HOT badge — royal blue ── */
.product-cart-wrap .product-badges span.hot,
.product-badges span.hot,
span.badge-hot, .badge.hot {
  background-color: #1e40af !important;
  color: #fff !important;
}

/* ── SALE badge — slightly darker blue for contrast ── */
.product-cart-wrap .product-badges span.sale,
.product-badges span.sale, .badge.sale {
  background-color: #1a3697 !important;
  color: #fff !important;
}

/* ── NJD Logo sizing overrides ─────────────────────────────────────────────
   The NJD oval logo is 440×310 aspect (~1.42:1 width:height).
   Old logo was a wide 215×66 wordmark, so main.css widths are too large.
   All overrides live here so main.css stays untouched.
   ─────────────────────────────────────────────────────────────────────── */

/* Desktop header-middle logo */
.logo.logo-width-1 {
  margin-right: 20px !important;
}
.logo.logo-width-1 a img {
  width: 80px !important;
  min-width: 80px !important;
  height: auto !important;
}

/* Sticky bar + mobile logo (d-block d-lg-none) */
.header-bottom .logo.logo-width-1 a img,
.mobile-header-logo a img {
  width: 60px !important;
  min-width: 60px !important;
  height: auto !important;
}

/* Footer logo */
.footer-mid .logo img,
.widget-about .logo img {
  width: 75px !important;
  max-width: 75px !important;
  height: auto !important;
}

/* Supplier-panel sidebar logo */
.navbar-aside .brand-wrap img.logo {
  width: 50px !important;
  height: auto !important;
}

/* ═══════════════════════════════════════════
   BOOTSTRAP SUCCESS → ROYAL BLUE overrides
   (handles btn-success, btn-outline-success, bg-success, text-success, badge-success)
═══════════════════════════════════════════ */
.btn-success,
.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active {
  background-color: #1e40af !important;
  border-color: #1e40af !important;
  color: #fff !important;
}
.btn-outline-success {
  color: #1e40af !important;
  border-color: #1e40af !important;
  background-color: transparent !important;
}
.btn-outline-success:hover,
.btn-check:checked + .btn-outline-success,
.btn-outline-success.active,
.btn-outline-success:active {
  background-color: #1e40af !important;
  border-color: #1e40af !important;
  color: #fff !important;
}
.alert-success {
  background-color: #eff6ff !important;
  border-color: #dbeafe !important;
  color: #1e40af !important;
}
.border-success { border-color: #1e40af !important; }
.link-success { color: #1e40af !important; }

/* ═══════════════════════════════════════════
   SLIDER-RANGE.CSS override — replace #3BB77E with royal blue
   (slider-range.css is a vendor file; override here instead of editing it)
═══════════════════════════════════════════ */
.noUi-handle:before,
.noUi-handle:after,
.noUi-connect,
.noUi-handle:active {
  background-color: #1e40af !important;
  border-color: #1e40af !important;
}
.noUi-connect {
  background: #1e40af !important;
}
.price-filter .noUi-handle {
  background-color: #1e40af !important;
  border-color: #1e40af !important;
}
.price-filter .noUi-handle:active {
  border-color: rgba(30,64,175,0.38) !important;
}

/* ═══════════════════════════════════════════
   CATEGORIES BUTTON — explicit royal blue background
   Ensures the store menu bar is royal blue on all screens
═══════════════════════════════════════════ */
.main-categori-wrap > a.categories-button-active,
.header-style-1 .main-categori-wrap > a.categories-button-active,
a.categories-button-active {
  background: #1e40af !important;
  background-color: #1e40af !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
}

/* ═══════════════════════════════════════════
   PARAGRAPH COLOR — SYSTEMIC FIX
   main.css `p { color: #7E7E7E }` directly overrides CSS color inheritance,
   making paragraphs dark grey even inside white-text (blue) parent sections.
   Override it to restore inheritance — paragraphs now get color from their
   nearest ancestor (white/light bg → grey from body; blue bg → white from hero).
   More specific rules (.text-muted, .card p, etc.) still override as needed.
═══════════════════════════════════════════ */
p {
  color: inherit;
}

/* ═══════════════════════════════════════════
   BLUE HERO SECTIONS — belt-and-suspenders white text
   Covers class-based hero sections and deeply nested inline-style sections.
   The `p { color: inherit }` above handles most cases; these are explicit
   overrides for the common hero/header class patterns.
═══════════════════════════════════════════ */
/* Inline-style blue backgrounds (section, div — no direct-child restriction) */
section[style*="background:#1e40af"] p,
section[style*="background:#1e40af"] span,
section[style*="background:#1e40af"] small,
section[style*="background:linear-gradient"] p,
section[style*="background:linear-gradient"] span,
section[style*="background:linear-gradient"] small,
div[style*="background:#1e40af"] p,
div[style*="background:#1e40af"] span,
div[style*="background:linear-gradient(135deg,#1e40af"] p,
div[style*="background:linear-gradient(135deg,#1e40af"] span,
div[style*="background:linear-gradient(90deg,#1e40af"] p,
div[style*="background:linear-gradient(90deg,#1e40af"] span {
  color: #fff !important;
}
/* Class-based blue hero sections (vendors-grid, vendor-details, dropshipping, checkout) */
.store-hero p, .store-hero span, .store-hero small,
.store-hero h1, .store-hero h2, .store-hero h3, .store-hero h4, .store-hero strong,
.vendor-hero p, .vendor-hero span, .vendor-hero small,
.vendor-hero h1, .vendor-hero h2, .vendor-hero h3, .vendor-hero h4, .vendor-hero strong,
.flw-header p, .flw-header span, .flw-header small,
.flw-header h1, .flw-header h2, .flw-header h3, .flw-header h4, .flw-header strong,
.ds-hero p, .ds-hero span, .ds-hero small,
.ds-hero h1, .ds-hero h2, .ds-hero h3, .ds-hero h4, .ds-hero strong {
  color: #fff !important;
}
/* Keep .text-muted still somewhat muted but visible inside cards on white bg */
.card p.text-muted,
.card small.text-muted,
.card .text-muted,
.card-body .text-muted {
  color: #6b7280 !important;
}

/* ═══════════════════════════════════════════
   TEXT-MUTED CONTRAST FIX
   main.css sets .text-muted to #B6B6B6 !important which is too faint
   on white backgrounds. Override to a more readable #6b7280.
═══════════════════════════════════════════ */
.text-muted {
  color: #6b7280 !important;
}

/* ═══════════════════════════════════════════
   BADGE WHITE TEXT — ensure all custom badges with blue/dark backgrounds
   show white text (Bootstrap's --bs-badge-color may be overridden)
═══════════════════════════════════════════ */
.badge[style*="background:#1e40af"],
.badge[style*="background: #1e40af"] {
  color: #fff !important;
}
.badge[style*="background:#dc2626"],
.badge[style*="background: #dc2626"] {
  color: #fff !important;
}
.badge[style*="background:#dbeafe"],
.badge[style*="background:#eff6ff"] {
  color: #1e40af !important;
}