/* ==========================================================================
   أداة العطل الألمانية — تنسيق
   ⚠️ درس مقيس من هذا الموقع: القالب يبدّل الوضع الداكن بالصنف html.dark-skin
      وقتَ التشغيل ولا يغيّر data-skin أبدًا. وكل سطح بخلفية ثابتة يحتاج
      **لونًا صريحًا** وإلا ورث الأبيض وصار أبيض على أبيض (حدث فعلًا على جدول
      أسعار الذهب: نسبة تباين 1.00). لذلك كل قاعدة هنا تحدّد اللون والخلفية معًا.
   ========================================================================== */

.apx-hol{
  margin:22px 0 30px;
  padding:18px;
  border:1px solid #d9e2ec;
  border-radius:16px;
  background:#ffffff;
  color:#1f2d3d;                      /* صريح — لا وراثة */
}

.apx-hol__controls{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-bottom:16px;
}
.apx-hol__field{
  display:flex;
  flex-direction:column;
  gap:6px;
  flex:1 1 180px;
  min-width:0;
}
.apx-hol__field > span{
  font-size:13px;
  font-weight:700;
  color:#526174;                      /* 6.3:1 على الأبيض */
}
.apx-hol select{
  width:100%;
  min-height:44px;                    /* هدف لمس ≥44px — 93.5% من الزوّار على الجوال */
  padding:10px 12px;
  border:1px solid #c7d2e0;
  border-radius:10px;
  background:#f7f9fc;
  color:#14273e;
  font-size:16px;                     /* <16px يجعل iOS يكبّر الصفحة عند التركيز */
  font-family:inherit;
}
.apx-hol select:focus-visible{
  outline:2px solid #0b57d0;
  outline-offset:2px;
}

.apx-hol__summary{
  margin:0 0 16px !important;
  padding:12px 14px;
  border-inline-start:4px solid #0b57d0;
  border-radius:0 8px 8px 0;
  background:#eef4ff;
  color:#14273e;
  font-size:15px;
  line-height:1.9;
}

.apx-hol__h{
  margin:22px 0 10px !important;
  font-size:19px;
  color:#203249 !important;
}

/* التمرير الأفقي للجدول على الشاشات الضيّقة بدل كسر التخطيط */
.apx-hol__wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }

.apx-hol__table{
  width:100%;
  border-collapse:collapse;
  font-size:15px;
}
.apx-hol__table th,
.apx-hol__table td{
  padding:11px 12px;
  border:1px solid #dbe3ec;
  text-align:right;
  vertical-align:top;
}
.apx-hol__table th{
  background:#203249;
  color:#ffffff;                      /* 13.0:1 */
  font-weight:700;
  white-space:nowrap;
}
.apx-hol__table td{ color:#1f2d3d; }  /* ← العمود الذي نسيه جدول الذهب */
.apx-hol__table tbody tr:nth-child(even) td{ background:#f7f9fc; }

.apx-hol__date{
  direction:ltr;
  text-align:right;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.apx-hol__de{
  display:block;
  margin-top:2px;
  font-size:12px;
  color:#6b7a8d;                      /* 4.6:1 */
  direction:ltr;
  text-align:right;
}

.apx-hol__credit{
  margin:16px 0 0 !important;
  padding:12px 14px;
  border-radius:10px;
  background:#f7f9fc;
  color:#526174;
  font-size:13px;
  line-height:1.9;
}
.apx-hol__credit a{ color:#0b57d0; }

.apx-hol-error{
  padding:12px 14px;
  border-inline-start:4px solid #b31200;
  background:#fdf3f2;
  color:#7a1006;
  border-radius:0 8px 8px 0;
}

.apx-hol[aria-busy="true"]{ opacity:.55; }

/* ==========================================================================
   الوضع الداكن — يُكتب المحدِّدان معًا لأن القالب يستعمل الصنف لا السمة.
   كل قيمة مقيسة مقابل خلفيتها.
   ========================================================================== */
html.dark-skin .apx-hol,
[data-skin="dark"] .apx-hol{
  background:#16202b;
  border-color:#26384a;
  color:#e7eaf0;                      /* 13.3:1 */
}
html.dark-skin .apx-hol__field > span,
[data-skin="dark"] .apx-hol__field > span{ color:#aab3c0; }   /* 8.0:1 */

html.dark-skin .apx-hol select,
[data-skin="dark"] .apx-hol select{
  background:#1e2c3a;
  border-color:#3a4c60;
  color:#e7eaf0;                      /* 11.9:1 */
}
html.dark-skin .apx-hol select:focus-visible,
[data-skin="dark"] .apx-hol select:focus-visible{ outline-color:#7cb2f5; }

html.dark-skin .apx-hol__summary,
[data-skin="dark"] .apx-hol__summary{
  background:#17253c;
  border-inline-start-color:#7cb2f5;
  color:#e7eaf0;                      /* 12.1:1 */
}
html.dark-skin .apx-hol__h,
[data-skin="dark"] .apx-hol__h{ color:#8fc4f5 !important; }   /* 8.9:1 */

html.dark-skin .apx-hol__table th,
[data-skin="dark"] .apx-hol__table th{
  background:#22303f;
  color:#ffffff;                      /* 12.2:1 */
  border-color:#26384a;
}
html.dark-skin .apx-hol__table td,
[data-skin="dark"] .apx-hol__table td{
  color:#e7eaf0 !important;           /* 13.3:1 — صريح، لا وراثة */
  background:transparent;
  border-color:#26384a;
}
html.dark-skin .apx-hol__table tbody tr:nth-child(even) td,
[data-skin="dark"] .apx-hol__table tbody tr:nth-child(even) td{ background:#1a2533; }

html.dark-skin .apx-hol__de,
[data-skin="dark"] .apx-hol__de{ color:#9aa6b6; }             /* 6.4:1 */

html.dark-skin .apx-hol__credit,
[data-skin="dark"] .apx-hol__credit{
  background:#1a1c21;
  color:#c3ccd8;                      /* 10.5:1 */
}
/* تخصّص كافٍ لتجاوز قاعدة روابط المتن ذات !important على هذا الموقع */
html.dark-skin #the-post .entry-content .apx-hol a,
[data-skin="dark"] #the-post .entry-content .apx-hol a{
  color:#7cb2f5 !important;           /* 7.4:1 */
}

html.dark-skin .apx-hol-error,
[data-skin="dark"] .apx-hol-error{
  background:#2b1513;
  border-inline-start-color:#ff8f6b;
  color:#ffd7cc;
}

@media (max-width:600px){
  .apx-hol{ padding:14px 12px; }
  .apx-hol__table{ font-size:14px; }
  .apx-hol__table th, .apx-hol__table td{ padding:9px 10px; }
  .apx-hol__h{ font-size:17px; }
}

@media (prefers-reduced-motion:reduce){
  .apx-hol, .apx-hol *{ transition:none !important; }
}

/* BIZ-014 — العدّ التنازلي وزرّ التقويم (أُضيفا 2026-09-22) */
.apx-hol__next{margin:0 0 12px;padding:10px 14px;border-radius:10px;font-size:16px;line-height:1.8;
border:1px solid rgba(0,0,0,.16)}
html.dark-skin .apx-hol__next{border-color:rgba(255,255,255,.22)}
.apx-hol__ics{min-height:44px;padding:0 16px;border-radius:22px;cursor:pointer;font:inherit;font-size:14px;
color:inherit;background:transparent;border:1px solid rgba(0,0,0,.24);align-self:end}
.apx-hol__ics:hover,.apx-hol__ics:focus-visible{border-color:var(--brand-color,#000)}
html.dark-skin .apx-hol__ics{border-color:rgba(255,255,255,.3)}
