/* TechBar Catalog UI — qlobal UI.
 * köhnə: techbar-trustbar.php, techbar-slider-pagin.php, techbar-ui-tweaks.php (mu) + functions.php (yuxarı banner, mobil menyu bağla düyməsi, WhatsApp gizlətmə) */

/* ===== Güvən zolağı (ana səhifə) ===== */
/* ==== Techbar güvən zolağı (2026-07-19) — rollback: mu-plugins/techbar-trustbar.php faylını sil ==== */
/* Slayder sütununun içində, bannerin dərhal altında — ayrı-ayrı kartlar.
   width:100% vacibdir: Elementor widget-wrap flex-dir, bloku məzmun eninə sıxırdı */
.tb-trustbar{margin:16px 0 0;width:100%;}
.tb-trust-in{display:flex;align-items:stretch;gap:12px;}
.tb-trustbar .tb-trust-item{
  flex:1 1 0;min-width:0;
  display:flex;align-items:center;justify-content:center;gap:11px;
  padding:15px 12px;text-decoration:none;
  background:#fff;border:1px solid #E2E9F8;border-radius:14px;
  box-shadow:0 2px 10px rgba(6,6,68,.06);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.tb-trustbar a.tb-trust-item:hover{
  transform:translateY(-2px);border-color:#1A62E7;
  box-shadow:0 8px 20px rgba(6,6,68,.12);
}
.tb-trust-ico{flex:none;display:flex;align-items:center;justify-content:center;color:#1A62E7;}
.tb-trust-ico svg{width:30px;height:30px;stroke-width:1.8;}
.tb-trust-txt{display:flex;flex-direction:column;gap:1px;min-width:0;}
.tb-trustbar span.tb-trust-num{
  margin:0;font-size:14.5px;font-weight:800;color:#1A62E7;line-height:1.2;
  letter-spacing:0;text-transform:none;
}
.tb-trustbar span.tb-trust-label{
  margin:0;font-size:12.5px;font-weight:600;color:#39415a;line-height:1.25;
  letter-spacing:0;text-transform:none;overflow-wrap:break-word;
}
/* Tablet: 2 sıra (3+2) */
@media (max-width:1024px){
  .tb-trust-in{flex-wrap:wrap;row-gap:10px;}
  .tb-trustbar .tb-trust-item{flex:1 1 30%;}
}
/* Mobil: kartlar GÖSTƏRİLMİR (İlkin 2026-07-20: "mobildə 5 stickeri yığışdır —
   təkcə banner və kateqoriyalar qalsın"). Desktop və tablet toxunulmaz. */
@media (max-width:767px){
  .tb-trustbar{display:none;}
}

/* ===== Slayder nöqtələri ===== */
/* Woodmart slayder paginasiyası — kiçik/sönük default, hover-də açılır */
.wd-slider .wd-slider-pagin{z-index:3}
.wd-slider .wd-slider-pagin .wd-nav-pagin{
  background:rgba(255,255,255,0);box-shadow:none;padding:5px 8px;gap:5px;
  transition:background .3s ease,padding .3s ease,box-shadow .3s ease}
.wd-slider .wd-slider-pagin .wd-nav-pagin-item span{
  width:6px;height:6px;background:#8fa3b3;opacity:.4;
  transition:width .3s ease,height .3s ease,opacity .3s ease,background .3s ease,border-radius .3s ease}
.wd-slider .wd-slider-pagin .wd-nav-pagin-item.wd-active span{
  background:#1E62E0;opacity:.7;width:7px;height:7px}
.wd-slider:hover .wd-slider-pagin .wd-nav-pagin{
  background:rgba(255,255,255,.96);padding:7px 11px;box-shadow:0 4px 16px rgba(20,40,80,.16)}
.wd-slider:hover .wd-slider-pagin .wd-nav-pagin-item span{width:9px;height:9px;opacity:.5;background:#c2ccd6}
.wd-slider:hover .wd-slider-pagin .wd-nav-pagin-item.wd-active span{
  background:#1E62E0;opacity:1;width:22px;border-radius:5px}
/* toxunma cihazları (hover yoxdur) — nöqtələr bir az daha görünən, amma yenə kiçik */
@media (hover:none){
  .wd-slider .wd-slider-pagin .wd-nav-pagin-item span{opacity:.55}
  .wd-slider .wd-slider-pagin .wd-nav-pagin-item.wd-active span{opacity:.9;width:8px;height:8px}
}

/* ===== UI xırdalıqları (WhatsApp düyməsi və s.) ===== */
/* ==== WhatsApp düyməsi: kompakt dairə + diqqət effektləri ==== */
/* DOM (qlwapp plagini JS ilə qurur): .qlwapp__container--bottom-right > a.qlwapp__button > i.qlwapp__icon + span.qlwapp__text */
.qlwapp .qlwapp__text{display:none !important;}
.qlwapp a.qlwapp__button{
  width:56px !important;height:56px !important;
  min-width:0 !important;padding:0 !important;margin:0 !important;
  border-radius:50% !important;
  display:flex !important;align-items:center;justify-content:center;
  position:relative;
  box-shadow:0 6px 18px rgba(6,6,68,.18);
  animation:tbWaPulse 2.4s ease-out infinite;
}
.qlwapp a.qlwapp__button .qlwapp__icon{
  margin:0 !important;font-size:27px !important;line-height:1 !important;
}
/* Diqqət: qırmızı bildiriş nöqtəsi */
.qlwapp a.qlwapp__button::after{
  content:"";position:absolute;top:1px;right:1px;
  width:13px;height:13px;border-radius:50%;
  background:#D52624;border:2px solid #fff;
}
/* Diqqət: yaşıl puls halqası */
@keyframes tbWaPulse{
  0%{box-shadow:0 6px 18px rgba(6,6,68,.18),0 0 0 0 rgba(37,211,102,.45);}
  70%{box-shadow:0 6px 18px rgba(6,6,68,.18),0 0 0 14px rgba(37,211,102,0);}
  100%{box-shadow:0 6px 18px rgba(6,6,68,.18),0 0 0 0 rgba(37,211,102,0);}
}
@media (prefers-reduced-motion:reduce){
  .qlwapp a.qlwapp__button{animation:none;}
}

/* ==== Məhsul kartı tooltip-i («Müqayisə et» və s.): mətn düymədən uzağa sürüşürdü ====
   Səbəb: .tooltip wrapper-inə sabit ~260px en verilir (mətn ~95px), Bootstrap JS mövqeni
   enli wrapper-ə görə hesablayır → pill düymədən ~70px sol-da görünürdü (ölçüldü). */
body > .tooltip{width:max-content !important;max-width:280px !important;}
body > .tooltip .tooltip-inner{white-space:nowrap;max-width:none;}

/* ==== Ana səhifə hero bölməsi (8aaa33f): mobil/tabletdə headerin altına girirdi ====
   Bölmənin bütün cihazlarda margin-top:-30px-i var; ≥1024-də header hündürlüyü bunu
   udur, amma 390/768-də slayderin üst 20px-i header tərəfindən örtülürdü (ölçüldü,
   İlkin iPhone skrinşotu 2026-07-20: "slider yuxarıdan kəsilib"). Yalnız dar enlərdə sıfırla. */
@media (max-width: 1023px){
  .elementor-2025 .elementor-element-8aaa33f{margin-top:0 !important;}
}

/* ===== Yuxarı kampaniya banneri ===== */
.top-banner {
            display: block;
            width: 100%;
            text-align: center;
        }

        @media (max-width: 768px) {
            .top-banner img {
                width: 100%;
                height: auto !important;
            }
        }
.top-banner img{display:block;width:100%;height:auto;max-width:1920px;margin:0 auto;border:none;image-rendering:-webkit-optimize-contrast;}

/* ===== Mobil menyu bağla düyməsi ===== */
@media (max-width: 480px) {
    .custom-menu-close {
        position: fixed;
        top: 60px;
        right: 7px;
        font-size: 18px;
        z-index: 999999;
        cursor: pointer;
        background: #fff;
        width: 30px;
        height: 30px;
        display: none;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        box-shadow: 0 0 10px rgba(0,0,0,0.2);
    }
}
@media (min-width: 481px) {
    .custom-menu-close {
        display: none !important;
    }
}
body:has(.mobile-nav.wd-opened) .custom-menu-close,body.wd-side-hidden .custom-menu-close{display:flex;}

/* ===== WhatsApp düyməsi: səbət paneli və ya mobil menyu açıq olanda arxada qalsın (əvvəl hər 300 ms JS yoxlayırdı) ===== */
body:has(.cart-widget-side.wd-opened) .qlwapp__container,
body:has(.mobile-nav.wd-opened) .qlwapp__container{position:static !important;z-index:0 !important;pointer-events:none !important;opacity:.3 !important;}

/* ===== Woodmart Custom JS-dən köçən davranışlar (CSS ilə — JS gözləmədən) ===== */
/* Kartda qiymət blokunun üst boşluğu (əvvəl JS hər AJAX-dan sonra inline yazırdı) */
.wrap-price{margin-top:0 !important;}
/* «Stokda yoxdur» nişanı kartın şəkil blokunun küncündə */
.product-element-bottom{position:relative;}
.product-wrapper > .button-stock-status.out-of-stock{position:absolute;z-index:10;}
/* Mobildə (≤480px) Elementor qlobal şablonundakı şəkil vidceti gizli (əvvəl JS səhifədəki ilk vidceti gizlədirdi — bütün səhifələrdə bu idi) */
@media (max-width: 480px){
	.elementor-19934 .elementor-element-6b7e512 > .elementor-widget-container{display:none !important;}
}
