/* =========================================================
   PGP v228 — Safe no-blue first paint for Following/Liked
   لا يمسح ملفات ولا أكواد خارج المطلوب.
   يعالج:
   1) صفحة Following تفتح بدون 500 بإرجاع ملف الصفحة الأصلي.
   2) منع الفلاش الأزرق/الغامق ببداية صفحات Following وLiked.
   3) خط الهيدر السفلي أسود 60%.
   ========================================================= */

:root{
  --pgp-bottom-nav-final-border:rgba(0,0,0,.60)!important;
}

/* Page-first-paint guard only for the two pages and saved/following wrappers */
html body.pgp-page-following,
/* Keep local following/saved page surfaces white while loading */
/* Some old follow-ring styles are blue (#ee154e). Do not delete them; override only on these pages. */
html body :is(.following-wrap,.saved-wrap) :is(
  .pgp-garage-follow-ring-target,
  img.pgp-garage-follow-ring-target,
  .pgp-garage-is-following img,
  .pgp-garage-is-following .pgp-garage-follow-ring-target
){
  outline-color:#ee154e!important;
  box-shadow:
    0 0 0 2.5px #ee154e,
    0 0 0 5.5px rgba(238,21,78,.14),
    0 8px 18px rgba(238,21,78,.16)!important;
}

/* Following and liked page texts stay readable after forcing first paint white */
html body :is(.following-wrap,.saved-wrap) :is(h1,h2,h3,p,.garage-name,.product-title,.saved-count,.following-count){
  color:#141414;
}

/* Bottom nav: black 60% line instead of red */
html body .tc-bottom-bar,
html body .pgp-bottom-nav{
  border-color:rgba(0,0,0,.60)!important;
  border:1px solid rgba(0,0,0,.60)!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;
}

html body .tc-bottom-bar::after,
html body .pgp-bottom-nav::after{
  background:
    linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.60) 18%, rgba(0,0,0,.60) 82%, rgba(0,0,0,0) 100%) top / 100% 1px no-repeat,
    linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.38) 20%, rgba(0,0,0,.38) 80%, rgba(0,0,0,0) 100%) bottom / 100% 1px no-repeat,
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.34) 20%, rgba(0,0,0,.34) 80%, rgba(0,0,0,0) 100%) left / 1px 100% no-repeat,
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.34) 20%, rgba(0,0,0,.34) 80%, rgba(0,0,0,0) 100%) right / 1px 100% no-repeat!important;
}