/* =========================================================
   Metta Pic v47 — Balanced Black & White (not all-dark)
   Hero stays pure black. Body alternates white / soft black.
   ========================================================= */

:root {
  --mp-black: #0a0a0a;
  --mp-ink: #111111;
  --mp-white: #ffffff;
  --mp-off: #f6f6f6;
  --mp-line: #e5e5e5;
  --mp-muted: #6b6b6b;
  --mp-text: #161616;
}

html, body, body.mp-theme, body.mp-home {
  background: var(--mp-white) !important;
  background-color: #ffffff !important;
  color: var(--mp-text) !important;
  font-family: "Yekan", "Vazirmatn", Tahoma, Arial, sans-serif !important;
}
body *, body *::before, body *::after {
  font-family: inherit !important;
}

/* ---- HEADER: transparent on hero, BLACK on scroll ---- */
.site-header,
#siteHeader {
  background: transparent !important;
  border-bottom: 1px solid transparent !important;
  color: #fff !important;
  transition: background .25s ease, border-color .25s ease, box-shadow .25s ease !important;
}
.site-header .brand strong,
.site-header .desktop-nav a {
  color: #fff !important;
}
.site-header .brand-logo {
  filter: brightness(0) invert(1) !important;
  height: 30px !important;
  max-width: 100px !important;
}
.site-header .header-cart,
.site-header .header-icon,
.site-header .menu-toggle {
  color: #fff !important;
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.2) !important;
}
.site-header .menu-toggle span { background: #fff !important; }
.site-header .header-cart svg,
.site-header .header-icon svg { stroke: #fff !important; color: #fff !important; }
.site-header .mp-cart-count,
.site-header .cart-count {
  background: #fff !important;
  color: #000 !important;
}

/* SCROLLED = solid black */
.site-header.scrolled,
body .site-header.scrolled,
body.mp-home .site-header.scrolled {
  background: #0a0a0a !important;
  background-color: #0a0a0a !important;
  color: #fff !important;
  border-bottom: 1px solid #222 !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.35) !important;
  backdrop-filter: none !important;
}
.site-header.scrolled .brand strong,
.site-header.scrolled .desktop-nav a { color: #fff !important; }
.site-header.scrolled .brand-logo {
  filter: brightness(0) invert(1) !important;
}
.site-header.scrolled .menu-toggle span { background: #fff !important; }
.site-header.scrolled .header-cart,
.site-header.scrolled .header-icon,
.site-header.scrolled .menu-toggle {
  color: #fff !important;
  background: rgba(255,255,255,.1) !important;
  border-color: rgba(255,255,255,.2) !important;
}

/* Non-home pages: header always black */
body:not(.mp-home) .site-header {
  background: #0a0a0a !important;
  color: #fff !important;
  border-bottom: 1px solid #222 !important;
}

/* ---- HERO: keep pure black (user loves it) ---- */
section.mp-hero2, .mp-hero2 {
  background: #000000 !important;
  color: #fff !important;
}
.mp-hero2-title { color: #fff !important; }
.mp-hero2-lead { color: #b8b8b8 !important; }
.mp-hero2-actions .mp-btn-dark {
  background: #fff !important;
  color: #000 !important;
}
.mp-hero2-actions .mp-btn-line {
  background: transparent !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.5) !important;
}
.mp-hero.mp-hero-lancer { display: none !important; }

/* ---- Alternating sections: WHITE / soft gray / black accents ---- */
.mp-cat-strip {
  background: #ffffff !important;
  color: #161616 !important;
  padding: 56px 0 !important;
  border-bottom: 1px solid #eee !important;
}
.mp-popular {
  background: #f6f6f6 !important;
  color: #161616 !important;
  padding: 56px 0 !important;
}
.mp-cat-products {
  padding: 48px 0 !important;
}
.mp-cat-products:nth-of-type(odd) {
  background: #ffffff !important;
}
.mp-cat-products:nth-of-type(even) {
  background: #f6f6f6 !important;
}
.mp-section-head h2 { color: #111 !important; }
.mp-section-head p { color: #666 !important; }
.eyebrow { color: #888 !important; letter-spacing: .12em !important; }
.mp-link-more { color: #111 !important; border-bottom: 1px solid #111 !important; }

/* Category tiles: mix black & white */
.mp-cat-tile {
  background: #fff !important;
  border: 1px solid #e5e5e5 !important;
  color: #111 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
}
.mp-cat-tile.is-dark {
  background: #0a0a0a !important;
  border-color: #0a0a0a !important;
  color: #fff !important;
}
.mp-cat-tile.is-dark strong,
.mp-cat-tile.is-dark small { color: #fff !important; }
.mp-cat-tile strong { color: #111 !important; }
.mp-cat-tile small { color: #777 !important; }

/* Product cards on light sections */
.mp-pcard {
  background: #ffffff !important;
  border: 1px solid #e8e8e8 !important;
  border-radius: 18px !important;
  color: #161616 !important;
  box-shadow: 0 4px 18px rgba(0,0,0,.04) !important;
}
.mp-pcard:hover {
  border-color: #111 !important;
  box-shadow: 0 14px 36px rgba(0,0,0,.1) !important;
}
.mp-pcard-media { background: #fafafa !important; }
.mp-pcard-title { color: #111 !important; }
.mp-pcard-now { color: #111 !important; font-size: 13px !important; }
.mp-pcard-old { color: #999 !important; }
.mp-pcard-off {
  background: none !important;
  color: #111 !important;
  font-size: 10px !important;
  font-weight: 800 !important;
}
.mp-pcard-cart {
  background: #111 !important;
  color: #fff !important;
}
.mp-pcard-cart:hover { background: #000 !important; }
.mp-pcard-cart svg { stroke: #fff !important; color: #fff !important; }
.mp-pcard-wish {
  background: #fff !important;
  color: #111 !important;
  border: 1px solid #e5e5e5 !important;
}

/* Grid responsive */
.mp-pcard-grid.mp-pcard-grid-5 {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
@media (min-width: 640px) {
  .mp-pcard-grid.mp-pcard-grid-5 {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (min-width: 992px) {
  .mp-pcard-grid.mp-pcard-grid-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }
}
@media (min-width: 1400px) {
  .mp-pcard-grid.mp-pcard-grid-5 {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }
}

/* Consult — black band */
.mp-consult {
  background: #0a0a0a !important;
  color: #fff !important;
  padding: 48px 0 !important;
}
.mp-consult-inner h2 { color: #fff !important; }
.mp-consult-inner p { color: #aaa !important; }
.mp-consult .mp-btn-dark {
  background: #fff !important;
  color: #000 !important;
}

/* About teaser — white */
.mp-about-teaser {
  background: #fff !important;
  color: #161616 !important;
  padding: 64px 0 !important;
}
.mp-about-teaser h2 { color: #111 !important; }
.mp-about-teaser p { color: #555 !important; }
.mp-point {
  background: #f6f6f6 !important;
  border: 1px solid #e8e8e8 !important;
  border-radius: 14px !important;
  padding: 16px !important;
  color: #111 !important;
}
.mp-point span { color: #777 !important; }
.mp-about-teaser .mp-btn-dark {
  background: #111 !important;
  color: #fff !important;
}

/* FAQ accordion — white cards, professional */
.mp-faq-home {
  background: #f6f6f6 !important;
  padding: 56px 0 !important;
}
.mp-faq-list {
  max-width: 820px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.mp-faq-item {
  background: #ffffff !important;
  border: 1px solid #e5e5e5 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  transition: border-color .2s ease, box-shadow .2s ease !important;
}
.mp-faq-item[open] {
  border-color: #111 !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.06) !important;
}
.mp-faq-item summary {
  list-style: none !important;
  cursor: pointer !important;
  padding: 16px 18px !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  color: #111 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}
.mp-faq-item summary::-webkit-details-marker { display: none !important; }
.mp-faq-item summary span {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background: #111 !important;
  color: #fff !important;
  display: grid !important;
  place-items: center !important;
  font-size: 16px !important;
  flex-shrink: 0 !important;
  transition: transform .25s ease, background .2s !important;
}
.mp-faq-item[open] summary span {
  background: #000 !important;
  transform: rotate(45deg) !important;
}
.mp-faq-item .answer {
  padding: 0 18px 16px !important;
  color: #555 !important;
  font-size: 13px !important;
  line-height: 1.9 !important;
}

/* Custom order — black */
.mp-custom-order, .mp-final2 {
  background: #0a0a0a !important;
  color: #fff !important;
  padding: 64px 0 !important;
}
.mp-custom-order h2, .mp-final2 h2 { color: #fff !important; }
.mp-custom-order p, .mp-final2 p { color: #aaa !important; }
.mp-btn-light {
  background: #fff !important;
  color: #000 !important;
}
.mp-btn-outline-light {
  background: transparent !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.45) !important;
}

/* ---- FOOTER black ---- */
.site-footer, footer.site-footer {
  background: #0a0a0a !important;
  color: #ccc !important;
  border-top: 1px solid #222 !important;
}
.site-footer a { color: #ddd !important; }
.site-footer h3 { color: #fff !important; }
.footer-bottom { border-top: 1px solid #222 !important; color: #888 !important; }

/* ---- Product variants professional ---- */
.mp-variants {
  background: #fafafa !important;
  border: 1px solid #e5e5e5 !important;
  border-radius: 16px !important;
  padding: 18px !important;
  margin: 18px 0 22px !important;
  direction: rtl !important;
}
.mp-var-label {
  font-size: 13px !important;
  font-weight: 800 !important;
  color: #111 !important;
  margin-bottom: 10px !important;
}
.mp-size-list { display: flex; flex-wrap: wrap; gap: 8px; }
.mp-size-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  min-width: 76px;
  padding: 10px 12px;
  border: 1.5px solid #ddd;
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  color: #111;
  transition: .15s ease;
}
.mp-size-item input { display: none; }
.mp-size-item:has(input:checked),
.mp-size-item.is-active {
  border-color: #000 !important;
  background: #000 !important;
  color: #fff !important;
}
.mp-size-price { font-size: 10px; opacity: .75; }
.mp-color-list { display: flex; flex-wrap: wrap; gap: 10px; }
.mp-color-dot {
  width: 36px; height: 36px;
  border-radius: 50%;
  border: 2px solid #ddd;
  background: var(--swatch, #ccc);
  cursor: pointer;
  padding: 0;
  transition: .15s ease;
}
.mp-color-dot.is-active {
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #000;
  border-color: #000;
}
.mp-bl-row, .mp-backlight-block {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 700;
  color: #111;
  margin-top: 8px;
}
.mp-bl-row input, .mp-backlight-block input {
  width: 18px; height: 18px;
  accent-color: #000;
}
.mp-var-total {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #e0e0e0;
  font-size: 14px;
  font-weight: 800;
  color: #111;
}
.mp-var-total strong,
#mpVarTotalPrice,
#mpVariantPriceLive {
  font-size: 20px !important;
  font-weight: 900 !important;
  color: #000 !important;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  transition: opacity .12s ease;
}
.mp-price-typing {
  display: inline-block;
  border-left: 2px solid #000;
  animation: mpBlink .7s step-end infinite;
  padding-left: 2px;
}
@keyframes mpBlink {
  50% { border-color: transparent; }
}

/* Single product page light */
.single-product .product,
.woocommerce div.product {
  color: #161616 !important;
}
.woocommerce div.product .product_title { color: #111 !important; }
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.mp-clean-single-price strong {
  color: #111 !important;
  font-weight: 900 !important;
}
.single_add_to_cart_button,
.woocommerce a.button.alt {
  background: #111 !important;
  color: #fff !important;
}

/* Idea page */
.mp-idea-page {
  background: #fff !important;
  color: #161616 !important;
  padding: 48px 0 72px !important;
  min-height: 70vh !important;
}
.mp-idea-head h1 { color: #111 !important; font-weight: 900 !important; }
.mp-idea-head p { color: #666 !important; }
.mp-idea-form {
  max-width: 640px;
  margin: 28px auto 0;
  background: #fafafa !important;
  border: 1px solid #e5e5e5 !important;
  border-radius: 18px !important;
  padding: 24px !important;
}
.mp-idea-field { margin-bottom: 14px; }
.mp-idea-field label {
  display: block;
  font-size: 12px;
  font-weight: 800;
  color: #111;
  margin-bottom: 6px;
}
.mp-idea-field .req { color: #c00; }
.mp-idea-field input,
.mp-idea-field select,
.mp-idea-field textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1.5px solid #ddd;
  border-radius: 12px;
  background: #fff;
  color: #111;
  font-size: 14px;
  font-family: inherit !important;
}
.mp-idea-field input:focus,
.mp-idea-field select:focus,
.mp-idea-field textarea:focus {
  outline: none;
  border-color: #111;
}
.mp-idea-row2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
@media (max-width: 560px) {
  .mp-idea-row2 { grid-template-columns: 1fr; }
}
.mp-idea-check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  color: #111;
  margin-top: 8px;
}
.mp-idea-submit {
  width: 100%;
  margin-top: 8px;
  padding: 14px;
  border: 0;
  border-radius: 12px;
  background: #111 !important;
  color: #fff !important;
  font-weight: 900 !important;
  font-size: 15px !important;
  cursor: pointer;
}
.mp-idea-submit:hover { background: #000 !important; }
.mp-idea-msg {
  max-width: 640px;
  margin: 0 auto 16px;
  padding: 12px 16px;
  border-radius: 12px;
  font-weight: 700;
}
.mp-idea-msg.ok { background: #eefaf0; color: #0a6b2d; border: 1px solid #b8e6c4; }
.mp-idea-msg.err { background: #fff0f0; color: #a00; border: 1px solid #f0c0c0; }

/* Cart / checkout light with black accents */
.mp-ck-next, .mp-ck-invoice #place_order {
  background: #111 !important;
  color: #fff !important;
}

/* Bottom nav */
.mobile-bottom-nav {
  background: #0a0a0a !important;
  border-color: #222 !important;
}
.mobile-bottom-nav a { color: #aaa !important; }
.mobile-bottom-nav a.active { color: #fff !important; background: #1a1a1a !important; }