/* ============================================================================
   «مدار ارك» — ARC Orbit · أنماط العارض 360 (هوية «لؤلؤ دافئ»: زجاج للكروم فقط)
   ============================================================================ */
.orbit-lock { overflow: hidden !important; }

/* الطبقة الكاملة */
.orbit-ov { position: fixed; inset: 0; z-index: 9000; background: #17110c; opacity: 0; transition: opacity .38s ease; }
.orbit-ov.is-on { opacity: 1; }
.orbit-root { position: absolute; inset: 0; }
/* شبح البطاقة أثناء التمدّد (FLIP) */
.orbit-ghost { position: fixed; z-index: 3; background-size: cover; background-position: center; border-radius: 18px; opacity: 0;
  transition: left .62s cubic-bezier(.2,.8,.2,1), top .62s cubic-bezier(.2,.8,.2,1), width .62s cubic-bezier(.2,.8,.2,1), height .62s cubic-bezier(.2,.8,.2,1), border-radius .62s ease, opacity .6s ease; pointer-events: none; }
.orbit-ghost.is-on { opacity: 1; }
.orbit-ghost.is-out { opacity: 0 !important; }

/* المسرح (يُستخدم أيضاً مضمَّناً في اللوحة) */
.orbit-stage { position: relative; width: 100%; height: 100%; overflow: hidden; background: #17110c; touch-action: none; user-select: none; -webkit-user-select: none; font-family: 'Almarai', 'Manrope', system-ui, sans-serif; color: #fff; }
.orbit-canvas { position: absolute; inset: 0; width: 100% !important; height: 100% !important; display: block; cursor: grab; }
.orbit-stage.is-lensdrag .orbit-canvas { cursor: move; }
.orbit-canvas:active { cursor: grabbing; }

/* ستارة لؤلؤية عند الفتح/التحميل */
.orbit-veil { position: absolute; inset: 0; z-index: 4; display: grid; place-items: center; gap: 14px; grid-auto-flow: row; align-content: center;
  background: radial-gradient(120% 100% at 50% 40%, #F6F0E6 0%, #E9DFCF 60%, #D9CBB6 100%); opacity: 0; pointer-events: none; transition: opacity .5s ease; }
.orbit-veil.is-on { opacity: 1; pointer-events: auto; }
.orbit-ring { width: 46px; height: 46px; border-radius: 50%; border: 2px solid rgba(138,90,43,.22); border-top-color: #8A5A2B; animation: orbitSpin 1.1s linear infinite; }
.orbit-veil-txt { font-family: 'Noto Kufi Arabic', 'Manrope', sans-serif; font-weight: 700; font-size: 14px; color: #6B5B4A; letter-spacing: .04em; }
@keyframes orbitSpin { to { transform: rotate(360deg); } }

/* الـHUD */
.orbit-hud { position: absolute; inset: 0; z-index: 5; pointer-events: none; display: flex; flex-direction: column; justify-content: space-between;
  padding: max(14px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom)); }
.orbit-hud-top, .orbit-hud-bottom { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.orbit-hud-bottom { flex-direction: column; align-items: center; justify-content: flex-end; gap: 10px; }
.orbit-hud > * > * { pointer-events: auto; }
.orbit-title { display: flex; flex-direction: column; gap: 3px; padding: 10px 14px; border-radius: 14px; max-width: min(70vw, 420px);
  background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.22); -webkit-backdrop-filter: blur(18px) saturate(160%); backdrop-filter: blur(18px) saturate(160%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 10px 30px -18px rgba(0,0,0,.6); }
.orbit-title:empty { display: none; }
.orbit-title-main { font-family: 'Noto Kufi Arabic', 'Manrope', sans-serif; font-weight: 700; font-size: 15px; line-height: 1.5; }
.orbit-title-sub { font-size: 12px; opacity: .78; }
.orbit-title-sub:empty { display: none; }
.orbit-hud-actions { display: flex; gap: 8px; align-items: center; }
.orbit-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 14px; border-radius: 999px; cursor: pointer;
  color: #fff; font: 700 13px/1 'Almarai', 'Manrope', sans-serif; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
  -webkit-backdrop-filter: blur(18px) saturate(160%); backdrop-filter: blur(18px) saturate(160%); box-shadow: inset 0 1px 0 rgba(255,255,255,.35); transition: background .2s, transform .35s cubic-bezier(.2,.8,.2,1); }
.orbit-btn:hover { background: rgba(255,255,255,.22); }
.orbit-btn.is-on { background: linear-gradient(135deg, #A87038, #8A5A2B); border-color: rgba(240,210,164,.6); }
.orbit-close { width: 42px; padding: 0; justify-content: center; font-size: 26px; font-weight: 300; }

/* مبدّل الوعد/الدليل */
.orbit-toggle[hidden] { display: none !important; }
.orbit-toggle { display: inline-flex; padding: 4px; border-radius: 999px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
  -webkit-backdrop-filter: blur(18px) saturate(160%); backdrop-filter: blur(18px) saturate(160%); box-shadow: inset 0 1px 0 rgba(255,255,255,.35); }
.orbit-tg { min-height: 36px; padding: 0 18px; border: 0; border-radius: 999px; background: transparent; color: rgba(255,255,255,.82); cursor: pointer;
  font: 700 13px/1 'Almarai', 'Manrope', sans-serif; transition: background .25s, color .25s; }
.orbit-tg.is-on { background: linear-gradient(135deg, #A87038, #8A5A2B); color: #fff; box-shadow: 0 6px 16px -8px rgba(0,0,0,.6); }

/* شرائح المشاهد */
.orbit-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; max-width: 92vw; }
.orbit-chips:empty { display: none; }
.orbit-chip { min-height: 32px; padding: 0 13px; border-radius: 999px; cursor: pointer; color: #fff; font: 700 12px/1 'Almarai', 'Manrope', sans-serif;
  background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.22); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); transition: background .2s; }
.orbit-chip:hover { background: rgba(255,255,255,.22); }
.orbit-chip.is-on { background: rgba(240,210,164,.9); color: #2A211A; border-color: transparent; }

/* التلميح */
.orbit-hint { font-size: 12.5px; font-weight: 700; color: rgba(255,255,255,.9); padding: 7px 14px; border-radius: 999px; background: rgba(23,17,12,.42);
  border: 1px solid rgba(255,255,255,.14); opacity: 0; transform: translateY(6px); transition: opacity .4s, transform .4s; pointer-events: none !important; text-align: center; }
.orbit-hint.is-on { opacity: 1; transform: none; }

/* النقاط الأرضية (الانتقال بين المشاهد) */
.orbit-hs-layer { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.orbit-hs { position: absolute; left: 0; top: 0; pointer-events: auto; display: flex; flex-direction: column; align-items: center; gap: 6px;
  background: transparent; border: 0; padding: 0; cursor: pointer; color: #fff; will-change: transform; }
.orbit-hs i { display: block; width: 46px; height: 46px; border-radius: 50%; position: relative;
  background: radial-gradient(circle, rgba(240,210,164,.55) 0%, rgba(240,210,164,.12) 55%, transparent 70%); }
.orbit-hs i::before { content: ''; position: absolute; inset: 14px; border-radius: 50%; background: #F0D2A4; box-shadow: 0 0 0 4px rgba(240,210,164,.28), 0 6px 16px -4px rgba(0,0,0,.6); }
.orbit-hs i::after { content: ''; position: absolute; inset: 4px; border-radius: 50%; border: 1.5px solid rgba(240,210,164,.7); animation: orbitPulse 2.2s ease-out infinite; }
.orbit-hs span { font: 700 12px/1.3 'Almarai', 'Manrope', sans-serif; padding: 5px 11px; border-radius: 999px; background: rgba(23,17,12,.55);
  border: 1px solid rgba(255,255,255,.16); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); white-space: nowrap; }
.orbit-hs span:empty { display: none; }
.orbit-hs:hover i::before { background: #fff; }
.orbit-hs-x { position: absolute; top: -6px; right: -6px; width: 22px; height: 22px; border-radius: 50%; background: #b91c1c; color: #fff; font-style: normal; font-size: 16px; line-height: 22px; text-align: center; }
@keyframes orbitPulse { 0% { transform: scale(.6); opacity: .9; } 100% { transform: scale(1.6); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .orbit-hs i::after { animation: none; } }

/* زر «مدار 360» على بطاقات المشاريع + شارة الرئيسية */
.orbit-trigger { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 0 13px; border-radius: 999px; cursor: pointer; text-decoration: none;
  color: #fff; font: 700 12.5px/1 'Almarai', 'Manrope', sans-serif; background: linear-gradient(135deg, #A87038, #8A5A2B); border: 1px solid rgba(240,210,164,.55);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 8px 20px -10px rgba(58,40,22,.7); transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .3s; }
.orbit-trigger:hover { transform: translateY(-2px); box-shadow: inset 0 1px 0 rgba(255,255,255,.4), 0 14px 26px -12px rgba(58,40,22,.8); }
.orbit-trigger.is-busy { opacity: .7; pointer-events: none; }
.orbit-trigger svg { width: 15px; height: 15px; }
.orbit-trigger i { display: inline-block; width: 12px; height: 12px; border-radius: 50%; border: 2px solid #F0D2A4; border-inline-start-color: transparent; animation: orbitSpinFlat 1.6s linear infinite; }
@keyframes orbitSpinFlat { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .orbit-trigger i { animation: none; } }

@media (max-width: 720px) {
  .orbit-title { max-width: 62vw; padding: 8px 12px; }
  .orbit-title-main { font-size: 13.5px; }
  .orbit-btn span { display: none; }
  .orbit-btn.orbit-gyro { width: 42px; padding: 0; justify-content: center; }
  .orbit-btn.orbit-gyro.is-on span { display: none; }
}