/* شهاب — عارض الصور (PhotoSwipe 5) على هوية الدار.

   الخلفية كحلي بدل الأسود، الأيقونات بيضا، الخط Almarai، العدّاد بأرقام
   جدولية، والكابشن عمود جنب الصورة من ناحية البداية (اليمين في RTL) على
   الشاشات العريضة وشريط تحتها على الضيّقة. الأزرار المضافة (نسخ الرابط،
   ملء الشاشة) بأيقونات Font Awesome جوّه أزرار PhotoSwipe نفسها. */

.sh-pswp{
  --pswp-bg:#0a1a33;
  --pswp-placeholder-bg:#0f2a4f;
  --pswp-root-z-index:9950;
  --pswp-icon-color:#fff;
  --pswp-icon-color-secondary:#0a1a33;
  --pswp-icon-stroke-color:#0a1a33;
  --pswp-icon-stroke-width:0;
  --pswp-error-text-color:rgba(255,255,255,.75);
  font-family:var(--sh-font);
}
.sh-pswp .pswp__counter{
  font-family:var(--sh-font);font-size:13px;font-weight:800;opacity:.85;text-shadow:none;
  font-variant-numeric:tabular-nums;direction:ltr;unicode-bidi:isolate;
}
.sh-pswp .pswp__button--sh-share,.sh-pswp .pswp__button--sh-fs{color:#fff;font-size:16px;line-height:60px;opacity:.85}
.sh-pswp .pswp__button--sh-share:hover,.sh-pswp .pswp__button--sh-fs:hover{opacity:1}
.sh-pswp .pswp__button--sh-share .sh-i,.sh-pswp .pswp__button--sh-fs .sh-i{display:inline-block;vertical-align:middle}
.sh-pswp .pswp__button:focus-visible{outline:2px solid var(--sh-sky);outline-offset:-4px}
/* the vendor's 60px chevrons are billboard-sized; a 34px glyph in the same 75×100 hit area reads as a cue */
.sh-pswp .pswp__button--arrow .pswp__icn{width:34px;height:34px;margin-top:-17px}
.sh-pswp .pswp__button--arrow--prev .pswp__icn{left:20px}
.sh-pswp .pswp__button--arrow--next .pswp__icn{right:20px}

/* ---- caption: a band under the picture, centred, clear of the arrows ---- */
.sh-pswp__caption{
  position:absolute;z-index:10;left:50%;bottom:22px;transform:translateX(-50%);
  width:min(880px,calc(100% - 160px));
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 24px;
  color:#fff;pointer-events:none;
}
.sh-pswp__caption > *{pointer-events:auto}
.sh-pswp__kicker{display:inline-flex;align-items:center;gap:8px;font-size:11.5px;font-weight:800;letter-spacing:.02em;color:var(--sh-sky)}
.sh-pswp__kicker .sh-mark{width:14px;height:11px;background:var(--sh-sky);flex:none}
.sh-pswp__title{
  margin:0;font-family:var(--sh-font);font-size:16px;font-weight:800;line-height:1.55;text-wrap:balance;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.sh-pswp__album{
  grid-column:2;grid-row:1/3;justify-self:end;
  display:inline-flex;align-items:center;gap:8px;white-space:nowrap;
  font-size:12.5px;font-weight:800;color:#fff;padding:9px 14px;border:1px solid rgba(255,255,255,.35);
  transition:background .18s ease,border-color .18s ease,color .18s ease;
}
@media (hover:hover){.sh-pswp__album:hover{background:#fff;border-color:#fff;color:var(--sh-navy)}}
.sh-pswp__album .sh-i{font-size:11px}

/* narrow: the band is the full width, and the album button drops under the title */
@media (max-width:899px){
  .sh-pswp__caption{width:calc(100% - 32px);bottom:16px;grid-template-columns:minmax(0,1fr);gap:6px}
  .sh-pswp__title{font-size:15px;-webkit-line-clamp:2}
  .sh-pswp__album{grid-column:1;grid-row:auto;justify-self:start;margin-top:4px}
}

/* ---- toast (copy link) ---- */
.sh-pswp__toast{
  position:absolute;z-index:11;left:50%;bottom:24px;transform:translate(-50%,8px);
  padding:9px 16px;background:#fff;color:var(--sh-navy);font-family:var(--sh-font);font-size:12.5px;font-weight:800;
  opacity:0;visibility:hidden;transition:opacity .22s ease,transform .22s ease,visibility 0s linear .22s;pointer-events:none;
  max-width:min(90vw,520px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;direction:ltr;
}
.sh-pswp__toast[data-on]{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .22s ease,transform .22s ease,visibility 0s}

@media (prefers-reduced-motion:reduce){
  .sh-pswp__album,.sh-pswp__toast{transition:none}
}