/* Mega Store Kenya — shared storefront layer
   Sits over the codecanyon themes to unify branding across every shop
   while preserving each vertical's personality via accent tokens.
   Body classes emitted by layout: `mk-store mk-store-<vertical>`.
*/

.mk-store{
  /* Global MK identity */
  --mk-green:#153e32;
  --mk-lime:#d5ee87;
  --mk-ivory:#f6f5ee;
  --mk-ink:#20372e;
  --mk-line:#dce3d8;
  --mk-muted:#5e6f66;

  /* Per-vertical accent — overridden below */
  --mk-accent:#153e32;
  --mk-accent-soft:#e6f0d9;
  --mk-accent-ink:#0e2a22;
  --mk-hero-bg:#f4efe7;
  --mk-serif:'Playfair Display','Cormorant Garamond',Georgia,serif;
  --mk-sans:'Inter','Poppins',system-ui,Arial,sans-serif;
}

/* --- Per-vertical accent overrides ------------------------------ */
.mk-store-jewellery { --mk-accent:#b4884b; --mk-accent-soft:#f6ecdb; --mk-accent-ink:#5c3e15; --mk-hero-bg:#f7efe1; }
.mk-store-vegetables{ --mk-accent:#1f8046; --mk-accent-soft:#e2f4de; --mk-accent-ink:#0e3a1e; --mk-hero-bg:#eaf6e2; }
.mk-store-furniture { --mk-accent:#a35b2a; --mk-accent-soft:#f5e8dc; --mk-accent-ink:#4a2612; --mk-hero-bg:#f5ede2; }
.mk-store-fashion   { --mk-accent:#4b3b2e; --mk-accent-soft:#efe7dc; --mk-accent-ink:#2a1e14; --mk-hero-bg:#f2eae0; }
.mk-store-electronics{--mk-accent:#0e2f56; --mk-accent-soft:#dae5f4; --mk-accent-ink:#0a1e37; --mk-hero-bg:#eef1f7; }
.mk-store-kids      { --mk-accent:#e0538b; --mk-accent-soft:#fde3ee; --mk-accent-ink:#7a1e46; --mk-hero-bg:#fff1e6; }
.mk-store-manti     { --mk-accent:#0163d2; --mk-accent-soft:#dae7f7; --mk-accent-ink:#083c7e; --mk-hero-bg:#eef4fb; }
.mk-store-pet       { --mk-accent:#ef7a34; --mk-accent-soft:#fce3ce; --mk-accent-ink:#7a3b0f; --mk-hero-bg:#fff2e6; }
.mk-store-skinflow  { --mk-accent:#c25d51; --mk-accent-soft:#f7e2de; --mk-accent-ink:#5a1e17; --mk-hero-bg:#fbeee7; }

/* --- Reset the noise that clashes across templates -------------- */
.mk-store,
.mk-store body{ background:#fff; color:var(--mk-ink); }
.mk-store a{ transition:color .18s ease, background-color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease; }

/* --- MK section-heading (used to unify all section titles) ------ */
.mk-store .section-title h2,
.mk-store .section-title .title{
  font-family:var(--mk-serif);
  color:var(--mk-green);
  letter-spacing:-.02em;
  font-weight:700;
}
.mk-store .section-title h2::after,
.mk-store .section-title .title::after{
  content:'';display:block;width:56px;height:3px;background:var(--mk-accent);
  border-radius:3px;margin-top:14px;
}
.mk-store .section-title.text-center h2::after,
.mk-store .section-title.text-center .title::after{ margin-inline:auto; }

/* Legacy small kicker used by some templates */
.mk-store .section-title span,
.mk-store .section-title .sub-title{
  color:var(--mk-accent);font-family:var(--mk-sans);text-transform:uppercase;
  letter-spacing:2.5px;font-weight:700;font-size:12px;
}

/* --- Buttons ------------------------------------------------------ */
.mk-store .btn-primary,
.mk-store .btn.btn-primary,
.mk-store .theme-btn,
.mk-store .primary-btn{
  background:var(--mk-green) !important;
  border-color:var(--mk-green) !important;
  color:#fff !important;
  border-radius:10px;
  padding:12px 26px;
  font-weight:600;
  font-family:var(--mk-sans);
  letter-spacing:.01em;
  box-shadow:0 6px 18px rgba(21,62,50,.12);
}
.mk-store .btn-primary:hover,
.mk-store .btn.btn-primary:hover,
.mk-store .theme-btn:hover,
.mk-store .primary-btn:hover{
  background:var(--mk-accent) !important;
  border-color:var(--mk-accent) !important;
  transform:translateY(-1px);
  box-shadow:0 10px 22px rgba(21,62,50,.18);
}
.mk-store .btn-outline-primary,
.mk-store .btn.btn-outline-primary{
  border:1.5px solid var(--mk-green) !important;
  color:var(--mk-green) !important;
  background:transparent !important;
  border-radius:10px;
  padding:11px 24px;
  font-weight:600;
}
.mk-store .btn-outline-primary:hover{ background:var(--mk-green) !important; color:#fff !important; }

/* --- Header top area (unified across templates) ---------------- */
.mk-store .header,
.mk-store .header-8,
.mk-store .header-area,
.mk-store header.site-header{
  background:#fff;
  border-bottom:1px solid var(--mk-line);
  box-shadow:0 1px 0 rgba(21,62,50,.03);
}
.mk-store .header .logo,
.mk-store .header-8 .logo,
.mk-store .site-logo{ font-family:var(--mk-serif); color:var(--mk-green); }
.mk-store .header a,
.mk-store .header-8 a,
.mk-store .site-header a{ color:var(--mk-ink); }
.mk-store .header a:hover,
.mk-store .header-8 a:hover,
.mk-store .site-header a:hover{ color:var(--mk-accent); }

/* Search bar polish */
.mk-store .search-box,
.mk-store .header-search{
  border:1px solid var(--mk-line) !important;
  background:var(--mk-ivory) !important;
  border-radius:999px !important;
  overflow:hidden;
}
.mk-store .search-box input,
.mk-store .header-search input{ background:transparent !important; border:0 !important; }

/* --- Hero section unification --------------------------------- */
.mk-store .home-hero,
.mk-store .hero-section,
.mk-store .banner-section .hero,
.mk-store .home-hero-8{
  position:relative;
  background:var(--mk-hero-bg);
}
.mk-store .home-hero::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(1200px 400px at 15% 90%, rgba(21,62,50,.06), transparent 60%);
}
.mk-store .home-hero h1,
.mk-store .home-hero h2,
.mk-store .hero-section h1,
.mk-store .hero-section h2,
.mk-store .home-hero-8 h2{
  font-family:var(--mk-serif) !important;
  color:var(--mk-green) !important;
  letter-spacing:-.02em;
  line-height:1.08;
  font-weight:700;
}
.mk-store .home-hero p,
.mk-store .hero-section p,
.mk-store .home-hero-8 p{
  color:var(--mk-muted);font-family:var(--mk-sans);font-size:17px;line-height:1.65;
}
.mk-store .hero-card{
  background:rgba(255,255,255,.94) !important;
  border-radius:22px !important;
  border:1px solid var(--mk-line) !important;
  box-shadow:0 25px 60px rgba(21,62,50,.10) !important;
  padding:44px !important;
}

/* --- Category strip / cards ----------------------------------- */
.mk-store .category-item{
  border-radius:18px;
  overflow:hidden;
  background:#fff;
  border:1px solid var(--mk-line);
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.mk-store .category-item:hover{
  transform:translateY(-4px);
  box-shadow:0 20px 40px rgba(21,62,50,.12);
  border-color:var(--mk-accent);
}
.mk-store .category-item .content{ padding:16px 18px; background:#fff; }
.mk-store .category-item .title{ color:var(--mk-green); font-weight:700; font-size:16px; }
.mk-store .category-item .count,
.mk-store .category-item small{ color:var(--mk-muted); font-size:13px; }

/* --- Product card (works for most codecanyon markups) --------- */
.mk-store .product-item,
.mk-store .product-card,
.mk-store .featured-item{
  background:#fff;
  border:1px solid var(--mk-line);
  border-radius:16px;
  overflow:hidden;
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.mk-store .product-item:hover,
.mk-store .product-card:hover,
.mk-store .featured-item:hover{
  transform:translateY(-6px);
  box-shadow:0 22px 46px rgba(21,62,50,.14);
  border-color:var(--mk-accent);
}
/* Price — covers .price, .new-price, .product-price, .new-price-area */
.mk-store .product-item .price,
.mk-store .product-card .price,
.mk-store .featured-item .price,
.mk-store .new-price,
.mk-store .new-price-area,
.mk-store .price-current,
.mk-store .current-price,
.mk-store .item-price{
  color:var(--mk-green) !important;
  font-weight:700 !important;
  font-size:17px !important;
  font-family:var(--mk-sans) !important;
}
.mk-store .new-price.color-dark,
.mk-store .new-price-area.color-primary{
  color:var(--mk-green) !important;
}
.mk-store .product-item .old-price,
.mk-store .product-item del,
.mk-store .featured-item del,
.mk-store .product-card del,
.mk-store .old-price,
.mk-store .old-price-area{
  color:#9ea89f !important;
  font-size:14px !important;
  margin-left:8px;
  text-decoration:line-through;
}

/* Product titles — cover many variants */
.mk-store .product-item .title,
.mk-store .product-item h5,
.mk-store .product-item h6,
.mk-store .product-card .title,
.mk-store .product-card h5,
.mk-store .featured-item .title,
.mk-store .featured-item h5,
.mk-store .product-title,
.mk-store .product-name,
.mk-store .item-title,
.mk-store .list-item-title,
.mk-store .article-item-title,
.mk-store .category-item-title{
  color:var(--mk-green) !important;
  font-family:var(--mk-sans) !important;
  font-weight:600;
  font-size:16px;
  line-height:1.4;
}
.mk-store .product-title:hover,
.mk-store .product-name:hover,
.mk-store .article-item-title:hover{
  color:var(--mk-accent) !important;
}

/* list-item-title color-primary override */
.mk-store .list-item-title.color-primary{ color:var(--mk-green) !important; }

/* Footer widget headings + text — used by v7 footer */
.mk-store .footer-widget .footer-widget-title,
.mk-store .footer-widget h5,
.mk-store .footer-widget h4{
  color:#fff !important; font-family:var(--mk-serif); font-weight:700;
}
.mk-store .footer-widget a,
.mk-store .footer-widget p,
.mk-store .footer-widget span{ color:#d5e0d8 !important; }
.mk-store .footer-widget a:hover{ color:var(--mk-lime) !important; }
.mk-store .footer-widget-address,
.mk-store .footer-widget-email,
.mk-store .footer-widget-number{ color:#d5e0d8 !important; }

/* Countdown timers (flash sale) */
.mk-store .countdown-item,
.mk-store .counter-item{
  background:var(--mk-accent-soft) !important;
  color:var(--mk-accent-ink) !important;
  border-radius:8px;
}

/* Rating pips */
.mk-store .rating i,
.mk-store .star-rating i{ color:#f4b93f; }

/* Badges (New / Sale / Hot) */
.mk-store .badge,
.mk-store .product-item .badge,
.mk-store .product-item .on-sale,
.mk-store .featured-item .badge{
  background:var(--mk-accent) !important;
  color:#fff !important;
  border-radius:999px;
  padding:5px 12px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}

/* --- Footer restyle ------------------------------------------- */
.mk-store .footer,
.mk-store footer,
.mk-store .footer-area,
.mk-store .footer-section{
  background:var(--mk-green) !important;
  color:#eaf1ec !important;
  font-family:var(--mk-sans);
  padding-top:56px !important;
}
.mk-store .footer *,
.mk-store footer *,
.mk-store .footer-area *,
.mk-store .footer-section *{
  color:#eaf1ec !important;
}
.mk-store .footer a:hover,
.mk-store footer a:hover,
.mk-store .footer-area a:hover,
.mk-store .footer-section a:hover{
  color:var(--mk-lime) !important;
}
.mk-store .footer h5,
.mk-store .footer h4,
.mk-store .footer .title,
.mk-store .footer-area .title,
.mk-store .footer-section .title{
  color:#fff !important;font-family:var(--mk-serif);letter-spacing:-.01em;
  font-weight:700;margin-bottom:18px;font-size:19px;
}
.mk-store .footer .copyright,
.mk-store footer .copyright{
  border-top:1px solid rgba(255,255,255,.12);
  padding-top:18px;margin-top:36px;font-size:14px;
}

/* --- Breadcrumb / page title area ----------------------------- */
.mk-store .page-title-area,
.mk-store .breadcrumb-section{
  background:var(--mk-hero-bg) !important;
  padding:52px 0 !important;
}
.mk-store .page-title-area::before,
.mk-store .breadcrumb-section::before{ display:none !important; }
.mk-store .page-title-area h1,
.mk-store .page-title-area h2,
.mk-store .breadcrumb-section h1,
.mk-store .breadcrumb-section h2{
  font-family:var(--mk-serif);color:var(--mk-green);letter-spacing:-.02em;
}
.mk-store .page-title-area .breadcrumb a,
.mk-store .breadcrumb-section .breadcrumb a,
.mk-store .page-title-area .breadcrumb li,
.mk-store .breadcrumb-section .breadcrumb li{ color:var(--mk-muted); }
.mk-store .page-title-area .breadcrumb .active,
.mk-store .breadcrumb-section .breadcrumb .active{ color:var(--mk-accent); font-weight:600; }

/* --- Flash sale / countdown timer stripe ---------------------- */
.mk-store .flash-section,
.mk-store .flash-sale{
  background:linear-gradient(120deg,var(--mk-accent-soft),#fff);
}
.mk-store .flash-section .section-title h2,
.mk-store .flash-sale .section-title h2{ color:var(--mk-accent-ink); }

/* --- Newsletter / CTA bands ----------------------------------- */
.mk-store .newsletter-area,
.mk-store .cta-area{
  background:var(--mk-green) !important;
  color:#fff;
  border-radius:22px;
  padding:48px !important;
  margin:60px auto;
  max-width:1200px;
}
.mk-store .newsletter-area h2,
.mk-store .newsletter-area h3,
.mk-store .cta-area h2{ color:#fff !important; font-family:var(--mk-serif); }
.mk-store .newsletter-area input{
  background:#fff !important;border:0 !important;border-radius:999px !important;
  padding:14px 22px !important;
}
.mk-store .newsletter-area button{
  background:var(--mk-lime) !important;color:var(--mk-green) !important;
  border-radius:999px !important;border:0 !important;font-weight:700;
}

/* --- Featured 'Why shop with us' block ------------------------ */
.mk-store .featured-8 .featured-item{
  border:0 !important;background:transparent !important;
  box-shadow:none !important;padding:8px 4px;
}
.mk-store .featured-8 .featured-item:hover{ transform:none;box-shadow:none;border:0; }
.mk-store .featured-8 .featured-item .icon{
  width:52px;height:52px;background:var(--mk-accent-soft);
  color:var(--mk-accent-ink);border-radius:14px;display:inline-flex;
  align-items:center;justify-content:center;font-size:22px;margin-bottom:12px;
}
.mk-store .featured-8 .featured-item .content p{
  color:var(--mk-green);font-weight:600;font-family:var(--mk-sans);
}

/* --- Compact mobile posture ----------------------------------- */
@media(max-width:820px){
  .mk-store .hero-card{ padding:28px !important; }
  .mk-store .home-hero h1,
  .mk-store .home-hero h2,
  .mk-store .hero-section h1,
  .mk-store .hero-section h2,
  .mk-store .home-hero-8 h2{ font-size:32px !important; }
  .mk-store .section-title h2,
  .mk-store .section-title .title{ font-size:26px !important; }
  .mk-store .newsletter-area{ padding:32px !important; }
}

/* --- MK-branded "Shop across the marketplace" strip ---------- */
.mk-cross-shop{
  background:var(--mk-ivory);
  padding:56px 0;
  border-block:1px solid var(--mk-line);
  margin-top:60px;
}
.mk-cross-shop .mk-cross-inner{
  max-width:1200px;margin-inline:auto;padding:0 24px;
  display:flex;justify-content:space-between;gap:24px;align-items:center;flex-wrap:wrap;
}
.mk-cross-shop h3{
  font-family:var(--mk-serif);color:var(--mk-green);font-size:26px;margin:0 0 6px;
  letter-spacing:-.02em;
}
.mk-cross-shop p{ color:var(--mk-muted); margin:0; font-size:15px; }
.mk-cross-shop a.mk-cross-cta{
  background:var(--mk-green);color:#fff !important;padding:14px 26px;border-radius:999px;
  font-weight:600;text-decoration:none;font-family:var(--mk-sans);
}
.mk-cross-shop a.mk-cross-cta:hover{ background:var(--mk-accent); }

/* --- Constrain merchant logo images to a consistent header size --- */
.mk-store .logo img,
.mk-store .brand-logo img,
.mk-store .header .logo img,
.mk-store .site-logo img,
.mk-store .logo-area img,
.mk-store a.logo > img,
.mk-store .header-logo img{
  max-width:220px !important;
  max-height:56px !important;
  width:auto !important;
  height:auto !important;
  object-fit:contain;
  display:inline-block;
}
@media(max-width:820px){
  .mk-store .logo img,
  .mk-store .brand-logo img,
  .mk-store .header .logo img,
  .mk-store .site-logo img{
    max-width:170px !important;
    max-height:44px !important;
  }
}
