/* ==========================================================
   ALX landing pages (/pages/*): styles moved verbatim from «ALFAC UX patch v1» (Settings > Customization CSS), phase 6.
   Loaded only by pages/other_pages.blade.php. Pairs with app/Support/LandingContent.php (tables built on the server)
   and js/alx-landing.js (drag hint / sticky first column while a table overflows).
   ========================================================== */

/* ALFAC brand colours (25 Oct 2026): the green #0a7f5c used by landing pages and added sections is replaced
   with the site identity: navy #112569 buttons, blue #2E86C1 text links. WhatsApp buttons stay green. */
.alfac-lp a:not(.lp-btn) { color: #2E86C1 !important; }
.alfac-lp .lp-btn-main { background: #112569 !important; }
.alfac-lp .lp-btn-main:hover { background: #1E3A8A !important; }
.alfac-lp .lp-cta { background: #f1f5fb !important; border-color: #d6e2f3 !important; }
.alfac-lp .ap-p, #alfac-cmmp-page .cm-price span { color: #112569 !important; }

/* ALFAC price tables (25 Oct 2026): navy header, white body with soft stripes, total price stronger than
   price per hour, «توفيرك» column on package tables, «اشترك» button per row, highlighted diploma row,
   «الساعات» hidden and first column sticky on mobile. */
.alfac-lp .ap-wrap { background: #fff !important; border-color: #dbe3ee !important; box-shadow: 0 2px 10px rgba(17, 37, 105, .05); }
.alfac-lp .ap-wrap thead th { background: #112569 !important; color: #fff !important; font-weight: 700; border-bottom: 0 !important; white-space: nowrap; }
.alfac-lp .ap-wrap tbody td { background: #fff; }
.alfac-lp .ap-wrap tbody tr:nth-child(even) td { background: #f5f8fc; }
.alfac-lp .ap-wrap td[data-alfac-hour] { color: #64748b !important; font-weight: 600 !important; font-size: .9em; }
.alfac-lp .ap-wrap td[data-alfac-hour]::after { content: " ريال"; font-weight: 400; font-size: .85em; }
.alfac-lp .ap-wrap td[data-alfac-hour]:has(.ap-na)::after { content: none; }
.alfac-lp .ap-wrap .alfac-hide { display: none !important; }
.alfac-lp .ap-wrap td.alfac-save-cell { color: #1E3A8A; font-weight: 800; white-space: nowrap; font-variant-numeric: tabular-nums; }
.alfac-lp .ap-wrap td.alfac-sub-cell { text-align: center; white-space: nowrap; }
.alfac-lp .ap-wrap a.alfac-sub { display: inline-block; padding: 6px 16px; border-radius: 8px; background: linear-gradient(135deg, #dc2626, #b91c1c); color: #fff !important; font-weight: 700; font-size: .85em; line-height: 1.6; text-decoration: none !important; white-space: nowrap; box-shadow: 0 2px 6px rgba(185, 28, 28, .25); }
.alfac-lp .ap-wrap a.alfac-sub:hover { background: linear-gradient(135deg, #b91c1c, #991b1b); }
.alfac-lp .alfac-badge { display: inline-block; margin-inline-start: 8px; padding: 1px 9px; border-radius: 999px; font-size: .75em; font-weight: 700; line-height: 1.5; vertical-align: baseline; position: relative; top: -1px; white-space: nowrap; }
.alfac-lp .alfac-badge--best { background: #112569; color: #fff; }
.alfac-lp .ap-wrap tr.alfac-best td { background: #eef4ff !important; }
.alfac-lp .ap-wrap tr.alfac-best td:first-child { box-shadow: inset -4px 0 0 #2E86C1; font-weight: 700; }
@media (max-width: 767px) {
  .alfac-lp .ap-wrap .alfac-hours-col { display: none; }
  .alfac-lp .ap-wrap table[data-alfac-tbl] th { white-space: normal !important; line-height: 1.4; }
  .alfac-lp .ap-wrap table[data-alfac-tbl] td:not(:first-child) { white-space: nowrap; }
  .alfac-lp .ap-wrap table[data-alfac-tbl] td:first-child { width: 30%; }
  .alfac-lp .ap-wrap table[data-alfac-tbl] th, .alfac-lp .ap-wrap table[data-alfac-tbl] td { padding: .5rem .3rem !important; font-size: .92em; }
  .alfac-lp .ap-wrap td[data-alfac-hour]::after { content: none; }
  .alfac-lp .ap-wrap a.alfac-sub { padding: 4px 9px; font-size: .8em; }
  .alfac-lp .ap-wrap tr.alfac-best .alfac-badge--best { margin: 3px 0 0; }
}

/* ALFAC table alignment (25 Oct 2026): numeric columns centred and narrow, secondary text columns quieter */
.alfac-lp .ap-wrap .alfac-num { text-align: center !important; white-space: nowrap; width: 1%; }
.alfac-lp .ap-wrap td.alfac-sec { color: #475569; font-size: .9em; line-height: 1.7; }
@media (max-width: 767px) {
  .alfac-lp .ap-wrap table:not([data-alfac-tbl]) td:first-child { min-width: 118px; }
}
@media (max-width: 767px) {
  .alfac-lp .ap-wrap table.alfac-narrow { min-width: 0 !important; }
  .alfac-lp .ap-wrap th.alfac-num { white-space: normal !important; line-height: 1.4; }
  .alfac-lp .ap-wrap table.alfac-wide th:first-child, .alfac-lp .ap-wrap table.alfac-wide td:first-child { position: sticky; right: 0; z-index: 1; }
  .alfac-lp .ap-wrap table.alfac-wide th:first-child { z-index: 2; }
  .alfac-lp .ap-wrap table.alfac-wide td:first-child { box-shadow: -6px 0 8px -6px rgba(17, 37, 105, .15); }
}
/* ALFAC landing FAQ accordion (25 Oct 2026) */
.alfac-lp details.lp-faq { border: 1px solid #dbe3ee; border-radius: 12px; background: #fff; margin: 0 0 10px; overflow: hidden; }
.alfac-lp details.lp-faq > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 12px; padding: 14px 16px; }
.alfac-lp details.lp-faq > summary::-webkit-details-marker { display: none; }
.alfac-lp details.lp-faq > summary h3 { flex: 1; margin: 0 !important; font-size: 1.02rem !important; font-weight: 700; color: #112569; line-height: 1.6; }
.alfac-lp details.lp-faq > summary::after { content: "+"; flex: none; width: 28px; height: 28px; border-radius: 50%; background: #f1f5fb; color: #112569; font-weight: 700; font-size: 20px; line-height: 28px; text-align: center; }
.alfac-lp details.lp-faq[open] > summary::after { content: "−"; background: #112569; color: #fff; }
.alfac-lp details.lp-faq[open] > summary { border-bottom: 1px solid #eef2f7; }
.alfac-lp details.lp-faq > :not(summary) { margin: 0 !important; padding: 12px 16px 14px; }
.alfac-lp details.lp-faq > summary:hover h3 { color: #1E3A8A; }
/* ALFAC readability (25 Oct 2026): page/blog body text was theme gray #818894 (contrast ~3.5:1); now slate #334155 (~10:1) */
.post-show p, .post-show span { color: #334155; }
/* ALFAC readability 2: fact-card captions and price notes on landing pages #6b7280 -> #475569 */
.post-show .alfac-lp [class*="fact"] span, .post-show .alfac-lp p.ap-note { color: #475569; }
/* ALFAC readability 3: remaining secondary notes and price-per-hour cells -> #475569 */
.post-show .alfac-lp p.ap-note, .post-show .alfac-lp p.ie-note, .post-show .alfac-lp .cm-price small, .alfac-lp .ap-wrap td[data-alfac-hour] { color: #475569 !important; }
/* ALFAC compact narrow tables on mobile (25 Oct 2026): headers and cells wrap, tighter padding, so tables with the «اشترك» column fit the screen */
@media (max-width: 767px) {
  .alfac-lp .ap-wrap table.alfac-narrow th, .alfac-lp .ap-wrap table.alfac-narrow td { padding: .5rem .35rem !important; }
  .alfac-lp .ap-wrap table.alfac-narrow th, .alfac-lp .ap-wrap table.alfac-narrow td:not(.alfac-sub-cell) { white-space: normal !important; }
  .alfac-lp .ap-wrap table[data-alfac-sub] td:first-child { min-width: 0 !important; width: 28%; }
  .alfac-lp .ap-wrap table[data-alfac-sub] td.alfac-sec { font-size: .85em; }
}

/* ---------- 20. جداول صفحات تدريب الشركات والجهات: تصميم احترافي، وبطاقات على الجوال (27 أكتوبر، بطلب المستخدم) ---------- */
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap { border: 1px solid #e3e8f0; border-radius: 14px; overflow: hidden; background: #fff; box-shadow: 0 4px 18px rgba(17, 37, 105, .06); margin: .75rem 0 1.5rem; }
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap table { min-width: 0; width: 100%; border-collapse: separate; border-spacing: 0; }
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap thead th { background: #112569; color: #fff; font-weight: 700; font-size: .92rem; padding: .85rem 1rem; border: 0; }
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tbody td { padding: .85rem 1rem; border-bottom: 1px solid #eef1f6; vertical-align: middle; color: #334155; background: #fff; transition: background .15s; }
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tbody tr:nth-child(even) td { background: #f8fafc; }
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tbody tr:last-child td { border-bottom: 0; }
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tbody tr:hover td { background: #eef6f2; }
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tbody td:first-child { font-weight: 700; color: #112569; }
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tbody td:first-child a { color: #112569 !important; text-decoration: none !important; font-weight: 700; }
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tbody td:first-child a::after { content: "←"; display: inline-block; margin-inline-start: .45rem; color: #0a7f5c; font-weight: 400; transition: transform .15s; }
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tbody td:first-child a:hover { color: #0a7f5c !important; }
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tbody td:first-child a:hover::after { transform: translateX(-3px); }
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap table:has(th:nth-child(3)) td:last-child { white-space: nowrap; color: #0b5d3b; font-weight: 700; }
@media (max-width: 640px) {
  :is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap { border: 0; border-radius: 0; box-shadow: none; background: transparent; overflow: visible; }
  :is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap thead { display: none; }
  :is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap table,
  :is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tbody,
  :is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tr,
  :is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap td { display: block; width: auto; }
  :is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tbody tr { background: #fff; border: 1px solid #e3e8f0; border-radius: 12px; padding: 12px 14px; margin-bottom: 10px; box-shadow: 0 2px 8px rgba(17, 37, 105, .05); }
  :is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tbody td,
  :is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tbody tr:nth-child(even) td,
  :is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tbody tr:hover td { background: transparent; border: 0; padding: 2px 0; }
  :is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tbody td:first-child { font-size: 1rem; margin-bottom: 2px; }
  :is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap tbody td:nth-child(2) { color: #64748b; font-size: .9rem; line-height: 1.7; }
  :is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ie-wrap table:has(th:nth-child(3)) td:last-child { display: inline-block; margin-top: 8px; padding: 3px 12px; border-radius: 999px; background: #e8f5ef; color: #0b5d3b; font-size: .82rem; }
}

/* ---------- 21. صفحات تدريب الجهات: بطاقات مسارات ملوّنة، أقسام بخلفية، شعارات أصغر (27 أكتوبر، بطلب المستخدم) ---------- */
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ct-logos figure { height: 70px; padding: 8px; }
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ct-logos img { max-height: 48px; }
#alfac-corp .ct-card { position: relative; display: flex; flex-direction: column; border: 1px solid #e3e8f0; border-top: 4px solid var(--ct, #112569); border-radius: 14px; padding: 18px 20px 20px; background: #fff; box-shadow: 0 2px 10px rgba(17, 37, 105, .05); transition: transform .2s, box-shadow .2s; }
#alfac-corp .ct-card:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(17, 37, 105, .10); }
#alfac-corp .ct-card.ct-adm { --ct: #112569; --ct-bg: #eef1fa; }
#alfac-corp .ct-card.ct-eng { --ct: #0a7f5c; --ct-bg: #e8f5ef; }
#alfac-corp .ct-card.ct-cert { --ct: #a8741a; --ct-bg: #fbf3e2; }
#alfac-corp .ct-card h3 { display: flex; align-items: center; gap: 10px; color: var(--ct) !important; }
#alfac-corp .ct-ico { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; background: var(--ct-bg); color: var(--ct); display: inline-flex; align-items: center; justify-content: center; }
#alfac-corp .ct-ico svg { width: 20px; height: 20px; }
#alfac-corp .ct-card p { flex: 1 1 auto; }
#alfac-corp .ct-card a.ct-btn { align-self: flex-start; display: inline-block; margin-top: 4px; padding: 8px 16px; border: 1.5px solid var(--ct); border-radius: 10px; color: var(--ct) !important; text-decoration: none !important; font-weight: 700; font-size: .92rem; transition: background .15s, color .15s; }
#alfac-corp .ct-card a.ct-btn:hover { background: var(--ct); color: #fff !important; }
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ct-band { background: #fff; border: 1px solid #e3e8f0; border-inline-start: 4px solid #0a7f5c; border-radius: 16px; padding: 4px 22px 12px; margin: 1.75rem 0; box-shadow: 0 4px 16px rgba(17, 37, 105, .06); }
:is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ct-band > h2 { margin-top: 1.1rem; }
@media (max-width: 575px) { :is(#alfac-corp, #alfac-corp-adm, #alfac-corp-eng) .ct-band { padding: 2px 14px 8px; } }

/* ---------- 22. توحيد جداول كل صفحات الهبوط مع تصميم صفحات الجهات (27 أكتوبر، بطلب المستخدم) ---------- */
.alfac-lp .ie-wrap { border: 1px solid #e3e8f0; border-radius: 14px; background: #fff; box-shadow: 0 4px 18px rgba(17, 37, 105, .06); margin: .75rem 0 1.5rem; }
.alfac-lp .ie-wrap thead th { background: #112569; color: #fff; font-weight: 700; border: 0; }
.alfac-lp .ie-wrap tbody td { background: #fff; }
.alfac-lp .ie-wrap tbody tr:nth-child(even) td { background: #f8fafc; }
.alfac-lp .ie-wrap tbody tr:last-child td { border-bottom: 0; }
.alfac-lp :is(.ie-wrap, .ap-wrap) tbody td:first-child a { color: #112569 !important; text-decoration: none !important; font-weight: 700; }
.alfac-lp :is(.ie-wrap, .ap-wrap) tbody td:first-child a::after { content: "←"; display: inline-block; margin-inline-start: .4rem; color: #0a7f5c; font-weight: 400; transition: transform .15s; }
.alfac-lp :is(.ie-wrap, .ap-wrap) tbody td:first-child a:hover { color: #0a7f5c !important; }
.alfac-lp :is(.ie-wrap, .ap-wrap) tbody td:first-child a:hover::after { transform: translateX(-3px); }

/* ---------- 23. التمرير باتجاه العربية: شريط الشركاء يتحرك من اليسار إلى اليمين بلا فراغات، وتلميح سحب للجداول العريضة على الجوال (27 أكتوبر، بطلب المستخدم) ---------- */
.alfac-scroll-hint { display: none; font-size: .8rem; color: #64748b; margin: .25rem 0 .35rem; }
.alfac-scroll-hint.show { display: block; }
.alfac-lp :is(.ap-wrap, .ie-wrap).is-scrollable:not(.at-end) { -webkit-mask-image: linear-gradient(to right, transparent 0, #000 40px); mask-image: linear-gradient(to right, transparent 0, #000 40px); }
