/* =========================================================
   PGP v226 — Bottom Nav SOURCE FIX
   مصدر واحد للهيدر السفلي حتى ما يتحول أزرق بعد التحديث.
   - أبيض/زجاجي ثابت
   - خط أحمر ناعم على الإطار
   - بالمنتصف بالموبايل واللابتوب
   - الأيقونات والكتابة سوداء
   ========================================================= */

:root{
  --pgp-bottom-nav-final-bg: rgba(255,255,255,.86);
  --pgp-bottom-nav-final-text: #111315;
  --pgp-bottom-nav-final-border: rgba(0,0,0,.60);
  --pgp-bottom-nav-final-active: rgba(0,0,0,.06);
}

html body .tc-bottom-bar,
html body .pgp-bottom-nav{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  bottom:max(12px, env(safe-area-inset-bottom))!important;
  transform:translateX(-50%)!important;
  -webkit-transform:translateX(-50%)!important;

  width:calc(100vw - 44px)!important;
  max-width:720px!important;
  min-width:0!important;
  margin:0!important;
  box-sizing:border-box!important;

  min-height:76px!important;
  padding:9px 10px!important;
  border-radius:32px!important;
  overflow:hidden!important;
  z-index:99999!important;

  background:var(--pgp-bottom-nav-final-bg)!important;
  background-color:var(--pgp-bottom-nav-final-bg)!important;
  background-image:linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,255,255,.72))!important;

  border:1px solid var(--pgp-bottom-nav-final-border)!important;
  outline:0!important;

  -webkit-backdrop-filter:blur(22px) saturate(145%)!important;
  backdrop-filter:blur(22px) saturate(145%)!important;

  box-shadow:
    0 18px 55px rgba(0,0,0,.16),
    0 8px 25px rgba(0,0,0,.10),
    0 0 0 1px rgba(0,0,0,.10),
    inset 0 1px 0 rgba(255,255,255,.80)!important;

  color:var(--pgp-bottom-nav-final-text)!important;
}

html body .tc-bottom-bar::before,
html body .pgp-bottom-nav::before{
  content:none!important;
  display:none!important;
}

html body .tc-bottom-bar::after,
html body .pgp-bottom-nav::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  border-radius:inherit!important;
  pointer-events:none!important;
  z-index:2!important;
  background:
    linear-gradient(90deg, rgba(238,21,78,0) 0%, rgba(0,0,0,.60) 18%, rgba(0,0,0,.60) 82%, rgba(238,21,78,0) 100%) top / 100% 1px no-repeat,
    linear-gradient(90deg, rgba(238,21,78,0) 0%, rgba(0,0,0,.38) 20%, rgba(0,0,0,.38) 80%, rgba(238,21,78,0) 100%) bottom / 100% 1px no-repeat,
    linear-gradient(180deg, rgba(238,21,78,0) 0%, rgba(0,0,0,.34) 20%, rgba(0,0,0,.34) 80%, rgba(238,21,78,0) 100%) left / 1px 100% no-repeat,
    linear-gradient(180deg, rgba(238,21,78,0) 0%, rgba(0,0,0,.34) 20%, rgba(0,0,0,.34) 80%, rgba(238,21,78,0) 100%) right / 1px 100% no-repeat!important;
}

html body .tc-bottom-btn,
html body .tc-bottom-btn.primary,
html body .tc-bottom-btn.account,
html body .pgp-bottom-nav a,
html body .pgp-bottom-nav button,
html body #tcBottomAuthBtn,
html body #tcMessageBtn,
html body #tcMenuBtn{
  position:relative!important;
  z-index:4!important;

  flex:1 1 0!important;
  min-width:0!important;
  height:58px!important;
  margin:0!important;
  padding:0 6px!important;

  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;

  color:var(--pgp-bottom-nav-final-text)!important;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  border:0!important;
  border-radius:999px!important;
  box-shadow:none!important;
  outline:0!important;
  text-decoration:none!important;
}

html body .tc-bottom-btn svg,
html body .tc-bottom-btn svg *,
html body .pgp-bottom-nav svg,
html body .pgp-bottom-nav svg *,
html body #tcBottomAuthIcon,
html body #tcMessageBtn svg,
html body #tcMenuBtn svg{
  display:block!important;
  width:25px!important;
  height:25px!important;
  visibility:visible!important;
  opacity:1!important;
  stroke:var(--pgp-bottom-nav-final-text)!important;
  color:var(--pgp-bottom-nav-final-text)!important;
  fill:none!important;
  stroke-width:2.2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}

html body .tc-bottom-btn span,
html body .pgp-bottom-nav span,
html body #tcBottomAuthText{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  color:var(--pgp-bottom-nav-final-text)!important;
  font-size:11px!important;
  line-height:1!important;
  font-weight:850!important;
  white-space:nowrap!important;
}

html body .tc-bottom-btn:hover,
html body .tc-bottom-btn:active,
html body .tc-bottom-btn:focus,
html body .tc-bottom-btn.active,
html body .tc-bottom-btn.is-active,
html body .tc-bottom-btn.primary,
html body .tc-bottom-btn.account,
html body .pgp-bottom-nav .is-active{
  background:var(--pgp-bottom-nav-final-active)!important;
  color:var(--pgp-bottom-nav-final-text)!important;
  border:0!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75)!important;
}

html body .tc-bottom-btn:hover svg,
html body .tc-bottom-btn:active svg,
html body .tc-bottom-btn:focus svg,
html body .tc-bottom-btn.active svg,
html body .tc-bottom-btn.is-active svg,
html body .tc-bottom-btn.primary svg,
html body .tc-bottom-btn.account svg,
html body .tc-bottom-btn:hover svg *,
html body .tc-bottom-btn:active svg *,
html body .tc-bottom-btn:focus svg *,
html body .tc-bottom-btn.active svg *,
html body .tc-bottom-btn.is-active svg *,
html body .tc-bottom-btn.primary svg *,
html body .tc-bottom-btn.account svg *{
  color:var(--pgp-bottom-nav-final-text)!important;
  stroke:var(--pgp-bottom-nav-final-text)!important;
}

html body .tc-bottom-badge,
html body .tc-cart-count,
html body .cart-badge{
  background:#f3144e!important;
  color:#ffffff!important;
  border:0!important;
  box-shadow:0 8px 22px rgba(243,20,78,.32)!important;
}

@media(min-width:769px){
  html body .tc-bottom-bar,
  html body .pgp-bottom-nav{
    width:min(720px, calc(100vw - 44px))!important;
    max-width:720px!important;
  }
}

@supports (bottom: env(safe-area-inset-bottom)){
  html body .tc-bottom-bar,
  html body .pgp-bottom-nav{
    bottom:calc(12px + env(safe-area-inset-bottom))!important;
  }
}