/* EMKAN v148 — focused correction only
   1) restore the canonical v146 context/breadcrumb geometry (one line only),
   2) force Education/Learning rail/tree to the physical right in RTL,
   3) use the site's canonical stepped two-line disclosure mark,
   4) keep Civil/Services as a clean four-card page with no search/secondary row. */

/* ========================================================================== 
   A. CONTEXT / BACK / BREADCRUMB — exactly one canonical row and one rule.
   v147 accidentally expanded the outer row to 100% and added a second rule
   to its inner wrapper. Restore the v146 central frame and let ONLY the outer
   row draw the bottom hairline.
   ========================================================================== */
@media (min-width:901px){
  :root{--emkan-v148-context-physical-width:min(var(--emkan-context-width,1380px),calc(100vw - 96px))}
}
@media (max-width:900px){
  :root{--emkan-v148-context-physical-width:min(720px,calc(100vw - 34px))}
}
@media (max-width:560px){
  :root{--emkan-v148-context-physical-width:calc(100vw - 28px)}
}

html body :is(
  main>.emkan-context-bar,
  .article-page>.emkan-context-bar,
  .store-category-main>.store-context-bar,
  .podcast-main>.podcast-context-bar,
  .product-main>.product-toolbar
){
  position:relative!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  width:var(--emkan-v148-context-physical-width)!important;
  max-width:none!important;
  min-height:32px!important;
  box-sizing:border-box!important;
  margin-top:var(--emkan-context-top,14px)!important;
  margin-right:0!important;
  margin-bottom:var(--emkan-context-bottom,20px)!important;
  margin-left:0!important;
  padding:0 0 var(--emkan-context-rule-pad,11px)!important;
  border:0!important;
  border-bottom:1px solid var(--line)!important;
  background:transparent!important;
}

/* Kill any decorative or inherited second line on the row itself. */
html body :is(.emkan-context-bar,.store-context-bar,.podcast-context-bar,.product-toolbar)::before,
html body :is(.emkan-context-bar,.store-context-bar,.podcast-context-bar,.product-toolbar)::after{
  content:none!important;
  display:none!important;
  border:0!important;
}

/* v147 wrapper is layout-only now. It MUST NOT create another line or a
   viewport-sized translated frame. */
html body .emkan-v147-context-inner{
  position:static!important;
  left:auto!important;
  right:auto!important;
  transform:none!important;
  width:100%!important;
  max-width:none!important;
  min-height:20px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-top:0!important;
  border-bottom:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:22px!important;
  box-sizing:border-box!important;
  font-size:10.5px!important;
  line-height:1.7!important;
  background:transparent!important;
}
html body .emkan-v147-context-inner::before,
html body .emkan-v147-context-inner::after{content:none!important;display:none!important}
html body .emkan-v147-context-inner > *{
  border-top:0!important;
  border-bottom:0!important;
  margin-block:0!important;
}
html body .emkan-v147-context-inner > :is(.emkan-context-path,.product-context-path,#podcastPath,#storeCategoryPath,#productPath){
  flex:1 1 auto!important;
  min-width:0!important;
  padding:0!important;
  overflow:hidden!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
}
html body .emkan-v147-context-inner > :is(.emkan-context-back,#productBack,.product-back,.podcast-back,.store-back){
  flex:0 0 auto!important;
  position:static!important;
  inset:auto!important;
  transform:none!important;
  padding:0!important;
  white-space:nowrap!important;
}
html[dir="rtl"] body .emkan-v147-context-inner{direction:rtl!important;text-align:right!important}
html[dir="ltr"] body .emkan-v147-context-inner{direction:ltr!important;text-align:left!important}

/* Older article rules also drew their own line. The canonical row above owns
   the line now. */
html body .article-page>.emkan-context-bar{border-bottom:1px solid var(--line)!important}
html body .article-page>.article-page-back,
html body .emkan-context-bar + .article-page-back{display:none!important}

@media (max-width:900px){
  html body .emkan-v147-context-inner{gap:14px!important;font-size:10px!important}
}

/* ========================================================================== 
   B. EDUCATION > LEARNING — physical placement, not logical guessing.
   DOM order is rail then content. In RTL use row-reverse so the rail is
   physically on the RIGHT; in LTR use row so it is on the LEFT.
   ========================================================================== */
@media (min-width:901px){
  html body.emkan-v147-learning-resource #contentApp > .v69-content-detail-layout,
  html body.emkan-v147-learning-resource #contentApp > .v69-content-detail-layout.v90-education-detail-layout{
    width:100%!important;
    max-width:1180px!important;
    margin-inline:auto!important;
    display:flex!important;
    align-items:flex-start!important;
    gap:34px!important;
    direction:ltr!important;
    grid-template-columns:none!important;
    grid-template-areas:none!important;
  }
  html[dir="rtl"] body.emkan-v147-learning-resource #contentApp > .v69-content-detail-layout{
    flex-direction:row-reverse!important;
  }
  html[dir="ltr"] body.emkan-v147-learning-resource #contentApp > .v69-content-detail-layout{
    flex-direction:row!important;
  }
  html body.emkan-v147-learning-resource #contentApp > .v69-content-detail-layout > .v69-content-search-rail{
    order:initial!important;
    flex:0 0 190px!important;
    width:190px!important;
    max-width:190px!important;
    min-width:190px!important;
    margin:0!important;
    padding:0!important;
    position:static!important;
    inset:auto!important;
    transform:none!important;
    grid-area:auto!important;
  }
  html body.emkan-v147-learning-resource #contentApp > .v69-content-detail-layout > .v69-content-detail-body{
    order:initial!important;
    flex:1 1 auto!important;
    width:auto!important;
    max-width:none!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    grid-area:auto!important;
  }
  html[dir="rtl"] body.emkan-v147-learning-resource #contentApp .v69-content-search-rail,
  html[dir="rtl"] body.emkan-v147-learning-resource #contentApp .v69-content-detail-body{
    direction:rtl!important;
    text-align:right!important;
  }
  html[dir="ltr"] body.emkan-v147-learning-resource #contentApp .v69-content-search-rail,
  html[dir="ltr"] body.emkan-v147-learning-resource #contentApp .v69-content-detail-body{
    direction:ltr!important;
    text-align:left!important;
  }

  /* Internal learning tree follows the same physical rule: side/tree on right
     for FA/AR, on left for EN. */
  html body.emkan-v147-learning-resource #contentApp .learning-workspace,
  html body.emkan-v147-learning-resource #contentApp .learning-workspace.v90-learning-workspace{
    width:100%!important;
    max-width:none!important;
    display:flex!important;
    align-items:flex-start!important;
    gap:26px!important;
    direction:ltr!important;
    grid-template-columns:none!important;
    grid-template-areas:none!important;
  }
  html[dir="rtl"] body.emkan-v147-learning-resource #contentApp .learning-workspace{flex-direction:row-reverse!important}
  html[dir="ltr"] body.emkan-v147-learning-resource #contentApp .learning-workspace{flex-direction:row!important}
  html body.emkan-v147-learning-resource #contentApp .learning-workspace > .learning-side{
    order:initial!important;
    flex:0 0 180px!important;
    width:180px!important;
    max-width:180px!important;
    min-width:180px!important;
    position:static!important;
    inset:auto!important;
    transform:none!important;
    margin:0!important;
    padding:0!important;
    grid-area:auto!important;
  }
  html body.emkan-v147-learning-resource #contentApp .learning-workspace > .learning-panels{
    order:initial!important;
    flex:1 1 auto!important;
    width:auto!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    grid-area:auto!important;
  }
  html[dir="rtl"] body.emkan-v147-learning-resource #contentApp .learning-workspace > :is(.learning-side,.learning-panels){direction:rtl!important;text-align:right!important}
  html[dir="ltr"] body.emkan-v147-learning-resource #contentApp .learning-workspace > :is(.learning-side,.learning-panels){direction:ltr!important;text-align:left!important}
}

/* Mobile/tablet stack stays clean; rail first, then content. */
@media (max-width:900px){
  html body.emkan-v147-learning-resource #contentApp > .v69-content-detail-layout{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    max-width:none!important;
    gap:18px!important;
  }
  html body.emkan-v147-learning-resource #contentApp > .v69-content-detail-layout > .v69-content-search-rail,
  html body.emkan-v147-learning-resource #contentApp > .v69-content-detail-layout > .v69-content-detail-body{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    flex:0 0 auto!important;
  }
}

/* Canonical dropdown mark: the site's stepped two-line icon. Remove every
   native/legacy plus, minus, square and marker inside this learning page. */
html body.emkan-v147-learning-resource #contentApp details > summary{
  list-style:none!important;
}
html body.emkan-v147-learning-resource #contentApp details > summary::-webkit-details-marker{display:none!important}
html body.emkan-v147-learning-resource #contentApp details > summary::before,
html body.emkan-v147-learning-resource #contentApp details > summary::after{
  content:none!important;
  display:none!important;
}
html body.emkan-v147-learning-resource #contentApp details > summary > :is(
  .emkan-v146-lesson-mark,
  .emkan-v147-disclosure-mark,
  .emkan-disclosure-mark,
  .category-chevron,
  .detail-subcategory-chevron,
  .v49-filter-chevron
){display:none!important}
html body.emkan-v147-learning-resource #contentApp .emkan-v148-disclosure-mark{
  position:relative!important;
  display:inline-block!important;
  visibility:visible!important;
  opacity:.82!important;
  width:13px!important;
  height:13px!important;
  flex:0 0 13px!important;
  border:0!important;
  background:transparent!important;
  color:currentColor!important;
}
html body.emkan-v147-learning-resource #contentApp .emkan-v148-disclosure-mark::before,
html body.emkan-v147-learning-resource #contentApp .emkan-v148-disclosure-mark::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset-inline-start:1px!important;
  left:auto!important;
  height:1px!important;
  background:currentColor!important;
  border:0!important;
  transform:none!important;
  transition:width .22s ease!important;
}
html body.emkan-v147-learning-resource #contentApp .emkan-v148-disclosure-mark::before{top:2px!important;width:6px!important}
html body.emkan-v147-learning-resource #contentApp .emkan-v148-disclosure-mark::after{bottom:2px!important;width:11px!important}
html body.emkan-v147-learning-resource #contentApp details[open] > summary .emkan-v148-disclosure-mark::before{width:11px!important}
html body.emkan-v147-learning-resource #contentApp details[open] > summary .emkan-v148-disclosure-mark::after{width:6px!important}

/* ========================================================================== 
   C. CIVIL > SERVICES — this page has no search/sidebar/secondary row.
   Keep only the four service covers on the root Services view. Old observers
   may inject legacy rows later, so hide them by scope as well.
   ========================================================================== */
html body.emkan-v147-civil-services :is(
  #detailNav,
  .detail-nav,
  .civil-search,
  .project-search,
  .research-search,
  .secondary-rail,
  .civil-filter-rail,
  .project-filter-rail,
  .category-rail,
  .emkan-civil-results,
  .detail-note,
  .detail-copy,
  .detail-title:not(#detailTitle)
){display:none!important}
html body.emkan-v147-civil-services .detail-layout{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
}
html body.emkan-v147-civil-services .detail-layout > article{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
}
/* On Services root, anything legacy injected beside our one canonical view is hidden. */
html body.emkan-v148-civil-services-root .detail-layout > article > :not(.emkan-v147-services-view){display:none!important}
html body.emkan-v148-civil-services-root .emkan-v147-services-view{
  display:block!important;
  width:100%!important;
  max-width:1040px!important;
  margin:0 auto!important;
  padding-top:8px!important;
}
html body.emkan-v148-civil-services-root .emkan-v147-services-grid{
  grid-template-columns:repeat(4,192px)!important;
  justify-content:center!important;
  align-items:start!important;
  gap:28px!important;
  margin:18px auto 0!important;
}
@media (max-width:900px){
  html body.emkan-v148-civil-services-root .emkan-v147-services-grid{grid-template-columns:repeat(2,minmax(0,192px))!important;gap:24px 20px!important}
}
@media (max-width:520px){
  html body.emkan-v148-civil-services-root .emkan-v147-services-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:20px 12px!important}
}

/* Final context inset: keep Back and breadcrumb visibly INSIDE the canonical
   rule instead of sitting on/over its endpoints. The rule width itself stays
   the shared context width. */
html body .emkan-v147-context-inner{padding-inline:10px!important}
@media (max-width:900px){html body .emkan-v147-context-inner{padding-inline:7px!important}}
