/* ═══════════════════════════════════════════════════════════════
   EG SEARCH UI v1 — 2026-10-10. Флаг: ?eg-ui=new (клас на <body>).
   Включає: індикатори завантаження (A–D) + фікси верстки 1–5.
   НЕ чіпає глобальний custom.css.
   ═══════════════════════════════════════════════════════════════ */

/* ── A/B3: верхня смуга прогресу ── */
.eg-sui-bar{position:fixed;top:0;left:0;height:3px;width:0;z-index:100000;
  background:linear-gradient(90deg,var(--accent,#1d3fb3),var(--accent-2,#d96a2a));
  opacity:0;transition:width .25s ease,opacity .2s}
.eg-sui-bar.on{opacity:1}

/* ── B3: оверлей «Шукаємо товари…» ── */
.eg-sui-ov{position:fixed;inset:0;z-index:99999;display:none;
  align-items:center;justify-content:center;flex-direction:column;gap:12px;
  background:rgba(246,241,231,.78);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.eg-sui-ov.on{display:flex}
.eg-sui-sp{width:38px;height:38px;border:3px solid rgba(29,63,179,.22);border-top-color:var(--accent,#1d3fb3);
  border-radius:50%;animation:eg-sui-rot .8s linear infinite}
@keyframes eg-sui-rot{to{transform:rotate(360deg)}}
.eg-sui-msg{font-size:14px;font-weight:800;color:#25315a;text-align:center;padding:0 16px}
.eg-sui-slow{display:none;font-size:12px;color:#6b7794}
.eg-sui-ov.slow .eg-sui-slow{display:block}
.eg-sui-ov.err .eg-sui-sp{display:none}
.eg-sui-ov.err .eg-sui-msg:before{content:"⚠️ "}
.eg-sui-retry{display:none;margin-top:6px;padding:12px 22px;border:none;border-radius:12px;
  background:var(--accent,#1d3fb3);color:#fff;font-weight:800;font-size:13px;cursor:pointer}
.eg-sui-ov.err .eg-sui-retry{display:inline-block}
.eg-sui-help{display:none;font-size:12px;color:#6b7794;text-align:center}
.eg-sui-ov.err .eg-sui-help{display:block}
@media (prefers-reduced-motion: reduce){ .eg-sui-sp{animation-duration:2.4s} }

/* ── A: стан кнопки пошуку ── */
.eg-sui-btn{position:relative}
.eg-sui-btn.eg-sui-loading{pointer-events:none;cursor:wait;filter:brightness(.95)}
.eg-sui-btn.eg-sui-loading svg,.eg-sui-btn.eg-sui-loading img,.eg-sui-btn.eg-sui-loading .eg-sui-lbl{opacity:0}
.eg-sui-btn.eg-sui-loading:after{content:"";position:absolute;left:50%;top:50%;width:16px;height:16px;margin:-8px 0 0 -8px;
  border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:eg-sui-rot .7s linear infinite}
.eg-sui-btn.eg-sui-loading.eg-sui-light:after{border-color:rgba(29,63,179,.3);border-top-color:#1d3fb3}

/* ── B1: спінер всередині поля ── */
.eg-sui-field{position:relative}
.eg-sui-inspin{position:absolute;right:44px;top:50%;width:16px;height:16px;margin-top:-8px;display:none;
  border:2px solid rgba(29,63,179,.25);border-top-color:var(--accent,#1d3fb3);border-radius:50%;animation:eg-sui-rot .7s linear infinite;z-index:3}
.eg-sui-field.eg-sui-loading .eg-sui-inspin{display:block}
.eg-sui-hintq{display:none;font-size:12px;color:#6b7794;padding:6px 2px}
.eg-sui-hintq.on{display:block}

/* ── B2: скелетон-рядки підказок ── */
.eg-sui-skel-row{display:flex;gap:12px;align-items:center;padding:10px 12px}
.eg-sui-skel-th{width:48px;height:48px;border-radius:8px;flex:0 0 48px}
.eg-sui-skel-tt{height:12px;border-radius:6px;flex:1}
.eg-sui-dim{opacity:.5;transition:opacity .15s}
.eg-sui-shim{background:linear-gradient(90deg,#eef1f7 25%,#e3e8f3 37%,#eef1f7 63%);
  background-size:400% 100%;animation:eg-sui-shim 1.2s infinite}
@keyframes eg-sui-shim{0%{background-position:100% 0}100%{background-position:0 0}}

/* ── B4: скелетон-картки на сторінці результатів ── */
.eg-sui-skel-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media(min-width:769px){ .eg-sui-skel-grid{grid-template-columns:repeat(4,1fr)} }
.eg-sui-skel-card{background:#fff;border:1px solid #e6e9f2;border-radius:12px;overflow:hidden}
.eg-sui-skel-img{aspect-ratio:1/1}
.eg-sui-skel-line{height:12px;margin:10px;border-radius:6px}
.eg-sui-skel-line.s{width:60%}
.eg-sui-skel-btn{height:40px;margin:10px;border-radius:10px}

/* ── B5: кнопка «Показати ще» ── */
.eg-sui-more.eg-sui-loading{pointer-events:none;opacity:.85;cursor:wait}

/* ═══ ФІКСИ ВЕРСТКИ 1–5 (лише під флагом) ═══ */

/* 1) картки: рівна висота, фото не ховається, опис не налазить */
body.eg-ui-new.search ul.products.columns-3{display:grid!important;grid-template-columns:repeat(2,1fr)!important;
  gap:14px!important;align-items:stretch!important;margin:14px 0 0!important;padding:0!important;list-style:none}
@media(min-width:769px){ body.eg-ui-new.search ul.products.columns-3{grid-template-columns:repeat(4,1fr)!important} }
body.eg-ui-new.search ul.products.columns-3>li.product,
body.eg-ui-new.search ul.products.columns-4>li.product{display:flex!important;flex-direction:column!important;
  width:auto!important;margin:0!important;float:none!important;background:#fff;border:1px solid #e6e9f2;border-radius:14px;overflow:hidden}
body.eg-ui-new.search ul.products li.product a.woocommerce-LoopProduct-link{display:flex;flex-direction:column;height:100%}
body.eg-ui-new.search ul.products li.product .wd-product{display:flex;flex-direction:column;height:100%}
body.eg-ui-new.search ul.products li.product img{aspect-ratio:1/1;object-fit:contain;width:100%;height:auto;display:block;background:#fff}
/* фото-зона фіксованої висоти → прибирає мост / стрибки */
body.eg-ui-new.search ul.products li.product .wd-product-thumb,
body.eg-ui-new.search ul.products li.product .product-image-link{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden}
/* назва: рівно 3 рядки, далі «…» */
body.eg-ui-new.search ul.products li.product .woocommerce-loop-product__title,
body.eg-ui-new.search ul.products li.product h3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  font-size:14px;line-height:1.3;min-height:calc(3 * 1.3em)}
/* опис у картці — ПРИБРАТИ (він і налазив на фото) */
body.eg-ui-new.search ul.products li.product .woocommerce-product-details__short-description,
body.eg-ui-new.search ul.products li.product .eg-p-desc,
body.eg-ui-new.search ul.products li.product p.eg-desc{display:none!important}
/* ціна+кнопка завжди знизу картки */
body.eg-ui-new.search ul.products li.product .price{margin-top:auto!important}

/* 2) контент не під нижньою панеллю */
body.eg-ui-new.search .eg-archive-wrap{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}

/* 3) прибрати ДУБЛЬ кнопки фільтрів: ховаємо «Фільтр» з нижньої панелі на сторінці пошуку (лишаємо кнопку сторінки) */
body.eg-ui-new.search .eg-bottom-nav a[href*="egOpenFilter"],
body.eg-ui-new.search .eg-bottom-nav .eg-bn-filter{display:none!important}

/* 4) прибрати порожній проміжок: заголовок і панель керування — одним компактним рядом */
body.eg-ui-new.search .eg-archive-top{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0!important}
body.eg-ui-new.search .eg-archive-top .eg-archive-title{margin:0!important;font-size:20px;line-height:1.25}
body.eg-ui-new.search .eg-archive-main>h1{margin:0 0 10px!important}
body.eg-ui-new.search .eg-archive-main{padding-top:0!important}
body.eg-ui-new.search .eg-sui-results{min-height:60vh}

/* 5) сортування як у каталозі */
body.eg-ui-new.search .eg-sort-wrap select.orderby{height:44px;padding:0 38px 0 14px;border:1px solid #d8e0ef;border-radius:12px;
  background:#fff;font-weight:700;color:#25315a;-webkit-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2325315a' stroke-width='2'><path d='m6 9 6 6 6-6'/></svg>");
  background-repeat:no-repeat;background-position:right 12px center}
body.eg-ui-new.search .eg-mob-filter-btn{height:44px;border-radius:12px}


/* ═══ EG-SUI v2 2026-10-10 (межі ПОШУКУ) ═══ */
/* п.2 КАРТКИ: один вид для всіх — прибираємо опис над фото (eg-p-topdesc рендериться
   лише коли в товару є short/long description → звідси «у частини є, у частини немає») */
body.eg-ui-new.search .eg-p-card .eg-p-topdesc{display:none!important}

/* п.1 ПАНЕЛЬ «Фільтри + Сортування»: нормальний потік, один рядок, суцільний фон, без перекриття */
body.eg-ui-new.search .eg-archive-head{display:block;margin:0 0 10px!important;font-size:20px;line-height:1.25}
body.eg-ui-new.search .eg-archive-head .eg-count{font-weight:400;font-size:14px;color:#566074}
body.eg-ui-new.search .eg-archive-main > .eg-archive-top{
  position:static!important;z-index:auto!important;transform:none!important;
  display:flex!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:space-between!important;
  gap:10px!important;width:auto!important;margin:0 0 14px!important;padding:8px 10px!important;
  background:#fff!important;border:1px solid #e6e9f2!important;border-radius:14px!important;
  box-shadow:0 2px 10px rgba(15,23,42,.04)!important;
}
body.eg-ui-new.search .eg-archive-main > .eg-archive-top .eg-mob-filter-btn{
  flex:0 0 auto!important;width:auto!important;min-width:130px!important;height:44px!important;
  border-radius:12px!important;padding:0 14px!important;justify-content:center!important;white-space:nowrap!important;
}
body.eg-ui-new.search .eg-archive-main > .eg-archive-top .eg-sort-wrap{
  flex:1 1 auto!important;min-width:0!important;width:auto!important;order:initial!important;
}
body.eg-ui-new.search .eg-archive-main > .eg-archive-top .eg-sort-wrap form,
body.eg-ui-new.search .eg-archive-main > .eg-archive-top .eg-sort-wrap select{
  width:100%!important;min-width:0!important;height:44px!important;
}
/* нейтралізація розбіжних правил custom.css лише на пошуку (body.search-results не чіпаю) */
body.eg-ui-new.search .eg-archive-top{background:#fff!important}
body.eg-ui-new.search .eg-archive-sidebar{background:#fff!important}
@media(max-width:420px){
  body.eg-ui-new.search .eg-archive-main > .eg-archive-top{gap:8px!important;padding:6px 8px!important}
  body.eg-ui-new.search .eg-archive-main > .eg-archive-top .eg-mob-filter-btn{min-width:112px!important;font-size:11px!important}
}

/* ═══ VARIANT A 2026-10-11: нейтралізація розбіжних правил custom.css (body.search-results)
   лише під флагом ?eg-ui=new. custom.css НЕ змінюється. ═══ */
body.eg-ui-new.search .archive.search-results { display: block !important; }
body.eg-ui-new.search .eg-archive-wrap {
  flex: 0 0 100% !important; width: 100% !important; max-width: 1200px !important; margin: 0 auto !important;
}
body.eg-ui-new.search .wd-content-area { padding: 0 !important; }
body.eg-ui-new.search .main-page-wrapper { padding: 0 !important; }
@media (max-width: 1024px) {
  body.eg-ui-new.search .eg-archive-wrap { grid-template-columns: 1fr !important; }
  body.eg-ui-new.search .eg-archive-sidebar { display: none; }
  body.eg-ui-new.search .eg-archive-sidebar.open { display: block; }
  body.eg-ui-new.search .eg-archive-main ul.products { grid-template-columns: repeat(2, 1fr) !important; gap: 10px 8px !important; }
}