/* ============================================================
   ZAKERLI — Icon System styles
   الأيقونات بتاخد مقاسها من حجم الخط اللي حواليها (1em)، فأي زرار أو
   عنوان بيفضل متوازن من غير ما نظبط كل حالة لوحدها.
   ============================================================ */
.zi{
  width:1.1em; height:1.1em;
  display:inline-block;
  vertical-align:-0.2em;
  flex-shrink:0;
  overflow:visible;
}
.zi-w{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:0;
  margin-inline:1px;
}
/* أيقونات الواجهة (اللي بتستعمل currentColor) بتورث لون النص لوحدها،
   فمفيش قواعد لون هنا — ده اللي بيخليها تتغير مع الدارك/اللايت من غير
   أي كود. */

/* شوية سياقات محتاجة مقاس أكبر شوية من النص */
.page-title .zi, h1 .zi, h2 .zi{ width:1em; height:1em; vertical-align:-0.12em; }
.big-num .zi, .price-num .zi{ width:.8em; height:.8em; }
.btn .zi, .btn-ghost .zi, .btn-mint .zi, .btn-danger .zi{ width:1.15em; height:1.15em; }
.method-opt .zi{ width:1.25em; height:1.25em; vertical-align:-.28em; }
.toast .zi{ width:1.2em; height:1.2em; }

/* داخل نظام الهدايا — الخانات دي متحددة بـ font-size في gifts.css،
   والأيقونة بتاخد مقاسها منه (1em) فمفيش أي مقاسات مكررة هنا. */
.zg-i-emoji .zi, .zg-cine-emoji .zi, .zg-gift-card .zg-emoji .zi{
  width:1em; height:1em; vertical-align:-.08em;
}
.zg-i-emoji .zi-w, .zg-cine-emoji .zi-w, .zg-gift-card .zg-emoji .zi-w{ margin:0; }
.zg-row .zi{ width:1.35em; height:1.35em; vertical-align:-.3em; }
.zg-coins .zi, .zg-b-coins .zi, .zg-wallet .zi{ width:1.15em; height:1.15em; vertical-align:-.22em; }
.zg-ticker .zi{ width:1.25em; height:1.25em; vertical-align:-.28em; }
.zg-open-btn .zi{ width:20px; height:20px; vertical-align:0; }
.zg-x .zi{ width:14px; height:14px; vertical-align:0; }

/* الأيقونات الملونة بتفضل واضحة على اللايت والدارك، بس بنزود لمسة ظل
   خفيفة على اللايت عشان الحواف الفاتحة (زي الكاستل والصاروخ) ماتضيعش. */
:root[data-theme="light"] .zi-w .zi{ filter:drop-shadow(0 1px 1px rgba(36,31,20,.12)); }

@media (prefers-reduced-motion: no-preference){
  .zg-open-btn:hover .zi{ transform:scale(1.12) rotate(-6deg); transition:transform .18s ease; }
}