/* ---- Reset im Header-Scope ---- */
#stec-header * { margin:0; padding:0; box-sizing:border-box; }
#stec-header {
  font-family:"SamsungOne","Samsung Sharp Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  position:sticky; top:0; z-index:9999;
  background:#fff;
  border-bottom:1px solid #eaeaea;
}

/* ---- Top-Leiste (Utility) ---- */
#stec-header .stec-utility {
  background:#f8f8f8;
  border-bottom:1px solid #eaeaea;
  height:32px;
  display:flex; align-items:center; justify-content:flex-end;
}
#stec-header .stec-utility-inner {
  max-width:1440px; width:100%; margin:0 auto; padding:0 24px;
  display:flex; align-items:center; justify-content:flex-end; gap:20px;
}
#stec-header .stec-utility a {
  font-size:12px; color:#333; text-decoration:none; line-height:1;
}
#stec-header .stec-utility a:hover { color:#000; text-decoration:underline; }

/* ---- Haupt-Leiste ---- */
#stec-header .stec-main {
  height:56px;
  max-width:1440px; width:100%; margin:0 auto; padding:0 24px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}

/* Logo */
#stec-header .stec-logo { flex-shrink:0; display:flex; align-items:center; }
#stec-header .stec-logo-img { height:26px; width:auto; display:block; }

/* Nav (Desktop) */
#stec-header .stec-nav { flex:1; display:flex; align-items:center; height:100%; }
#stec-header .stec-nav ul { list-style:none; display:flex; align-items:center; gap:0; height:100%; }
#stec-header .stec-nav li { height:100%; display:flex; align-items:center; }
#stec-header .stec-nav a {
  font-size:14px; font-weight:600; color:#000; text-decoration:none;
  padding:0 16px; height:100%; display:flex; align-items:center;
  position:relative; white-space:nowrap;
}
#stec-header .stec-nav a::after {
  content:""; position:absolute; left:16px; right:16px; bottom:0;
  height:2px; background:#a52226; transform:scaleX(0); transition:transform .2s ease;
}
#stec-header .stec-nav a:hover::after { transform:scaleX(1); }

/* Icons rechts */
#stec-header .stec-icons { flex-shrink:0; display:flex; align-items:center; gap:8px; }
#stec-header .stec-icon-btn {
  width:38px; height:38px; border:none; background:transparent; cursor:pointer;
  display:flex; align-items:center; justify-content:center; border-radius:50%;
  color:#000; transition:background .15s ease;
}
#stec-header .stec-icon-btn:hover { background:#f2f2f2; }
#stec-header .stec-icon-btn svg { width:21px; height:21px; stroke:#000; fill:none; stroke-width:1.6; }

/* Burger nur mobil */
#stec-header .stec-burger { display:none; }

/* ---- Meilisearch Overlay ---- */
#stec-header .stec-search-overlay {
  position:fixed; top:0; left:0; right:0; bottom:0;
  background:rgba(255,255,255,.98);
  z-index:10000; display:none; padding-top:0;
}
#stec-header .stec-search-overlay.active { display:block; }
#stec-header .stec-search-top {
  height:56px; border-bottom:1px solid #eaeaea;
  max-width:1440px; margin:0 auto; padding:0 24px;
  display:flex; align-items:center; gap:16px;
}
#stec-header .stec-search-top .stec-logo { margin-right:auto; }
#stec-header #meilisearch-box {
  max-width:900px; margin:40px auto 0; padding:0 24px;
}
/* Fallback-Suchfeld, falls Scry noch nicht geladen ist */
#stec-header .stec-search-fallback {
  display:flex; align-items:center; gap:12px;
  border-bottom:2px solid #000; padding:12px 0;
}
#stec-header .stec-search-fallback input {
  flex:1; border:none; outline:none; font-size:24px; background:transparent;
  font-family:inherit;
}
#stec-header .stec-search-fallback svg { width:26px; height:26px; stroke:#000; fill:none; stroke-width:1.6; }

/* ---- Mobile Off-Canvas Menü ---- */
#stec-header .stec-mobile-menu {
  position:fixed; top:0; right:0; bottom:0; width:100%; max-width:420px;
  background:#fff; z-index:10001; transform:translateX(100%);
  transition:transform .3s cubic-bezier(.4,0,.2,1); overflow-y:auto;
  box-shadow:-4px 0 24px rgba(0,0,0,.08);
}
#stec-header .stec-mobile-menu.active { transform:translateX(0); }
#stec-header .stec-mobile-top {
  height:56px; border-bottom:1px solid #eaeaea; padding:0 20px;
  display:flex; align-items:center; justify-content:space-between;
}
#stec-header .stec-mobile-nav { padding:8px 0; }
#stec-header .stec-mobile-nav a {
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 20px; font-size:16px; font-weight:600; color:#000;
  text-decoration:none; border-bottom:1px solid #f2f2f2;
}
#stec-header .stec-mobile-nav a svg { width:18px; height:18px; stroke:#666; fill:none; stroke-width:2; }
#stec-header .stec-mobile-utility { padding:16px 20px; }
#stec-header .stec-mobile-utility a {
  display:block; padding:10px 0; font-size:14px; color:#333; text-decoration:none;
}
#stec-header .stec-overlay-bg {
  position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:10000;
  opacity:0; visibility:hidden; transition:opacity .3s ease;
}
#stec-header .stec-overlay-bg.active { opacity:1; visibility:visible; }

body.stec-noscroll { overflow:hidden; }

/* ============================================================
   RESPONSIVE
   ============================================================ */

/* Tablet: Nav ausblenden, Burger zeigen */
@media (max-width:1024px){
  #stec-header .stec-nav { display:none; }
  #stec-header .stec-burger { display:flex; }
  #stec-header .stec-main { height:52px; }
  #stec-header .stec-logo-img { height:24px; }
}

/* Mobile */
@media (max-width:640px){
  #stec-header .stec-utility { display:none; }
  #stec-header .stec-main { padding:0 16px; height:52px; gap:12px; }
  #stec-header .stec-logo-img { height:22px; }
  #stec-header .stec-icons { gap:2px; }
  #stec-header #meilisearch-box { margin-top:24px; padding:0 16px; }
  #stec-header .stec-search-fallback input { font-size:18px; }
  #stec-header .stec-search-top { padding:0 16px; height:52px; }
}
/* ============================================================
   ERGÄNZUNGEN v2.0 — dynamische WordPress-Menüs
   ============================================================ */

/* Utility-Leiste: Menü ist jetzt eine <ul>-Liste statt einzelner Links */
#stec-header .stec-utility-menu {
  list-style:none; display:flex; align-items:center; gap:20px; margin:0; padding:0;
}
#stec-header .stec-utility-menu li { display:flex; align-items:center; }
#stec-header .stec-utility-menu a {
  font-size:12px; color:#333; text-decoration:none; line-height:1;
}
#stec-header .stec-utility-menu a:hover { color:#000; text-decoration:underline; }

/* Bild/Icon vor dem Menütext (Hauptnavigation) */
#stec-header .stec-nav-img {
  height:20px; width:auto; display:inline-block; vertical-align:middle;
  margin-right:8px; object-fit:contain;
}
#stec-header .stec-nav a { display:flex; align-items:center; }
#stec-header .stec-nav-text { display:inline-block; }

/* Mobiles Menü: <ul>-Liste ohne Standard-Aufzählung */
#stec-header .stec-mobile-menu-list {
  list-style:none; margin:0; padding:0;
}
#stec-header .stec-mobile-menu-list li { display:block; }
/* Bild/Icon im mobilen Menü */
#stec-header .stec-mobile-nav .stec-nav-img {
  height:22px; width:auto; margin-right:12px; vertical-align:middle; object-fit:contain;
}
#stec-header .stec-mobile-nav a { display:flex; align-items:center; }

/* Fallback-"Menü zuweisen"-Hinweis dezent */
#stec-header .stec-nav-menu > li > a[href*="nav-menus"],
#stec-header .stec-utility-menu > li > a[href*="nav-menus"],
#stec-header .stec-mobile-menu-list > li > a[href*="nav-menus"] {
  opacity:.5; font-style:italic;
}

/* ============================================================
   Begrüßung in der oberen Leiste (v4.1)
   ============================================================ */
#stec-header .stec-greeting {
  font-size:12px; color:#333; text-decoration:none; line-height:1;
  white-space:nowrap;
}
#stec-header .stec-greeting:hover { color:#000; text-decoration:underline; }

/* ============================================================
   Live-Suche: Ergebnisse & Verlauf (v4.2)
   ============================================================ */
#stec-header .stec-search-results { max-width:900px; margin:20px auto 0; padding:0 24px; }

/* Ergebnisliste */
#stec-header .stec-result-list { list-style:none; margin:0; padding:0; }
#stec-header .stec-result-item { border-bottom:1px solid #eee; }
#stec-header .stec-result-item a {
  display:flex; align-items:center; gap:14px; padding:10px 4px;
  text-decoration:none; color:#000;
}
#stec-header .stec-result-item a:hover { background:#f7f7f7; }
#stec-header .stec-result-img {
  width:48px; height:48px; object-fit:contain; flex-shrink:0;
  border:1px solid #eee; border-radius:6px; background:#fff;
}
#stec-header .stec-result-info { display:flex; flex-direction:column; gap:2px; }
#stec-header .stec-result-title { font-size:14px; font-weight:600; }
#stec-header .stec-result-price { font-size:13px; color:#a52226; }
#stec-header .stec-result-price del { color:#999; font-weight:400; margin-right:6px; }

/* Zustände */
#stec-header .stec-search-loading,
#stec-header .stec-search-empty { padding:16px 4px; font-size:14px; color:#666; }

/* Verlauf */
#stec-header .stec-history-head {
  display:flex; align-items:center; justify-content:space-between;
  padding:4px; margin-bottom:4px;
}
#stec-header .stec-history-head span { font-size:12px; color:#888; text-transform:uppercase; letter-spacing:.03em; }
#stec-header .stec-history-clear {
  border:none; background:transparent; color:#a52226; font-size:12px; cursor:pointer; padding:2px 4px;
}
#stec-header .stec-history-clear:hover { text-decoration:underline; }
#stec-header .stec-history ul { list-style:none; margin:0; padding:0; }
#stec-header .stec-history li { display:flex; align-items:center; }
#stec-header .stec-history-term {
  flex:1; display:flex; align-items:center; gap:10px; padding:9px 4px;
  text-decoration:none; color:#333; font-size:14px;
}
#stec-header .stec-history-term:hover { color:#000; }
#stec-header .stec-history-icon { width:16px; height:16px; stroke:#999; fill:none; stroke-width:1.6; }
#stec-header .stec-history-remove {
  border:none; background:transparent; color:#bbb; font-size:20px; line-height:1;
  cursor:pointer; padding:4px 8px;
}
#stec-header .stec-history-remove:hover { color:#a52226; }

/* ============================================================
   Warenkorb-Zähler (Badge) (v4.3)
   ============================================================ */
#stec-header .stec-cart-btn { position:relative; }
#stec-header .stec-cart-count {
  position:absolute; top:2px; right:2px;
  min-width:17px; height:17px; padding:0 4px;
  background:#a52226; color:#fff;
  font-size:11px; font-weight:700; line-height:17px; text-align:center;
  border-radius:9px; box-sizing:border-box;
  pointer-events:none;
}
/* Bei leerem Warenkorb ausblenden */
#stec-header .stec-cart-count.stec-cart-empty { display:none; }
