/* ============================================================
   Metta Pic v14.1 — FULL NAVY THEME
   #07152f + white + orange accent
   Product cards (screenshot style) · Header floating · Global force
   ============================================================ */

:root {
  --mp-navy: #07152f !important;
  --mp-navy-2: #0c1f45 !important;
  --mp-navy-soft: #122a55 !important;
  --mp-white: #ffffff !important;
  --mp-off: #f3f5f9 !important;
  --mp-orange: #ff6b35 !important;
  --mp-orange-h: #e85a28 !important;
  --mp-green: #16a34a !important;
  --mp-red: #dc2626 !important;
  --mp-muted: #6b7a94 !important;
  --mp-line: #d5dce8 !important;
  --black: #07152f !important;
  --ink: #07152f !important;
  --white: #ffffff !important;
  --soft: #f3f5f9 !important;
  --line: #d5dce8 !important;
  --muted: #6b7a94 !important;
  --paper: #f3f5f9 !important;
  --accent: #ff6b35 !important;
}

/* ========== GLOBAL FORCE ========== */
html, body {
  background: #f3f5f9 !important;
  color: #07152f !important;
}
a { color: #07152f; }
a:hover { color: #ff6b35; }

/* Kill pure blacks site-wide where used as bg/text for chrome */
.site-footer,
footer.site-footer,
.footer-main,
.mp-products,
.mp-final-box,
.mobile-bottom-nav,
.mobile-drawer,
.mp-qck-next,
.mp-btn-dark,
.btn.btn-dark,
.single_add_to_cart_button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.mp-sticky-buy,
.mp-add-cart,
.mp-pcard-cart,
.cart-circle {
  background-color: #07152f !important;
  color: #fff !important;
  border-color: #07152f !important;
}

.site-footer a:hover,
.footer-col a:hover,
.mobile-bottom-nav a.active {
  color: #ff6b35 !important;
}

/* ========== FLOATING HEADER ========== */
.site-header,
header.site-header,
#siteHeader {
  position: fixed !important;
  top: 12px !important;
  left: 16px !important;
  right: 16px !important;
  width: auto !important;
  max-width: calc(100% - 32px) !important;
  margin: 0 auto !important;
  z-index: 1000 !important;
  background: rgba(255, 255, 255, 0.92) !important;
  backdrop-filter: blur(16px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.2) !important;
  border: 1px solid rgba(7, 21, 47, 0.08) !important;
  border-radius: 20px !important;
  box-shadow: 0 8px 32px rgba(7, 21, 47, 0.1) !important;
  color: #07152f !important;
  transition: background .25s, box-shadow .25s, top .25s !important;
}
.site-header .header-inner,
#siteHeader .header-inner {
  max-width: 1180px !important;
  margin: 0 auto !important;
  height: 64px !important;
  padding: 0 18px !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}
.site-header.scrolled {
  top: 8px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 12px 40px rgba(7, 21, 47, 0.14) !important;
}
/* Force light header on ALL pages (home + inner) */
body .site-header,
body:not([data-page="home"]) .site-header,
body:not([data-page="home"]) .site-header.scrolled,
body[data-page="home"] .site-header,
body[data-page="home"] .site-header.scrolled {
  background: rgba(255, 255, 255, 0.94) !important;
  color: #07152f !important;
  border-color: rgba(7, 21, 47, 0.08) !important;
}
body .site-header .desktop-nav a,
body .site-header .brand strong,
body .site-header .header-actions a,
body .site-header .header-login-btn,
body:not([data-page="home"]) .site-header .desktop-nav a,
body:not([data-page="home"]) .site-header:not(.scrolled) .desktop-nav a,
body:not([data-page="home"]) .site-header.scrolled .desktop-nav a {
  color: #07152f !important;
}
body .site-header .desktop-nav a:hover,
body .site-header .desktop-nav a.active {
  color: #ff6b35 !important;
}
body .site-header .brand small {
  color: #6b7a94 !important;
}
.site-header .menu-toggle span {
  background: #07152f !important;
}
.site-header .cart-count,
.site-header .mp-cart-count {
  background: #ff6b35 !important;
  color: #fff !important;
}
/* Space under floating header */
body { padding-top: 0 !important; }
.site-header + *,
main,
.mp-page-hero,
.mp-hero2,
.hero-section {
  /* content starts below fixed header via existing page padding; reinforce */
}
.mp-page-hero { padding-top: 110px !important; }
.mp-hero2 { padding-top: 100px !important; }
@media (max-width: 900px) {
  .site-header {
    top: 8px !important;
    left: 10px !important;
    right: 10px !important;
    max-width: calc(100% - 20px) !important;
    border-radius: 16px !important;
  }
  .site-header .header-inner { height: 56px !important; padding: 0 12px !important; }
  .mp-page-hero { padding-top: 90px !important; }
  .mp-hero2 { padding-top: 80px !important; }
}

/* ========== BUTTONS GLOBAL ========== */
.btn, .mp-btn, .button, button.button,
.woocommerce a.button, .woocommerce button.button,
.single_add_to_cart_button, .mp-sticky-buy,
.mp-qck-next, .mp-btn-dark, .header-login-btn {
  background: #07152f !important;
  color: #fff !important;
  border: none !important;
  border-radius: 14px !important;
  font-weight: 800 !important;
  transition: background .2s, transform .15s, box-shadow .2s !important;
}
.btn:hover, .mp-btn:hover, .button:hover,
.single_add_to_cart_button:hover, .mp-sticky-buy:hover,
.mp-qck-next:hover, .mp-btn-dark:hover, .header-login-btn:hover {
  background: #ff6b35 !important;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 10px 28px rgba(255, 107, 53, 0.35) !important;
}
.mp-btn-line, .btn-outline, .mp-btn-outline {
  background: transparent !important;
  color: #07152f !important;
  border: 1.5px solid #07152f !important;
}
.eyebrow, .mp-eyebrow { color: #ff6b35 !important; font-weight: 800 !important; }

/* ========== PRODUCT CARDS — screenshot style ========== */
.mp-pcard,
.product-card,
.mp-product-card,
.woocommerce ul.products li.product {
  background: #fff !important;
  border: 1px solid #e8ecf2 !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  box-shadow: 0 6px 24px rgba(7, 21, 47, 0.06) !important;
  transition: transform .28s ease, box-shadow .28s ease !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
}
.mp-pcard:hover,
.product-card:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 18px 48px rgba(7, 21, 47, 0.12) !important;
  border-color: #d0d7e4 !important;
}

.mp-pcard-media,
.product-media {
  position: relative !important;
  background: linear-gradient(165deg, #f0f3f8 0%, #e6ebf3 100%) !important;
  aspect-ratio: 1 / 1.05 !important;
  overflow: hidden !important;
  border-radius: 0 !important;
}
.mp-pcard-imgwrap,
.mp-pcard-media a {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}
.mp-pcard-media img,
.product-media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  padding: 0 !important;
  transition: transform .4s ease !important;
}
.mp-pcard:hover .mp-pcard-media img {
  transform: scale(1.04) !important;
}

/* Heart wishlist — top left like screenshot */
.mp-pcard-wish,
.circle-action.wishlist {
  position: absolute !important;
  top: 12px !important;
  left: 12px !important;
  right: auto !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: #fff !important;
  border: none !important;
  box-shadow: 0 4px 14px rgba(7, 21, 47, 0.12) !important;
  display: grid !important;
  place-items: center !important;
  color: #07152f !important;
  cursor: pointer !important;
  z-index: 3 !important;
  padding: 0 !important;
  transition: color .2s, transform .2s !important;
}
.mp-pcard-wish:hover,
.mp-pcard-wish.is-active {
  color: #ff6b35 !important;
  transform: scale(1.08) !important;
}
.mp-pcard-wish svg { width: 18px !important; height: 18px !important; }

.mp-pcard-body,
.product-body {
  padding: 14px 14px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  flex: 1 !important;
  background: #fff !important;
}
.mp-pcard-title,
.product-body h3,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  color: #07152f !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  margin: 0 !important;
  text-decoration: none !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  min-height: 40px !important;
}
.mp-pcard-title:hover { color: #ff6b35 !important; }

.mp-pcard-rating,
.mp-pcard-stars {
  display: flex !important;
  align-items: center !important;
  gap: 3px !important;
}
.mp-pcard-stars .mp-star-on,
.mp-star-on,
.stars,
.star-rating {
  color: #ff6b35 !important;
}
.mp-pcard-stars .mp-star-off { color: #c5cdd9 !important; }
.mp-pcard-reviews { font-size: 11px !important; color: #6b7a94 !important; margin-right: 4px !important; }

/* Price row + cart button — like screenshot */
.mp-pcard-foot,
.product-bottom {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin-top: auto !important;
  padding-top: 4px !important;
}
.mp-pcard-price,
.price-area {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}
.mp-pcard-old {
  font-size: 11px !important;
  color: #9aa5b8 !important;
  text-decoration: line-through !important;
}
.mp-pcard-now,
.mp-pcard-price strong,
.price {
  color: #07152f !important;
  font-weight: 900 !important;
  font-size: 15px !important;
  line-height: 1.3 !important;
}
.mp-pcard-now small {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #6b7a94 !important;
}
.mp-pcard-off {
  display: inline-block !important;
  background: rgba(255, 107, 53, 0.12) !important;
  color: #ff6b35 !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  padding: 2px 6px !important;
  border-radius: 6px !important;
}

/* Cart button — rounded square navy (screenshot) */
.mp-pcard-cart,
.mp-add-cart,
.cart-circle {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  flex-shrink: 0 !important;
  border-radius: 14px !important;
  background: #07152f !important;
  color: #fff !important;
  border: none !important;
  display: grid !important;
  place-items: center !important;
  box-shadow: 0 6px 16px rgba(7, 21, 47, 0.25) !important;
  transition: background .2s, transform .2s, box-shadow .2s !important;
  text-decoration: none !important;
  padding: 0 !important;
}
.mp-pcard-cart:hover,
.mp-add-cart:hover,
.cart-circle:hover {
  background: #ff6b35 !important;
  color: #fff !important;
  transform: scale(1.06) !important;
  box-shadow: 0 8px 22px rgba(255, 107, 53, 0.4) !important;
}
.mp-pcard-cart svg,
.mp-add-cart svg {
  width: 20px !important;
  height: 20px !important;
  stroke: currentColor !important;
}
.mp-pcard-cart.is-in-cart {
  background: #dc2626 !important;
}

/* ========== PRODUCT PAGE CHECKBOXES / VARIANTS ========== */
.mp-size-item,
.mp-bl-choice,
.mp-color-dot,
label.mp-var-option,
.mp-variants input[type="radio"] + span,
.mp-variants label {
  border-color: #d5dce8 !important;
  color: #07152f !important;
  border-radius: 12px !important;
  transition: border-color .2s, background .2s, box-shadow .2s !important;
}
.mp-size-item.is-active,
.mp-bl-choice.is-active,
.mp-variants input[type="radio"]:checked + span,
.mp-variants label.is-active {
  border-color: #07152f !important;
  background: #07152f !important;
  color: #fff !important;
  box-shadow: 0 6px 18px rgba(7, 21, 47, 0.2) !important;
}
/* Color dots must keep their own swatch color when selected */
.mp-color-dot.is-active {
  border-color: transparent !important;
  background: var(--swatch, #07152f) !important;
  color: inherit !important;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--swatch, #07152f) !important;
  transform: scale(1.08);
}
.mp-variants input[type="checkbox"]:checked,
.mp-variants input[type="radio"]:checked {
  accent-color: #07152f !important;
}
/* Accent orange for selected backlight / special */
.mp-bl-choice.is-active[data-bl="yes"],
#mpBacklightYes:checked + label {
  border-color: #ff6b35 !important;
  background: #ff6b35 !important;
}

/* ========== PRICE TYPING — red down / green up ========== */
.mp-price-typing.mp-price-up {
  color: #16a34a !important;
}
.mp-price-typing.mp-price-down {
  color: #dc2626 !important;
}
#mpVariantTotal,
.mp-variant-total,
.mp-var-total strong,
.mp-clean-single-price strong,
#mpStickyPriceVal {
  font-variant-numeric: tabular-nums !important;
  transition: color .12s ease !important;
}
.mp-sticky-price {
  background: #fff !important;
  border-top: 1px solid #d5dce8 !important;
  box-shadow: 0 -10px 36px rgba(7, 21, 47, 0.12) !important;
}
.mp-sticky-price-inner {
  max-width: 640px !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 16px !important;
}
.mp-sticky-price strong,
#mpStickyPriceVal {
  color: #07152f !important;
  font-weight: 900 !important;
  font-size: 18px !important;
  flex: 1 !important;
}
.mp-sticky-buy {
  background: #07152f !important;
  color: #fff !important;
  border-radius: 12px !important;
  padding: 12px 20px !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
}
.mp-sticky-buy:hover { background: #ff6b35 !important; }

/* ========== BOXES / CARDS / INFO ========== */
.trust-item,
.mp-product-info-box,
.mp-val,
.mp-about-cta-box,
.mp-contact-info-box,
.cta-box,
.mp-contact-card,
.faq-item,
.mp-article,
.category-tile {
  background: #fff !important;
  border: 1px solid #d5dce8 !important;
  border-radius: 18px !important;
  position: relative !important;
  overflow: hidden !important;
}
.trust-item::before,
.mp-product-info-box::before,
.mp-val::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100px; height: 100px;
  background:
    radial-gradient(circle at 0% 0%, rgba(255,107,53,0.1) 0%, transparent 60%),
    repeating-linear-gradient(-45deg, transparent, transparent 5px, rgba(7,21,47,0.025) 5px, rgba(7,21,47,0.025) 6px);
  pointer-events: none;
  z-index: 0;
}
.trust-item > *, .mp-product-info-box > *, .mp-val > * { position: relative; z-index: 1; }

.mp-product-info-box b,
.mp-val strong,
.trust-item strong {
  color: #07152f !important;
}
.mp-product-info-box span,
.mp-val span {
  color: #6b7a94 !important;
}

/* Dark sections stay navy */
.mp-products,
.mp-final-box,
.mp-about-cta-box.dark,
footer,
.site-footer,
.footer-main {
  background: #07152f !important;
  color: #fff !important;
}
.mp-final-box .btn,
.mp-about-cta-box .mp-btn-dark {
  background: #ff6b35 !important;
}
.mp-final-box .btn:hover {
  background: #fff !important;
  color: #07152f !important;
}

/* ========== HERO ========== */
.mp-hero2 {
  position: relative !important;
  background: #07152f !important;
  color: #fff !important;
  overflow: hidden !important;
}
.mp-hero2 .mp-hero-bg {
  position: absolute !important;
  inset: 0 !important;
  background-size: cover !important;
  background-position: center !important;
  opacity: 0.3 !important;
  transition: background-image 1s ease, opacity .6s !important;
  z-index: 0 !important;
  transform: scale(1.06) !important;
}
.mp-hero2 .mp-hero-overlay {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(145deg, rgba(7,21,47,.94) 0%, rgba(7,21,47,.75) 50%, rgba(255,107,53,.2) 100%) !important;
  z-index: 1 !important;
}
.mp-hero2 .mp-hero2-inner { position: relative !important; z-index: 2 !important; }
.mp-hero2-title { color: #fff !important; }
.mp-hero2-lead { color: rgba(255,255,255,.85) !important; }
.mp-hero2-pill {
  background: rgba(255,107,53,.18) !important;
  color: #ff6b35 !important;
  border: 1px solid rgba(255,107,53,.4) !important;
}
.mp-hero2-hcard {
  background: #fff !important;
  color: #07152f !important;
  border-radius: 20px !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.28) !important;
}
.mp-page-hero {
  background: linear-gradient(145deg, #07152f 0%, #0c1f45 55%, #1a3a6e 100%) !important;
  color: #fff !important;
}

/* ========== QUICK CHECKOUT POPUP ========== */
.mp-qck-overlay { background: rgba(7, 21, 47, 0.55) !important; }
.mp-qck-sheet {
  background: #fff !important;
  border-radius: 24px 24px 0 0 !important;
  box-shadow: 0 -24px 64px rgba(7, 21, 47, 0.28) !important;
}
.mp-qck-prog-bar > span, #mpQckProg {
  background: linear-gradient(90deg, #07152f, #ff6b35) !important;
}
.mp-qck-next { background: #07152f !important; }
.mp-qck-next:hover { background: #ff6b35 !important; }
.mp-qck-gw.is-active,
.mp-qck-addr-card.is-active {
  background: #07152f !important;
  border-color: #07152f !important;
  color: #fff !important;
}
.mp-qck-otp-digits input:focus {
  border-color: #ff6b35 !important;
  box-shadow: 0 0 0 3px rgba(255,107,53,.15) !important;
}

/* ========== FORMS ========== */
input[type="text"], input[type="tel"], input[type="email"],
input[type="number"], input[type="date"], textarea, select {
  border: 1.5px solid #d5dce8 !important;
  border-radius: 12px !important;
  color: #07152f !important;
  background: #fff !important;
}
input:focus, textarea:focus, select:focus {
  border-color: #ff6b35 !important;
  box-shadow: 0 0 0 3px rgba(255,107,53,.14) !important;
  outline: none !important;
}

/* ========== FOOTER ========== */
.footer-col h3 { color: #fff !important; }
.footer-col a, .footer-col span { color: rgba(255,255,255,.7) !important; }
.footer-col a:hover { color: #ff6b35 !important; }
.mp-footer-sc5 a { color: #ff6b35 !important; font-weight: 700; }

/* ========== MOBILE BOTTOM NAV ========== */
.mobile-bottom-nav {
  background: #07152f !important;
  border-color: rgba(255,255,255,.08) !important;
  border-radius: 20px !important;
}
.mobile-bottom-nav a { color: rgba(255,255,255,.55) !important; }
.mobile-bottom-nav a.active {
  color: #fff !important;
  background: rgba(255,107,53,.2) !important;
}
.mobile-drawer {
  background: #07152f !important;
  color: #fff !important;
}

/* ========== RESPONSIVE CARDS ========== */
@media (max-width: 768px) {
  .mp-pcard { border-radius: 16px !important; }
  .mp-pcard-body { padding: 11px 11px 13px !important; }
  .mp-pcard-title { font-size: 11.5px !important; min-height: 34px !important; }
  .mp-pcard-now { font-size: 13px !important; }
  .mp-pcard-cart, .mp-add-cart {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    border-radius: 12px !important;
  }
  .mp-pcard-wish {
    width: 32px !important;
    height: 32px !important;
    top: 8px !important;
    left: 8px !important;
  }
  .products-grid, .mp-products-grid, .woocommerce ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
}

/* ========== MISC ========== */
.mp-accent { color: #ff6b35 !important; }
.section-heading h2, h1, h2, h3 { color: inherit; }
.mp-single-info h1 { color: #07152f !important; }
.woocommerce-Price-amount { color: inherit !important; }

/* ===== FORCE header light on EVERY page (override header.css blacks) ===== */
body .site-header,
body[data-page="home"] .site-header,
body[data-page="inner"] .site-header,
body:not([data-page="home"]) .site-header,
body:not([data-page="home"]) .site-header.scrolled,
body[data-page="inner"] .site-header.scrolled,
body.mp-home .site-header,
body.mp-theme .site-header {
  background: rgba(255,255,255,0.94) !important;
  color: #07152f !important;
  border-bottom: none !important;
  border: 1px solid rgba(7,21,47,0.08) !important;
  position: fixed !important;
  top: 12px !important;
  left: 16px !important;
  right: 16px !important;
  width: auto !important;
  max-width: calc(100% - 32px) !important;
  border-radius: 20px !important;
  box-shadow: 0 8px 32px rgba(7,21,47,0.1) !important;
}
body .site-header .desktop-nav a,
body:not([data-page="home"]) .site-header .desktop-nav a,
body:not([data-page="home"]) .site-header:not(.scrolled) .desktop-nav a,
body:not([data-page="home"]) .site-header.scrolled .desktop-nav a,
body[data-page="inner"] .site-header a {
  color: #07152f !important;
}
body .site-header .desktop-nav a:hover,
body .site-header .desktop-nav a.active {
  color: #ff6b35 !important;
}
body .site-header .brand strong,
body .site-header .header-login-btn,
body .site-header .header-cart,
body .site-header .header-icon {
  color: #07152f !important;
}
body .site-header .header-cart svg,
body .site-header .header-icon svg {
  stroke: #07152f !important;
  color: #07152f !important;
}
body .site-header .menu-toggle span {
  background: #07152f !important;
}
/* black text force on inner pages that used #111 */
.mp-product-price strong,
.mp-pcard-now,
.mp-read,
.mp-details-btn {
  color: #07152f !important;
}
.mp-add-cart,
.mp-pcard-cart {
  background: #07152f !important;
  border-color: #07152f !important;
  color: #fff !important;
}
.mp-add-cart:hover,
.mp-pcard-cart:hover {
  background: #ff6b35 !important;
  color: #fff !important;
  border-color: #ff6b35 !important;
}


/* ===== COLOR DOTS MUST KEEP THEIR SWATCH COLOR WHEN SELECTED ===== */
.mp-color-dot,
button.mp-color-dot,
.mp-variants .mp-color-dot {
  background: var(--swatch, #07152f) !important;
  background-color: var(--swatch, #07152f) !important;
}
.mp-color-dot.is-active,
button.mp-color-dot.is-active,
.mp-variants .mp-color-dot.is-active {
  background: var(--swatch, #07152f) !important;
  background-color: var(--swatch, #07152f) !important;
  border-color: transparent !important;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--swatch, #07152f) !important;
  transform: scale(1.1);
  color: inherit !important;
}