/* Magazine archive (أرشيف مجلة قلمون) — RTL. v1.5.0 */
.acs-magarc :where(a){text-decoration:none}
/* shared gold read button */
.acs-magarc__btn{display:inline-flex;align-items:center;gap:8px;background:#CB9B2A;color:#fff;font-family:"Readex Pro",sans-serif;font-weight:500;font-size:14px;line-height:1.5;border-radius:4px;padding:10px 20px}
.acs-magarc__btn:hover{background:#b98a20}
/* mint issue-number chip */
.acs-magarc__chip{display:inline-flex;align-items:center;background:#E5EFED;color:#068788;font-family:"Readex Pro",sans-serif;font-weight:400;font-size:12px;line-height:1.5;border-radius:16px;padding:4px 12px}
/* local 32/600 section heading + 52×4 teal accent */
.acs-magarc__heading{font-family:"Readex Pro",sans-serif;font-weight:600;font-size:32px;line-height:1.5;color:#231F20;margin:0;position:relative;padding-bottom:16px}
.acs-magarc__heading::after{content:"";position:absolute;inset-inline-start:0;bottom:0;width:52px;height:4px;background:#068788}
/* head */
.acs-magarc-head{display:flex;flex-direction:column;align-items:flex-start;gap:0}
.acs-magarc-head__title{font-family:"Readex Pro",sans-serif;font-weight:600;font-size:32px;line-height:1.5;color:#231F20;margin:0;padding:32px 0}
.acs-magarc-head__stats{display:flex;gap:40px;padding:32px 0 30px;border-top:1px solid #E5EFED;width:100%}
.acs-magarc-head__stat{display:flex;flex-direction:column;gap:4px}
.acs-magarc-head__stat-value{font-family:"Readex Pro",sans-serif;font-weight:600;font-size:24px;line-height:1.5;color:#231F20}
.acs-magarc-head__stat-label{font-family:"Readex Pro",sans-serif;font-weight:400;font-size:12px;line-height:1.5;color:#9C999A}
.acs-magarc-head__buttons{display:flex;gap:8px;padding-top:8px}
.acs-magarc-head__btn{display:inline-flex;align-items:center;font-family:"Readex Pro",sans-serif;font-weight:500;font-size:14px;line-height:1.5;border-radius:4px;padding:8px 20px;border:1px solid #068788}
.acs-magarc-head__btn--outline{color:#068788;background:#fff}
.acs-magarc-head__btn--outline:hover{background:#E5EFED}
.acs-magarc-head__btn--fill{color:#fff;background:#068788}
.acs-magarc-head__btn--fill:hover{background:#04696a}
/* editorial board */
.acs-magarc-board{background:#fff;border:1px solid #E5EFED;border-radius:8px;padding:20px}
.acs-magarc-board__title{font-family:"Readex Pro",sans-serif;font-weight:600;font-size:18px;line-height:1.5;color:#231F20;margin:0}
.acs-magarc-board__body{padding-top:16px;display:flex;flex-direction:column;gap:12px}
.acs-magarc-board__line{display:flex;flex-direction:column;gap:4px}
.acs-magarc-board__label{font-family:"Readex Pro",sans-serif;font-weight:400;font-size:14px;line-height:1.5;color:#CB9B2A}
.acs-magarc-board__value{font-family:"Readex Pro",sans-serif;font-weight:400;font-size:12px;line-height:1.5;color:#231F20}
.acs-magarc-board__members{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:4px 16px}
.acs-magarc-board__members li{position:relative;padding-inline-start:12px;font-family:"Readex Pro",sans-serif;font-weight:400;font-size:12px;line-height:1.5;color:#231F20}
.acs-magarc-board__members li::before{content:"";position:absolute;inset-inline-start:0;top:calc(50% - 2px);width:4px;height:4px;border-radius:50%;border:1px solid #CB9B2A}
/* latest */
.acs-magarc-latest{display:flex;flex-direction:column;gap:24px}
.acs-magarc-latest .acs-magarc__heading{margin-bottom:0}
/* shared card body pieces */
.acs-magarc-card__title{font-family:"Readex Pro",sans-serif;font-weight:500;line-height:1.5;display:block}
.acs-magarc-card__chip,.acs-magarc-card__body .acs-magarc__chip{align-self:flex-start}
/* featured (teal) */
.acs-magarc-card--featured{position:relative;display:flex;gap:0;background:#068788;border-radius:4px;overflow:hidden;padding:24px 48px;color:#fff}
.acs-magarc-card--featured::before{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:6px;background:#1D4264}
.acs-magarc-card--featured .acs-magarc-card__cover{flex:0 0 auto;order:2;margin-inline-end:auto}
.acs-magarc-card--featured .acs-magarc-card__cover img{width:190px;height:253px;object-fit:contain;border-radius:4px;display:block}
.acs-magarc-card--featured .acs-magarc-card__body{order:1;display:flex;flex-direction:column;align-items:flex-start;max-width:958px;padding-inline-start:0}
.acs-magarc-card--featured .acs-magarc-card__title{color:#fff;font-size:32px;padding-top:24px}
.acs-magarc-card--featured .acs-magarc-card__excerpt{color:#fff;font-family:"Readex Pro",sans-serif;font-weight:300;font-size:14px;line-height:1.5;margin:0;padding-top:20px}
.acs-magarc-card--featured .acs-magarc-card__foot{padding-top:28px}
/* compact (white) */
.acs-magarc-latest__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.acs-magarc-card--compact{display:flex;gap:0;background:#fff;border-radius:4px;padding:16px}
.acs-magarc-card--compact .acs-magarc-card__cover{flex:0 0 auto;padding:16px;border:1px solid #E5EFED;border-radius:4px;align-self:flex-start}
.acs-magarc-card--compact .acs-magarc-card__cover img{width:127.5px;height:170px;object-fit:contain;border-radius:2px;display:block}
.acs-magarc-card--compact .acs-magarc-card__body{display:flex;flex-direction:column;align-items:flex-start;padding-inline-start:16px}
.acs-magarc-card--compact .acs-magarc-card__title{color:#231F20;font-size:18px;padding-top:16px}
.acs-magarc-card--compact .acs-magarc-card__foot{padding-top:28px}
@media(max-width:900px){.acs-magarc-latest__grid{grid-template-columns:1fr}.acs-magarc-card--featured{flex-direction:column;gap:24px}}
/* upcoming teaser */
.acs-magarc-teaser{background:#E5EFED;border:1px solid #E5EFED;border-radius:8px;padding:16px;display:flex;flex-direction:column}
.acs-magarc-teaser__eyebrow{font-family:"Readex Pro",sans-serif;font-weight:600;font-size:12px;line-height:1.5;color:#068788;margin:0}
.acs-magarc-teaser__title{font-family:"Readex Pro",sans-serif;font-weight:400;font-size:14px;line-height:1.5;color:#231F20;margin:0;padding-top:8px}
.acs-magarc-teaser__text{font-family:"Readex Pro",sans-serif;font-weight:300;font-size:14px;line-height:1.5;color:#231F20;margin:0;padding-top:8px}
.acs-magarc-teaser__link{font-family:"Readex Pro",sans-serif;font-weight:400;font-size:14px;line-height:1.5;color:#068788;text-decoration:underline;padding-top:8px;align-self:flex-start}
/* previous list */
.acs-magarc-list{display:flex;flex-direction:column}
.acs-magarc-list .acs-magarc__heading{margin-bottom:32px}
.acs-magarc-list__rows{display:flex;flex-direction:column;gap:48px}
.acs-magarc-row{display:flex;gap:24px;align-items:stretch}
.acs-magarc-row__text{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start}
.acs-magarc-row__title{font-family:"Readex Pro",sans-serif;font-weight:500;font-size:18px;line-height:1.5;color:#231F20;padding-top:16px;display:block}
.acs-magarc-row__excerpt{font-family:"Readex Pro",sans-serif;font-weight:300;font-size:14px;line-height:1.5;color:#9C999A;margin:0;padding-top:16px}
.acs-magarc-row__foot{padding-top:16px}
.acs-magarc-row__cover{flex:0 0 auto;order:2}
.acs-magarc-row__cover img{width:139px;height:185px;object-fit:cover;border-radius:2.74px;display:block}
.acs-magarc-list .acs-pager{margin-top:48px;justify-content:center}
@media(max-width:600px){.acs-magarc-row{flex-direction:column}.acs-magarc-row__cover{order:0}}
/* ── phones ── the 900px/600px rules above already collapse the latest grid,
   featured card and previous-issue rows to one column. This block is phone
   POLISH: mobile heading sizes, a tighter stats rail, the editorial-board member
   list to ONE column (long Arabic names need the width), and lighter rhythm.
   All rules are direction-agnostic (no flex-direction/order), so RTL is safe. */
/* mobile peek-slider chrome (shared markup: .acs-mslider) — the arrow bar is
   hidden on desktop, where the track stays a normal grid. min-width:0 lets the
   wrapper shrink to its parent so the over-wide track scrolls INSIDE it instead
   of stretching the page (the wrapper is a flex item of the .acs-magarc-latest
   column, whose default min-width:auto would otherwise grow to the cards). */
.acs-mslider{min-width:0}
.acs-mslider__nav{display:none}
@media(max-width:478px){
  /* CONTAIN the over-wide slider. Two things matter: (1) the CARD width is a
     DEFINITE viewport value (calc below), not a % of the track — a % is circular
     (track sizes to card, card to track) and makes the track grow to the card
     instead of scrolling; (2) belt-and-braces, clip the page + the root so any
     residual can never make the whole page swipe. The track's own overflow-x:auto
     then does the real finger/arrow scroll. */
  body{overflow-x:clip}
  .acs-magarc-latest{min-width:0;overflow-x:clip}
  /* section headings (أحدث الأعداد / الأعداد السابقة): the teal accent sits BESIDE
     the title — a SHORT 52×4px rule (site standard), colour rgba(22,142,126,.32),
     not the full-width line and not underneath it (client). */
  .acs-magarc__heading{font-size:24px;display:flex;align-items:center;gap:16px;padding-bottom:0}
  .acs-magarc__heading::after{position:static;inset:auto;width:52px;height:4px;flex:0 0 auto;background:rgba(22,142,126,.32)}
  .acs-magarc-head__title{font-size:24px;padding:24px 0}
  .acs-magarc-head__stats{gap:16px 20px;flex-wrap:wrap;padding:24px 0}
  .acs-magarc-head__stat-value{font-size:20px}
  .acs-magarc-head__buttons{flex-wrap:wrap}
  .acs-magarc-board__members{grid-template-columns:1fr}
  /* «العدد القادم» / «العدد ما بعد القادم» teasers → mint BUTTONS only (no title /
     text); the whole button links to the read-more (the link is overlaid). Client
     specs: 175×42, radius 10, bg #E5EFED, teal 16/500 label, 8/41 padding. Two
     sit side by side (the widgets flow inline-block). */
  .acs-magarc-teaser-el{display:inline-block;vertical-align:top}
  .acs-magarc-teaser{position:relative;display:inline-flex;align-items:center;justify-content:center;width:175px;max-width:100%;height:42px;box-sizing:border-box;padding:8px 41px;gap:10px;border:1px solid rgba(6,135,136,.32);border-radius:10px;background:rgba(229,239,237,1)}
  .acs-magarc-teaser__title,.acs-magarc-teaser__text{display:none}
  .acs-magarc-teaser__eyebrow{margin:0;padding:0;font-family:"Readex Pro",sans-serif;font-weight:500;font-size:16px;line-height:1.5;color:rgba(6,135,136,1);white-space:nowrap}
  .acs-magarc-teaser__link{position:absolute;inset:0;padding:0;font-size:0;line-height:0;overflow:hidden}
  /* featured issue card (client): cover FLOATS to the RIGHT, the chip + title flow
     beside it on the left, then the DESCRIPTION and the read BUTTON both span the
     FULL width (clear the float) — same left/right edges as the button. */
  .acs-magarc-card--featured{display:block;padding:16px}
  .acs-magarc-card--featured .acs-magarc-card__cover{float:right;margin:0 0 12px 16px;flex:none}
  .acs-magarc-card--featured .acs-magarc-card__cover img{width:110px;height:auto}
  .acs-magarc-card--featured .acs-magarc-card__body{display:block}
  .acs-magarc-card--featured .acs-magarc-card__title{font-size:18px;padding-top:12px}
  .acs-magarc-card--featured .acs-magarc-card__excerpt{clear:both;font-size:14px;padding-top:16px}
  .acs-magarc-card--featured .acs-magarc-card__foot{clear:both;padding-top:16px}
  .acs-magarc-card--featured .acs-magarc__btn{display:flex;justify-content:center}
  .acs-magarc-card--compact .acs-magarc-card__title{font-size:16px}
  /* «أحدث الأعداد» → horizontal PEEK slider. Each card is WIDER than the screen
     (100% + ~90px) so, snapped to the right edge, its cover (on the LEFT) is only
     ~half visible — the left half sits off-screen, telling the reader to slide.
     Arrows below (mobile-sliders.js) scroll it; native touch-swipe also works. */
  .acs-magarc-latest__grid{display:flex;gap:16px;max-width:100%;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .acs-magarc-latest__grid::-webkit-scrollbar{display:none}
  .acs-magarc-latest__grid>.acs-magarc-card{flex:0 0 calc(100vw + 90px);box-sizing:border-box;scroll-snap-align:start}
  /* slider card: cover LEFT, text RIGHT (row-reverse of the cover-first DOM). */
  .acs-magarc-latest__grid .acs-magarc-card--compact{flex-direction:row-reverse;gap:16px;padding:16px}
  .acs-magarc-latest__grid .acs-magarc-card--compact .acs-magarc-card__cover{flex:0 0 170px;padding:0;border:0;align-self:flex-start}
  .acs-magarc-latest__grid .acs-magarc-card--compact .acs-magarc-card__cover img{width:170px;height:auto}
  .acs-magarc-latest__grid .acs-magarc-card--compact .acs-magarc-card__body{flex:1;min-width:0;padding-inline-start:0}
  /* arrow bar: two teal circles at the bottom-left; «next» filled (LTR nav so the
     DOM order next→prev lays left→right predictably regardless of the RTL page) */
  .acs-mslider__nav{display:flex;direction:ltr;justify-content:flex-start;gap:16px;margin-top:16px}
  .acs-mslider__btn{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;padding:0;border:1px solid #068788;border-radius:50%;background:#fff;color:#068788;cursor:pointer}
  .acs-mslider__btn svg{width:22px;height:22px}
  .acs-mslider__btn--next{background:#068788;color:#fff}
  /* الأعداد السابقة: rows stay HORIZONTAL (cover on the RIGHT, text on the LEFT) —
     override the 600px column stack (Screenshot). */
  .acs-magarc-list__rows{gap:24px}
  .acs-magarc-row{flex-direction:row;gap:16px;align-items:flex-start}
  .acs-magarc-row__cover{order:-1;flex:0 0 auto}
  .acs-magarc-row__cover img{width:96px;height:auto}
  .acs-magarc-row__title{font-size:16px}
}