/*
Author: Md. Monjurul Hye
Theme Name: Hye Ember
Description: Warm, modern starter theme with rounded buttons, clean header menu (no drawer), subtle animations, and a flexible Hero section.
Version: 2.2.1a
Text Domain: md-monjurul-hye
*/

:root{
  --bg:#f9fafb;
  --surface:#ffffff;
  --card:#ffffff;
  --text:#0f172a;
  --muted:#475569;
  --primary:#f59e0b;         /* warm accent */
  --primary-contrast:#111827;
  --border:#e5e7eb;
  --radius:14px;
  --container:1120px;
  --shadow: 0 10px 30px rgba(17,24,39,.08);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;padding:0}
body{
  font-family: 'Nunito', ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", Arial, "Noto Sans";
  background:linear-gradient(180deg, #fbfbfb, #f4f6f8 60%, #eef2f7);
  color:var(--text);
  line-height:1.7;
}

/* Layout */
.container{max-width:var(--container);margin:0 auto;padding:1.25rem}
main.container{padding-top:2rem}

/* Header */
.site-header{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.7);backdrop-filter: blur(10px);border-bottom:1px solid var(--border)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.brand{display:flex;align-items:center;gap:.7rem;font-weight:800;letter-spacing:.2px;font-family:'Playfair Display', serif}
.brand .logo{width:38px;height:38px;border-radius:10px;background: radial-gradient(120% 120% at 30% 10%, #ffd27a 0%, #f59e0b 40%, #b45309 100%); box-shadow: 0 8px 20px rgba(245,158,11,.25), inset 0 0 0 1px rgba(255,255,255,.4)}
.brand a{color:#111827;text-decoration:none}

/* Nav - pills */
.header-nav ul{list-style:none;display:flex;gap:.5rem;margin:0;padding:0;flex-wrap:wrap}
.header-nav a{display:inline-block;text-decoration:none;color:#111827;border:1px solid var(--border);background:var(--surface);padding:.5rem .8rem;border-radius:999px;transition: transform .15s ease, box-shadow .15s ease}
.header-nav a:hover{transform:translateY(-1px); box-shadow: var(--shadow)}

/* Mobile Drawer */
.nav-toggle{display:none;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:.45rem .6rem}
@media (max-width: 860px){
  .nav-toggle{display:inline-block}
  .header-nav{display:none}
  .drawer{position:fixed;inset:0 0 0 auto;width:min(86vw, 340px);background:var(--surface);border-left:1px solid var(--border);box-shadow: -20px 0 40px rgba(0,0,0,.08);transform:translateX(100%);transition: transform .2s ease;z-index:1100}
  .drawer.open{transform:translateX(0)}
  .drawer .inner{padding:1rem}
  .drawer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}
  .drawer a{color:#111827;text-decoration:none;border:1px solid var(--border);border-radius:12px;padding:.6rem .8rem;background:#fff}
}

/* Hero */
.hero{padding:3rem 0;background:linear-gradient(180deg,#fff 0%, #fff7ec 100%);border-bottom:1px solid var(--border)}
.hero .wrap{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between}
.hero h1{font-family:'Playfair Display', serif;font-size:2.2rem;margin:.4rem 0}
.hero p{color:var(--muted);max-width:56ch}
.cta{display:inline-block;background:linear-gradient(180deg, #ffd27a, #f59e0b);color:var(--primary-contrast);border:1px solid rgba(0,0,0,.06);border-radius:16px;padding:.6rem 1rem;font-weight:700; text-decoration:none; box-shadow: 0 8px 20px rgba(245,158,11,.25); transition: transform .15s ease, box-shadow .15s ease}
.cta:hover{transform: translateY(-1px); box-shadow: 0 14px 32px rgba(245,158,11,.32)}

/* Cards / posts */
.grid{display:grid;gap:1rem;grid-template-columns:repeat(12,1fr)}
.card{grid-column: span 12 / span 12;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.1rem;box-shadow: var(--shadow);transition: transform .15s ease}
.card:hover{transform: translateY(-2px)}
@media (min-width:720px){ .card{grid-column: span 6 / span 6} }
@media (min-width:1024px){ .card{grid-column: span 4 / span 4} }

.card h2{margin:.2rem 0 .4rem 0;font-size:1.15rem}
.card h2 a{color:#111827;text-decoration:none}
.card p{color:var(--muted);margin:.2rem 0 .6rem 0}
.readmore{display:inline-block;font-weight:700;text-decoration:none;color:var(--primary-contrast);background:linear-gradient(180deg, #ffd27a, #f59e0b);border:1px solid rgba(0,0,0,.06);padding:.5rem .75rem;border-radius:14px;transition: transform .15s ease, box-shadow .15s ease; box-shadow: 0 8px 20px rgba(245,158,11,.18)}
.readmore:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(245,158,11,.26)}

/* Footer */
.site-footer{border-top:1px solid var(--border);background:#fff}
.site-footer .container{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center}
.footer-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:.5rem;flex-wrap:wrap}
.footer-nav a{color:#334155;text-decoration:none;border:1px solid var(--border);padding:.4rem .7rem;border-radius:12px;background:var(--surface)}
.footer-nav a:hover{box-shadow: var(--shadow)}

/* Forms & tables */
input,select,textarea{width:100%;background:#fff;color:#0f172a;border:1px solid var(--border);border-radius:12px;padding:.6rem .7rem}
button,.button{background:linear-gradient(180deg, #ffd27a, #f59e0b);color:var(--primary-contrast);border:none;border-radius:14px;padding:.6rem .9rem;font-weight:700;box-shadow: 0 8px 20px rgba(245,158,11,.18);transition: transform .15s ease, box-shadow .15s ease}
button:hover,.button:hover{transform:translateY(-1px);box-shadow: 0 12px 28px rgba(245,158,11,.28)}
table{width:100%;border-collapse:collapse}
th,td{border:1px solid var(--border);padding:.6rem}



/* Widgets / Sidebar */
.layout{display:grid;grid-template-columns:1fr;gap:1.2rem}
@media(min-width:980px){.layout{grid-template-columns:3fr 1.2fr}}
.sidebar .widget{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:1rem;box-shadow: var(--shadow)}
.sidebar .widget h2,.sidebar .widget .widgettitle{margin-top:0;font-size:1rem}
.sidebar .widget ul{list-style:none;margin:0;padding:0}
.sidebar .widget ul li{padding:.25rem 0;border-bottom:1px dashed var(--border)}
.sidebar .widget ul li:last-child{border-bottom:0}

/* Footer widgets */
.footer-widgets{display:grid;gap:1rem;grid-template-columns:repeat(1,1fr);margin:1rem 0}
@media(min-width:720px){.footer-widgets{grid-template-columns:repeat(2,1fr)}}
@media(min-width:980px){.footer-widgets{grid-template-columns:repeat(3,1fr)}}
.footer-widgets .widget{background:#fff;border:1px solid var(--border);border-radius:12px;padding:1rem;box-shadow: var(--shadow)}
.footer-widgets .widget h2,.footer-widgets .widget .widgettitle{margin-top:0;font-size:1rem}




/* Product badges */
.woocommerce ul.products li.product{ position: relative; }
.mdmh-badges{
  position:absolute; top:.6rem; left:.6rem; display:flex; gap:.35rem; z-index:5;
}
.mdmh-badges .badge{
  display:inline-block; font-size:.72rem; font-weight:800; letter-spacing:.3px;
  padding:.25rem .45rem; border-radius:999px; color:#111827; background:#fff;
  border:1px solid var(--border); box-shadow: var(--shadow);
}
.mdmh-badges .badge.sale{ background:linear-gradient(180deg,#ffd2d2,#fca5a5); }
.mdmh-badges .badge.new{ background:linear-gradient(180deg,#d1fae5,#a7f3d0); }




/* Header mini cart */
.header-cart{position:relative; display:flex; align-items:center; gap:.5rem}
.cart-button{
  position:relative; background:#fff; border:1px solid var(--border); border-radius:12px; padding:.45rem .6rem; cursor:pointer
}
.cart-button .count{
  position:absolute; top:-6px; right:-6px; background:linear-gradient(180deg,#ffd27a,#f59e0b);
  color:#111827; font-weight:800; font-size:.7rem; border-radius:999px; padding:.1rem .35rem; border:1px solid rgba(0,0,0,.06);
}
.cart-dropdown{
  position:absolute; right:0; top:calc(100% + .5rem); width:min(92vw, 360px);
  background:#fff; border:1px solid var(--border); border-radius:14px; box-shadow: var(--shadow);
  padding:.75rem; display:none; z-index:1200;
}
.cart-dropdown.open{display:block}
.cart-dropdown .widget_shopping_cart_content{max-height:60vh; overflow:auto}

/* Two-column checkout */
.woocommerce-checkout .container{max-width: var(--container)}
.woocommerce-checkout form.checkout{
  display:grid; grid-template-columns: 1.4fr .9fr; gap:1rem;
}
@media(max-width: 980px){
  .woocommerce-checkout form.checkout{ grid-template-columns: 1fr; }
}
.woocommerce-checkout #customer_details, .woocommerce-checkout #order_review{
  background:#fff; border:1px solid var(--border); border-radius:12px; padding:1rem; box-shadow: var(--shadow);
}



/* Accessibility: skip link & focus ring */
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{position:fixed;left:1rem;top:1rem;width:auto;height:auto;background:#111827;color:#fff;padding:.5rem .75rem;border-radius:10px;z-index:2000}
:focus{outline:2px solid #2563eb; outline-offset:2px}
.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}


/* --- v1.8.3 header cleanup --- */
.header-nav ul, .header-nav .menu{ list-style:none; margin:0; padding:0 }
.header-nav .menu > li{ display:inline-block; margin:0 .6rem }
.header-nav .menu > li > a{ text-decoration:none }

/* Hide drawer UI entirely */
.drawer, .drawer-close{ display:none !important }

/* Keep menu visible on mobile (since drawer hidden) */
@media (max-width: 860px){
  .nav-toggle{ display:none !important }
  .header-nav{ display:block !important }
}


/* --- v1.8.4: remove drawer/nav-toggle, clean menu bullets --- */
ul.menu, .menu{ list-style:none; margin:0; padding:0 }
.header-nav .menu > li{ display:inline-block; margin:0 .6rem }
.header-nav .menu > li > a{ text-decoration:none }


/* --- Dropdown submenu --- */
.header-nav .menu{position:relative}
.header-nav .menu > li{position:relative}
.header-nav .menu li{list-style:none}
.header-nav .menu li ul.sub-menu{position:absolute;left:0;top:calc(100% + 8px);min-width:220px;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.08);padding:.5rem;display:none;z-index:1001}
.header-nav .menu > li:hover > ul.sub-menu{display:block}
.header-nav .menu li ul.sub-menu li a{display:block;padding:.5rem .75rem;border-radius:8px;color:var(--text)}
.header-nav .menu li ul.sub-menu li a:hover{background:var(--hover)}
/* show nested submenu to the right */
.header-nav .menu li ul.sub-menu li{position:relative}
.header-nav .menu li ul.sub-menu li ul.sub-menu{left:100%;top:0}
/* Mobile fallback: show when .open */
@media (max-width: 960px){
  .header-nav .menu{flex-direction:column;gap:.25rem}
  .header-nav .menu li ul.sub-menu{position:relative;left:auto;top:auto;display:none;margin-left:1rem}
  .header-nav .menu li.open > ul.sub-menu{display:block}
}

/* Stable dropdown (no flicker) */
.header-nav .menu > li{position:relative}
.header-nav .menu li ul.sub-menu{
  position:absolute;left:0;top:calc(100% + 8px);
  min-width:220px;background:var(--surface);border:1px solid var(--border);
  border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.08);padding:.5rem;
  visibility:hidden;opacity:0;transform:translateY(6px);
  transition:opacity .15s ease, transform .15s ease, visibility 0s linear .15s;
  pointer-events:none; z-index:1001;
}
.header-nav .menu > li:hover > ul.sub-menu,
.header-nav .menu li ul.sub-menu:hover{
  visibility:visible; opacity:1; transform:translateY(0); pointer-events:auto;
  transition:opacity .15s ease, transform .15s ease, visibility 0s;
}
.header-nav .menu li ul.sub-menu li{position:relative}
.header-nav .menu li ul.sub-menu li ul.sub-menu{left:100%; top:0}
@media (max-width: 960px){
  .header-nav .menu li ul.sub-menu{
    position:relative; left:auto; top:auto; transform:none;
    border-radius:10px; box-shadow:none; visibility:hidden; opacity:0; pointer-events:none;
  }
  .header-nav .menu li.open > ul.sub-menu{visibility:visible; opacity:1; pointer-events:auto}
}


/* --- Gap fix: invisible bridge to prevent hover drop --- */
.header-nav .menu > li.menu-item-has-children{position:relative}
.header-nav .menu > li.menu-item-has-children::after{
  content:""; position:absolute; left:0; right:0; top:100%; height:12px;
  background:transparent; /* bridge so pointer doesn't leave when moving down */
}
/* Also show when .open is set (JS-managed) */
.header-nav .menu > li.open > ul.sub-menu{visibility:visible; opacity:1; transform:translateY(0); pointer-events:auto; transition:opacity .15s ease, transform .15s ease, visibility 0s;}

/* Click-only submenu mode */
.header-nav .menu > li > ul.sub-menu{display:none}
.header-nav .menu > li.open > ul.sub-menu{display:block}
/* Override earlier visibility/opacity hover rules */
.header-nav .menu > li:hover > ul.sub-menu{display:none}
.header-nav .menu li ul.sub-menu:hover{display:block}
@media (min-width: 961px){
  .header-nav .menu li ul.sub-menu{
    position:absolute; left:0; top:calc(100% + 8px); min-width:220px;
    background:var(--surface); border:1px solid var(--border);
    border-radius:12px; box-shadow:0 8px 30px rgba(0,0,0,.08); padding:.5rem;
  }
}
@media (max-width: 960px){
  .header-nav .menu li ul.sub-menu{position:relative; left:auto; top:auto; box-shadow:none; border-radius:10px}
}


/* === HOVER-STABLE SUBMENU (desktop) === */
.header-nav .menu > li{position:relative}
.header-nav .menu li ul.sub-menu{
  position:absolute; left:0; top:calc(100% + 8px);
  min-width:220px; background:var(--surface); border:1px solid var(--border);
  border-radius:12px; box-shadow:0 8px 30px rgba(0,0,0,.08); padding:.5rem;
  visibility:hidden; opacity:0; transform:translateY(6px);
  transition:opacity .15s ease, transform .15s ease, visibility 0s linear .15s;
  pointer-events:none; z-index:1001;
}
/* Show on hover (desktop) OR when .open is applied */
@media (min-width: 961px){
  .header-nav .menu > li:hover > ul.sub-menu,
  .header-nav .menu > li.open > ul.sub-menu,
  .header-nav .menu li ul.sub-menu:hover{
    visibility:visible; opacity:1; transform:translateY(0); pointer-events:auto;
    transition:opacity .15s ease, transform .15s ease, visibility 0s;
  }
}
/* Bridge area to prevent small gaps breaking hover */
.header-nav .menu > li.menu-item-has-children::after{
  content:""; position:absolute; left:0; right:0; top:100%; height:12px; background:transparent;
}

/* Nested submenu to the right */
.header-nav .menu li ul.sub-menu li{position:relative}
.header-nav .menu li ul.sub-menu li ul.sub-menu{left:100%; top:0}

/* Mobile (tap-to-toggle) */
@media (max-width: 960px){
  .header-nav .menu li ul.sub-menu{
    position:relative; left:auto; top:auto; transform:none;
    border-radius:10px; box-shadow:none;
    visibility:hidden; opacity:0; pointer-events:none;
  }
  .header-nav .menu li.open > ul.sub-menu{
    visibility:visible; opacity:1; pointer-events:auto;
  }
  /* Disable hover open on mobile */
  .header-nav .menu > li:hover > ul.sub-menu{visibility:hidden; opacity:0; pointer-events:none;}
}


/* === PURE CSS SUBMENU (hover + focus-within) === */
.header-nav .menu > li { position: relative; }
.header-nav .menu li ul.sub-menu {
  position: absolute;
  left: 0;
  top: 100%;
  min-width: 220px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 8px 30px rgba(0,0,0,.08);
  padding: .5rem;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: all .2s ease;
  z-index: 999;
}
.header-nav .menu li:hover > ul.sub-menu,
.header-nav .menu li:focus-within > ul.sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.header-nav .menu li ul.sub-menu li { position: relative; }
.header-nav .menu li ul.sub-menu li ul.sub-menu { top: 0; left: 100%; }
/* Mobile */
@media (max-width: 960px) {
  .header-nav .menu li ul.sub-menu {
    position: relative;
    left: auto; top: auto;
    transform: none;
    box-shadow: none;
    border: none;
    padding-left: 1rem;
  }
}


/* === SUBMENU v1.9.0: Caret + Mega + Accordion === */

/* Caret indicator for parents */
.header-nav .menu li.menu-item-has-children > a{
  position:relative; padding-right:1.2rem;
}
.header-nav .menu li.menu-item-has-children > a::after{
  content:"▾"; position:absolute; right:.4rem; top:50%; transform:translateY(-45%);
  font-size:.8em; opacity:.8;
}

/* Base dropdown */
.header-nav .menu > li { position: relative; }
.header-nav .menu li ul.sub-menu{
  position:absolute; left:0; top:100%;
  min-width:240px; background:var(--surface); border:1px solid var(--border);
  border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.08);
  padding:.6rem; opacity:0; visibility:hidden; transform:translateY(8px);
  transition:all .2s ease; z-index:1002;
}
.header-nav .menu li:hover > ul.sub-menu,
.header-nav .menu li:focus-within > ul.sub-menu{
  opacity:1; visibility:visible; transform:translateY(0);
}
.header-nav .menu li ul.sub-menu li a{
  display:block; padding:.55rem .75rem; border-radius:8px; color:var(--text);
}
.header-nav .menu li ul.sub-menu li a:hover{ background:var(--hover); }

/* Nested flyout */
.header-nav .menu li ul.sub-menu li{ position:relative; }
.header-nav .menu li ul.sub-menu li ul.sub-menu{ top:0; left:100%; }

/* Mega menu (apply .mega on parent li) */
.header-nav .menu > li.mega{ position:static; }
.header-nav .menu > li.mega > ul.sub-menu{
  left:50%; transform:translate(-50%, 8px);
  width:min(1000px, 92vw); padding:1rem; display:grid; gap:.75rem;
  grid-template-columns: repeat(3, minmax(0,1fr));
}
.header-nav .menu > li.mega:hover > ul.sub-menu,
.header-nav .menu > li.mega:focus-within > ul.sub-menu{
  transform:translate(-50%, 0);
}
.header-nav .menu > li.mega > ul.sub-menu > li > a{ font-weight:600; opacity:.9; }
.header-nav .menu > li.mega > ul.sub-menu > li{ padding:.25rem .25rem; }
.header-nav .menu > li.mega > ul.sub-menu > li ul.sub-menu{ position:relative; left:auto; top:auto; box-shadow:none; border:none; padding-left:.25rem; }

/* Mobile accordion */
@media (max-width: 960px){
  .header-nav .menu{ display:flex; flex-direction:column; gap:.25rem; }
  .header-nav .menu li ul.sub-menu{
    position:relative; left:auto; top:auto; transform:none;
    box-shadow:none; border:none; border-left:2px solid var(--border);
    margin-left:.5rem; padding-left:.5rem; opacity:1; visibility:visible; display:none;
  }
  .header-nav .menu li.open > ul.sub-menu{ display:block; }
  .header-nav .menu li.menu-item-has-children > a::after{ content:"▸"; right:.25rem; }
  .header-nav .menu li.open > a::after{ content:"▾"; }
}


/* Desktop: allow click-to-lock (.open) in addition to :hover */
@media (min-width: 961px){
  .header-nav .menu > li.open > ul.sub-menu{opacity:1;visibility:visible;transform:translateY(0)}
}

/* v2.0 gapless submenu: stick right under the parent */
@media (min-width: 961px){
  .header-nav .menu > li { position: relative; }
  .header-nav .menu > li > ul.sub-menu{
    top: calc(100% - 6px) !important; /* pull up to remove gap created by pill padding/shadow */
    margin-top: 0 !important;
  }
  .header-nav .menu > li > a{ position: relative; z-index: 1003; } /* keep parent above */
}
.header-nav .menu li ul.sub-menu{ margin: 0 !important; }

/* v2.0.1 submenu zero-gap */
@media (min-width: 961px){
  .header-nav .menu > li > ul.sub-menu{
    top: 100% !important; /* no gap */
    margin-top: 0 !important;
  }
}


/* v2.0.2: desktop hover opens submenu */
@media (min-width: 961px){
  .header-nav .menu li:hover > ul.sub-menu,
  .header-nav .menu li:focus-within > ul.sub-menu{
    opacity:1; visibility:visible; transform:translateY(0);
  }
}
/* prevent hover open on mobile */
@media (max-width: 960px){
  .header-nav .menu > li:hover > ul.sub-menu{ opacity:0; visibility:hidden; }
  .header-nav .menu li.open > ul.sub-menu{ display:block; opacity:1; visibility:visible; }
}


/* v2.0.4: HARD hover fix for desktop */
@media (min-width: 961px){
  .header-nav .menu li{ position:relative }
  .header-nav .menu li > ul.sub-menu{
    position:absolute; left:0; top:100%;
    display:block !important;
    opacity:0; visibility:hidden; pointer-events:none;
    transform:translateY(8px);
    min-width:240px;
    background:var(--surface); border:1px solid var(--border);
    border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.08);
    transition:opacity .18s ease, transform .18s ease, visibility 0s linear .18s;
    z-index:1002;
  }
  .header-nav .menu li:hover > ul.sub-menu,
  .header-nav .menu li:focus-within > ul.sub-menu{
    opacity:1; visibility:visible; pointer-events:auto;
    transform:translateY(0);
    transition:opacity .18s ease, transform .18s ease, visibility 0s;
  }
  .header-nav .menu li ul.sub-menu li{ position:relative }
  .header-nav .menu li ul.sub-menu li > ul.sub-menu{ left:100%; top:0 }
}
@media (max-width: 960px){
  .header-nav .menu li > ul.sub-menu{
    position:relative; left:auto; top:auto;
    display:none; opacity:1; visibility:visible; transform:none;
    box-shadow:none; border:none; padding-left:.5rem;
  }
  .header-nav .menu li.open > ul.sub-menu{ display:block }
  .header-nav .menu > li:hover > ul.sub-menu{ display:none }
}


/* v2.0.5 Built-in mobile hamburger */
#nav-toggle{ display:none; }
@media (max-width: 960px){
  #nav-toggle{
    display:inline-flex; align-items:center; justify-content:center;
    width:40px; height:40px; border-radius:10px; border:1px solid var(--border);
    background:var(--surface); color:var(--text); margin-right:.5rem;
  }
  .header-nav{ position:relative; }
  .header-nav .menu{
    display:none; position:absolute; top:48px; right:0;
    background:var(--surface); border:1px solid var(--border);
    border-radius:14px; box-shadow:0 12px 40px rgba(0,0,0,.12);
    padding:.6rem; width:min(92vw,340px); max-height:70vh; overflow:auto;
  }
  body.nav-open .header-nav .menu{ display:block; }
  /* keep submenu accordion */
  .header-nav .menu li ul.sub-menu{ display:none; }
  .header-nav .menu li.open > ul.sub-menu{ display:block; }
  .header-nav .menu li.menu-item-has-children > a::after{ content:"▸"; margin-left:.35rem; }
  .header-nav .menu li.open > a::after{ content:"▾"; }
}


/* v2.1.0 WooCommerce base styling */
.woocommerce .products{ display:grid; grid-template-columns: repeat(auto-fill, minmax(240px,1fr)); gap:1rem; }
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product{
  list-style:none; background:var(--surface,#fff); border:1px solid var(--border,#e5e7eb); border-radius:14px; padding:1rem;
  box-shadow:0 8px 24px rgba(0,0,0,.06);
}
.woocommerce ul.products li.product a img{ border-radius:12px; }
.woocommerce .price{ color:var(--text,#111); font-weight:600; }
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit{
  background:var(--accent,#6366f1); color:#fff; border:none; border-radius:12px; padding:.6rem 1rem; cursor:pointer;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover{ opacity:.92 }
.woocommerce div.product div.images img{ border-radius:12px }
.woocommerce div.product .summary{ padding-left:1.5rem }
@media (max-width: 960px){
  .woocommerce div.product .summary{ padding-left:0 }
}
.woocommerce-cart .cart-collaterals .cart_totals, .woocommerce-checkout .col2-set, .woocommerce-checkout #order_review{
  background:var(--surface,#fff); border:1px solid var(--border,#e5e7eb); border-radius:14px; padding:1rem; box-shadow:0 8px 24px rgba(0,0,0,.06);
}


/* v2.2.0 Woo+ UI */
/* Mini cart */
.hye-mini-cart{ display:inline-flex; align-items:center; gap:.4rem; margin-left:.5rem;
  background:var(--surface,#fff); border:1px solid var(--border,#e5e7eb); border-radius:999px; padding:.35rem .6rem; box-shadow:0 6px 18px rgba(0,0,0,.06); }
.hye-cart-icon{ font-size:1rem; line-height:1 }
.hye-cart-count{ min-width:1.25rem; height:1.25rem; line-height:1.25rem; text-align:center; font-size:.8rem;
  background:var(--accent,#6366f1); color:#fff; border-radius:999px; padding:0 .35rem; }
/* Shop columns helper (fallback to loop_shop_columns filter) */
.woocommerce ul.products{ gap:1rem }
@media (min-width: 961px){
  .columns-2 .products{ grid-template-columns:repeat(2,minmax(0,1fr)) }
  .columns-3 .products{ grid-template-columns:repeat(3,minmax(0,1fr)) }
  .columns-4 .products{ grid-template-columns:repeat(4,minmax(0,1fr)) }
}
/* Checkout layouts */
body.hye-checkout-two.woocommerce-checkout .col2-set{ display:grid; grid-template-columns:1fr 1fr; gap:1rem }
body.hye-checkout-two.woocommerce-checkout #order_review{ margin-top:0 }
@media (max-width: 960px){
  body.hye-checkout-two.woocommerce-checkout .col2-set{ grid-template-columns:1fr }
}
body.hye-checkout-one.woocommerce-checkout .col2-set, body.hye-checkout-one.woocommerce-checkout #order_review{ display:block; }


/* v2.2.1 Mobile header menu fix */
#nav-toggle{ display:none; }
@media (max-width: 960px){
  #nav-toggle{
    display:inline-flex; align-items:center; justify-content:center;
    width:40px; height:40px; border-radius:10px; border:1px solid var(--border,#e5e7eb);
    background:var(--surface,#fff); color:var(--text,#111); margin-right:.5rem; z-index:1003;
  }
  .header-nav{ position:relative; }
  .header-nav .menu{
    display:none; position:absolute; top:48px; right:0; left:auto;
    background:var(--surface,#fff); border:1px solid var(--border,#e5e7eb);
    border-radius:14px; box-shadow:0 12px 40px rgba(0,0,0,.12);
    padding:.6rem; width:min(92vw, 340px); max-height:70vh; overflow:auto; z-index:1002;
    flex-direction:column; gap:.25rem;
  }
  body.nav-open .header-nav .menu{ display:flex; }
  .header-nav .menu li{ margin:.05rem 0; }
  .header-nav .menu li a{ display:block; padding:.6rem .8rem; border-radius:10px; }
  .header-nav .menu li a:hover{ background:var(--hover, rgba(0,0,0,.05)); }
  .header-nav .menu li ul.sub-menu{ display:none; position:relative; left:auto; top:auto; border:none; box-shadow:none; padding-left:.6rem; }
  .header-nav .menu li.open > ul.sub-menu{ display:block; }
  .header-nav .menu li.menu-item-has-children > a::after{ content:"▸"; margin-left:.35rem; }
  .header-nav .menu li.open > a::after{ content:"▾"; }
}