/* ═══════════════════════════════════════════════════════════════════════
   Astro Chart Ultimate PRO — Unified Stylesheet
   Version: 14.0 (Unified)
   ─────────────────────────────────────────────────────────────────────
   هذا الملف موحّد للتابات والأكورديونات في كل البلوجن (ما عدا المحاور).
   الملفات المُدمَجة:
     - astro-chart.css (الأساسي)
     - astro-chart-insights.css (مدمج)
   الملفات المُستثناة:
     - astro-axes.css (منفصل، كما هو)
   ═══════════════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════
   1) ROOT & RESET
   ═══════════════════════════════════════════════════════ */
:root {
  --ac-bg:       #11093a;
  --ac-bg2:      #1a0f50;
  --ac-purple:   #a435fe;
  --ac-purple2:  #7b1fd4;
  --ac-gold:     #d9c088;
  --ac-gold2:    #b89c5a;
  --ac-text:     #c8c0d8;
  --ac-text2:    #a8a0b8;
  --ac-glass:    rgba(255,255,255,0.04);
  --ac-glass2:   rgba(255,255,255,0.08);
  --ac-border:   rgba(164,53,254,0.25);
  --ac-border2:  rgba(217,192,136,0.3);
  --ac-radius:   16px;
  --ac-radius2:  10px;
}

.ac-app *, .ac-app *::before, .ac-app *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.ac-app {
  direction: rtl;
  text-align: right;
  font-family: inherit;
  color: var(--ac-text);
  background: var(--ac-bg);
  max-width: 960px;
  margin: 0 auto;
  padding: 0 0 60px;
  position: relative;
  /* ✅ لا نستخدم overflow هنا — نتركه visible
     (هذا يحل مشكلة بار الأدمن ويُفعّل sticky) */
}

/* ═══════════════════════════════════════════════════════
   2) STARFIELD
   ═══════════════════════════════════════════════════════ */
.ac-stars {
  position: fixed; inset: 0;
  pointer-events: none; z-index: 0; overflow: hidden;
}
.ac-star {
  position: absolute; background: #fff; border-radius: 50%;
  animation: ac-twinkle var(--d, 3s) infinite alternate;
  opacity: var(--o, 0.4);
}
@keyframes ac-twinkle {
  0%   { opacity: var(--o); }
  100% { opacity: calc(var(--o) * 0.2); }
}

/* ═══════════════════════════════════════════════════════
   3) HEADER + ORBIT
   ═══════════════════════════════════════════════════════ */
.ac-header {
  text-align: center; padding: 60px 20px 40px;
  position: relative; z-index: 1;
}
.ac-orbit {
  width: 90px; height: 90px; margin: 0 auto 20px;
  position: relative; display: flex; align-items: center; justify-content: center;
}
.ac-orbit-ring {
  position: absolute; inset: 0;
  border-radius: 50%; border: 1.5px solid var(--ac-purple);
  animation: ac-rotate 8s linear infinite;
}
.ac-orbit-ring:nth-child(2) {
  inset: 8px; border-color: var(--ac-gold);
  animation-duration: 12s; animation-direction: reverse;
}
.ac-orbit-dot {
  position: absolute; top: -4px; left: calc(50% - 4px);
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--ac-purple); box-shadow: 0 0 10px var(--ac-purple);
}
.ac-orbit-ring:nth-child(2) .ac-orbit-dot {
  background: var(--ac-gold); box-shadow: 0 0 10px var(--ac-gold);
}
.ac-orbit-core {
  font-size: 30px; position: relative; z-index: 2;
  display: inline-flex; align-items: center;
}
.ac-orbit-core img { height: 1em; width: 1em; }
@keyframes ac-rotate { to { transform: rotate(360deg); } }

.ac-title {
  font-size: clamp(22px, 4vw, 34px);
  letter-spacing: 2px; font-weight: 700;
  color: var(--ac-gold);
  background: linear-gradient(135deg, var(--ac-purple) 0%, var(--ac-gold) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin-bottom: 8px;
}
.ac-subtitle {
  color: var(--ac-text2); font-size: 14px;
  font-weight: 300; letter-spacing: 1px;
}

/* ═══════════════════════════════════════════════════════
   4) DIVIDER
   ═══════════════════════════════════════════════════════ */
.ac-divider {
  display: flex; align-items: center; gap: 12px;
  padding: 0 24px; margin-bottom: 28px;
}
.ac-divider-line {
  flex: 1; height: 1px;
  background: linear-gradient(to left, transparent, var(--ac-border), transparent);
}
.ac-divider-icon { color: var(--ac-gold); font-size: 14px; }

/* ═══════════════════════════════════════════════════════
   5) GLASS CARD
   ═══════════════════════════════════════════════════════ */
.ac-card {
  background: var(--ac-glass);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius);
  padding: 28px;
  position: relative; z-index: 1;
  margin: 0 10px 20px;
  transition: border-color 0.3s;
}
.ac-card::before {
  content: ''; position: absolute; inset: 0;
  border-radius: var(--ac-radius);
  background: linear-gradient(135deg, rgba(164,53,254,0.06) 0%, transparent 60%);
  pointer-events: none;
}
.ac-card:hover { border-color: rgba(164,53,254,0.45); }

/* ═══════════════════════════════════════════════════════
   6) FORM FIELDS
   ═══════════════════════════════════════════════════════ */
.ac-field { margin-bottom: 18px; position: relative; }
.ac-field label {
  display: block; font-size: 12px; font-weight: 600;
  color: var(--ac-text2); margin-bottom: 7px; letter-spacing: 0.5px;
}
.ac-field input[type="text"],
.ac-field input[type="number"],
.ac-field select {
  width: 100%;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--ac-radius2);
  padding: 12px 14px;
  color: var(--ac-text);
  font-family: inherit;
  font-size: 14px;
  outline: none;
  transition: border-color 0.25s, box-shadow 0.25s, background 0.25s;
  -webkit-appearance: none;
}

/* ✅ حقل الوقت — بدون appearance: none لضمان عمل Picker */
.ac-field input[type="time"] {
  width: 100%;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--ac-radius2);
  padding: 12px 14px;
  color: var(--ac-text);
  font-family: inherit;
  font-size: 14px;
  outline: none;
  transition: border-color 0.25s, box-shadow 0.25s, background 0.25s;
  /* لا نضع -webkit-appearance: none */
}
.ac-field select {
  cursor: pointer; appearance: none; -webkit-appearance: none;
  padding-right: 10px; padding-left: 10px; line-height: normal;
}
.ac-field select option { background: #1a0f50; color: #fff; }
.ac-field input:focus, .ac-field select:focus {
  border-color: var(--ac-purple);
  background: rgba(164,53,254,0.08);
  box-shadow: 0 0 0 3px rgba(164,53,254,0.15);
}
.ac-field input:disabled { opacity: 0.4; cursor: not-allowed; }
/* ✅ اجعل الأيقونة مرئية وواضحة */
.ac-field input[type="time"]::-webkit-calendar-picker-indicator {
  filter: invert(1) opacity(0.7);
  cursor: pointer;
  width: 20px;
  height: 20px;
  padding: 4px;
  margin-left: 4px;   /* مسافة من الحافة */
}

.ac-field input[type="time"] {
  cursor: pointer;
}

.ac-date-row {
  display: grid; grid-template-columns: 1fr 1fr 1.5fr; gap: 10px;
}
.ac-unknown-check {
  display: flex; align-items: center; gap: 8px;
  margin-top: 10px; font-size: 13px; color: var(--ac-text2); cursor: pointer;
}
.ac-unknown-check input[type="checkbox"] {
  accent-color: var(--ac-purple); width: 16px; height: 16px; cursor: pointer;
}
.ac-unknown-msg {
  display: none; font-size: 11px; color: var(--ac-gold);
  margin-top: 8px; padding: 7px 12px;
  background: rgba(217,192,136,0.08); border-radius: 6px;
  border-right: 2px solid var(--ac-gold);
}

/* ═══════════════════════════════════════════════════════
   7) CITY AUTOCOMPLETE
   ═══════════════════════════════════════════════════════ */
.ac-city-wrapper { position: relative; }
.ac-city-dropdown {
  position: absolute; top: calc(100% + 6px); left: 0; right: 0;
  background: #1e1250;
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius2);
  max-height: 180px; overflow-y: auto;
  z-index: 9999; display: none;
  box-shadow: 0 12px 40px rgba(0,0,0,0.6);
}
.ac-city-dropdown.active { display: block; }
.ac-city-dropdown::-webkit-scrollbar { width: 4px; }
.ac-city-dropdown::-webkit-scrollbar-thumb {
  background: var(--ac-purple); border-radius: 2px;
}
.ac-city-item {
  padding: 10px 14px; cursor: pointer;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  transition: background 0.15s; font-size: 13px; color: var(--ac-text);
}
.ac-city-item:hover { background: rgba(164,53,254,0.15); }
.ac-city-item:last-child { border-bottom: none; }

/* ═══════════════════════════════════════════════════════
   8) MAP
   ═══════════════════════════════════════════════════════ */
.ac-map-check {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 14px; font-size: 13px; color: var(--ac-text2); cursor: pointer;
}
.ac-map-check input[type="checkbox"] {
  accent-color: var(--ac-purple); width: 16px; height: 16px;
}
.ac-locate-btn {
  width: 100%; padding: 11px;
  background: rgba(184,134,11,0.2);
  color: var(--ac-gold);
  border: 1px solid var(--ac-border2);
  border-radius: var(--ac-radius2);
  font-size: 13px; font-weight: 600;
  cursor: pointer; transition: 0.3s;
  margin-bottom: 12px;
}
.ac-locate-btn:not(:disabled):hover { background: rgba(184,134,11,0.35); }
.ac-locate-btn:disabled { opacity: 0.35; cursor: not-allowed; }
.ac-map-container {
  border-radius: var(--ac-radius2); overflow: hidden;
  border: 1px solid var(--ac-border);
  transition: opacity 0.3s, filter 0.3s;
  margin-bottom: 16px; min-height: 240px;
}
.ac-map-disabled {
  opacity: 0.4; pointer-events: none; filter: grayscale(0.8);
}

/* ═══════════════════════════════════════════════════════
   9) SUBMIT BUTTON
   ═══════════════════════════════════════════════════════ */
.ac-submit-wrap { text-align: center; margin-top: 10px; }
.ac-btn {
  display: inline-flex; align-items: center; gap: 10px;
  background: linear-gradient(135deg, var(--ac-purple2) 0%, var(--ac-purple) 100%);
  color: #fff; border: none;
  padding: 16px 48px; border-radius: 50px;
  font-family: inherit; font-size: 16px; font-weight: 700;
  cursor: pointer; transition: all 0.3s;
  box-shadow: 0 4px 30px rgba(164,53,254,0.4);
  letter-spacing: 0.5px;
  position: relative; overflow: hidden;
}
.ac-btn::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.15) 0%, transparent 60%);
  opacity: 0; transition: opacity 0.3s;
}
.ac-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 40px rgba(164,53,254,0.6);
}
.ac-btn:hover::after { opacity: 1; }
.ac-btn:disabled {
  opacity: 0.6; cursor: not-allowed;
  transform: none; box-shadow: none;
}
.ac-btn-icon { font-size: 20px; }

/* ═══════════════════════════════════════════════════════
   10) LOADING SPINNER
   ═══════════════════════════════════════════════════════ */
#ac-loading {
  display: none; text-align: center;
  padding: 50px 20px; position: relative; z-index: 1;
}
.ac-loader {
  display: inline-block; width: 60px; height: 60px;
  position: relative; margin-bottom: 20px;
}
.ac-loader-ring {
  position: absolute; inset: 0;
  border-radius: 50%;
  border: 2px solid transparent;
  border-top-color: var(--ac-purple);
  animation: ac-spin 1s linear infinite;
}
.ac-loader-ring:nth-child(2) {
  inset: 8px;
  border-top-color: var(--ac-gold);
  animation-duration: 1.5s;
  animation-direction: reverse;
}
@keyframes ac-spin { to { transform: rotate(360deg); } }
#ac-loading p { color: var(--ac-text2); font-size: 14px; margin-top: 5px; }

/* ═══════════════════════════════════════════════════════
   11) CHART WRAP
   ═══════════════════════════════════════════════════════ */
.ac-chart-wrap {
  text-align: center;
  margin: 0 10px 24px;
  padding: 20px;
  background: var(--ac-glass);
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius);
}
.ac-chart-wrap img { max-width: 100%; height: auto; }

/* ═══════════════════════════════════════════════════════════════════════
   12) UNIFIED TABS SYSTEM  ← الأساس الموحّد لكل التابات
   ─────────────────────────────────────────────────────────────────────
   البنية:
     <div class="ac-tabs-fade-wrap">
       <div class="ac-tabs-nav">                      ← منطقة التمرير
         <span class="ac-tab-pill"></span>            ← يُنشئه JS
         <button class="ac-tab-btn active">…</button>
       </div>
     </div>
     <div class="ac-tab-content active">…</div>
   
   يدعم أيضاً الأسماء القديمة:
     - .ac-insights-tabs   ≈ .ac-tabs-nav
     - .ac-insights-tab    ≈ .ac-tab-btn
     - .ac-insights-section ≈ .ac-tab-content
   ═══════════════════════════════════════════════════════════════════════ */

/* ───── الغلاف + التلاشي ───── */
.ac-tabs-fade-wrap {
  position: sticky;
  top: 0;
  z-index: 20;
  background: var(--ac-bg);
  margin-bottom: 16px;
  padding: 4px 0 10px;
}


/* ───── منطقة التمرير الأفقي ───── */
.ac-tabs-nav,
.ac-insights-tabs {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  padding: 6px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
  cursor: grab;
  position: relative;
  border: 1px solid rgba(91, 47, 176, 0.4);
  border-radius: 10px;
  background: rgba(33, 23, 90, 0.6);
  box-shadow:
    inset 0 2px 6px rgba(0, 0, 0, 0.35),
    inset 0 -1px 0 rgba(164, 100, 254, 0.15),
    0 1px 0 rgba(164, 100, 254, 0.06);
}

/* ✅ تلاشي خفيف لحواف تابات الإنسايتس (من الداخل) */


.ac-tabs-nav::-webkit-scrollbar,
.ac-insights-tabs::-webkit-scrollbar { display: none; }
.ac-tabs-nav.dragging,
.ac-insights-tabs.dragging { cursor: grabbing; }
.ac-tabs-nav.dragging *,
.ac-insights-tabs.dragging * { pointer-events: none; }

/* ───── زر التاب ───── */
.ac-tab-btn,
.ac-insights-tab {
  position: relative;
  z-index: 1;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 40px;
  padding: 8px 18px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--ac-text2);
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  transition: color 0.25s ease;
  -webkit-tap-highlight-color: transparent;
}
.ac-tab-btn:hover,
.ac-insights-tab:hover { color: var(--ac-text); }
.ac-tab-btn.active,
.ac-insights-tab.active { color: #4a1a78; font-weight: 700; }
.ac-tab-btn:focus-visible,
.ac-insights-tab:focus-visible {
  outline: 3px solid var(--ac-gold);
  outline-offset: 2px;
}

/* الأيقونة داخل الزر — النقر عليها يُحسب على الزر */
.ac-tab-btn > *,
.ac-insights-tab > * { pointer-events: none; }

/* ───── Pill المنزلق (يُنشئه JS) ───── */
.ac-tab-pill {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  height: 40px;
  border-radius: 10px 0 10px 0;

	
	
  /* ✅ تدرج لوني بدل لون صلب — يُشعر بالبروز */
  background: linear-gradient(180deg, #d8c18a 0%, var(--ac-gold) 100%);
  pointer-events: none;
  /* ✅ ظل خارجي قوي + خط علوي مضيء + خط سفلي داكن */
box-shadow:
  0 1px 2px rgba(0, 0, 0, 0.2),
  inset 0 1px 0 rgba(255, 255, 255, 0.25),
  inset 0 -1px 2px rgba(0, 0, 0, 0.1);
  transition: left .38s cubic-bezier(.4,0,.2,1),
              top  .38s cubic-bezier(.4,0,.2,1),
              width .38s cubic-bezier(.4,0,.2,1),
              height .38s cubic-bezier(.4,0,.2,1);
  will-change: left, top, width, height;
}

/* ───── احتياطي: إذا لم يعمل JS يبقى التاب النشط ملوّناً ───── */
.ac-tabs-nav:not(.ac-tabs-ready) .ac-tab-btn.active,
.ac-insights-tabs:not(.ac-tabs-ready) .ac-insights-tab.active {
  background: var(--ac-gold);
  color: var(--ac-bg);
}

/* ───── لوحات التاب ───── */
.ac-tab-content {
  display: none;
  padding: 0 10px;   /* تابات البيانات تحتفظ بالهامش */
}
.ac-insights-section {
  display: none;
  padding: 0;        /* ← بطاقات الإنسايتس بلا هامش جانبي */
}
.ac-tab-content.active,
.ac-insights-section.active {
  display: block;
  animation: ac-fadeUp 0.35s ease;
}
@keyframes ac-fadeUp {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ═══════════════════════════════════════════════════════════════════════
   13) UNIFIED ACCORDION SYSTEM  ← الأساس الموحّد لكل الأكورديونات
   ─────────────────────────────────────────────────────────────────────
   البنية:
     <details class="ac-card-accordion" data-ac-pct="85">
       <summary class="ac-card-summary">
         <span class="ac-card-summary-icon">🎭</span>
         <div class="ac-card-summary-content">
           <div class="ac-card-summary-title">…</div>
           <div class="ac-card-summary-value">…</div>
         </div>
       </summary>
       <div class="ac-card-detail">…</div>
     </details>
   
   ملاحظات:
     - البطاقة المفتوحة تحمل [data-ac-open] (يضيفه JS)
     - زر الإغلاق .ac-card-close يُنشأ من JS
     - شريط النسبة .ac-card-mini يُنشأ من JS عند وجود data-ac-pct
   ═══════════════════════════════════════════════════════════════════════ */

.ac-card-accordion {
  background: var(--ac-glass);
  border: 1px solid var(--ac-border);
  border-radius: 15px;
  margin-bottom: 12px;
  overflow: clip;
  transition: border-color 0.2s;
  scroll-margin-top: 80px;
}
@supports not (overflow: clip) {
  .ac-card-accordion { overflow: visible; }
}
.ac-card-accordion:hover { border-color: rgba(164,53,254,0.5); }
.ac-card-accordion[data-ac-open] { border-color: rgba(164,53,254,0.55); }

/* ───── رأس البطاقة (summary) ───── */
.ac-card-summary {
  padding: 14px 16px;
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 64px;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.ac-card-summary::-webkit-details-marker { display: none; }

.ac-card-summary-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: rgba(196,184,232,0.1);
  color: var(--ac-gold);
  font-size: 22px;
  line-height: 1;
  flex-shrink: 0;
}

.ac-card-summary-content { flex: 1; min-width: 0; }

.ac-card-summary-title {
  font-size: 17px;
  font-weight: 700;
  color: var(--ac-gold);
  letter-spacing: 0;
  line-height: 1.5;
  transition: margin var(--acx-speed, 0.3s) ease;
}

.ac-card-summary-value {
  font-size: 14px;
  font-weight: 600;
  color: var(--ac-text2);
  line-height: 1.5;
  max-height: 6em;
  overflow: hidden;
  transition: max-height .3s ease, opacity .2s ease, margin .3s ease;
}

/* ───── السهم في نهاية الصف ───── */
.ac-card-summary::before {
  content: '';
  order: 3;
  flex: none;
  width: 9px;
  height: 9px;
  margin: -4px 0 0;
  border-right: 2px solid var(--ac-text2);
  border-bottom: 2px solid var(--ac-text2);
  font-size: 0;
  transform: rotate(45deg);
  transition: transform .3s ease, margin .3s ease;
}
.ac-card-accordion[data-ac-open] .ac-card-summary::before {
  margin: 4px 0 0;
  transform: rotate(-135deg);
}

/* ───── عند الفتح: العنوان يثبت + يخفي الوصف ───── */
.ac-card-accordion[data-ac-open] > .ac-card-summary {
  position: sticky;
  top: calc(var(--acx-top, 0px) + var(--acx-tabs-h, 0px));
  z-index: 15;
  background: #21175a;
  border-bottom: 1px solid rgba(91,47,176,0.6);
  border-radius: 15px 15px 0 0;
}
.ac-card-accordion[data-ac-open] .ac-card-summary-value,
.ac-card-accordion[data-ac-open] .ac-card-mini {
  max-height: 0;
  margin-top: 0;
  opacity: 0;
}
.ac-card-accordion[data-ac-open] .ac-card-summary-title { margin-bottom: 0; }

/* ───── جسم البطاقة ───── */
.ac-card-detail {
  padding: 18px 16px 0;
  color: var(--ac-text);
  font-size: 14px;
  line-height: 1.75;
}

/* ───── شريط النسبة المصغّر (اختياري) ───── */
.ac-card-mini {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin-top: 6px;
  max-height: 2em;
  overflow: hidden;
  transition: max-height .3s ease, opacity .2s ease, margin .3s ease;
}
.ac-card-mini-bar {
  flex: 1;
  height: 5px;
  border-radius: 999px;
  background: rgba(244,239,230,0.12);
}
.ac-card-mini-bar > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(to right, var(--ac-purple2), var(--ac-purple), var(--ac-gold));
}
.ac-card-mini b {
  color: var(--ac-text);
  font-size: 13px;
  font-weight: 700;
}

/* ───── زر الإغلاق (يُنشئه JS) ───── */
.ac-card-close {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: calc(100% + 32px);
  min-height: 56px;
  margin: 16px -16px 0;
  padding: 0.75rem 1rem;
  border: 0;
  border-top: 1px solid rgba(91,47,176,0.6);
  background: transparent;
  color: var(--ac-gold);
  font-family: inherit;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  border-radius: 0 0 15px 15px;
}
.ac-card-close::after {
  content: '';
  width: 8px;
  height: 8px;
  margin-top: 4px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-135deg);
}
@media (hover: hover) {
  .ac-card-close:hover { background: rgba(255,255,255,0.06); }
  .ac-card-summary:hover { background: rgba(255,255,255,0.04); }
}

.ac-card-summary:focus-visible,
.ac-card-close:focus-visible {
  outline: 3px solid var(--ac-gold);
  outline-offset: -3px;
}

/* ═══════════════════════════════════════════════════════
   14) DATA CARDS (صفوف الكواكب/البيوت/الاتصالات)
   ═══════════════════════════════════════════════════════ */
.ac-data-card {
  background: var(--ac-glass);
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius2);
  padding: 13px 16px;
  margin-bottom: 8px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: background 0.2s, border-color 0.2s;
}
.ac-data-card:hover {
  background: var(--ac-glass2);
  border-color: rgba(164,53,254,0.4);
}
.ac-data-label { font-size: 14px; color: var(--ac-text); }
.ac-data-value { font-size: 13px; color: var(--ac-gold); font-weight: 500; }
.ac-empty-msg {
  text-align: center; color: var(--ac-text2);
  font-size: 14px; padding: 30px;
}

/* ═══════════════════════════════════════════════════════
   15) BIRTH CARD & WARNINGS
   ═══════════════════════════════════════════════════════ */
.ac-warn {
  display: flex; align-items: flex-start; gap: 8px;
  padding: 12px 16px;
  background: rgba(217,192,136,0.08);
  border: 1px solid rgba(217,192,136,0.3);
  border-radius: var(--ac-radius2);
  color: var(--ac-gold); font-size: 13px;
  margin: 0 10px 16px;
}

.ac-birth-card {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 10px;
  margin: 0 10px 20px;
  padding: 20px;
  background: var(--ac-glass);
  border: 1px solid var(--ac-border2);
  border-radius: var(--ac-radius);
  position: relative;
}
.ac-birth-card::before {
  content: ''; position: absolute; inset: 0;
  border-radius: var(--ac-radius);
  background: linear-gradient(135deg, rgba(217,192,136,0.06) 0%, transparent 60%);
  pointer-events: none;
}
.ac-birth-item { display: flex; flex-direction: column; gap: 5px; }
.ac-birth-label {
  font-size: 11px; font-weight: 700;
  color: var(--ac-text2); letter-spacing: 0.5px;
}
.ac-birth-value {
  font-size: 15px; font-weight: 600;
  color: var(--ac-gold); line-height: 1.3;
}
.ac-birth-warn {
  grid-column: 1 / -1;
  display: flex; align-items: flex-start; gap: 10px;
  padding: 12px 16px;
  background: rgba(255,160,0,0.08);
  border: 1px solid rgba(255,160,0,0.3);
  border-radius: var(--ac-radius2);
  margin-top: 6px;
}
.ac-birth-warn-icon { font-size: 18px; flex-shrink: 0; }
.ac-birth-warn-text {
  font-size: 13px; color: #ffd080; line-height: 1.6;
}
.ac-birth-warn-text strong {
  color: #ffc107; display: block;
  margin-bottom: 2px; font-size: 14px;
}

/* ═══════════════════════════════════════════════════════
   16) DOWNLOAD BUTTON
   ═══════════════════════════════════════════════════════ */
.ac-download-btn {
  display: inline-block;
  background: var(--ac-glass);
  border: 1px solid var(--ac-border2);
  color: var(--ac-gold);
  padding: 10px 24px; border-radius: 50px;
  font-size: 14px; font-weight: 600;
  text-decoration: none; transition: all 0.3s; cursor: pointer;
}
.ac-download-btn:hover {
  background: rgba(217,192,136,0.15);
  border-color: var(--ac-gold);
  color: #fff;
}

/* ═══════════════════════════════════════════════════════
   17) INSIGHTS WRAP & TITLE
   ═══════════════════════════════════════════════════════ */
.ac-insights-wrap {
  margin: 0 4px 20px;
  --acx-top: 0px;
  --acx-tabs-h: 0px;
  --acx-speed: 0.3s;
}


/* ═══════════════════════════════════════════════════════
   18) DOMINANT PLANET POPUP TABLE
   ═══════════════════════════════════════════════════════ */
.ac-dominant-table {
  width: 100%; border-collapse: collapse;
  margin: 16px 0; font-size: 14px;
}
.ac-dominant-table thead th {
  background: rgba(164,53,254,0.18);
  color: var(--ac-gold);
  padding: 12px 14px;
  font-size: 12px; font-weight: 600;
  letter-spacing: 0.5px;
  border-bottom: 1px solid var(--ac-border);
  text-align: right;
}
.ac-dominant-table tbody td {
  padding: 11px 14px;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  color: var(--ac-text);
}
.ac-dominant-table tbody tr:hover td { background: rgba(164,53,254,0.08); }
.ac-dominant-table tbody tr:last-child td { border-bottom: none; }
.ac-winner-row td {
  background: rgba(217,192,136,0.08) !important;
  font-weight: 600;
}
.ac-impact-pct {
  display: inline-block;
  background: rgba(164,53,254,0.2);
  border: 1px solid var(--ac-border);
  color: var(--ac-text2);
  border-radius: 20px; padding: 3px 12px;
  font-size: 12px; font-weight: 600;
  min-width: 56px; text-align: center;
}
.ac-winner-row .ac-impact-pct {
  background: linear-gradient(135deg, var(--ac-gold2), var(--ac-gold));
  color: #1a0f50; border-color: transparent;
}
.ac-dom-sec-title {
  display: block; font-size: 12px; font-weight: 700;
  color: var(--ac-gold); letter-spacing: 0.5px; margin-bottom: 5px;
}
.ac-dom-subitems { list-style: none; padding-right: 16px; margin: 0; }
.ac-dom-subitems li {
  padding: 5px 0;
  border-bottom: 1px dashed rgba(255,255,255,0.08);
  color: var(--ac-text2); font-size: 13px;
}

/* ═══════════════════════════════════════════════════════
   19) SIGNATURE PATTERN
   ═══════════════════════════════════════════════════════ */
.ac-sig { padding: 12px 0; border-bottom: 1px solid var(--ac-glass2); }
.ac-sig:last-child { border-bottom: 0; padding-bottom: 0; }
.ac-sig-head {
  display: flex; align-items: center;
  flex-wrap: wrap; gap: 6px 10px; margin-bottom: 8px;
}
.ac-sig-name {
  font-weight: 700; color: var(--ac-gold);
  font-size: 15px; flex: 1; min-width: 90px;
}
.ac-sig-pct { font-weight: 700; color: var(--ac-text); font-size: 14px; }
.ac-why-btn {
  background: none; border: 0; padding: 4px 0;
  cursor: pointer; font-family: inherit;
  font-size: 12px; color: var(--ac-purple);
  text-decoration: underline; text-underline-offset: 3px;
}
.ac-why-btn:hover { color: var(--ac-text); }

.ac-sig-bar {
  height: 3px; border-radius: 99px;
  background: var(--ac-glass2);
  overflow: hidden; margin-bottom: 10px;
}
.ac-sig-bar span {
  display: block; height: 100%;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--ac-purple2), var(--ac-purple), var(--ac-gold));
  transform-origin: right center;
}
.ac-card-accordion[data-ac-open] .ac-sig-bar span { animation: acSigFill .7s ease-out; }
@keyframes acSigFill {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}
.ac-sig-interp {
  font-size: 14px; line-height: 1.7;
  color: var(--ac-text); margin: 0 0 6px;
}
.ac-sig-basis {
  font-size: 12px; line-height: 1.6;
  color: var(--ac-text2); opacity: .8;
}

/* شريط رقيق 3px داخل البطاقات */
.ac-sig-bar-thin {
  height: 3px; border-radius: 99px;
  background: var(--ac-glass2);
  overflow: hidden; margin: 8px 0 10px;
  direction: rtl;
}
.ac-sig-bar-thin span {
  display: block; height: 100%;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--ac-purple2), var(--ac-purple), var(--ac-gold));
  transform-origin: right center;
}
.ac-card-accordion[data-ac-open] .ac-sig-bar-thin span { animation: acSigFill .7s ease-out; }

/* ═══════════════════════════════════════════════════════
   20) DRIVERS LIST
   ═══════════════════════════════════════════════════════ */
.ac-drivers-list { margin-top: 12px; }
.ac-driver-row {
  padding: 8px 0;
  border-bottom: 1px solid var(--ac-glass2);
}
.ac-driver-row:last-child { border-bottom: none; }
.ac-driver-top {
  display: flex; align-items: center;
  gap: 8px; font-size: 13px;
}
.ac-driver-num {
  color: var(--ac-purple); font-weight: 700;
  font-size: 12px; min-width: 22px; flex-shrink: 0;
}
.ac-driver-name { color: var(--ac-text); flex: 1; text-align: right; }
.ac-driver-pct { color: var(--ac-gold); font-weight: 700; flex-shrink: 0; }
.ac-driver-bar {
  height: 3px; border-radius: 99px;
  background: var(--ac-glass2);
  overflow: hidden; margin-top: 6px;
  direction: rtl;
}
.ac-driver-bar span {
  display: block; height: 100%;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--ac-purple2), var(--ac-purple), var(--ac-gold));
  transform-origin: right center;
}
.ac-card-accordion[data-ac-open] .ac-driver-bar span { animation: acSigFill .7s ease-out; }

/* ═══════════════════════════════════════════════════════
   21) POPUP OVERLAY (قديم — للنافذة المنبثقة العامة)
   ═══════════════════════════════════════════════════════ */
.ac-popup-overlay {
  display: none; position: fixed; inset: 0;
  background: rgba(0,0,0,0.7); z-index: 9999;
  align-items: center; justify-content: center;
}
.ac-popup-overlay.active { display: flex; }
.ac-popup {
  background: #1a0f50;
  border: 1px solid var(--ac-gold);
  border-radius: var(--ac-radius);
  padding: 24px; max-width: 700px; width: 90%;
  max-height: 80vh; overflow-y: auto; position: relative;
}
.ac-popup-close {
  position: absolute; top: 12px; left: 12px;
  background: none; border: none;
  color: var(--ac-gold); font-size: 22px; cursor: pointer;
}

/* ═══════════════════════════════════════════════════════
   22) BOTTOM SHEET / MODAL (نافذة الأدلة)
   ═══════════════════════════════════════════════════════ */
.ac-sheet-root {
  position: fixed; inset: 0; z-index: 99999;
  direction: rtl; text-align: right;
  visibility: hidden; pointer-events: none;
  transition: visibility 0s linear .3s;
}
.ac-sheet-root.open {
  visibility: visible; pointer-events: auto;
  transition-delay: 0s;
}
.ac-sheet-scrim {
  position: absolute; inset: 0;
  background: rgba(8,4,28,.72);
  opacity: 0; transition: opacity .25s;
}
.ac-sheet-root.open .ac-sheet-scrim { opacity: 1; }
.ac-sheet {
  position: absolute; left: 0; right: 0; bottom: 0;
  max-height: 82vh;
  display: flex; flex-direction: column; overflow: hidden;
  background: var(--ac-bg2); color: var(--ac-text);
  font-size: 14px; line-height: 1.6;
  border-top: 1px solid var(--ac-border2);
  border-radius: 20px 20px 0 0;
  transform: translateY(100%); transition: transform .3s ease;
}
.ac-sheet-root.open .ac-sheet { transform: translateY(0); }
.ac-sheet-grab {
  width: 40px; height: 4px; border-radius: 99px;
  background: var(--ac-glass2);
  margin: 10px auto 0; flex-shrink: 0;
}
.ac-sheet-top {
  display: flex; align-items: flex-start;
  gap: 10px; padding: 14px 18px 10px; flex-shrink: 0;
}
.ac-sheet-titles { flex: 1; }
.ac-sheet-title {
  font-size: 16px; font-weight: 700; color: var(--ac-gold);
}
.ac-sheet-sub {
  font-size: 12px; color: var(--ac-text2); margin-top: 2px;
}
.ac-sheet-close {
  background: var(--ac-glass2); border: 0;
  color: var(--ac-text);
  width: 32px; height: 32px; border-radius: 50%;
  cursor: pointer; font-size: 18px; line-height: 1;
  flex-shrink: 0; font-family: inherit;
}
.ac-sheet-close:hover { background: var(--ac-border); }
.ac-sheet-body {
  overflow-y: auto; overscroll-behavior: contain;
  padding: 0 18px 22px;
  -webkit-overflow-scrolling: touch;
}

/* مجموعات داخل النافذة */
.ac-ev-group { margin-top: 14px; }
.ac-ev-group-head {
  display: flex; align-items: center;
  gap: 8px; font-weight: 700; font-size: 13px;
}
.ac-ev-count {
  font-weight: 400; font-size: 12px; color: var(--ac-text2);
}
.ac-ev-hint {
  font-size: 12px; color: var(--ac-text2);
  opacity: .8; margin: 2px 0 6px;
}
.ac-ev-dot {
  width: 9px; height: 9px; border-radius: 50%;
  flex-shrink: 0; background: var(--ac-gold);
}
.ac-ev-group[data-k="anchor"] .ac-ev-dot { background: #a435fe; }
.ac-ev-group[data-k="emphasis"] .ac-ev-dot { background: #2fd4b8; }
.ac-ev-group[data-k="activation"] .ac-ev-dot { background: #ff7a6b; }
.ac-ev-group[data-k="location"] .ac-ev-dot { background: var(--ac-gold); }
.ac-ev-group[data-k="meaning"] .ac-ev-dot  { background: var(--ac-purple); }
.ac-ev-group[data-k="drivers"] .ac-ev-dot  { background: var(--ac-purple); }
.ac-ev-group[data-k="intro"] .ac-ev-group-head { display: none; }

.ac-ev-item {
  display: flex; align-items: center;
  gap: 8px; padding: 7px 10px;
  margin-top: 5px;
  background: var(--ac-glass);
  border: 1px solid var(--ac-glass2);
  border-radius: 8px; font-size: 13px;
}
.ac-ev-item.top { border-color: var(--ac-border2); }
.ac-ev-badge {
  margin-right: auto; font-size: 10px;
  color: var(--ac-bg); background: var(--ac-gold);
  border-radius: 99px; padding: 1px 8px;
  white-space: nowrap; font-weight: 700;
}
.ac-ev-paragraph {
  font-size: 13px; line-height: 1.8;
  color: var(--ac-text); margin: 8px 0 0;
  padding: 12px 14px;
  background: var(--ac-glass);
  border: 1px solid var(--ac-glass2);
  border-radius: 8px;
  border-right: 3px solid var(--ac-gold);
}
.ac-ev-notice {
  font-size: 12.5px; line-height: 1.85;
  color: var(--ac-gold); margin: 12px 0 0;
  padding: 12px 14px;
  background: rgba(217,192,136,0.08);
  border: 1px solid rgba(217,192,136,0.25);
  border-radius: 8px;
  border-right: 3px solid var(--ac-gold);
}

/* قائمة محركات داخل النافذة */
.ac-ev-driver-row {
  padding: 10px 12px; margin-top: 5px;
  background: var(--ac-glass);
  border: 1px solid var(--ac-glass2);
  border-radius: 8px; font-size: 13px;
}
.ac-ev-driver-top {
  display: flex; align-items: center; gap: 10px;
}
.ac-ev-driver-num {
  color: var(--ac-purple); font-weight: 700;
  font-size: 12px; min-width: 22px; flex-shrink: 0;
}
.ac-ev-driver-name { color: var(--ac-text); flex: 1; line-height: 1.5; }
.ac-ev-driver-right {
  display: flex; align-items: center; gap: 8px; flex-shrink: 0;
}
.ac-ev-driver-cat {
  font-size: 10px; color: var(--ac-text2);
  background: var(--ac-glass2);
  border-radius: 99px; padding: 2px 8px; white-space: nowrap;
}
.ac-ev-driver-pct {
  color: var(--ac-gold); font-weight: 700;
  font-size: 13px; min-width: 42px; text-align: left;
}
.ac-ev-driver-bar {
  height: 3px;
  background: var(--ac-glass2);
  border-radius: 99px; overflow: hidden;
  margin-top: 8px; direction: rtl;
}
.ac-ev-driver-bar span {
  display: block; height: 100%;
  background: linear-gradient(90deg, var(--ac-purple2), var(--ac-purple), var(--ac-gold));
  border-radius: 99px;
  transform-origin: right center;
  animation: acSigFill .7s ease-out;
}

/* ═══════════════════════════════════════════════════════
   23) ADVANCED OPTIONS (نموذج)
   ═══════════════════════════════════════════════════════ */
.ac-adv-grid select {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  appearance: auto; -webkit-appearance: auto;
  height: 38px; line-height: 38px;
  padding-top: 0; padding-bottom: 0;
}

.ac-adv-toggle {
  width: 100%; background: transparent; border: none;
  padding: 14px 0; cursor: pointer; font-family: inherit;
  display: flex; align-items: center; gap: 12px; margin: 4px 0 0;
}
.ac-adv-line {
  flex: 1; height: 1px;
  background: linear-gradient(to left, transparent, rgba(217,192,136,0.35));
}
.ac-adv-line-flip {
  background: linear-gradient(to right, transparent, rgba(217,192,136,0.35));
}
.ac-adv-core {
  display: flex; align-items: center; gap: 8px;
  background: rgba(217,192,136,0.07);
  border: 1px solid rgba(217,192,136,0.25);
  border-radius: 50px; padding: 7px 16px;
  color: var(--ac-gold); font-size: 12px; font-weight: 600;
  white-space: nowrap; transition: .25s; letter-spacing: .4px;
}
.ac-adv-toggle:hover .ac-adv-core {
  background: rgba(217,192,136,0.14);
  border-color: var(--ac-gold2);
  box-shadow: 0 0 16px rgba(217,192,136,0.15);
}
.ac-adv-toggle.open .ac-adv-core {
  background: rgba(164,53,254,0.15);
  border-color: var(--ac-purple);
  color: var(--ac-text);
}
.ac-adv-arr { font-size: 11px; transition: transform .3s; }
.ac-adv-toggle.open .ac-adv-arr { transform: rotate(180deg); }

.ac-adv-panel {
  overflow: hidden; max-height: 0;
  transition: max-height .35s cubic-bezier(.4,0,.2,1), opacity .3s;
  opacity: 0;
}
.ac-adv-panel.open { max-height: 500px; opacity: 1; }
.ac-adv-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 12px; padding-top: 14px;
}
.ac-adv-full { grid-column: 1 / -1; }

/* ═══════════════════════════════════════════════════════
   24) LOAD MORE BUTTONS
   ═══════════════════════════════════════════════════════ */
.ac-decl-hidden,
.ac-aspect-hidden,
.ac-planet-hidden,
.ac-house-hidden { display: none !important; }
.ac-load-more-btn {
  display: block; width: 100%;
  margin-top: 12px; padding: 12px;
  background: var(--ac-glass);
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius2);
  color: var(--ac-gold); font-size: 14px;
  cursor: pointer; transition: 0.2s;
  font-family: inherit; font-weight: 600;
}
.ac-load-more-btn:hover {
  background: var(--ac-glass2);
  border-color: var(--ac-purple);
  color: #fff;
}

/* ═══════════════════════════════════════════════════════
   25) ACCESSIBILITY
   ═══════════════════════════════════════════════════════ */
.ac-btn:focus-visible,
.ac-tab-btn:focus-visible,
.ac-insights-tab:focus-visible,
.ac-download-btn:focus-visible,
.ac-load-more-btn:focus-visible,
.ac-locate-btn:focus-visible,
.ac-field input:focus-visible,
.ac-field select:focus-visible,
.ac-city-item:focus-visible {
  outline: 2px solid var(--ac-gold);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
 .ac-tab-pill {
transition:
  left .45s cubic-bezier(.34, 1.56, .64, 1),      /* ← ease-out-back */
  top  .45s cubic-bezier(.34, 1.56, .64, 1),
  width .45s cubic-bezier(.34, 1.56, .64, 1),
  height .45s cubic-bezier(.34, 1.56, .64, 1);
}
	
	.ac-tab-pill.moving {
  transform: scaleX(1.08);        /* ← يتمدد 8% أفقياً */
}
  .ac-tab-content.active,
  .ac-insights-section.active { animation: none; }
}

/* ═══════════════════════════════════════════════════════
   26) RESPONSIVE
   ═══════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .ac-card {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background: rgba(26,15,80,0.75);
  }
  .ac-tab-btn,
  .ac-insights-tab { padding: 8px 14px; font-size: 12.5px; }
  .ac-card-summary { padding: 12px 14px; min-height: 56px; gap: 10px; }
  .ac-card-summary-icon { width: 38px; height: 38px; font-size: 18px; }
  .ac-card-summary-title { font-size: 15px; }
  .ac-card-close { font-size: 14px; min-height: 50px; }
}

@media (max-width: 600px) {
  .ac-date-row { grid-template-columns: 1fr 1fr 1fr; }
  .ac-card { margin: 0 6px 16px; padding: 20px 16px; }
  .ac-adv-grid { grid-template-columns: 1fr; }
  .ac-adv-full { grid-column: 1; }
}

/* ═══════════════════════════════════════════════════════
   27) SETTINGS للـ Sheet على الديسكتوب
   ═══════════════════════════════════════════════════════ */
@media (min-width: 769px) {
  .ac-sheet-grab { display: none; }
  .ac-sheet {
    left: 50%; right: auto;
    bottom: auto; top: 50%;
    width: min(480px, 92vw);
    max-height: 80vh;
    border: 1px solid var(--ac-border2);
    border-radius: 18px;
    opacity: 0;
    transform: translate(-50%, -46%);
    transition: transform .25s ease, opacity .25s ease;
  }
  .ac-sheet-root.open .ac-sheet {
    transform: translate(-50%, -50%);
    opacity: 1;
  }
}

/* ✅ تثبيت شريط التابات عند التمرير */
.ac-insights-wrap > .ac-tabs-fade-wrap {
  position: sticky;
  top: var(--acx-top, 0px);
  z-index: 20;
  background: var(--ac-bg);
  padding: 4px 0 10px;
  margin: -4px 0 12px;   /* ← كان 16px */
}

/* ═══════════════════════════════════════════════════════
   28) RESULT STRIP (بعد التوليد — ديسكتوب + جوال)
   ═══════════════════════════════════════════════════════ */
.ac-result-strip {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--ac-glass);
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius2);
  padding: 8px 10px;
  margin: 0 0 16px;
  font-size: 12.5px;
}

.ac-result-strip-icon {
  flex-shrink: 0;
  font-size: 16px;
  color: var(--ac-gold);
  width: 20px;
  text-align: center;
}

.ac-result-strip-info {
  flex: 1;
  color: var(--ac-text);
  line-height: 1.5;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12.5px;
  min-width: 0;
}

.ac-result-strip-btn {
  flex-shrink: 0;
  border: 0;
  background: var(--ac-glass2);
  color: var(--ac-gold);
  font-family: inherit;
  font-size: 11.5px;
  font-weight: 700;
  padding: 6px 10px;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.2s;
  touch-action: manipulation;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.ac-result-strip-btn i { font-size: 12px; }

.ac-result-strip-btn:hover {
  background: rgba(217, 192, 136, 0.15);
}

.ac-result-strip-new {
  background: transparent;
  border: 1px solid var(--ac-border2);
}

/* إخفاء النصوص على الشاشات الصغيرة جداً */
@media (max-width: 400px) {
  .ac-result-strip-btn-label { display: none; }
  .ac-result-strip-btn { padding: 6px 8px; }
}

/* ✅ إخفاء الفورم في وضع الاستعادة (ديسكتوب فقط) */
@media (min-width: 769px) {
  body.ac-restored-mode .ac-card {
    display: none !important;
  }
}

/* ═══════════════════════════════════════════════════════
   29) FORM LOADING OVERLAY (فوق النموذج عند التوليد)
   ═══════════════════════════════════════════════════════ */
.ac-form-overlay {
  position: absolute;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: inherit;
  background: rgba(17, 9, 58, 0.85);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0s linear 0.25s;
  pointer-events: none;
  padding: 24px;
}

.ac-form-overlay.visible {
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
  pointer-events: auto;
}

.ac-form-overlay-inner {
  text-align: center;
  max-width: 340px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.ac-form-overlay-title {
  font-size: 18px;
  font-weight: 700;
  color: #f4efe6 !important;   /* ← لؤلؤي فاتح — يظهر بوضوح على الخلفية الداكنة */
  letter-spacing: 0.3px;
  line-height: 1.5;
  margin: 0;
}

.ac-form-overlay-message {
  font-size: 14.5px;
  color: #c4b8e8 !important;   /* ← بنفسجي فاتح */
  line-height: 1.7;
  margin: 0;
  min-height: 1.7em;
  transition: opacity 0.3s ease;
}

.ac-form-overlay-hint {
  color: #a8a0b8 !important;   /* ← ضمان ظهور التلميح */
}

.ac-form-overlay-message.fading {
  opacity: 0;
}

.ac-form-overlay-hint {
  font-size: 12px;
  color: var(--ac-text2);
  margin: 0;
  opacity: 0.75;
}

.ac-form-overlay-cancel {
  background: var(--ac-glass2);
  border: 1px solid var(--ac-border2);
  color: var(--ac-gold);
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  padding: 9px 22px;
  border-radius: 50px;
  cursor: pointer;
  margin-top: 6px;
  touch-action: manipulation;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0s linear 0.3s,
              background 0.2s, border-color 0.2s;
}

.ac-form-overlay-cancel.visible {
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}

.ac-form-overlay-cancel:hover {
  background: rgba(217, 192, 136, 0.15);
  border-color: var(--ac-gold);
}

.ac-form-overlay .ac-loader {
  margin-bottom: 0;
}

@media (max-width: 768px) {
  .ac-form-overlay {
    padding: 20px 16px;
  }
  .ac-form-overlay-title {
    font-size: 16px;
  }
  .ac-form-overlay-message {
    font-size: 13px;
  }
}

/* ═══════════════════════════════════════════════════════
   30) BIRTH CARD — MOBILE COMPACT (2×2 Grid)
   ═══════════════════════════════════════════════════════ */
@media (max-width: 768px) {

  .ac-birth-card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 12px;
    margin: 0 0 12px;
    border-radius: 14px;
  }

  .ac-birth-card::before { display: none; }

  .ac-birth-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    padding: 10px 12px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 12px;
    min-width: 0;
    overflow: hidden;
  }

  .ac-birth-label {
    display: inline-block;
    width: 18px;
    height: 18px;
    overflow: hidden;
    font-size: 14px;
    line-height: 18px;
    margin: 0;
    flex-shrink: 0;
    color: var(--ac-gold);
  }

  .ac-birth-value {
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--ac-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    min-width: 0;
  }

  /* تنبيه الوقت غير معروف — يمتد على عرض كامل */
  .ac-birth-warn {
    grid-column: 1 / -1;
    padding: 10px 12px;
    gap: 8px;
    margin-top: 4px;
  }

  .ac-birth-warn-icon { font-size: 16px; }

  .ac-birth-warn-text {
    font-size: 12px;
    line-height: 1.5;
  }

  .ac-birth-warn-text strong {
    font-size: 13px;
    margin-bottom: 3px;
  }
}

/* ═══════════════════════════════════════════════════════
   31) SAVE CHART MODAL (للزوار غير المسجلين)
   ═══════════════════════════════════════════════════════ */
.ac-save-modal-root {
  position: fixed;
  inset: 0;
  z-index: 99997;
  visibility: hidden;
  pointer-events: none;
  transition: visibility 0s linear 0.3s;
  direction: rtl;
  text-align: right;
}

.ac-save-modal-root.open {
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}

.ac-save-modal-scrim {
  position: absolute;
  inset: 0;
  background: rgba(8, 4, 28, 0.78);
  opacity: 0;
  transition: opacity 0.25s;
}

.ac-save-modal-root.open .ac-save-modal-scrim {
  opacity: 1;
}

.ac-save-modal {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--ac-bg2);
  color: var(--ac-text);
  border-top: 1px solid var(--ac-border2);
  border-radius: 20px 20px 0 0;
  padding: 24px 20px calc(24px + env(safe-area-inset-bottom, 0px));
  text-align: center;
  transform: translateY(100%);
  transition: transform 0.3s ease;
  max-height: 90vh;
  overflow-y: auto;
}

.ac-save-modal-root.open .ac-save-modal {
  transform: translateY(0);
}

.ac-save-modal-close {
  position: absolute;
  top: 12px;
  left: 12px;
  background: var(--ac-glass2);
  border: 0;
  color: var(--ac-text);
  width: 32px;
  height: 32px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
  font-family: inherit;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.ac-save-modal-close:hover {
  background: var(--ac-border);
}

.ac-save-modal-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: rgba(217, 192, 136, 0.12);
  color: var(--ac-gold);
  font-size: 26px;
  margin: 4px auto 16px;
}

.ac-save-modal-title {
  font-size: 19px;
  font-weight: 700;
  color: var(--ac-gold);
  margin: 0 0 10px;
  letter-spacing: 0.3px;
  line-height: 1.5;
}

.ac-save-modal-desc {
  font-size: 13.5px;
  color: var(--ac-text2);
  line-height: 1.7;
  margin: 0 0 20px;
}

.ac-save-modal-benefits {
  list-style: none;
  padding: 0;
  margin: 0 0 24px;
  text-align: right;
  display: inline-block;
}

.ac-save-modal-benefits li {
  font-size: 13.5px;
  color: var(--ac-text);
  padding: 6px 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.ac-save-modal-benefits i {
  color: var(--ac-gold);
  font-size: 15px;
  flex-shrink: 0;
  /* ✅ عكس قاعدة القالب — لإرجاع العلامة لوضعها الصحيح */
  transform: scaleX(-1);
}

.ac-save-modal-primary {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  background: linear-gradient(135deg, var(--ac-purple2), var(--ac-purple));
  color: #fff;
  padding: 14px 24px;
  border-radius: 50px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s;
  box-shadow: 0 4px 20px rgba(164, 53, 254, 0.35);
  margin-bottom: 10px;
}

.ac-save-modal-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(164, 53, 254, 0.5);
}

.ac-save-modal-primary i {
  font-size: 16px;
}

.ac-save-modal-secondary {
  background: transparent;
  border: 0;
  color: var(--ac-text2);
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  padding: 8px 16px;
  transition: color 0.2s;
}

.ac-save-modal-secondary:hover {
  color: var(--ac-text);
}

@media (min-width: 769px) {
  .ac-save-modal {
    left: 50%;
    right: auto;
    bottom: auto;
    top: 50%;
    width: min(440px, 92vw);
    max-height: 85vh;
    border-radius: 20px;
    padding: 28px 26px 24px;
    border: 1px solid var(--ac-border2);
    opacity: 0;
    transform: translate(-50%, -46%);
    transition: transform 0.25s ease, opacity 0.25s ease;
  }
  .ac-save-modal-root.open .ac-save-modal {
    transform: translate(-50%, -50%);
    opacity: 1;
  }
}

/* زر الحفظ — أيقونة ذهبية + نص متجاوب */
.ac-save-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.ac-save-btn i {
  color: var(--ac-gold);
  font-size: 15px;
}

.ac-save-btn .ac-save-btn-text {
  white-space: nowrap;
}

@media (max-width: 500px) {
  .ac-save-btn .ac-save-btn-text {
    white-space: normal;
    font-size: 12px;
    line-height: 1.4;
    max-width: 220px;
  }
}

/* ═══════════════════════════════════════════════════════
   32) LOADING LOCK — تجميد الشاشة أثناء توليد الخريطة
   ═══════════════════════════════════════════════════════ */
body.ac-loading-active {
  overflow: hidden !important;
  height: 100vh !important;
  touch-action: none;
}

/* إخفاء كل الأقسام التي تُملأ عبر AJAX أثناء التحميل */
body.ac-loading-active #ac-map-section,
body.ac-loading-active #ac-insights-section,
body.ac-loading-active #ac-tabs-section,
body.ac-loading-active .ac-axes-wrapper,
body.ac-loading-active .ac-axis-container,
body.ac-loading-active #ac-tabs-section,
body.ac-loading-active .ac-result-strip {
  display: none !important;
}

/* تعطيل أي تفاعل خارج الـ Overlay */
body.ac-loading-active .ac-card {
  pointer-events: none;
}

body.ac-loading-active .ac-form-overlay {
  pointer-events: auto;
}

/* ═══════════════════════════════════════════════════════
   33) CHART ACTIONS — حفظ (أساسي) + تنزيل (ثانوي)
   ═══════════════════════════════════════════════════════ */
.ac-chart-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-width: 380px;
  margin: 18px auto 0;
  padding: 0 10px;
}

/* ───── الأساس لكل زر ───── */
.ac-action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 13px 24px;
  border-radius: 50px;
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s, transform 0.15s, box-shadow 0.2s;
  touch-action: manipulation;
  letter-spacing: 0.2px;
  text-align: center;
  line-height: 1.3;
}

.ac-action-btn i {
  font-size: 15px;
  flex-shrink: 0;
}

/* ───── حفظ — أساسي (مملوء بنفسجي) ───── */
.ac-action-btn-primary {
  background: linear-gradient(135deg, var(--ac-purple2), var(--ac-purple));
  color: #fff;
  border: 0;
  box-shadow: 0 4px 16px rgba(164, 53, 254, 0.35);
}

.ac-action-btn-primary i {
  color: var(--ac-gold);
}

.ac-action-btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(164, 53, 254, 0.5);
}

.ac-action-btn-primary:active {
  transform: translateY(0) scale(0.98);
}

/* حالة "تم الحفظ" — أخضر هادئ */
.ac-action-btn-primary.is-saved {
  background: linear-gradient(135deg, #3d9d6d, #4db87e);
  box-shadow: 0 4px 16px rgba(77, 184, 126, 0.3);
}

.ac-action-btn-primary.is-saved i {
  color: #fff;
}

/* حالة التعطيل */
.ac-action-btn-primary:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

/* ───── تنزيل — ثانوي (Outline ذهبي) ───── */
.ac-action-btn-secondary {
  background: transparent;
  color: var(--ac-gold);
  border: 1.5px solid var(--ac-border2);
}

.ac-action-btn-secondary i {
  color: var(--ac-gold);
}

.ac-action-btn-secondary:hover {
  background: rgba(217, 192, 136, 0.08);
  border-color: var(--ac-gold);
  transform: translateY(-1px);
}

.ac-action-btn-secondary:active {
  transform: translateY(0) scale(0.98);
}

/* ───── رسالة الحالة أسفل الأزرار ───── */
.ac-save-status {
  display: block;
  text-align: center;
  margin-top: 10px;
  font-size: 12.5px;
  min-height: 1em;
  font-weight: 600;
}

/* ───── الجوال — نفس التصميم بأحجام مضبوطة ───── */
@media (max-width: 600px) {
  .ac-chart-actions {
    gap: 8px;
    margin-top: 14px;
    padding: 0 4px;
  }

  .ac-action-btn {
    padding: 12px 18px;
    font-size: 13px;
  }

  .ac-action-btn i {
    font-size: 14px;
  }
}

/* ═══════════════════════════════════════════════════════
   34) COPY OPTIONS — خيارات نسخ البيانات (Chips)
   ═══════════════════════════════════════════════════════ */
.ac-copy-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 4px;
}

.ac-copy-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--ac-glass);
  border: 1px solid var(--ac-border);
  border-radius: 50px;
  padding: 8px 14px 8px 12px;
  cursor: pointer;
  user-select: none;
  font-size: 13px;
  color: var(--ac-text2);
  transition: background 0.2s, border-color 0.2s, color 0.2s;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.ac-copy-check:hover {
  background: var(--ac-glass2);
  border-color: rgba(217, 192, 136, 0.4);
}

/* ✅ الـ checkbox الفعلي */
.ac-copy-check input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  border: 1.5px solid var(--ac-border);
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.04);
  cursor: pointer;
  position: relative;
  flex-shrink: 0;
  transition: background 0.2s, border-color 0.2s;
  margin: 0;
}

.ac-copy-check input[type="checkbox"]:checked {
  background: linear-gradient(135deg, var(--ac-purple2), var(--ac-purple));
  border-color: transparent;
}



/* ✅ الأيقونة داخل الـ label */
.ac-copy-check i {
  font-size: 13px;
  color: var(--ac-gold);
  flex-shrink: 0;
  transition: color 0.2s;
}

/* ✅ حالة التحديد — النص يصبح فاتحاً */
.ac-copy-check input[type="checkbox"]:checked ~ span,
.ac-copy-check:has(input[type="checkbox"]:checked) {
  color: var(--ac-text);
}

.ac-copy-check:has(input[type="checkbox"]:checked) {
  background: rgba(217, 192, 136, 0.1);
  border-color: var(--ac-border2);
}

/* ───── الجوال — ترتيب أفضل ───── */
@media (max-width: 600px) {
  .ac-copy-options {
    gap: 6px;
  }

  .ac-copy-check {
    padding: 7px 11px 7px 10px;
    font-size: 12.5px;
    gap: 6px;
  }

  .ac-copy-check input[type="checkbox"] {
    width: 16px;
    height: 16px;
  }

  .ac-copy-check input[type="checkbox"]:checked::after {
    left: 4.5px;
    top: 1px;
    width: 3px;
    height: 8px;
  }

  .ac-copy-check i {
    font-size: 12px;
  }
}

/* ═══════════════════════════════════════════════════════
   35) ASTRO SUMMARY — شريط الظواهر + 3 بطاقات
   ═══════════════════════════════════════════════════════ */

.ac-summary-wrap {
  margin: 0 0 20px;
}

/* ───── شريط الظواهر ───── */
.ac-summary-events {
  background: linear-gradient(135deg, rgba(164,53,254,0.08), rgba(217,192,136,0.05));
  border: 1px solid var(--ac-border2);
  border-right: 3px solid var(--ac-gold);
  border-radius: 14px;
  padding: 14px 18px;
  margin-top: 12px;   /* ✅ يفصله عن البطاقات أعلاه */
}

.ac-summary-events-head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 700;
  color: var(--ac-gold);
  margin-bottom: 8px;
  letter-spacing: 0.3px;
}

.ac-summary-events-head i {
  font-size: 16px;
}

.ac-summary-events-intro {
  font-size: 13px;
  color: var(--ac-text);
  margin: 0 0 10px;
  line-height: 1.6;
}

.ac-summary-events-list {
  list-style: none;
  padding: 0;
  margin: 0 0 10px;
}

.ac-summary-events-list li {
  font-size: 13px;
  color: var(--ac-text);
  padding: 4px 0;
  display: flex;
  align-items: center;
  gap: 8px;
  line-height: 1.5;
}

.ac-summary-events-list li::before {
  content: '✦';
  color: var(--ac-gold);
  font-size: 11px;
  flex-shrink: 0;
}

.ac-summary-events-more {
  font-size: 12px;
  color: var(--ac-text2);
  font-style: italic;
  margin: 4px 0 0;
}

.ac-summary-events-cta {
  display: inline-block;
  font-size: 12px;
  color: var(--ac-gold);
  margin-top: 10px;
  text-decoration: none;
  font-weight: 600;
  transition: color 0.2s;
}

.ac-summary-events-cta:hover {
  color: var(--ac-text);
}

/* ───── حالة الخريطة العادية ───── */
.ac-summary-events-empty {
  background: var(--ac-glass);
  border: 1px solid var(--ac-border);
  border-right: 3px solid var(--ac-text2);
}

.ac-summary-events-empty .ac-summary-events-head {
  color: var(--ac-text);
}

/* ───── البطاقات الثلاث ───── */
.ac-summary-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.ac-summary-card {
  background: var(--ac-glass);
  border: 1px solid var(--ac-border);
  border-radius: 12px;
  padding: 14px 16px;
  position: relative;
  overflow: hidden;
  transition: border-color 0.2s, transform 0.2s;
}

.ac-summary-card::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 3px;
  border-radius: 12px 12px 0 0;
}

/* ألوان الأشرطة العلوية */
.ac-summary-card--sun::before {
  background: var(--ac-gold);
}

.ac-summary-card--moon::before {
  background: var(--ac-purple);
}

.ac-summary-card--asc::before {
  background: #a8a0b8;
}

.ac-summary-card:hover {
  border-color: rgba(164,53,254,0.45);
  transform: translateY(-2px);
}

.ac-summary-card-icon {
  font-size: 20px;
  line-height: 1;
  margin-bottom: 8px;
  display: block;
}

.ac-summary-card--sun .ac-summary-card-icon { color: var(--ac-gold); }
.ac-summary-card--moon .ac-summary-card-icon { color: var(--ac-purple); }
.ac-summary-card--asc .ac-summary-card-icon { color: #a8a0b8; }

.ac-summary-card-label {
  font-size: 11px;
  font-weight: 700;
  color: var(--ac-text2);
  letter-spacing: 0.5px;
  margin-bottom: 4px;
  display: block;
}

.ac-summary-card-value {
  font-size: 15px;
  font-weight: 700;
  color: var(--ac-text);
  line-height: 1.4;
}

.ac-summary-card--sun .ac-summary-card-value { color: var(--ac-gold); }
.ac-summary-card--moon .ac-summary-card-value { color: #c7a6ff; }
.ac-summary-card--asc .ac-summary-card-value { color: #d0c8e0; }

/* ───── الجوال — عمودي ───── */
@media (max-width: 768px) {
  /* ✅ الهوامش الجانبية */
  .ac-summary-wrap {
    margin: 0 12px 20px;
  }

   .ac-summary-events {
    padding: 12px 14px;
    margin-top: 10px;   /* ✅ */
  }

  .ac-summary-events-head {
    font-size: 13px;
  }

  /* ✅ البطاقات أفقية على الجوال */
  .ac-summary-cards {
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
  }

  .ac-summary-card {
    padding: 10px 8px;
    text-align: center;
  }

  .ac-summary-card-icon {
    margin: 0 auto 6px;
    font-size: 18px;
  }

  .ac-summary-card-label {
    font-size: 10px;
    margin-bottom: 3px;
    text-align: center;
  }

  .ac-summary-card-value {
    font-size: 12.5px;
    text-align: center;
    line-height: 1.3;
  }

  /* ✅ هامش أسفل البطاقات (لا تلتصق بالـ bottom bar) */
  .ac-mobile-app-mode #ac-summary-section {
    padding-bottom: 8px;
  }
}

/* ✅ على الشاشات الصغيرة جداً */
@media (max-width: 380px) {
  .ac-summary-card-label {
    font-size: 9.5px;
  }
  .ac-summary-card-value {
    font-size: 11.5px;
  }
  .ac-summary-card-icon {
    font-size: 16px;
  }
}

/* ═══════════════════════════════════════════════════════
   36) SKELETON LOADER — هيكل تحميل الظواهر
   ═══════════════════════════════════════════════════════ */

.ac-summary-skeleton {
  background: linear-gradient(135deg, rgba(164,53,254,0.05), rgba(217,192,136,0.03));
  border: 1px solid var(--ac-border);
  border-radius: 14px;
  padding: 16px 18px;
  margin-top: 12px;
  animation: ac-skel-fadeIn 0.3s ease;
}

.ac-summary-skeleton-head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 700;
  color: var(--ac-gold);
  margin-bottom: 6px;
}

.ac-summary-skeleton-head i {
  font-size: 15px;
  animation: ac-skel-pulse 2s ease-in-out infinite;
}

.ac-summary-skeleton-sub {
  font-size: 11.5px;
  color: var(--ac-text2);
  margin: 0 0 14px;
  opacity: 0.75;
  line-height: 1.5;
}

/* مستطيلات الهيكل */
.ac-skel-bar {
  height: 12px;
  border-radius: 6px;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.04) 0%,
    rgba(255, 255, 255, 0.10) 50%,
    rgba(255, 255, 255, 0.04) 100%
  );
  background-size: 200% 100%;
  animation: ac-skel-shimmer 1.6s infinite;
  margin-bottom: 8px;
}

.ac-skel-bar:nth-child(2) { width: 92%; }
.ac-skel-bar:nth-child(3) { width: 78%; }
.ac-skel-bar:nth-child(4) { width: 85%; margin-bottom: 0; }

@keyframes ac-skel-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

@keyframes ac-skel-pulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.5; }
}

@keyframes ac-skel-fadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* انتقال عند استبدال الهيكل بالمحتوى */
.ac-summary-events {
  animation: ac-skel-fadeIn 0.25s ease;
}

/* ✅ احترام تفضيل تقليل الحركة */
@media (prefers-reduced-motion: reduce) {
  .ac-skel-bar,
  .ac-summary-skeleton-head i {
    animation: none !important;
  }
}

/* ✅ على الجوال */
@media (max-width: 768px) {
  .ac-summary-skeleton {
    padding: 14px 16px;
    margin-top: 10px;
  }

  .ac-summary-skeleton-head {
    font-size: 12.5px;
  }

  .ac-summary-skeleton-sub {
    font-size: 11px;
    margin-bottom: 12px;
  }

  .ac-skel-bar {
    height: 10px;
    margin-bottom: 7px;
  }
}

/* مسافة تنفّس أعلى محتوى #ac-map-section بعد إزالة الإطار الخارجي */
#ac-map-section {
    padding-top: 12px;
}


/* ═══════════════════════════════════════════════════
   خلفية موحّدة لشرائط التابات
   (البيانات + الإنسايتس + المحاور الفرعية + التاب الرئيسي)
   ═══════════════════════════════════════════════════ */

#ac-tabs-section div .ac-tabs-nav,
#ac-insights-section .ac-insights-tabs,
.ac-axes-wrapper .ac-axes-tabs,
.ac-main-tabs {
    background-image: linear-gradient(to right, #25145c 5%, #a435fe 130%);
    border-top-right-radius: 0px;
    border-bottom-left-radius: 0px;
    border-top-left-radius: 15px;
    border-bottom-right-radius: 15px;
}