/* ──────────────────────────────────────────────────────────
   FictionX – moi-1  Pages module: article reading view
   Scope: `.fx-article` only (rendered by module/{lang}/pages/show-page.dwt).
   Purpose: professional long-form reading layout for CMS page bodies —
   comfortable Arabic typography, a constrained reading measure, and
   fully responsive media (fixes legacy inline width/height on images).
   Presentation only: never alters authored content. RTL-first with
   logical properties. Radius 4px, no button shadows (template rules).
   ────────────────────────────────────────────────────────── */

/* Reading progress indicator (thin top bar; pure UI control) */
.fx-read-progress{
    position:fixed;
    inset-block-start:0;
    inset-inline-start:0;
    inline-size:0;
    block-size:3px;
    z-index:2147482900;
    background:linear-gradient(90deg,#c11717 0%,#a51313 60%,#7d0f0f 100%);
    transition:inline-size .12s linear;
    pointer-events:none;
}

/* ===== Article shell =====
   Design language borrowed from the bespoke page 1050 (parchment field +
   white content card + gold/maroon accents), applied via CSS only so the
   authored content of every other pages-show page stays byte-identical. */
.fx-article{
    display:block;
    padding-block:0 8px;
    background:hsl(42 35% 96%);
}

/* Tie the page-header band to the same palette with a gold underline. */
.fx-page-header{ border-bottom:3px solid #D4AF37 !important; }

/* Full-screen content: the card fills the full viewport width, edge to edge. */
.fx-article .fx-article__body{
    max-width:100%;
    width:100%;
    margin-block:26px 10px;
    margin-inline:0;
    color:#2b333d;
    font-size:17px;
    line-height:2;
    text-align:start;
    background:#ffffff;
    border-block:1px solid rgba(165,19,19,.10);
    box-shadow:none;
    padding:clamp(20px,4vw,54px);
}

/* Vertical rhythm for authored blocks. The theme sets p{font-size:14px}
   globally, which made paragraphs smaller than lists in the same article. */
.fx-article .fx-article__body p,
.fx-article .fx-article__body li{
    font-size:inherit;
}
.fx-article .fx-article__body p{
    margin:0 0 1.15em;
}
/* Legacy editor inline sizes (e.g. 14px) inside text must not shrink it. */
.fx-article .fx-article__body p span[style*="font-size:14px"],
.fx-article .fx-article__body li span[style*="font-size:14px"],
.fx-article .fx-article__body p span[style*="font-size: 14px"],
.fx-article .fx-article__body li span[style*="font-size: 14px"]{
    font-size:inherit !important;
}
.fx-article .fx-article__body p:last-child{ margin-bottom:0; }

/* Justify long paragraphs on comfortable widths only (avoids wide
   inter-word gaps on small screens). */
@media (min-width:768px){
    .fx-article .fx-article__body p{
        text-align:justify;
        text-justify:inter-word;
    }
}

/* Links inside content take the brand accent */
.fx-article .fx-article__body a{
    color:#a51313;
    text-decoration:none;
    border-block-end:1px solid rgba(165,19,19,.35);
    transition:color .2s ease, border-color .2s ease;
}
.fx-article .fx-article__body a:hover{
    color:#7d0f0f;
    border-block-end-color:#7d0f0f;
}

/* Lists (previously styled inline in the template; now scoped here) */
.fx-article .fx-article__body ul,
.fx-article .fx-article__body ol{
    padding-inline:30px;
    margin:0 0 1.15em;
}
.fx-article .fx-article__body li{
    list-style-type:square;
    padding:4px 0;
}

/* Headings authored inside the body */
.fx-article .fx-article__body h1,
.fx-article .fx-article__body h2,
.fx-article .fx-article__body h3,
.fx-article .fx-article__body h4{
    color:#15202b;
    line-height:1.4;
    margin:1.4em 0 .6em;
    scroll-margin-block-start:96px;
}

/* ===== Section headings (authored grey #eeeeee boxes) =====
   Presentation-only upgrade of the legacy inline-styled section boxes into
   centered section titles with a gold underline (mirrors page 1050's
   .section-title / .section-line). Text is never changed. */
.fx-article .fx-article__body div[style*="#eeeeee"]{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:clamp(12px,2vw,24px);
    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    padding:0 !important;
    margin:2.9em 0 1.8em !important;
    text-align:center;
    scroll-margin-block-start:96px;
}
/* Symmetric ornamental rules flanking the title, fading outward. */
.fx-article .fx-article__body div[style*="#eeeeee"]::before,
.fx-article .fx-article__body div[style*="#eeeeee"]::after{
    content:"";
    flex:0 1 104px;
    min-width:20px;
    height:2px;
    border-radius:4px;
}
.fx-article .fx-article__body div[style*="#eeeeee"]::before{
    background:linear-gradient(90deg,#a51313 0%,#D4AF37 55%,rgba(212,175,55,0) 100%);
}
.fx-article .fx-article__body div[style*="#eeeeee"]::after{
    background:linear-gradient(90deg,rgba(212,175,55,0) 0%,#D4AF37 45%,#a51313 100%);
}
/* Section titles get one size regardless of how the editor nested the
   inline font-size span (outer vs inner), which produced 14px vs 28px. */
.fx-article .fx-article__body div[style*="#eeeeee"] > span,
.fx-article .fx-article__body div[style*="#eeeeee"] > strong{
    font-size:clamp(20px,2vw,24px) !important;
}
.fx-article .fx-article__body div[style*="#eeeeee"] span span,
.fx-article .fx-article__body div[style*="#eeeeee"] span strong,
.fx-article .fx-article__body div[style*="#eeeeee"] strong span,
.fx-article .fx-article__body div[style*="#eeeeee"] strong strong{
    font-size:inherit !important;
}
.fx-article .fx-article__body div[style*="#eeeeee"] span,
.fx-article .fx-article__body div[style*="#eeeeee"] strong{
    color:#a51313 !important;
    font-weight:800;
    line-height:1.4;
    letter-spacing:-.2px;
}

/* ===== Responsive media (core fix + framed presentation) =====
   Authored images carry inline width/height (e.g. 700x400) and floats.
   Neutralise the fixed height, cap the width so nothing overflows, and
   present each image inside an elegant matte frame ("box"). */
.fx-article img{
    max-width:100%;
    height:auto !important;
    box-sizing:border-box;
    background:#fff;
    padding:7px;
    border:1px solid rgba(15,23,42,.12);
    border-radius:4px;
    box-shadow:none;
}

/* On roomy viewports keep the intended float but constrain the size so
   text still wraps nicely beside the image. */
@media (min-width:993px){
    .fx-article .fx-article__body img[style*="float:left"],
    .fx-article .fx-article__body img[style*="float: left"]{
        float:inline-start;
        max-width:min(48%,460px);
        margin:6px 0 14px 22px;
    }
    .fx-article .fx-article__body img[style*="float:right"],
    .fx-article .fx-article__body img[style*="float: right"]{
        float:inline-end;
        max-width:min(48%,460px);
        margin:6px 22px 14px 0;
    }
}

/* Tablet and below: stop floating, centre images, let them breathe. */
@media (max-width:992px){
    .fx-article .fx-article__body img{
        float:none !important;
        display:block;
        margin-inline:auto !important;
        margin-block:14px !important;
        width:auto;
    }
}

/* Embedded media and wide tables should never break the layout. */
.fx-article .fx-article__body iframe,
.fx-article .fx-article__body video{
    max-width:100%;
}
.fx-article .fx-article__body table{
    max-width:100%;
    border-collapse:collapse;
}

/* Share bar spacing within the article flow */
.fx-article .fx-share{
    margin-inline:auto;
}

/* ===== Full-bleed special page (ID 1050) — preserved behaviour ===== */
.page-albusaidi-state{
    width:100vw;
    max-width:100vw;
    margin-inline-start:calc(50% - 50vw);
    margin-inline-end:calc(50% - 50vw);
}
.page-albusaidi-state article ul,
.page-albusaidi-state article ol{
    padding:10px 30px;
}
.page-albusaidi-state article div.container li{
    list-style-type:square;
    padding:4px 0;
}

/* ===== CMS accordions (Bootstrap-3 markup authored in content) =====
   Display-only toggling; does not alter content. */
.fx-article .panel-group .panel-collapse{ display:none; overflow:hidden; }
.fx-article .panel-group .panel-collapse.in{ display:block; }
.fx-article .panel-group .panel-heading a{ cursor:pointer; }

/* ===== Responsive typography ===== */
@media (max-width:767px){
    .fx-article .fx-article__body{
        font-size:16px;
        line-height:1.95;
    }
    .fx-article .fx-article__body ul,
    .fx-article .fx-article__body ol{ padding-inline:22px; }
    .fx-article .fx-article__body div[style*="#eeeeee"] > span,
    .fx-article .fx-article__body div[style*="#eeeeee"] > strong{ font-size:19px !important; }
    /* Let the ornamental rules give way so short titles stay on one line. */
    .fx-article .fx-article__body div[style*="#eeeeee"]{ gap:10px; }
    .fx-article .fx-article__body div[style*="#eeeeee"]::before,
    .fx-article .fx-article__body div[style*="#eeeeee"]::after{ flex:1 1 0; min-width:14px; }
}

/* ══════════════════════════════════════════════════════════
   Page-specific creative styling (scoped by data-page-id so it
   can never affect any other pages-show page).
   ══════════════════════════════════════════════════════════ */

/* --- Page 599 · النشيد الوطني (National Anthem) ---
   Present the verse block (the last paragraph in .post-item, whose lines
   are separated by <br>) as an elegant centered, gold-framed plaque.
   Content is never altered — only its presentation. */
.fx-article[data-page-id="599"] .fx-article__body .post-item > p:last-of-type{
    position:relative;
    max-width:640px;
    margin:2.6em auto 1.2em;
    padding:40px 30px 34px;
    text-align:center;
    background:linear-gradient(180deg,#fffdf6 0%,#faf4e6 100%);
    border:1px solid rgba(212,175,55,.55);
    border-radius:4px;
    color:#7d0f0f;
    font-size:clamp(19px,2.2vw,25px);
    font-weight:600;
    line-height:2.5;
    box-shadow:none;
}
/* Jewel accent straddling the top edge */
.fx-article[data-page-id="599"] .fx-article__body .post-item > p:last-of-type::before{
    content:"";
    position:absolute;
    top:-9px;
    left:50%;
    transform:translateX(-50%) rotate(45deg);
    width:16px;
    height:16px;
    background:linear-gradient(135deg,#e9c96a,#D4AF37);
    border:1px solid rgba(125,15,15,.25);
    border-radius:3px;
}
/* Lead-in line ("… من الكلمات التالية:") centered above the plaque */
.fx-article[data-page-id="599"] .fx-article__body .post-item > p:nth-last-of-type(2){
    text-align:center;
    font-weight:700;
    color:#a51313;
}
@media (max-width:767px){
    .fx-article[data-page-id="599"] .fx-article__body .post-item > p:last-of-type{
        padding:30px 18px 26px;
        line-height:2.3;
    }
}

/* --- Page 1052 · الوزارات (Ministries directory) ---
   Rebuild the legacy flex rows into one uniform, responsive, shadow-free
   card grid. All `.row` groups collapse into a single grid via
   display:contents so cards wrap naturally at any width. Content untouched. */
/* Page 1052: no boxed container — content spans the full page width. */
.fx-article[data-page-id="1052"] .fx-article__body{
    padding-inline:clamp(14px,3vw,40px);
    border:0;
}
.fx-article[data-page-id="1052"] .page-ministries{ margin:6px 0; }
/* Each authored row becomes a centered, wrapping flex line. Cards grow to
   share the width but stay capped, so 3-per-row looks even and the lone
   last card never stretches. No empty middle cells, fully responsive. */
.fx-article[data-page-id="1052"] .page-ministries .row{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:stretch;
    gap:18px;
    margin:0 0 18px;
}
.fx-article[data-page-id="1052"] .page-ministries .item-outer-container{
    flex:1 1 200px;
    max-width:none;
    width:auto;
    margin:0;
    padding:26px 16px;
    background:#fff;
    border:1px solid rgba(165,19,19,.12);
    border-radius:4px;
    box-shadow:none;
    transition:transform .25s ease, border-color .25s ease, background .25s ease;
}
.fx-article[data-page-id="1052"] .page-ministries .item-outer-container:hover{
    transform:translateY(-4px);
    border-color:#D4AF37;
    background:linear-gradient(180deg,#fffdf6,#ffffff);
}
/* The final row holds a single ministry (الأوقاف) — keep it card-sized and
   centered instead of stretching it across the whole width. */
.fx-article[data-page-id="1052"] .page-ministries .item-outer-container:only-child{
    flex:0 1 320px;
    max-width:340px;
}
.fx-article[data-page-id="1052"] .page-ministries .item-inner-container{
    padding:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:14px;
}
/* A few cards carry a stray/comment-only anchor as a DIRECT child of the card
   (e.g. وزارة الصحة, وزارة الطاقة). style.css forces those anchors to
   height:100%;width:100%;display:block — so with equal-height (stretch) cards
   they filled the card and pushed the real content out (clipped by
   overflow:hidden). Collapse these empty wrappers; real image/label links live
   nested inside and are untouched. */
.fx-article[data-page-id="1052"] .page-ministries .item-outer-container > a{
    display:inline;
    width:auto;
    height:auto;
}
.fx-article[data-page-id="1052"] .page-ministries .image-outer-container{ width:100%; }
.fx-article[data-page-id="1052"] .page-ministries .image-inner-container{
    width:98px;
    height:98px;
    padding:16px;
    background:#faf6ec;
    border:1px solid rgba(212,175,55,.55);
    border-radius:50%;
    box-shadow:none;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:transform .25s ease;
}
.fx-article[data-page-id="1052"] .page-ministries .item-outer-container:hover .image-inner-container{
    transform:scale(1.05);
}
.fx-article[data-page-id="1052"] .page-ministries .image-inner-container img{
    width:100%;
    height:100%;
    object-fit:contain;
    background:transparent;
    border:0;
    border-radius:0;
    padding:0;
    box-shadow:none;
}
.fx-article[data-page-id="1052"] .page-ministries .label-container{
    margin:0;
    text-align:center;
    font-weight:700;
    font-size:15.5px;
    line-height:1.6;
    color:#15202b;
}
/* Neutralise the global content-link underline for directory links */
.fx-article[data-page-id="1052"] .page-ministries a{
    border:0 !important;
    color:inherit;
    text-decoration:none;
}
.fx-article[data-page-id="1052"] .page-ministries .item-outer-container:hover .label-container,
.fx-article[data-page-id="1052"] .page-ministries .item-outer-container:hover .label-container a{
    color:#a51313;
}

/* --- Page 681 · المراسيم السلطانية (Royal Decrees register) ---
   The body is a single unstyled 3-column table (رقم / تاريخ / عنوان) inside a
   float:right wrapper. Present it as a full-width, readable register: maroon
   header, parchment zebra rows, gold list bullets, and horizontal scroll on
   narrow screens. Content is never altered. */
.fx-article[data-page-id="681"] .fx-article__body > div{
    float:none !important;
    width:100% !important;
    overflow-x:auto;
    border:1px solid rgba(165,19,19,.15);
    border-radius:4px;
    -webkit-overflow-scrolling:touch;
}
.fx-article[data-page-id="681"] .fx-article__body > div > p{ margin:0; }
.fx-article[data-page-id="681"] .fx-article__body table{
    width:100%;
    min-width:640px;
    margin:0;
    border-collapse:collapse;
    font-size:16px;
    background:#fff;
}
/* Header (authored as the first row, bold centered labels) */
.fx-article[data-page-id="681"] .fx-article__body table tbody tr:first-child td{
    background:#26313c;
    text-align:center;
    vertical-align:middle;
    padding:16px 14px;
    border-color:#2f3d4b;
}
.fx-article[data-page-id="681"] .fx-article__body table tbody tr:first-child td *{
    color:#fff !important;
}
/* Body cells */
.fx-article[data-page-id="681"] .fx-article__body table td{
    padding:13px 16px;
    border:1px solid #e6e9ed;
    vertical-align:top;
    line-height:1.9;
}
.fx-article[data-page-id="681"] .fx-article__body table tbody tr:nth-child(even) td{
    background:#f6f7f9;
}
.fx-article[data-page-id="681"] .fx-article__body table tbody tr:not(:first-child):hover td{
    background:#eef2f7;
}
/* Decree number (col 1) + date (col 2): compact, centered, emphasised */
.fx-article[data-page-id="681"] .fx-article__body table td:first-child,
.fx-article[data-page-id="681"] .fx-article__body table td:nth-child(2){
    width:1%;
    white-space:nowrap;
    text-align:center;
    vertical-align:middle;
    font-weight:700;
}
.fx-article[data-page-id="681"] .fx-article__body table td:first-child p,
.fx-article[data-page-id="681"] .fx-article__body table td:nth-child(2) p{
    margin:.15em 0;
    text-align:center !important;
}
/* Title lists → gold bullet markers */
.fx-article[data-page-id="681"] .fx-article__body table td ul{
    margin:0;
    padding:0;
    list-style:none;
}
.fx-article[data-page-id="681"] .fx-article__body table td li{
    position:relative;
    list-style:none;
    padding-inline-start:1.15em;
    margin:.4em 0;
}
.fx-article[data-page-id="681"] .fx-article__body table td li:first-child{ margin-top:0; }
.fx-article[data-page-id="681"] .fx-article__body table td li:last-child{ margin-bottom:0; }
.fx-article[data-page-id="681"] .fx-article__body table td li::before{
    content:"";
    position:absolute;
    inset-inline-start:0;
    top:.72em;
    width:7px;
    height:7px;
    background:#3f6f89;
    border-radius:50%;
}
.fx-article[data-page-id="681"] .fx-article__body table td li p{ margin:0; }

/* Dark mode (theme swap → #theme_css=dark.css, mirrored as .fx-theme-dark).
   Adapt the register's surfaces/borders to the site's dark palette and lift
   the authored inline-black text so it stays legible. Presentation only. */
.fx-article.fx-theme-dark[data-page-id="681"]{
    background:#1f242b;
}
.fx-article.fx-theme-dark[data-page-id="681"] .fx-article__body{
    background:#23272e;
    color:#d0d0d0;
    border-color:#3a424c;
}
.fx-article.fx-theme-dark[data-page-id="681"] .fx-article__body > div{
    border-color:#3a424c;
}
.fx-article.fx-theme-dark[data-page-id="681"] .fx-article__body table{
    background:#2a2f36;
}
.fx-article.fx-theme-dark[data-page-id="681"] .fx-article__body table tbody tr:first-child td{
    background:#161b22;
    border-color:#161b22;
}
.fx-article.fx-theme-dark[data-page-id="681"] .fx-article__body table td{
    border-color:#3a424c;
    color:#d0d0d0;
}
.fx-article.fx-theme-dark[data-page-id="681"] .fx-article__body table tbody tr:nth-child(even) td{
    background:#232830;
}
.fx-article.fx-theme-dark[data-page-id="681"] .fx-article__body table tbody tr:not(:first-child):hover td{
    background:#2f3742;
}
.fx-article.fx-theme-dark[data-page-id="681"] .fx-article__body table td li::before{
    background:#6b8ba3;
}
/* Authored cells hard-code color:#000000 inline; lift it in dark mode so the
   text is readable (header keeps its own white rule, which wins by specificity). */
.fx-article.fx-theme-dark[data-page-id="681"] .fx-article__body table tbody tr:not(:first-child) td span{
    color:#d6d6d6 !important;
}

/* --- Page 763 · النطق السامي (Royal Speeches, one link per year) ---
   Authored as ~45 pink skewed theme buttons (btn-juicy_pink / new-angle /
   col-md-3). Rebuild them into a calm, uniform, responsive year grid that
   matches the site's slate palette. Presentation only; links untouched. */
.fx-article[data-page-id="763"] .fx-article__body > p{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(210px,1fr));
    gap:12px;
    margin:10px 0;
}
/* Base-design primary button: the theme's brand-red `.main-bg` (#a51313 → hover
   #870000) with its signature `new-angle` corners, unified into a tidy
   responsive grid. Mirrors the site's own button language. */
.fx-article[data-page-id="763"] .fx-article__body > p .btn{
    float:none !important;
    width:auto !important;
    max-width:none !important;
    min-height:0 !important;
    margin:0 !important;
    padding:15px 16px !important;
    display:flex !important;
    align-items:center;
    justify-content:center;
    text-align:center;
    white-space:nowrap;
    background:#a51313 !important;
    color:#fff !important;
    text-shadow:1px 1px 1px rgba(0,0,0,.15);
    border:0 !important;
    border-radius:0 !important;
    border-top-right-radius:10px !important;
    border-bottom-left-radius:10px !important;
    font-size:15px !important;
    font-weight:700 !important;
    line-height:1.4 !important;
    letter-spacing:0 !important;
    text-transform:none !important;
    box-shadow:none !important;
    transition:transform .2s ease, background .2s ease;
}
.fx-article[data-page-id="763"] .fx-article__body > p .btn:hover,
.fx-article[data-page-id="763"] .fx-article__body > p .btn:focus{
    background:#870000 !important;
    color:#fff !important;
    transform:translateY(-3px);
}

/* --- Page 675 · وكالة الأنباء العمانية (article + official social boxes) ---
   The article body reuses the shared reading styles. Here we (1) stop the
   global content-link underline/red-tint from bleeding onto the round social
   icons, (2) tidy the two authored account rows, and (3) adapt to dark mode.
   The authored per-network hover colours are preserved. */
.fx-article[data-page-id="675"] .fx-article__body .social-box{
    margin-top:22px;
    padding-top:18px;
    border-top:1px solid #e6e9ed;
}
.fx-article[data-page-id="675"] .fx-article__body .social-title{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    flex-wrap:wrap;
    gap:12px;
}
.fx-article[data-page-id="675"] .fx-article__body .social-title span{
    font-size:15px;
    color:#26313c;
}
.fx-article[data-page-id="675"] .fx-article__body .social{ gap:8px; }
.fx-article[data-page-id="675"] .fx-article__body .social a{
    width:38px;
    height:38px;
    font-size:15px;
    color:#fff;
    border:0;
    box-shadow:none !important;
}
.fx-article[data-page-id="675"] .fx-article__body .social a:hover{
    box-shadow:none !important;
}
/* Dark mode: adapt the reading card + social rows to the site's dark palette. */
.fx-article.fx-theme-dark[data-page-id="675"]{
    background:#1f242b;
}
.fx-article.fx-theme-dark[data-page-id="675"] .fx-article__body{
    background:#2a2f36;
    color:#d0d0d0;
    border-color:#3a424c;
}
.fx-article.fx-theme-dark[data-page-id="675"] .fx-article__body .social-box{
    border-top-color:#3a424c;
}
.fx-article.fx-theme-dark[data-page-id="675"] .fx-article__body .social-title span{
    color:#c2c6cc;
}
.fx-article.fx-theme-dark[data-page-id="675"] .fx-article__body .social a{
    border:1px solid rgba(255,255,255,.16);
}

/* --- Page 987 · دليل خدمات البوابة الإعلامية (services guide table) ---
   A 5-column table with real <th> headers. Same slate register language as the
   decrees table (681): clean bordered grid, slate header, light zebra rows,
   compact number/type columns, dark-mode aware, horizontal scroll on phones. */
.fx-article[data-page-id="987"] .fx-article__body{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
}
.fx-article[data-page-id="987"] .fx-article__body table{
    width:100%;
    min-width:820px;
    margin:6px 0;
    border-collapse:collapse;
    font-size:16px;
    background:#fff;
}
.fx-article[data-page-id="987"] .fx-article__body table th{
    background:#26313c;
    color:#fff;
    text-align:center !important;
    vertical-align:middle;
    padding:16px 14px;
    border:1px solid #2f3d4b;
    font-weight:700;
}
.fx-article[data-page-id="987"] .fx-article__body table td{
    padding:13px 16px;
    border:1px solid #e6e9ed;
    vertical-align:top;
    line-height:1.9;
}
.fx-article[data-page-id="987"] .fx-article__body table tbody tr:nth-child(even) td{
    background:#f6f7f9;
}
.fx-article[data-page-id="987"] .fx-article__body table tbody tr:hover td{
    background:#eef2f7;
}
/* No. column (compact, centered) */
.fx-article[data-page-id="987"] .fx-article__body table td:first-child{
    width:1%;
    white-space:nowrap;
    text-align:center;
    vertical-align:middle;
    font-weight:700;
    color:#26313c;
}
/* Service name column (emphasised) */
.fx-article[data-page-id="987"] .fx-article__body table td:nth-child(2){
    font-weight:700;
    color:#15202b;
}
/* Type column (compact, accent) */
.fx-article[data-page-id="987"] .fx-article__body table td:last-child{
    white-space:nowrap;
    text-align:center;
    vertical-align:middle;
    font-weight:600;
    color:#3f6f89;
}
/* Dark mode */
.fx-article.fx-theme-dark[data-page-id="987"]{
    background:#1f242b;
}
.fx-article.fx-theme-dark[data-page-id="987"] .fx-article__body{
    background:#23272e;
    color:#d0d0d0;
    border-color:#3a424c;
}
.fx-article.fx-theme-dark[data-page-id="987"] .fx-article__body table{
    background:#2a2f36;
}
.fx-article.fx-theme-dark[data-page-id="987"] .fx-article__body table th{
    background:#161b22;
    border-color:#161b22;
}
.fx-article.fx-theme-dark[data-page-id="987"] .fx-article__body table td{
    border-color:#3a424c;
    color:#d0d0d0;
}
.fx-article.fx-theme-dark[data-page-id="987"] .fx-article__body table tbody tr:nth-child(even) td{
    background:#20242b;
}
.fx-article.fx-theme-dark[data-page-id="987"] .fx-article__body table tbody tr:hover td{
    background:#2f3742;
}
.fx-article.fx-theme-dark[data-page-id="987"] .fx-article__body table td:first-child{
    color:#e2e5e9;
}
.fx-article.fx-theme-dark[data-page-id="987"] .fx-article__body table td:nth-child(2){
    color:#e8eaed;
}
.fx-article.fx-theme-dark[data-page-id="987"] .fx-article__body table td:last-child{
    color:#7ab0cf;
}

/* --- Page 1065 · تلفزيون سلطنة عُمان (channels + official accounts) ---
   Present each channel's official-accounts row as a clean card: the channel
   name with an accent bar, and brand-coloured social icons on the other side.
   Responsive + dark-mode aware. Authored per-network hover colours preserved;
   content is never altered. */
.fx-article[data-page-id="1065"] .fx-article__body .social-box{
    display:block;
    width:100%;
    margin:14px 0 0;
    padding:16px 20px;
    background:#fff;
    border:1px solid #e6e9ed;
    border-inline-start:4px solid #26313c;
    border-radius:6px;
}
.fx-article[data-page-id="1065"] .fx-article__body .social-title{
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:14px;
    width:100%;
    text-align:start;
}
.fx-article[data-page-id="1065"] .fx-article__body .social-title span{
    font-size:16px;
    font-weight:700;
    color:#26313c;
    white-space:normal;
}
.fx-article[data-page-id="1065"] .fx-article__body .social{ gap:8px; }
.fx-article[data-page-id="1065"] .fx-article__body .social a{
    width:40px;
    height:40px;
    font-size:16px;
    color:#fff;
    border:0;
    box-shadow:none !important;
}
.fx-article[data-page-id="1065"] .fx-article__body .social a:hover{
    box-shadow:none !important;
}
/* Brand-coloured icons by default (prettier than the flat dark dots) */
.fx-article[data-page-id="1065"] .fx-article__body .social .youtube{ background:#ff0000; }
.fx-article[data-page-id="1065"] .fx-article__body .social .facebook{ background:#1877f2; }
.fx-article[data-page-id="1065"] .fx-article__body .social .x,
.fx-article[data-page-id="1065"] .fx-article__body .social .threads{ background:#000; }
.fx-article[data-page-id="1065"] .fx-article__body .social .instagram{
    background:linear-gradient(45deg,#feda75,#fa7e1e,#d62976,#962fbf,#4f5bd5);
}
/* Dark mode */
.fx-article.fx-theme-dark[data-page-id="1065"]{
    background:#1f242b;
}
.fx-article.fx-theme-dark[data-page-id="1065"] .fx-article__body{
    background:#23272e;
    color:#d0d0d0;
    border-color:#3a424c;
}
.fx-article.fx-theme-dark[data-page-id="1065"] .fx-article__body .social-box{
    background:#2a2f36;
    border-color:#3a424c;
    border-inline-start-color:#6b8ba3;
}
.fx-article.fx-theme-dark[data-page-id="1065"] .fx-article__body .social-title span{
    color:#e2e5e9;
}

/* --- Page 516 · الملحقيات الإعلامية (Media Attaché offices) ---
   The office list is authored as alternating <li><strong>title</strong></li>
   and <li><pre>contact</pre></li>. Present each office as a tidy contact card
   (slate header + readable body, no monospace). Child selectors only (no
   :has()) so it works on older engines. Content untouched. */
.fx-article[data-page-id="516"] .fx-article__body ul{
    list-style:none;
    padding:0;
    margin:14px 0;
}
.fx-article[data-page-id="516"] .fx-article__body ul > li{
    list-style:none;
    margin:0;
    padding:0;
}
/* Office title (direct <strong> child of the li) → card header */
.fx-article[data-page-id="516"] .fx-article__body ul > li > strong{
    display:block;
    margin-top:18px;
    padding:12px 16px;
    background:#26313c;
    color:#fff;
    border-radius:6px 6px 0 0;
    font-size:16px;
    font-weight:700;
}
/* Contact block (<pre>) → card body, de-monospaced and wrapping */
.fx-article[data-page-id="516"] .fx-article__body ul > li > pre{
    margin:0 0 4px;
    padding:14px 16px;
    background:#fff;
    border:1px solid #e6e9ed;
    border-top:0;
    border-radius:0 0 6px 6px;
    font-family:inherit;
    font-size:15px;
    line-height:2;
    color:#2b333d;
    white-space:pre-wrap;
    word-break:break-word;
    overflow-wrap:anywhere;
}
.fx-article[data-page-id="516"] .fx-article__body ul > li > pre strong{
    font-weight:600;
}
/* Dark mode */
.fx-article.fx-theme-dark[data-page-id="516"]{
    background:#1f242b;
}
.fx-article.fx-theme-dark[data-page-id="516"] .fx-article__body{
    background:#23272e;
    color:#d0d0d0;
    border-color:#3a424c;
}
.fx-article.fx-theme-dark[data-page-id="516"] .fx-article__body ul > li > strong{
    background:#161b22;
}
.fx-article.fx-theme-dark[data-page-id="516"] .fx-article__body ul > li > pre{
    background:#2a2f36;
    color:#d0d0d0;
    border-color:#3a424c;
}

/* --- Page 838 · رؤية عمان 2040 ---
   pages-article.js rebuilds the four Word-pasted tables into a timeline,
   stat cards, numbered phases and a task checklist (text unchanged). The
   rules on the wrappers below also cover the no-JS fallback: tables scroll
   inside their box instead of widening the page. */
.fx-article[data-page-id="838"] .fx-article__body > div:not([style*="#eeeeee"]){
    float:none !important;
    width:100% !important;
    max-width:100%;
    clear:both;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
}
.fx-article[data-page-id="838"] .fx-article__body table{ width:auto !important; }
.fx-article[data-page-id="838"] .fx-article__body td{ width:auto !important; padding:8px 12px; }
.fx-article[data-page-id="838"] .fx-article__body p.fx-empty{ display:none; }

/* Timeline (المراحل الزمنية) */
.fx-article[data-page-id="838"] .fx-timeline{
    position:relative;
    list-style:none;
    margin:0 0 1.6em;
    padding:0;
}
.fx-article[data-page-id="838"] .fx-timeline::before{
    content:"";
    position:absolute;
    inset-block:10px;
    inset-inline-start:8px;
    width:2px;
    background:linear-gradient(180deg,#D4AF37 0%,#a51313 100%);
}
.fx-article[data-page-id="838"] .fx-timeline__item{
    position:relative;
    list-style:none;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
    margin:0;
    padding:0 0 18px;
    padding-inline-start:34px;
}
.fx-article[data-page-id="838"] .fx-timeline__item:last-child{ padding-bottom:0; }
.fx-article[data-page-id="838"] .fx-timeline__item::before{
    content:"";
    position:absolute;
    inset-inline-start:2px;
    top:8px;
    width:14px;
    height:14px;
    box-sizing:border-box;
    background:#fff;
    border:3px solid #a51313;
    border-radius:50%;
}
.fx-article[data-page-id="838"] .fx-timeline__item:last-child::before{
    background:#a51313;
    border-color:#D4AF37;
}
.fx-article[data-page-id="838"] .fx-timeline__date{
    display:inline-block;
    padding:0 10px;
    font-size:13.5px;
    font-weight:700;
    line-height:1.9;
    color:#a51313;
    background:#fbf3f3;
    border:1px solid rgba(165,19,19,.18);
    border-radius:4px;
    white-space:nowrap;
}
.fx-article[data-page-id="838"] .fx-timeline__text{
    font-size:16px;
    font-weight:600;
    line-height:1.8;
    color:#15202b;
}
@media (min-width:768px){
    .fx-article[data-page-id="838"] .fx-timeline__item{
        flex-direction:row;
        align-items:baseline;
        gap:16px;
    }
    .fx-article[data-page-id="838"] .fx-timeline__date{
        flex:0 0 130px;
        text-align:center;
    }
}

/* Participant statistics → stat cards */
.fx-article[data-page-id="838"] .fx-stats{ margin:0 0 1.8em; }
.fx-article[data-page-id="838"] .fx-stats__title{
    margin:0 0 14px;
    text-align:center;
    font-size:17px;
    font-weight:700;
    color:#26313c;
}
.fx-article[data-page-id="838"] .fx-stats__grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(170px,1fr));
    gap:12px;
    list-style:none;
    margin:0;
    padding:0;
}
.fx-article[data-page-id="838"] .fx-stats__item{
    list-style:none;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:6px;
    margin:0;
    padding:18px 12px 16px;
    text-align:center;
    background:linear-gradient(180deg,#fffdf6 0%,#faf4e6 100%);
    border:1px solid rgba(212,175,55,.45);
    border-top:3px solid #a51313;
    border-radius:4px;
}
.fx-article[data-page-id="838"] .fx-stats__num{
    direction:ltr;
    unicode-bidi:isolate;
    font-size:clamp(24px,3vw,30px);
    font-weight:800;
    line-height:1.2;
    color:#a51313;
}
.fx-article[data-page-id="838"] .fx-stats__label{
    font-size:14.5px;
    font-weight:600;
    line-height:1.6;
    color:#2b333d;
}

/* Preparation phases → numbered steps */
.fx-article[data-page-id="838"] .fx-steps{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));
    gap:10px;
    list-style:none;
    margin:0 0 1.6em;
    padding:0;
    counter-reset:fxstep;
}
.fx-article[data-page-id="838"] .fx-steps > li{
    counter-increment:fxstep;
    list-style:none;
    display:flex;
    align-items:center;
    gap:14px;
    margin:0;
    padding:12px 16px;
    font-weight:600;
    line-height:1.7;
    color:#15202b;
    background:#fff;
    border:1px solid #e6e9ed;
    border-inline-start:4px solid #D4AF37;
    border-radius:4px;
}
.fx-article[data-page-id="838"] .fx-steps > li::before{
    content:counter(fxstep);
    flex:0 0 32px;
    height:32px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:15px;
    font-weight:700;
    color:#fff;
    background:#a51313;
    border-radius:50%;
}

/* Follow-up unit tasks → checklist cards */
.fx-article[data-page-id="838"] .fx-checklist{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));
    gap:10px;
    list-style:none;
    margin:0 0 1.2em;
    padding:0;
}
.fx-article[data-page-id="838"] .fx-checklist > li{
    position:relative;
    list-style:none;
    margin:0;
    padding:12px 16px;
    padding-inline-start:48px;
    line-height:1.85;
    color:#2b333d;
    background:#fff;
    border:1px solid #e6e9ed;
    border-radius:4px;
}
.fx-article[data-page-id="838"] .fx-checklist > li::before{
    content:"\f00c";
    font-family:FontAwesome;
    position:absolute;
    inset-inline-start:14px;
    top:14px;
    width:22px;
    height:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:11px;
    color:#a51313;
    background:#faf6ec;
    border:1px solid rgba(212,175,55,.6);
    border-radius:50%;
}

@media (max-width:480px){
    .fx-article[data-page-id="838"] .fx-article__body{ padding-inline:16px; }
    .fx-article[data-page-id="838"] .fx-stats__grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:10px;
    }
    .fx-article[data-page-id="838"] .fx-stats__item{ padding:14px 8px 12px; }
    .fx-article[data-page-id="838"] .fx-stats__num{ font-size:22px; }
    .fx-article[data-page-id="838"] .fx-stats__label{ font-size:13.5px; }
    .fx-article[data-page-id="838"] .fx-timeline__text{ font-size:15px; }
    .fx-article[data-page-id="838"] .fx-steps > li,
    .fx-article[data-page-id="838"] .fx-checklist > li{ font-size:15px; }
}

/* Dark mode */
.fx-article.fx-theme-dark[data-page-id="838"]{ background:#1f242b; }
.fx-article.fx-theme-dark[data-page-id="838"] .fx-article__body{
    background:#23272e;
    color:#d0d0d0;
    border-color:#3a424c;
}
.fx-article.fx-theme-dark[data-page-id="838"] .fx-timeline__item::before{ background:#23272e; }
.fx-article.fx-theme-dark[data-page-id="838"] .fx-timeline__item:last-child::before{ background:#a51313; }
.fx-article.fx-theme-dark[data-page-id="838"] .fx-timeline__date{
    color:#f0b4b4;
    background:#2f2326;
    border-color:#4a3034;
}
.fx-article.fx-theme-dark[data-page-id="838"] .fx-timeline__text,
.fx-article.fx-theme-dark[data-page-id="838"] .fx-stats__title,
.fx-article.fx-theme-dark[data-page-id="838"] .fx-steps > li{ color:#e2e5e9; }
.fx-article.fx-theme-dark[data-page-id="838"] .fx-stats__item{
    background:#2a2f36;
    border-color:#3a424c;
    border-top-color:#c94a4a;
}
.fx-article.fx-theme-dark[data-page-id="838"] .fx-stats__num{ color:#f08a8a; }
.fx-article.fx-theme-dark[data-page-id="838"] .fx-stats__label{ color:#c2c6cc; }
.fx-article.fx-theme-dark[data-page-id="838"] .fx-steps > li,
.fx-article.fx-theme-dark[data-page-id="838"] .fx-checklist > li{
    background:#2a2f36;
    border-color:#3a424c;
}
.fx-article.fx-theme-dark[data-page-id="838"] .fx-steps > li{ border-inline-start-color:#D4AF37; }
.fx-article.fx-theme-dark[data-page-id="838"] .fx-checklist > li{ color:#d0d0d0; }
.fx-article.fx-theme-dark[data-page-id="838"] .fx-checklist > li::before{
    color:#f08a8a;
    background:#2f2a20;
    border-color:#6b5a2a;
}

/* ===== Reduced motion ===== */
@media (prefers-reduced-motion:reduce){
    .fx-read-progress{ transition:none; }
    .fx-article[data-page-id="1065"] .fx-article__body .social a{ transition:none; }
    .fx-article[data-page-id="1065"] .fx-article__body .social a:hover{ transform:none; }
    .fx-article[data-page-id="763"] .fx-article__body > p .btn{ transition:none; }
    .fx-article[data-page-id="763"] .fx-article__body > p .btn:hover{ transform:none; }
    .fx-article[data-page-id="1052"] .page-ministries .item-outer-container,
    .fx-article[data-page-id="1052"] .page-ministries .image-inner-container{ transition:none; }
    .fx-article[data-page-id="1052"] .page-ministries .item-outer-container:hover{ transform:none; }
    .fx-article[data-page-id="1052"] .page-ministries .item-outer-container:hover .image-inner-container{ transform:none; }
}