/* =====================================================================
   الخلفيّة المعتمدة الموحّدة - تُضاف لأيّ صفحة ثابتة لتوحيدها مع الرئيسيّة.
   الاستعمال في <head>:  <link rel="stylesheet" href="assets/chrome.css">
   وبعد <body> مباشرة:   <div class="hero-pattern" aria-hidden="true"></div>
   ===================================================================== */

/* كحليّ عميق موحّد + توهّجان ذهبيّان (نفس الصفحة الرئيسيّة) */
html, body { min-height: 100vh; }
body {
  background-color: #030f21 !important;
  background-image:
    radial-gradient(115% 80% at 84% -6%, rgba(224,197,143,0.10) 0%, rgba(224,197,143,0.03) 30%, transparent 52%),
    radial-gradient(120% 85% at 6% 10%, rgba(224,197,143,0.045) 0%, transparent 46%) !important;
  background-attachment: fixed;
}

/* النقش المقنّع الخافت (يظهر من الزاوية) */
.hero-pattern {
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background-color: rgba(224,197,143,0.03);
  -webkit-mask-image: url("pattern.svg"), radial-gradient(150% 140% at 0% 0%, #000 0%, rgba(0,0,0,0.4) 38%, transparent 72%);
  -webkit-mask-repeat: repeat, no-repeat; -webkit-mask-size: 140px 104px, 100% 100%; -webkit-mask-composite: source-in;
          mask-image: url("pattern.svg"), radial-gradient(150% 140% at 0% 0%, #000 0%, rgba(0,0,0,0.4) 38%, transparent 72%);
          mask-repeat: repeat, no-repeat; mask-size: 140px 104px, 100% 100%; mask-composite: intersect;
}

/* المحتوى فوق النقش */
body > *:not(.hero-pattern):not(.site-header):not(.topnav) { position: relative; z-index: 1; }

/* إخفاء زرّ اللغة القديم (ثنائيّ) - يُستبدل بقائمة اللغة العائمة (٤ لغات) */
.lang-switch { display: none !important; }

/* قائمة اللغة (نسخة عائمة تُحقن تلقائيًّا في الصفحات الفرعيّة) */
.lang-dd { position: relative; }
.lang-dd--float { position: fixed; inset-block-start: 22px; inset-inline-end: 2.4rem; inset-block-end: auto; inset-inline-start: auto; z-index: 1200; }
.lang-dd-btn { display: inline-flex; align-items: center; justify-content: center; background: rgba(3,15,33,0.6); border: 1px solid rgba(224,197,143,0.28); color: #f4e3bd; border-radius: 999px; padding: .5rem; line-height: 0; cursor: pointer; box-shadow: 0 6px 18px rgba(0,0,0,0.35); transition: border-color .2s, color .2s; }
.lang-dd-btn:hover { border-color: #c9a86a; color: #e0c58f; }
.lang-dd-menu { position: absolute; inset-block-end: calc(100% + .45rem); inset-inline-start: 0; min-inline-size: 9rem; background: #0a2440; border: 1px solid rgba(224,197,143,0.2); border-radius: 12px; box-shadow: 0 12px 30px rgba(0,0,0,0.45); padding: .3rem; display: none; z-index: 91; }
.lang-dd.open .lang-dd-menu { display: block; }
.lang-dd-menu button { display: block; inline-size: 100%; text-align: start; background: none; border: 0; color: #d7c9ac; padding: .5rem .7rem; border-radius: 8px; font: inherit; font-size: .9rem; cursor: pointer; }
.lang-dd-menu button:hover { background: rgba(224,197,143,0.1); color: #e0c58f; }
