/*
 Theme Name:   Woodmart Child — المول التقني
 Description:  WoodMart Child Theme for EMOLE / مؤسسة المول التقني — Dashboard Controlled
 Author:       mohaned-kasem-falak
 Template:     woodmart
 Version:      2.0.0
 Text Domain:  woodmart
*/

/* ═══════════════════════════════════════════════
   CSS VARIABLES — injected dynamically from dashboard
   ═══════════════════════════════════════════════ */
:root {
  --em-primary:  #00A7D4;
  --em-accent:   #D30071;
  --em-green:    #7A9C59;
  --em-beige:    #E4D4B5;
  --em-dark:     #0F172A;
  --em-light:    #F5F8F8;
  --em-gray:     #64748B;
  --em-white:    #FFFFFF;
  --em-font:     'Cairo', sans-serif;
  --em-radius:   12px;
  --em-radius-btn: 10px;
}

/* ═══════════════════════════════════════════════
   GLOBAL
   ═══════════════════════════════════════════════ */
/* Force Cairo on everything */
*, *::before, *::after { box-sizing: border-box; }
body, html {
    font-family: 'Cairo', sans-serif !important;
    direction: rtl !important;
}
body *, body *::before, body *::after {
    font-family: inherit !important;
}
/* Override WoodMart font vars */
:root {
    --font: 'Cairo', sans-serif;
    --wd-body-font-family: 'Cairo', sans-serif;
    --wd-heading-font-family: 'Cairo', sans-serif;
}
/* WoodMart specific overrides */
.wd-font, .woodmart-font,
h1,h2,h3,h4,h5,h6,
p, a, span, div, li, td, th,
input, textarea, select, button,
label, nav, header, footer, main, section, article {
    font-family: 'Cairo', sans-serif !important;
}

/* ═══════════════════════════════════════════════
   WOODMART OVERRIDES
   ═══════════════════════════════════════════════ */
.wd-btn-primary, .button.alt, input[type="submit"],
.woocommerce a.button, .woocommerce button.button.alt,
.woocommerce input.button {
  background-color: var(--em-primary) !important;
  border-color: var(--em-primary) !important;
  border-radius: var(--em-radius-btn) !important;
  font-family: var(--em-font) !important;
  font-weight: 700 !important;
}
a { color: var(--em-primary); }
a:hover { color: #0090b5; }
.wd-header { background-color: var(--em-white) !important; }

/* ═══════════════════════════════════════════════
   LAYOUT HELPERS
   ═══════════════════════════════════════════════ */
.em-container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 2rem;
  width: 100%;
}
.em-section { padding: 80px 0; }
.em-section-light { background: var(--em-light); }
.em-section-white { background: var(--em-white); }
.em-section-dark  { background: var(--em-dark); }
.em-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.em-grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.em-grid-4 { display: grid; grid-template-columns: repeat(4,1fr); gap: 24px; }
@media(max-width:1024px) { .em-grid-4 { grid-template-columns: repeat(2,1fr); } .em-grid-3 { grid-template-columns: repeat(2,1fr); } }
@media(max-width:640px)  { .em-grid-4,.em-grid-3,.em-grid-2 { grid-template-columns: 1fr; } }

/* ═══════════════════════════════════════════════
   TYPOGRAPHY
   ═══════════════════════════════════════════════ */
.em-label {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 800; letter-spacing: 1px;
  padding: 6px 16px; border-radius: 50px; margin-bottom: 14px;
}
.em-label-blue  { background: rgba(0,167,212,.12); color: var(--em-primary); }
.em-label-pink  { background: rgba(211,0,113,.12); color: var(--em-accent); }
.em-label-green { background: rgba(122,156,89,.12); color: var(--em-green); }

.em-title {
  font-family: var(--em-font) !important;
  font-weight: 900 !important;
  font-size: clamp(28px, 3.5vw, 48px) !important;
  color: var(--em-dark) !important;
  line-height: 1.2 !important;
  margin: 0 0 14px !important;
}
.em-title-white { color: #fff !important; }
.em-title span  { color: var(--em-primary); }

.em-sub {
  font-size: 17px; color: var(--em-gray);
  line-height: 1.85; max-width: 600px;
}
.em-center { text-align: center; }
.em-center .em-sub { margin: 0 auto; }

/* ═══════════════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════════════ */
.em-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 13px 30px; border-radius: var(--em-radius-btn);
  font-family: var(--em-font); font-weight: 800; font-size: 15px;
  text-decoration: none; cursor: pointer; border: 2px solid transparent;
  transition: all 0.25s; line-height: 1;
}
.em-btn-primary {
  background: var(--em-primary); color: #fff;
  box-shadow: 0 4px 14px rgba(0,167,212,.3);
}
.em-btn-primary:hover { background: #0090b5; color: #fff; transform: translateY(-1px); }

.em-btn-accent {
  background: var(--em-accent); color: #fff;
  box-shadow: 0 4px 14px rgba(211,0,113,.3);
}
.em-btn-accent:hover { background: #b5005f; color: #fff; transform: translateY(-1px); }

.em-btn-ghost {
  background: transparent; color: #fff;
  border-color: rgba(255,255,255,.45);
}
.em-btn-ghost:hover { background: rgba(255,255,255,.1); color: #fff; }

.em-btn-outline {
  background: transparent; color: var(--em-primary);
  border-color: var(--em-primary);
}
.em-btn-outline:hover { background: var(--em-primary); color: #fff; }

.em-btn-lg { padding: 15px 36px; font-size: 17px; }

/* ═══════════════════════════════════════════════
   CARDS
   ═══════════════════════════════════════════════ */
.em-card {
  background: var(--em-white);
  border: 1.5px solid var(--em-beige);
  border-radius: var(--em-radius);
  padding: 28px 24px;
  transition: all 0.3s;
  position: relative; overflow: hidden;
}
.em-card::before {
  content: ''; position: absolute; top: 0; right: 0;
  width: 100%; height: 3px; background: var(--em-primary);
  transform: scaleX(0); transform-origin: right; transition: transform 0.3s;
}
.em-card:hover { transform: translateY(-6px); box-shadow: 0 16px 48px rgba(0,0,0,.09); border-color: transparent; }
.em-card:hover::before { transform: scaleX(1); }

.em-card-icon {
  width: 52px; height: 52px; border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px; margin-bottom: 16px; flex-shrink: 0;
}
.em-icon-blue  { background: rgba(0,167,212,.12); }
.em-icon-pink  { background: rgba(211,0,113,.12); }
.em-icon-green { background: rgba(122,156,89,.12); }
.em-icon-beige { background: rgba(228,212,181,.35); }

/* ═══════════════════════════════════════════════
   HERO
   ═══════════════════════════════════════════════ */
.em-hero {
  background: linear-gradient(135deg, var(--em-dark) 0%, #001828 100%);
  min-height: 650px; display: flex; align-items: center;
  position: relative; overflow: hidden; padding: 80px 0;
}
.em-hero::before {
  content: ''; position: absolute; top: -150px; left: -100px;
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(0,167,212,.14) 0%, transparent 65%);
  pointer-events: none;
}
.em-hero::after {
  content: ''; position: absolute; bottom: -80px; right: -80px;
  width: 400px; height: 400px;
  background: radial-gradient(circle, rgba(211,0,113,.1) 0%, transparent 65%);
  pointer-events: none;
}
.em-hero-inner {
  position: relative; z-index: 2;
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 4rem; align-items: center;
}
@media(max-width:900px) {
  .em-hero-inner { grid-template-columns: 1fr; }
  .em-hero-mockup { display: none; }
}
.em-hero-tag {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(0,167,212,.15); border: 1px solid rgba(0,167,212,.35);
  color: var(--em-primary); padding: 7px 18px; border-radius: 50px;
  font-size: 13px; font-weight: 700; margin-bottom: 1.5rem;
}
.em-hero-title {
  font-family: var(--em-font) !important;
  font-weight: 900 !important;
  font-size: clamp(38px, 5vw, 66px) !important;
  color: #fff !important; line-height: 1.2 !important;
  margin: 0 0 1.25rem !important;
}
.em-hero-sub {
  font-size: 18px; color: rgba(255,255,255,.72);
  line-height: 1.9; margin-bottom: 2.25rem;
}
.em-hero-btns { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 2rem; }
.em-hero-stats {
  display: flex; gap: 0; border-top: 1px solid rgba(255,255,255,.1);
  padding-top: 1.5rem;
}
.em-hero-stat {
  flex: 1; text-align: center; padding: 0 20px;
  border-left: 1px solid rgba(255,255,255,.1);
}
.em-hero-stat:last-child { border: none; }
.em-hero-stat-num { font-size: 26px; font-weight: 900; color: #fff; }
.em-hero-stat-num span { color: var(--em-primary); }
.em-hero-stat-label { font-size: 12px; color: rgba(255,255,255,.45); margin-top: 2px; }

/* ═══════════════════════════════════════════════
   HERO DASHBOARD MOCKUP
   ═══════════════════════════════════════════════ */
.em-mockup-wrap { position: relative; }
.em-mockup-float {
  position: absolute; background: #fff; border-radius: 12px;
  padding: 10px 16px; font-size: 12px;
  box-shadow: 0 8px 32px rgba(0,0,0,.25);
  display: flex; align-items: center; gap: 8px; white-space: nowrap; z-index: 3;
  animation: em-float 3s ease-in-out infinite;
}
.em-mockup-float-1 { top: -12px; right: -16px; animation-delay: 0s; }
.em-mockup-float-2 { bottom: 40px; left: -20px; animation-delay: 1.5s; }
@keyframes em-float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }

/* ═══════════════════════════════════════════════
   TRUST / MARQUEE
   ═══════════════════════════════════════════════ */
.em-trust-bar {
  background: var(--em-white);
  border-top: 1px solid var(--em-beige);
  border-bottom: 1px solid var(--em-beige);
  padding: 18px 0; overflow: hidden;
}
.em-marquee-track { overflow: hidden; }
.em-marquee {
  display: flex; gap: 1.5rem; width: max-content;
  animation: em-marquee 22s linear infinite;
}
.em-marquee:hover { animation-play-state: paused; }
@keyframes em-marquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.em-logo-pill {
  background: var(--em-light); border: 1px solid var(--em-beige);
  border-radius: 8px; padding: 9px 22px;
  font-weight: 700; font-size: 13px; color: var(--em-gray);
  white-space: nowrap; display: flex; align-items: center; gap: 8px;
}

/* ═══════════════════════════════════════════════
   STATS SECTION
   ═══════════════════════════════════════════════ */
.em-stats-section {
  background: var(--em-dark); padding: 80px 0;
}
.em-stat-item { text-align: center; padding: 0 2rem; border-left: 1px solid rgba(255,255,255,.07); }
.em-stat-item:last-child { border: none; }
.em-stat-num {
  font-size: clamp(42px, 5.5vw, 68px);
  font-weight: 900; line-height: 1; margin-bottom: 8px;
}
.em-stat-label { font-size: 14px; color: rgba(255,255,255,.55); font-weight: 600; }

/* ═══════════════════════════════════════════════
   PRICING CARDS
   ═══════════════════════════════════════════════ */
.em-price-card {
  background: var(--em-white); border-radius: var(--em-radius);
  border: 1.5px solid var(--em-beige); overflow: hidden;
  transition: all 0.3s; position: relative; display: flex; flex-direction: column;
}
.em-price-card:hover { transform: translateY(-4px); box-shadow: 0 20px 56px rgba(0,0,0,.1); }
.em-price-card.em-featured {
  transform: scale(1.04) translateY(0);
  border-color: var(--em-primary);
  box-shadow: 0 20px 56px rgba(0,167,212,.18);
}
.em-price-card.em-featured:hover { transform: scale(1.04) translateY(-4px); }

.em-price-head { padding: 26px 24px 20px; position: relative; }
.em-ph-eco  { background: var(--em-beige); }
.em-ph-mkt  { background: linear-gradient(135deg, var(--em-primary), #006e90); }
.em-ph-com  { background: var(--em-dark); }
.em-ph-pro  { background: linear-gradient(135deg, var(--em-accent), #7a0040); }

.em-price-badge {
  position: absolute; top: 14px; left: 14px;
  background: var(--em-accent); color: #fff;
  font-size: 11px; font-weight: 800;
  padding: 4px 10px; border-radius: 20px;
}
.em-price-name   { font-size: 14px; font-weight: 800; margin-bottom: 10px; }
.em-price-amount { font-size: 46px; font-weight: 900; line-height: 1; }
.em-price-period { font-size: 13px; opacity: .7; margin-top: 4px; }

.em-price-body { padding: 20px 24px 26px; flex: 1; display: flex; flex-direction: column; }
.em-features {
  list-style: none; margin: 0 0 22px; padding: 0; flex: 1;
}
.em-features li {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 13px; color: var(--em-gray);
  padding: 7px 0; border-bottom: 1px solid var(--em-beige);
}
.em-features li:last-child { border: none; }
.em-check { font-weight: 900; flex-shrink: 0; font-size: 14px; }

/* ═══════════════════════════════════════════════
   SERVICES GRID
   ═══════════════════════════════════════════════ */
.em-service-card {
  background: var(--em-white); border: 1.5px solid var(--em-beige);
  border-radius: var(--em-radius); padding: 28px 22px;
  transition: all 0.3s; position: relative; overflow: hidden;
}
.em-service-card::after {
  content: ''; position: absolute; bottom: 0; right: 0;
  width: 80px; height: 80px;
  background: radial-gradient(circle at 100% 100%, rgba(0,167,212,.06) 0%, transparent 70%);
}
.em-service-card:hover { transform: translateY(-5px); box-shadow: 0 14px 44px rgba(0,0,0,.09); border-color: var(--em-primary); }
.em-service-title { font-size: 16px; font-weight: 800; color: var(--em-dark); margin-bottom: 8px; }
.em-service-desc  { font-size: 13px; color: var(--em-gray); line-height: 1.75; }

/* ═══════════════════════════════════════════════
   SPLIT SECTIONS
   ═══════════════════════════════════════════════ */
.em-split { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center; }
@media(max-width:768px) { .em-split { grid-template-columns: 1fr; } }
.em-feature-list { list-style: none; margin: 1.5rem 0; padding: 0; }
.em-feature-list li {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 0; border-bottom: 1px solid var(--em-beige);
  font-size: 15px; color: var(--em-gray); font-weight: 600;
}
.em-feature-list li:last-child { border: none; }
.em-feature-list li::before { content: '✓'; color: var(--em-green); font-weight: 900; flex-shrink: 0; }

/* ═══════════════════════════════════════════════
   TESTIMONIALS
   ═══════════════════════════════════════════════ */
.em-testi {
  background: var(--em-white); border: 1.5px solid var(--em-beige);
  border-radius: var(--em-radius); padding: 28px;
  transition: all 0.3s;
}
.em-testi:hover { transform: translateY(-4px); box-shadow: 0 14px 44px rgba(0,0,0,.08); }
.em-testi-quote { font-size: 50px; color: var(--em-primary); line-height: 1; font-family: Georgia,serif; }
.em-testi-text  { font-size: 14px; color: var(--em-gray); line-height: 1.85; margin: 10px 0 20px; }
.em-testi-badge {
  background: rgba(122,156,89,.12); color: var(--em-green);
  border: 1px solid rgba(122,156,89,.25);
  padding: 3px 12px; border-radius: 20px; font-size: 11px; font-weight: 800;
}
.em-avatar {
  width: 42px; height: 42px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 900; font-size: 16px; flex-shrink: 0;
}

/* ═══════════════════════════════════════════════
   FINAL CTA
   ═══════════════════════════════════════════════ */
.em-cta-section {
  background: linear-gradient(135deg, #060d1a 0%, #001828 100%);
  padding: 120px 0; text-align: center; position: relative; overflow: hidden;
}
.em-cta-section::before {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 700px; height: 700px;
  background: radial-gradient(circle, rgba(0,167,212,.1) 0%, transparent 65%);
  pointer-events: none;
}

/* ═══════════════════════════════════════════════
   SOCIAL BUTTONS
   ═══════════════════════════════════════════════ */
.em-social {
  width: 38px; height: 38px; border-radius: 10px;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
  display: inline-flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.5); text-decoration: none;
  transition: all 0.25s; font-size: 14px;
}
.em-social:hover { background: var(--em-primary) !important; color: #fff !important; border-color: var(--em-primary) !important; }

/* ═══════════════════════════════════════════════
   MINI HERO (inner pages)
   ═══════════════════════════════════════════════ */
.em-mini-hero {
  background: linear-gradient(135deg, var(--em-dark) 0%, #001828 100%);
  padding: 60px 0 50px; text-align: center;
  position: relative; overflow: hidden;
}
.em-mini-hero::before {
  content: ''; position: absolute; top: -80px; left: 50%;
  transform: translateX(-50%);
  width: 600px; height: 300px;
  background: radial-gradient(ellipse, rgba(0,167,212,.12) 0%, transparent 70%);
  pointer-events: none;
}
.em-breadcrumb {
  display: flex; align-items: center; gap: 8px; justify-content: center;
  font-size: 13px; color: rgba(255,255,255,.45); margin-top: 12px;
}
.em-breadcrumb a { color: rgba(255,255,255,.55); text-decoration: none; }
.em-breadcrumb a:hover { color: var(--em-primary); }

/* ═══════════════════════════════════════════════
   CONTACT PAGE
   ═══════════════════════════════════════════════ */
.em-contact-form input,
.em-contact-form textarea,
.em-contact-form select {
  width: 100%; padding: 12px 16px;
  border: 1.5px solid var(--em-beige); border-radius: var(--em-radius);
  font-size: 15px; font-family: var(--em-font); direction: rtl;
  transition: border-color 0.2s; outline: none;
  background: var(--em-white); color: var(--em-dark);
  margin-bottom: 16px;
}
.em-contact-form input:focus,
.em-contact-form textarea:focus { border-color: var(--em-primary); }
.em-contact-form label {
  display: block; font-size: 13px; font-weight: 700;
  color: var(--em-dark); margin-bottom: 6px;
}

/* ═══════════════════════════════════════════════
   SCROLL REVEAL
   ═══════════════════════════════════════════════ */
.em-reveal { opacity: 0; transform: translateY(22px); transition: opacity .6s ease, transform .6s ease; }
.em-reveal.visible { opacity: 1; transform: none; }
.em-d1 { transition-delay: .1s; } .em-d2 { transition-delay: .2s; }
.em-d3 { transition-delay: .3s; } .em-d4 { transition-delay: .4s; }

/* ═══════════════════════════════════════════════
   CREDENTIALS (About page)
   ═══════════════════════════════════════════════ */
.em-cred-card {
  background: var(--em-white); border: 1.5px solid var(--em-beige);
  border-radius: var(--em-radius); padding: 22px 20px;
  text-align: center; transition: all 0.3s;
}
.em-cred-card:hover { border-color: var(--em-primary); transform: translateY(-3px); }
.em-cred-icon { font-size: 28px; margin-bottom: 10px; }
.em-cred-title { font-size: 14px; font-weight: 800; color: var(--em-dark); margin-bottom: 4px; }
.em-cred-num   { font-size: 13px; color: var(--em-primary); font-weight: 700; font-family: monospace; }

/* ═══════════════════════════════════════════════
   ADMIN DASHBOARD STYLES
   ═══════════════════════════════════════════════ */
.em-admin-wrap { max-width: 1100px; margin: 24px auto; font-family: 'Cairo',sans-serif; padding: 0 10px; }
.em-admin-head {
  background: linear-gradient(135deg, #0F172A, #001828);
  border-radius: 12px; padding: 24px 28px; margin-bottom: 20px;
  display: flex; align-items: center; justify-content: space-between;
}
.em-admin-head h1 { color: #fff; font-size: 22px; margin: 0; font-family: 'Cairo',sans-serif; }
.em-admin-head h1 span { color: #00A7D4; }
.em-admin-head p  { color: rgba(255,255,255,.4); font-size: 12px; margin: 4px 0 0; }
.em-admin-badge {
  background: rgba(0,167,212,.15); border: 1px solid #00A7D4;
  color: #00A7D4; padding: 5px 14px; border-radius: 20px;
  font-size: 12px; font-weight: 700;
}
.em-admin-nav {
  display: flex; gap: 4px; margin-bottom: 20px;
  background: #f0f0f1; border-radius: 10px; padding: 4px; flex-wrap: wrap;
}
.em-admin-tab {
  flex: 1; min-width: 100px; padding: 9px 14px; border-radius: 8px;
  border: none; background: transparent; cursor: pointer;
  font-size: 13px; font-weight: 700; color: #777; transition: all .2s;
  text-decoration: none; display: block; text-align: center;
  font-family: 'Cairo',sans-serif;
}
.em-admin-tab.active, .em-admin-tab:hover {
  background: #fff; color: #0F172A;
  box-shadow: 0 2px 8px rgba(0,0,0,.08); text-decoration: none;
}
.em-admin-card {
  background: #fff; border: 1px solid #e5e7eb;
  border-radius: 12px; padding: 22px; margin-bottom: 18px;
}
.em-admin-card h3 {
  font-size: 15px; font-weight: 800; color: #0F172A;
  margin: 0 0 16px; padding-bottom: 12px;
  border-bottom: 2px solid #00A7D4;
  font-family: 'Cairo',sans-serif;
}
.em-f { margin-bottom: 14px; }
.em-f label { display: block; font-size: 13px; font-weight: 700; color: #374151; margin-bottom: 5px; }
.em-f input[type=text], .em-f input[type=url], .em-f input[type=email],
.em-f textarea, .em-f select {
  width: 100%; padding: 9px 12px; border: 1.5px solid #e5e7eb;
  border-radius: 8px; font-size: 13px; font-family: 'Cairo',sans-serif;
  transition: border-color .2s; outline: none; direction: rtl;
}
.em-f input:focus, .em-f textarea:focus, .em-f select:focus { border-color: #00A7D4; }
.em-f input[type=color] { width: 48px; height: 38px; padding: 3px; border: 1.5px solid #e5e7eb; border-radius: 8px; cursor: pointer; }
.em-color-row { display: flex; align-items: center; gap: 8px; }
.em-color-row input[type=text] { flex: 1; }
.em-color-dot { width: 32px; height: 32px; border-radius: 8px; border: 2px solid #e5e7eb; flex-shrink: 0; }
.em-toggle { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; cursor: pointer; }
.em-toggle input { width: 16px; height: 16px; cursor: pointer; }
.em-toggle label { font-size: 14px; font-weight: 600; color: #374151; cursor: pointer; }
.em-g2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.em-g3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; }
.em-save-btn {
  background: linear-gradient(135deg, #00A7D4, #007fa0);
  color: #fff; border: none; padding: 12px 30px;
  border-radius: 10px; font-size: 15px; font-weight: 800;
  cursor: pointer; transition: all .25s; font-family: 'Cairo',sans-serif;
  box-shadow: 0 4px 14px rgba(0,167,212,.3);
}
.em-save-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(0,167,212,.4); }
.em-color-swatches { display: flex; gap: 8px; flex-wrap: wrap; padding: 14px; background: #0F172A; border-radius: 10px; margin-top: 12px; }
.em-swatch { width: 36px; height: 36px; border-radius: 8px; border: 2px solid rgba(255,255,255,.15); cursor: pointer; transition: transform .2s; }
.em-swatch:hover { transform: scale(1.15); }
.notice-success { border-right: 4px solid #00A7D4 !important; }

@media(max-width:782px) {
  .em-g2,.em-g3 { grid-template-columns: 1fr; }
  .em-admin-nav .em-admin-tab { flex: unset; }
}

/* ════════════════════════════════════════════════════════
   HEADER
   ════════════════════════════════════════════════════════ */
.em-header {
    position: sticky;
    top: 0;
    z-index: 9999;
    background: rgba(255,255,255,0.97);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--em-beige);
    transition: box-shadow .3s;
    width: 100%;
}
.em-header.em-scrolled { box-shadow: 0 4px 32px rgba(0,0,0,.08); }
.em-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 76px;
    gap: 20px;
}
.em-header-logo { text-decoration: none; display: flex; align-items: center; flex-shrink: 0; }
.em-header-nav { display: flex; align-items: center; gap: 2rem; }
.em-nav-link {
    font-size: 14px; font-weight: 700;
    color: var(--em-dark); text-decoration: none;
    transition: color .2s; position: relative; padding-bottom: 2px;
}
.em-nav-link:hover, .em-nav-active { color: var(--em-primary); }
.em-nav-active::after {
    content: ''; position: absolute; bottom: -4px; right: 0; left: 0;
    height: 2px; background: var(--em-primary); border-radius: 2px;
}
.em-header-actions { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.em-btn-ghost-sm {
    font-size: 14px; font-weight: 700; color: #64748B; text-decoration: none;
    padding: 8px 16px; border-radius: var(--em-radius-btn);
    border: 1.5px solid var(--em-beige); transition: all .2s;
    font-family: var(--em-font), sans-serif;
}
.em-btn-ghost-sm:hover { border-color: var(--em-primary); color: var(--em-primary); }
/* Mobile */
.em-mobile-toggle {
    display: none; flex-direction: column; gap: 5px;
    background: none; border: none; cursor: pointer; padding: 4px;
}
.em-mobile-toggle span { display: block; width: 24px; height: 2px; background: var(--em-dark); border-radius: 2px; transition: .3s; }
.em-mobile-menu {
    display: none; flex-direction: column;
    background: #fff; border-top: 1px solid var(--em-beige);
}
.em-mobile-menu.open { display: flex; }
.em-mobile-link {
    padding: 14px 20px; font-size: 15px; font-weight: 700;
    color: var(--em-dark); text-decoration: none;
    border-bottom: 1px solid var(--em-beige);
}
.em-mobile-link:hover { color: var(--em-primary); background: var(--em-light); }
@media (max-width: 900px) {
    .em-header-nav { display: none; }
    .em-mobile-toggle { display: flex; }
    .em-header-actions .em-btn-ghost-sm { display: none; }
}
@media (max-width: 480px) {
    .em-header-actions { display: none; }
}

/* ════════════════════════════════════════════════════════
   FOOTER
   ════════════════════════════════════════════════════════ */
.em-footer {
    background: var(--em-dark);
    color: rgba(255,255,255,.75);
    padding: 64px 0 0;
    font-family: var(--em-font), sans-serif;
}
.em-footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 48px;
    padding-bottom: 48px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}
.em-footer-tagline { color: rgba(255,255,255,.4); font-size: 14px; line-height: 1.8; margin-bottom: 8px; }
.em-footer-company { color: rgba(255,255,255,.2); font-size: 12px; margin-bottom: 20px; }
.em-footer-social { display: flex; gap: 8px; flex-wrap: wrap; }
.em-footer-col-title {
    font-size: 13px; font-weight: 800; color: rgba(255,255,255,.9);
    margin-bottom: 16px; letter-spacing: .5px;
}
.em-footer-link {
    display: block; font-size: 13px; color: rgba(255,255,255,.45);
    text-decoration: none; margin-bottom: 10px; transition: color .2s;
}
.em-footer-link:hover { color: var(--em-primary); }
.em-footer-contact-row {
    display: flex; align-items: flex-start; gap: 10px;
    font-size: 13px; color: rgba(255,255,255,.45); margin-bottom: 12px;
}
.em-footer-contact-row a { color: rgba(255,255,255,.45); text-decoration: none; transition: color .2s; }
.em-footer-contact-row a:hover { color: var(--em-primary); }
.em-footer-contact-row span:first-child { flex-shrink: 0; }
.em-footer-wa-btn {
    display: inline-flex; align-items: center; gap: 8px;
    background: #25D366; color: #fff; padding: 10px 18px;
    border-radius: var(--em-radius-btn); font-size: 13px; font-weight: 700;
    text-decoration: none; margin-top: 8px; transition: opacity .2s;
}
.em-footer-wa-btn:hover { opacity: .88; }
.em-footer-bottom {
    display: flex; justify-content: space-between; align-items: center;
    padding: 20px 0; font-size: 12px; color: rgba(255,255,255,.25);
    flex-wrap: wrap; gap: 10px;
}
@media (max-width: 768px) {
    .em-footer-grid { grid-template-columns: 1fr; gap: 32px; }
    .em-footer-bottom { flex-direction: column; align-items: flex-start; }
}

/* ════════════════════════════════════════════════════════
   PAGE WRAP — Reset أي Padding/Margin بتاع WoodMart
   ════════════════════════════════════════════════════════ */
.emole-full-page .site-header,
.emole-full-page .woodmart-sticky-header,
.emole-full-page #header,
.emole-full-page .header-main { display: none !important; }

.emole-full-page .site-footer,
.emole-full-page #footer,
.emole-full-page .footer-container { display: none !important; }

.emole-full-page #page,
.emole-full-page .site,
.emole-full-page main,
.emole-full-page .main-page-wrapper { padding: 0 !important; margin: 0 !important; }

#emole-page-wrap { min-height: 60vh; }

/* ════════════════════════════════════════════════════════════════
   WOOCOMMERCE — SHOP & PRODUCTS
   ════════════════════════════════════════════════════════════════ */

/* Shop Hero */
.em-shop-hero {
    background: var(--em-dark);
    padding: 60px 0 40px;
    position: relative;
    overflow: hidden;
}
.em-shop-hero::before {
    content: '';
    position: absolute; inset: 0;
    background: radial-gradient(ellipse 70% 80% at 30% 50%, rgba(0,167,212,.15), transparent);
    pointer-events: none;
}
.em-shop-hero-title {
    font-size: clamp(24px,3vw,40px);
    font-weight: 900;
    color: #fff;
    margin: 0 0 10px;
    font-family: var(--em-font), sans-serif;
}

/* Layout */
.em-shop-layout {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 32px;
    padding: 40px 0 64px;
    align-items: start;
}
@media(max-width:900px){
    .em-shop-layout { grid-template-columns: 1fr; }
    .em-shop-sidebar { order: 2; }
    .em-shop-content { order: 1; }
}

/* Sidebar */
.em-shop-sidebar { position: sticky; top: 96px; }
.em-shop-widget {
    background: #fff;
    border: 1px solid var(--em-beige);
    border-radius: var(--em-radius);
    padding: 20px;
    margin-bottom: 16px;
}
.em-shop-widget-title {
    font-size: 13px;
    font-weight: 800;
    color: var(--em-dark);
    margin-bottom: 14px;
    letter-spacing: .3px;
    text-transform: uppercase;
}
.em-shop-cats { list-style: none; margin: 0; padding: 0; }
.em-shop-cat-link {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 12px;
    border-radius: calc(var(--em-radius) - 4px);
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    color: var(--em-gray);
    transition: all .2s;
    margin-bottom: 4px;
}
.em-shop-cat-link:hover,
.em-shop-cat-link.active {
    background: rgba(0,167,212,.08);
    color: var(--em-primary);
}
.em-cat-count {
    margin-right: auto;
    background: var(--em-light);
    color: var(--em-gray);
    font-size: 11px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 20px;
}
.em-shop-cat-link.active .em-cat-count {
    background: rgba(0,167,212,.15);
    color: var(--em-primary);
}
.em-cat-thumb { width: 24px; height: 24px; border-radius: 6px; overflow: hidden; flex-shrink: 0; }
.em-cat-thumb img { width: 100%; height: 100%; object-fit: cover; }

/* Search */
.em-shop-search-wrap { display: flex; gap: 8px; }
.em-shop-search-wrap input[type="search"] {
    flex: 1; padding: 9px 14px; border: 1px solid var(--em-beige);
    border-radius: var(--em-radius-btn); font-family: var(--em-font),sans-serif;
    font-size: 13px; outline: none; transition: border-color .2s;
}
.em-shop-search-wrap input:focus { border-color: var(--em-primary); }
.em-shop-search-wrap button {
    padding: 9px 14px; background: var(--em-primary); color: #fff;
    border: none; border-radius: var(--em-radius-btn); cursor: pointer;
    font-size: 14px;
}

/* Price Filter */
.em-price-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.em-price-field label { display: block; font-size: 11px; color: var(--em-gray); margin-bottom: 4px; font-weight: 700; }
.em-price-field input {
    width: 100%; padding: 8px 10px; border: 1px solid var(--em-beige);
    border-radius: calc(var(--em-radius-btn) - 2px); font-family: var(--em-font),sans-serif;
    font-size: 13px; box-sizing: border-box;
}

/* Toolbar */
.em-shop-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    background: #fff;
    border: 1px solid var(--em-beige);
    border-radius: var(--em-radius);
    margin-bottom: 24px;
    flex-wrap: wrap;
    gap: 12px;
}
.em-shop-result-count { font-size: 13px; color: var(--em-gray); font-weight: 600; }
.woocommerce-ordering select {
    padding: 8px 14px; border: 1px solid var(--em-beige);
    border-radius: var(--em-radius-btn); font-family: var(--em-font),sans-serif;
    font-size: 13px; cursor: pointer; outline: none;
}

/* Products Grid */
ul.em-products-grid {
    list-style: none; margin: 0; padding: 0;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
@media(max-width:1100px){ ul.em-products-grid { grid-template-columns: repeat(2,1fr); } }
@media(max-width:600px){  ul.em-products-grid { grid-template-columns: 1fr; } }

/* Product Card */
li.em-product-card {
    background: #fff;
    border: 1px solid var(--em-beige);
    border-radius: var(--em-radius);
    overflow: hidden;
    transition: box-shadow .25s, transform .25s;
    position: relative;
}
li.em-product-card:hover {
    box-shadow: 0 8px 32px rgba(0,0,0,.1);
    transform: translateY(-3px);
}
.em-product-inner { display: flex; flex-direction: column; height: 100%; }
.em-product-img-wrap {
    display: block;
    position: relative;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    background: var(--em-light);
}
.em-product-img-wrap img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform .4s;
    display: block;
}
li.em-product-card:hover .em-product-img-wrap img { transform: scale(1.05); }

/* Badges */
.em-product-badges {
    position: absolute; top: 10px; right: 10px;
    display: flex; flex-direction: column; gap: 6px;
    z-index: 2;
}
.em-badge {
    padding: 3px 10px; border-radius: 20px;
    font-size: 11px; font-weight: 800;
    font-family: var(--em-font), sans-serif;
    display: inline-block;
}
.em-badge-sale  { background: var(--em-accent); color: #fff; }
.em-badge-new   { background: var(--em-primary); color: #fff; }
.em-badge-out   { background: #94a3b8; color: #fff; }

/* Quick Actions Overlay */
.em-product-actions {
    position: absolute; bottom: 0; left: 0; right: 0;
    display: flex; gap: 8px; padding: 12px;
    background: linear-gradient(to top, rgba(15,23,42,.7), transparent);
    transform: translateY(100%);
    transition: transform .3s;
    justify-content: center;
    z-index: 3;
}
li.em-product-card:hover .em-product-actions { transform: translateY(0); }
.em-product-actions .button,
.em-product-actions .em-product-atc {
    background: var(--em-accent) !important;
    color: #fff !important;
    border: none !important;
    padding: 9px 18px !important;
    border-radius: var(--em-radius-btn) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    font-family: var(--em-font), sans-serif !important;
    cursor: pointer;
    transition: opacity .2s !important;
    text-decoration: none !important;
    flex: 1;
    text-align: center;
}
.em-product-actions .button:hover { opacity: .88 !important; }
.em-product-view {
    display: flex; align-items: center; justify-content: center;
    width: 36px; height: 36px;
    background: rgba(255,255,255,.15);
    border-radius: 50%;
    color: #fff;
    text-decoration: none;
    transition: background .2s;
    flex-shrink: 0;
}
.em-product-view:hover { background: rgba(255,255,255,.3); }

/* Product Info */
.em-product-info { padding: 16px; flex: 1; display: flex; flex-direction: column; gap: 6px; }
.em-product-cat {
    font-size: 11px; font-weight: 700; color: var(--em-primary);
    text-transform: uppercase; letter-spacing: .3px;
}
.em-product-title {
    margin: 0;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.45;
    color: var(--em-dark);
}
.em-product-title a { color: inherit; text-decoration: none; transition: color .2s; }
.em-product-title a:hover { color: var(--em-primary); }
.em-product-rating { display: flex; align-items: center; gap: 2px; }
.em-star { color: #d1d5db; font-size: 13px; }
.em-star.filled { color: #f59e0b; }
.em-rating-count { font-size: 11px; color: var(--em-gray); margin-right: 4px; }
.em-product-bottom {
    display: flex; align-items: center;
    justify-content: space-between;
    gap: 10px; margin-top: auto; padding-top: 10px;
    border-top: 1px solid var(--em-beige);
}
.em-product-price { font-size: 16px; font-weight: 900; color: var(--em-dark); }
.em-product-price ins { text-decoration: none; color: var(--em-accent); }
.em-product-price del { font-size: 12px; color: #94a3b8; font-weight: 400; }
.em-product-bottom .button,
.em-product-bottom .em-atc-btn {
    display: inline-flex; align-items: center;
    background: var(--em-dark); color: #fff;
    border: none; border-radius: var(--em-radius-btn);
    padding: 8px 14px; font-size: 12px; font-weight: 800;
    font-family: var(--em-font), sans-serif;
    cursor: pointer; text-decoration: none;
    transition: background .2s; white-space: nowrap;
}
.em-product-bottom .button:hover { background: var(--em-primary); color: #fff; }
.em-out-label { font-size: 12px; color: #94a3b8; font-weight: 700; }

/* Pagination */
.em-shop-pagination { margin-top: 40px; display: flex; justify-content: center; }
.woocommerce-pagination ul {
    list-style: none; margin: 0; padding: 0;
    display: flex; gap: 8px; flex-wrap: wrap; justify-content: center;
}
.woocommerce-pagination li a,
.woocommerce-pagination li span {
    display: flex; align-items: center; justify-content: center;
    width: 40px; height: 40px;
    border: 1px solid var(--em-beige);
    border-radius: var(--em-radius-btn);
    font-size: 14px; font-weight: 700;
    color: var(--em-dark); text-decoration: none;
    transition: all .2s;
}
.woocommerce-pagination li a:hover { border-color: var(--em-primary); color: var(--em-primary); }
.woocommerce-pagination li span.current {
    background: var(--em-primary); border-color: var(--em-primary); color: #fff;
}

/* Empty State */
.em-shop-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 80px 20px;
    color: var(--em-gray);
}
.em-shop-empty h3 { font-size: 20px; font-weight: 800; color: var(--em-dark); margin-bottom: 8px; }

/* ════════════════════════════════════════════════════════════════
   SINGLE PRODUCT PAGE
   ════════════════════════════════════════════════════════════════ */
.em-single-product-page { padding: 40px 0 80px; }

.woocommerce div.product {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: start;
    font-family: var(--em-font), sans-serif;
    direction: rtl;
}
@media(max-width:768px){
    .woocommerce div.product { grid-template-columns: 1fr; gap: 24px; }
}

/* Product gallery */
.woocommerce div.product .woocommerce-product-gallery {
    border-radius: var(--em-radius);
    overflow: hidden;
    position: sticky;
    top: 96px;
}
.woocommerce div.product .woocommerce-product-gallery img { border-radius: var(--em-radius); }

/* Product summary */
.woocommerce div.product .summary {
    display: flex; flex-direction: column; gap: 16px;
}
.woocommerce div.product .summary .product_title {
    font-size: clamp(22px,3vw,36px);
    font-weight: 900;
    color: var(--em-dark);
    margin: 0;
    line-height: 1.3;
}
.woocommerce div.product .summary .price {
    font-size: 28px; font-weight: 900; color: var(--em-primary);
}
.woocommerce div.product .summary .price ins { text-decoration: none; }
.woocommerce div.product .summary .price del { font-size: 16px; color: #94a3b8; font-weight: 400; margin-left: 8px; }
.woocommerce div.product .summary .woocommerce-product-rating { display: flex; align-items: center; gap: 8px; }
.woocommerce div.product .summary .woocommerce-review-link { font-size: 13px; color: var(--em-gray); text-decoration: none; }
.woocommerce div.product .summary .product_meta { font-size: 13px; color: var(--em-gray); }
.woocommerce div.product .summary .product_meta a { color: var(--em-primary); text-decoration: none; }

/* Add to cart */
.woocommerce div.product form.cart { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.woocommerce div.product form.cart .qty {
    width: 70px; padding: 12px; border: 2px solid var(--em-beige);
    border-radius: var(--em-radius-btn); font-size: 16px; font-weight: 700;
    text-align: center; font-family: var(--em-font), sans-serif;
    transition: border-color .2s;
}
.woocommerce div.product form.cart .qty:focus { border-color: var(--em-primary); outline: none; }
.woocommerce div.product form.cart .single_add_to_cart_button,
.woocommerce div.product form.cart button.button {
    flex: 1; padding: 14px 28px;
    background: var(--em-accent); color: #fff;
    border: none; border-radius: var(--em-radius-btn);
    font-size: 15px; font-weight: 900;
    font-family: var(--em-font), sans-serif;
    cursor: pointer; transition: opacity .2s;
}
.woocommerce div.product form.cart .single_add_to_cart_button:hover { opacity: .88; }

/* Tabs */
.woocommerce div.product .woocommerce-tabs {
    grid-column: 1 / -1;
    margin-top: 16px;
}
.woocommerce div.product .woocommerce-tabs ul.tabs {
    list-style: none; padding: 0; margin: 0 0 24px;
    display: flex; gap: 8px; border-bottom: 2px solid var(--em-beige);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
    margin: 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    display: block; padding: 10px 20px;
    font-size: 14px; font-weight: 700;
    color: var(--em-gray); text-decoration: none;
    border-radius: var(--em-radius-btn) var(--em-radius-btn) 0 0;
    transition: all .2s;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
    color: var(--em-primary);
    border-bottom: 2px solid var(--em-primary);
}
.woocommerce div.product .woocommerce-tabs .panel { padding: 24px; background: #fff; border-radius: var(--em-radius); border: 1px solid var(--em-beige); }

/* Related products */
.related.products { grid-column: 1 / -1; }
.related.products h2 {
    font-size: 22px; font-weight: 900; color: var(--em-dark);
    margin-bottom: 24px; font-family: var(--em-font), sans-serif;
}
.related.products ul.products {
    display: grid; grid-template-columns: repeat(4,1fr); gap: 16px;
    list-style: none; margin: 0; padding: 0;
}
@media(max-width:900px){ .related.products ul.products { grid-template-columns: repeat(2,1fr); } }

/* ════════════════════════════════════════════════════════════════
   CART & CHECKOUT — base styling
   ════════════════════════════════════════════════════════════════ */
.woocommerce-cart-form table,
.woocommerce-checkout-review-order table {
    width: 100%; border-collapse: collapse; font-family: var(--em-font), sans-serif;
}
.woocommerce-cart-form table th,
.woocommerce-cart-form table td {
    padding: 14px 16px; border-bottom: 1px solid var(--em-beige); font-size: 14px;
}
.woocommerce .cart-collaterals .cart_totals { background: #fff; border: 1px solid var(--em-beige); border-radius: var(--em-radius); padding: 24px; }
.woocommerce .wc-proceed-to-checkout .checkout-button,
.woocommerce #payment #place_order {
    background: var(--em-accent) !important; color: #fff !important;
    border: none !important; border-radius: var(--em-radius-btn) !important;
    padding: 14px 32px !important; font-size: 16px !important; font-weight: 900 !important;
    font-family: var(--em-font), sans-serif !important;
    cursor: pointer !important; width: 100% !important;
    display: block !important; text-align: center !important;
    text-decoration: none !important; transition: opacity .2s !important;
}
.woocommerce .wc-proceed-to-checkout .checkout-button:hover,
.woocommerce #payment #place_order:hover { opacity: .88 !important; }

/* ── Cart Notice Toast */
.em-cart-notice {
    position: fixed; bottom: 24px; left: 24px;
    background: var(--em-dark); color: #fff;
    padding: 12px 20px; border-radius: var(--em-radius-btn);
    font-size: 13px; font-weight: 700;
    font-family: var(--em-font), sans-serif;
    box-shadow: 0 8px 32px rgba(0,0,0,.25);
    z-index: 99999; opacity: 0; transform: translateY(10px);
    transition: all .3s; pointer-events: none;
}
.em-cart-notice.show { opacity: 1; transform: translateY(0); }

/* ── WC Notices */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
    border-radius: var(--em-radius) !important;
    font-family: var(--em-font), sans-serif !important;
    font-size: 14px !important;
    border-top: none !important;
    padding: 14px 20px !important;
}

/* Products shortcode grid */
.em-products-shortcode-grid {
    display: grid; gap: 20px;
}
.em-cols-4 { grid-template-columns: repeat(4,1fr); }
.em-cols-3 { grid-template-columns: repeat(3,1fr); }
.em-cols-2 { grid-template-columns: repeat(2,1fr); }
@media(max-width:1100px){ .em-cols-4 { grid-template-columns: repeat(3,1fr); } }
@media(max-width:800px){
    .em-cols-4,.em-cols-3 { grid-template-columns: repeat(2,1fr); }
}
@media(max-width:480px){
    .em-cols-4,.em-cols-3,.em-cols-2 { grid-template-columns: 1fr; }
}
.em-product-card-wrap {
    background:#fff; border:1px solid var(--em-beige);
    border-radius:var(--em-radius); overflow:hidden;
    transition:box-shadow .25s,transform .25s;
}
.em-product-card-wrap:hover {
    box-shadow:0 8px 32px rgba(0,0,0,.1);
    transform:translateY(-3px);
}

/* ══ KILL WoodMart SVG overrides inside emole sections ══ */
.emh-svc7-icon svg,
.emh-svc7-icon svg *,
#emole-page-wrap .emh-svc7-icon svg,
#emole-page-wrap .emh-svc7-icon svg path,
#emole-page-wrap .emh-svc7-icon svg circle,
#emole-page-wrap .emh-svc7-icon svg line,
#emole-page-wrap .emh-svc7-icon svg polyline,
#emole-page-wrap .emh-svc7-icon svg polygon {
    fill: none !important;
    stroke: #ffffff !important;
    max-width: 26px !important;
    max-height: 26px !important;
    width: 26px !important;
    height: 26px !important;
}
/* Kill WoodMart .wd-svg or .icon overrides */
.emh-svc7-icon .wd-svg,
.emh-svc7-icon .icon,
.emh-svc7-icon i {
    display: none !important;
}

/* ════════════════════════════════════════════════════════
   ADMIN — PRODUCT PICKER + ENHANCED UI (v2.2)
   ════════════════════════════════════════════════════════ */

/* Wider admin wrap */
.em-admin-wrap { max-width: 1200px !important; }

/* Stats bar at top of dashboard */
.em-admin-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 20px;
}
.em-admin-stat-box {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 16px 20px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.em-admin-stat-box .em-asb-icon {
  width: 42px; height: 42px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; flex-shrink: 0;
}
.em-admin-stat-box .em-asb-label {
  font-size: 11px; color: #64748B; font-weight: 700;
  text-transform: uppercase; letter-spacing: .4px; margin-bottom: 3px;
}
.em-admin-stat-box .em-asb-val {
  font-size: 20px; font-weight: 900; color: #0F172A; line-height: 1;
}

/* Improved cards */
.em-admin-card {
  box-shadow: 0 1px 4px rgba(0,0,0,.05) !important;
  transition: box-shadow .2s;
}
.em-admin-card:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,.07) !important;
}
.em-admin-card h3 {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px !important;
  letter-spacing: -.1px;
}

/* Product search results */
#emp-results > div:last-child { border-bottom: none !important; }
#emp-results::-webkit-scrollbar { width: 6px; }
#emp-results::-webkit-scrollbar-track { background: #f8fafc; }
#emp-results::-webkit-scrollbar-thumb { background: #e2e8f0; border-radius: 3px; }

/* Client logos grid responsive */
@media (max-width: 900px) {
  .em-admin-stats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .em-admin-stats { grid-template-columns: 1fr 1fr; }
}

/* Pulse animation for live indicator */
@keyframes em-pulse {
  0%, 100% { opacity: 1; } 50% { opacity: .4; }
}
.em-live-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #22c55e; display: inline-block;
  animation: em-pulse 1.6s ease-in-out infinite;
}

/* Enhanced head */
.em-admin-head {
  background: linear-gradient(135deg, #0a1628 0%, #0F172A 40%, #001a2e 100%) !important;
  border: 1px solid rgba(0,167,212,.15) !important;
  position: relative; overflow: hidden;
}
.em-admin-head::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 300px 200px at 10% 50%, rgba(0,167,212,.08), transparent),
    radial-gradient(ellipse 200px 150px at 90% 30%, rgba(211,0,113,.06), transparent);
  pointer-events: none;
}
.em-admin-head > * { position: relative; z-index: 1; }

/* Save bar */
.em-save-bar {
  position: sticky; bottom: 0;
  background: rgba(255,255,255,.96);
  backdrop-filter: blur(10px);
  border-top: 1px solid #e5e7eb;
  padding: 14px 22px;
  display: flex; align-items: center; gap: 16px;
  z-index: 100; border-radius: 0 0 12px 12px;
  margin: 16px -10px -10px;
}

/* ══════════════════════════════════════════════
   KILL WHITE GAPS — WoodMart overrides
   ══════════════════════════════════════════════ */
/* Remove WoodMart content area padding */
.emole-site .site-content,
.emole-site #content,
.emole-site .content-area,
.emole-site .wd-content-area,
.emole-site main#emole-main,
#emole-main {
    padding: 0 !important;
    margin: 0 !important;
}
/* Kill WoodMart page wrappers padding */
.emole-site .wd-page-wrapper,
.emole-site #page,
.emole-site .site,
.emole-site #emole-page-wrap {
    padding: 0 !important;
    margin: 0 !important;
}
/* Kill gap between sections */
.emh + .emh {
    margin-top: 0 !important;
}
/* No white flash between dark sections */
body.emole-site {
    background: #0F172A !important;
}
/* WoodMart injects a default white background on content */
.emole-site .wd-content,
.emole-site .entry-content,
.emole-site .page-content {
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ══════════════════════════════════════════════
   NUKE: WoodMart default footer widgets — hidden on all emole pages
   ══════════════════════════════════════════════ */
body.emole-site .wd-footer-widgets,
body.emole-site .woodmart-footer-widgets,
body.emole-site .footer-widgets,
body.emole-site #footer-widgets,
body.emole-site .wd-widgets-footer,
body.emole-site .widget-area,
body.emole-site #secondary,
body.emole-site aside.widget-area,
body.emole-site .site-footer .widget-area,
body.emole-site .wd-site-footer > *:not(#emole-footer),
body.emole-site footer:not(#emole-footer),
body.emole-site .site-footer:not(#emole-footer) {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
}
/* White line gap fix */
body.emole-site {
    background: #0F172A !important;
}
/* Kill any white border/divider WoodMart adds */
body.emole-site .wd-header-bottom,
body.emole-site .wd-page-wrapper > *:not(#emole-page-wrap) {
    display: none !important;
}

/* ══════════════════════════════════════════════════════
   SECTION DIVIDERS — animated colored lines between sections
   ══════════════════════════════════════════════════════ */

/* Kill ALL white borders/margins between sections */
.emh + .emh,
section.emh { margin: 0 !important; border: none !important; outline: none !important; }

/* ── Kill ALL section ::after dividers globally — inline CSS in shortcodes handles them ── */
.emh::after,
.emh:not(:last-child)::after {
    display: none !important;
    content: none !important;
}

/* Kill WoodMart white backgrounds that leak between sections */
body.emole-site .wd-page-wrapper,
body.emole-site .site-content,
body.emole-site #content,
body.emole-site .content-area,
body.emole-site main#emole-main,
body.emole-site .entry-content,
body.emole-site .page-content {
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
}
body.emole-site {
    background: #0F172A !important;
}

/* Kill widget areas completely */
body.emole-site .widget-area,
body.emole-site #secondary,
body.emole-site aside.widget-area,
body.emole-site .wd-footer-widgets,
body.emole-site .woodmart-footer-widgets,
body.emole-site section.widget,
body.emole-site .wp-block-widget-area,
body.emole-site [id*="widget"],
body.emole-site [class*="widget-area"] {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
    visibility: hidden !important;
    position: absolute !important;
    left: -9999px !important;
}

/* ── Global button shimmer on ALL em-btn ──────────────────────── */
.em-btn, .em-btn-accent, .em-btn-primary, .em-btn-ghost {
    position: relative !important;
    overflow: hidden !important;
    transition: transform .22s, box-shadow .22s !important;
}
.em-btn::before, .em-btn-accent::before, .em-btn-primary::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important; left: -100% !important;
    width: 60% !important; height: 100% !important;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.2), transparent) !important;
    transform: skewX(-15deg) !important;
    transition: left .5s !important;
    pointer-events: none !important;
}
.em-btn:hover::before, .em-btn-accent:hover::before, .em-btn-primary:hover::before { left: 150% !important; }
.em-btn:hover, .em-btn-accent:hover, .em-btn-primary:hover {
    transform: translateY(-2px) scale(1.02) !important;
}

/* No gaps between home sections */
.emh { margin: 0 !important; padding-top: 0; }
.emh + .emh { margin-top: 0 !important; }
section.emh { display: block; }