/* ===== ELECTRIC GO HEADER ===== */

/* Remove WoodMart header junk */
.whb-header, .whb-sticky-header, .whb-clone { display: none !important; }

.eg-header {
  position: relative;
  z-index: 100;
  width: 100%;
}

/* TOPBAR */
.eg-header .topbar {
  background: #1a2238;
  color: rgba(255,255,255,.85);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  line-height: 32px;
  width: 100%;
  overflow: hidden;
}
.eg-header .topbar .inner {
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  white-space: nowrap;
}
.eg-header .topbar .dot {
  width: 5px;
  height: 5px;
  min-width: 5px;
  background: var(--accent-2);
  box-shadow: 0 0 6px rgba(217,106,42,.6);
  animation: eg-pulse 2.2s ease-in-out infinite;
  flex-shrink: 0;
}
@keyframes eg-pulse { 0%,100%{opacity:1} 50%{opacity:.5} }
.eg-header .topbar .s { color: rgba(255,255,255,.3); flex-shrink: 0; }

/* На мобільних — бігуча стрічка (топбар дублюється) */
@media (max-width: 768px) {
  .eg-header .topbar .inner {
    max-width: none;
    overflow: visible;
  }
  .eg-header .topbar .inner {
    animation: eg-top-scroll 18s linear infinite;
  }
  @keyframes eg-top-scroll {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
  }
  /* Дублювання вмісту */
  .eg-header .topbar .inner::after {
    content: "|  МАГАЗИН ВІДКРИТО  |  ДОСТАВКА ВІД 2000 ₴  |  ГАРАНТІЯ 24 МІСЯЦІ  |  КИЇВ · ЛЬВІВ · ОДЕСА · ДНІПРО  |  МАГАЗИН ВІДКРИТО  |  ДОСТАВКА ВІД 2000 ₴  |  ГАРАНТІЯ 24 МІСЯЦІ  |  КИЇВ · ЛЬВІВ · ОДЕСА · ДНІПРО";
    white-space: nowrap;
    color: rgba(255,255,255,.85);
    padding-left: 0;
  }
  /* Ховаємо точку і сепаратори */
  .eg-header .topbar .dot { display: none; }
  .eg-header .topbar .s { display: none; }
  .eg-header .topbar .inner { gap: 0; padding: 0; }
}

/* MAINBAR */
.eg-header .mainbar {
  width: 100%;
  background: rgba(246,241,231,.95);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: 0;
  z-index: 99;
}
.eg-header .mainbar .inner {
  display: flex;
  align-items: center;
  gap: 24px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  height: 56px;
}

/* LEFT */
.eg-header .left {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-shrink: 0;
}

/* BURGER */
.eg-header .burger {
  display: none;
  background: none;
  border: none;
  color: var(--text);
  cursor: pointer;
  padding: 4px;
}
@media (max-width: 1100px) {
  .eg-header .burger { display: flex; }
}

/* LOGO */
.eg-header .logo {
  display: flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
  flex-shrink: 0;
}
.eg-header .logo .bolt { color: var(--accent-2); }
.eg-header .logo .t {
  font-family: var(--mono);
  font-weight: 800;
  font-size: 17px;
  letter-spacing: -.02em;
  color: var(--text);
}
.eg-header .logo .g {
  font-family: var(--mono);
  font-weight: 300;
  font-size: 17px;
  color: var(--accent-2);
  letter-spacing: -.02em;
}

/* NAV */
.eg-header .nav {
  display: flex;
  align-items: center;
  flex: 1;
  justify-content: center;
  gap: 0;
}
.eg-header .nav a {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--muted);
  padding: 0 14px;
  height: 56px;
  display: flex;
  align-items: center;
  border-bottom: 2px solid transparent;
  transition: all .15s;
  white-space: nowrap;
}
.eg-header .nav a:hover { color: var(--accent); }
.eg-header .nav a.active { color: var(--accent); border-bottom-color: var(--accent); }
@media (max-width: 1100px) {
  .eg-header .nav { display: none; }
}

/* RIGHT */
.eg-header .right {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

/* SEARCH */
.eg-header .search {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--surface);
  border: 1px solid var(--line-2);
  padding: 0 12px;
  height: 34px;
  width: 200px;
  transition: border-color .15s;
}
.eg-header .search:focus-within { border-color: var(--accent); }
.eg-header .search svg { color: var(--muted-2); flex-shrink: 0; }
.eg-header .search input {
  border: none;
  background: none;
  font-family: var(--mono);
  font-size: 11px;
  color: var(--text);
  width: 100%;
  height: 100%;
  outline: none;
}
.eg-header .search input::placeholder { color: var(--muted-2); opacity: .6; }
@media (max-width: 720px) {
  .eg-header .search { width: 100px; }
}
@media (max-width: 420px) {
  .eg-header .search { display: none; }
}

/* CART */
.eg-header .cart {
  position: relative;
  display: flex;
  align-items: center;
  text-decoration: none;
  color: var(--text);
  transition: color .15s;
}
.eg-header .cart:hover { color: var(--accent); }
.eg-header .cart .badge {
  position: absolute;
  top: -6px;
  right: -6px;
  background: var(--accent-2);
  color: #fff;
  font-family: var(--mono);
  font-size: 8px;
  font-weight: 800;
  width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ===== DRAWER ===== */
.drawer {
  display: none;
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  z-index: 1000;
  background: rgba(0,0,0,.4);
}
.drawer.open { display: block; }
.drawer-inner {
  width: 280px;
  max-width: 80vw;
  height: 100%;
  background: var(--surface);
  padding: 24px 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow-y: auto;
}
.drawer-inner .close {
  align-self: flex-end;
  background: none;
  border: none;
  color: var(--text);
  cursor: pointer;
  padding: 4px;
  margin-bottom: 12px;
}
.drawer-inner a {
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text);
  text-decoration: none;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}
.drawer-inner a:hover { color: var(--accent); }

/* ===== FOOTER ===== */
.eg-footer {
  background: #1a2238;
  margin-top: 80px;
  width: 100%;
  color: rgba(255,255,255,.8);
}
.eg-footer-main {
  max-width: 1200px;
  margin: 0 auto;
  padding: 48px 20px;
}
.eg-fw {
  display: grid;
  grid-template-columns: 1.8fr 1fr 1fr 1.4fr;
  gap: 40px;
}
.eg-fc {
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: rgba(255,255,255,.7);
}
.eg-fc h4 {
  font-family: var(--mono);
  font-weight: 800;
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.95);
  margin: 0 0 8px;
}
.eg-fc a {
  font-family: var(--sans);
  font-size: 12.5px;
  color: rgba(255,255,255,.7);
  text-decoration: none;
  padding: 2px 0;
  transition: color .15s;
}
.eg-fc a:hover { color: #fff; }
.eg-fc span { color: rgba(255,255,255,.6) !important; }
.eg-footer-bot {
  border-top: 1px solid rgba(255,255,255,.12);
  padding: 16px 20px;
  width: 100%;
  background: #141b2d;
}
.eg-fb-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto;
  font-family: var(--mono);
  font-size: 9.5px;
  color: rgba(255,255,255,.5);
  text-transform: uppercase;
  letter-spacing: .5px;
}
.eg-logo{display:inline-flex;align-items:center;gap:4px;text-decoration:none}
.eg-logo-flash{color:#d96a2a}
.eg-logo-t{font-family:var(--mono);font-weight:800;font-size:16px;color:rgba(255,255,255,.95)}
.eg-logo-g{font-family:var(--mono);font-weight:300;font-size:16px;color:#d96a2a}
.eg-fc-brand span{color:rgba(255,255,255,.5)!important}
.eg-fc-brand p{color:rgba(255,255,255,.6)!important}
.eg-fc .tel{font-size:14px;font-weight:700;color:rgba(255,255,255,.95)!important;display:block;margin-bottom:4px}
.eg-fc .tel:hover{color:#fff}

@media(max-width:900px){
  .eg-fw{grid-template-columns:1fr 1fr;gap:30px}
}
@media(max-width:600px){
  .eg-fw{grid-template-columns:1fr;gap:20px}
  .eg-fb-inner{flex-direction:column;gap:4px;text-align:center}
}
