/* === Myotek Re:Use — Corporate Clean + Eco minimal === */
:root{
  --brand:#0078D7;        /* primary */
  --brand-hover:#005BBB;  /* hover  */
  --bg:#F8F9FB;           /* page bg */
  --text:#2E3A46;
  --muted:#6B7B8A;
  --line:#E6EAF0;
  --card:#FFFFFF;
  --radius:10px;
  --shadow:0 6px 16px rgba(0,0,0,.06);
  --fast:180ms;
}

/* Базова палітра */
body{ background:var(--bg) !important; color:var(--text); }
#top, header, .container .alert { background:#fff; }
#menu, .navbar { border-bottom:1px solid var(--line); }

/* Кнопки */
.btn-primary, .btn.btn-primary, .button, .btn.btn-cart, .btn.btn-success, #button-cart {
  background:var(--brand) !important; border-color:var(--brand) !important; color:#fff !important;
  border-radius:var(--radius); transition:all var(--fast) ease;
}
.btn-primary:hover, .button:hover, .btn.btn-success:hover, #button-cart:hover{
  background:var(--brand-hover) !important; border-color:var(--brand-hover) !important;
}

/* Top bar дрібні покращення */
#top { border-bottom:1px solid var(--line); }
#top a { color:var(--muted); }
#top a:hover{ color:var(--brand-hover); }

/* Лого, пошук, кошик */
#logo img{ max-height:56px; }
#search input{ border-radius:var(--radius); border:1px solid var(--line); }
#cart > .btn{ border-radius:var(--radius); }

/* ===== Mega-menu поверх стандартного #menu ===== */
#menu .nav > li { position: static; } /* щоб дропдаун розтягувався на ширину контейнера */
#menu .dropdown-menu {
  left:0; right:0; margin:0; padding:20px 24px;
  border:1px solid var(--line); border-top:none; border-radius:0 0 var(--radius) var(--radius);
  box-shadow:var(--shadow); background:#fff;
}

/* Грід усередині дропа (ocStore дає ul/li – вирівняємо плитками) */
#menu .dropdown-menu > .dropdown-inner { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:16px; }
@media (max-width:1199px){ #menu .dropdown-menu > .dropdown-inner { grid-template-columns:repeat(3,1fr); } }
@media (max-width:991px) { #menu .dropdown-menu > .dropdown-inner { grid-template-columns:repeat(2,1fr); } }

/* Плитки підкатегорій */
#menu .dropdown-menu a { display:block; background:var(--card); border:1px solid var(--line);
  border-radius:var(--radius); padding:12px 14px; color:var(--text); text-decoration:none;
  transition:transform var(--fast) ease, box-shadow var(--fast) ease, border-color var(--fast) ease;
}
#menu .dropdown-menu a:hover { transform:translateY(-2px); box-shadow:var(--shadow); border-color:var(--brand); color:var(--brand-hover); }

/* root-items у верхньому меню */
#menu .nav > li > a { padding:14px 18px; font-weight:600; color:#1E2732; }
#menu .nav > li > a:hover, #menu .nav > li.open > a { color:var(--brand-hover); }

/* Випадіння меню по hover (десктоп) */
@media (min-width:992px){
  #menu .dropdown:hover > .dropdown-menu{ display:block; }
}

/* Карточки “Рекомендуємо”/товари */
.product-thumb { border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:#fff; transition:box-shadow var(--fast) ease, transform var(--fast) ease; }
.product-thumb:hover{ box-shadow:var(--shadow); transform:translateY(-2px); }
.product-thumb .caption h4 a{ color:#1E2732; }
.product-thumb .caption h4 a:hover{ color:var(--brand-hover); }

/* Футер */
footer{ background:#F2F5F9; border-top:1px solid var(--line); }
footer a{ color:#506172; }
footer a:hover{ color:var(--brand-hover); }

/* Бейджі/ціни */
.price { color:#0E7AE6; font-weight:700; }
.label, .badge{ border-radius:8px; }

/* Breadcrumb + секції */
.breadcrumb{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); }
.box, .panel{ border-radius:var(--radius); border:1px solid var(--line); background:#fff; }

/* Невеликі правки списку категорій у лівих колонках */
.list-group a { border-radius:8px; }
.list-group a:hover { color:var(--brand-hover); border-color:var(--brand); }

/* === FIX: читабельність тексту у верхньому меню Myotek === */
#menu {
  background: linear-gradient(90deg, #0078D7, #005BBB) !important;
}

#menu .nav > li > a {
  color: #FFFFFF !important;
  font-weight: 600;
  text-shadow: 0 1px 2px rgba(0,0,0,0.25);
  transition: all 0.2s ease;
}

#menu .nav > li:hover > a,
#menu .nav > li.open > a,
#menu .nav > li.active > a {
  background: #F8F9FB !important;
  color: #005BBB !important;
  text-shadow: none;
  border-radius: 6px 6px 0 0;
}

/* Підменю (дропдауни) — світлі та контрастні */
#menu .dropdown-menu {
  background: #ffffff !important;
  border: 1px solid #d7e0ea;
  border-top: 3px solid #0078D7;
  box-shadow: 0 8px 18px rgba(0,0,0,0.12);
}

#menu .dropdown-menu a {
  color: #1f2a35 !important;
  background: #fff;
  padding: 10px 14px;
  border-radius: 8px;
  font-weight: 500;
}

#menu .dropdown-menu a:hover {
  background: rgba(0,120,215,0.08);
  color: #005BBB !important;
  border-color: #0078D7;
  text-decoration: none;
}

/* видалити сині обводки при кліку */
#menu .dropdown-menu a:focus {
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(0,120,215,0.3);
}
