/* ======================================================================
   EMKAN v164 — canonical context strip + canonical tree geometry
   This file intentionally owns ONLY these two UI systems.
   ====================================================================== */

:root{
  --emkan-context-edge:112px;
  --emkan-context-row-height:38px;
  --emkan-context-row-gap:14px;
  --emkan-tree-inset:24px;
  --emkan-tree-spine:4px;
  --emkan-tree-node:7px;
  --emkan-tree-row:32px;
}

/* ----------------------------------------------------------------------
   A) ONE context strip. Legacy bars are data sources only and are hidden
      by JS with inline !important. This is the only visible strip.
   ---------------------------------------------------------------------- */
html body .page-shell > .emkan-v164-context-portal{
  box-sizing:border-box!important;
  position:relative!important;
  z-index:80!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:24px!important;
  direction:ltr!important;
  height:var(--emkan-context-row-height)!important;
  min-height:var(--emkan-context-row-height)!important;
  max-height:var(--emkan-context-row-height)!important;
  margin-top:0!important;
  margin-bottom:var(--emkan-context-row-gap)!important;
  margin-left:calc(var(--emkan-context-edge) - var(--page-pad))!important;
  margin-right:calc(var(--emkan-context-edge) - var(--page-pad))!important;
  padding:0!important;
  border:0!important;
  border-bottom:1px solid var(--line)!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
  width:calc(100% + (2 * var(--page-pad)) - (2 * var(--emkan-context-edge)))!important;
  max-width:none!important;
  min-width:0!important;
  left:auto!important;
  right:auto!important;
  transform:none!important;
  pointer-events:auto!important;
}
html body .page-shell > .emkan-v164-context-portal.is-project-context{margin-bottom:0!important}

html body .emkan-v164-context-path,
html body .emkan-v164-context-back{
  box-sizing:border-box!important;
  position:static!important;
  inset:auto!important;
  transform:none!important;
  margin:0!important;
  padding:0!important;
  width:auto!important;
  height:100%!important;
  min-width:0!important;
  max-width:100%!important;
  display:flex!important;
  align-items:center!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  line-height:1.55!important;
  white-space:nowrap!important;
  text-decoration:none!important;
  color:var(--muted,#707981)!important;
  font-weight:400!important;
  opacity:.86!important;
  cursor:pointer!important;
  pointer-events:auto!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;
}
html body .emkan-v164-context-path{
  flex:1 1 auto!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  font-size:11.5px!important;
}
html body .emkan-v164-context-back{
  flex:0 0 auto!important;
  font-size:10.5px!important;
}

/* FA/AR: address at start/right, back at end/left. */
html[lang="fa"] body .emkan-v164-context-path,
html[lang="ar"] body .emkan-v164-context-path{
  order:2!important;
  direction:rtl!important;
  text-align:right!important;
  justify-content:flex-start!important;
}
html[lang="fa"] body .emkan-v164-context-back,
html[lang="ar"] body .emkan-v164-context-back{
  order:1!important;
  direction:rtl!important;
  text-align:left!important;
  justify-content:flex-start!important;
}

/* EN: address at start/left, back at end/right. Geometry is identical. */
html[lang="en"] body .emkan-v164-context-path{
  order:1!important;
  direction:ltr!important;
  text-align:left!important;
  justify-content:flex-start!important;
}
html[lang="en"] body .emkan-v164-context-back{
  order:2!important;
  direction:ltr!important;
  text-align:right!important;
  justify-content:flex-end!important;
}

html body .emkan-v164-context-path:hover,
html body .emkan-v164-context-path:focus-visible,
html body .emkan-v164-context-back:hover,
html body .emkan-v164-context-back:focus-visible{
  color:var(--hover-accent,var(--accent,#6f9fb2))!important;
  opacity:1!important;
  outline:0!important;
}

@media (min-width:901px) and (max-width:1279px){:root{--emkan-context-edge:148px}}
@media (max-width:900px){
  :root{--emkan-context-edge:16px;--emkan-context-row-height:42px;--emkan-context-row-gap:12px}
  html body .page-shell > .emkan-v164-context-portal{
    width:calc(100% + (2 * var(--page-pad)) - 32px)!important;
    gap:12px!important;
  }
  html body .emkan-v164-context-path{font-size:10.5px!important}
  html body .emkan-v164-context-back{font-size:10px!important}
}

/* ----------------------------------------------------------------------
   B) ONE vertical tree system.
      All old li/button connector pseudos are neutralized. Only the canonical
      container spine + canonical item diamond remain visible.
   ---------------------------------------------------------------------- */
@media (min-width:721px){
  /* Learning trees (all education/readings/course subtrees). */
  html body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"]{
    box-sizing:border-box!important;
    position:relative!important;
    display:block!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
    list-style:none!important;
    min-width:0!important;
  }
  html[lang="fa"] body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"],
  html[lang="ar"] body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"]{
    direction:rtl!important;
    text-align:right!important;
    padding:0 var(--emkan-tree-inset) 0 0!important;
  }
  html[lang="en"] body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"]{
    direction:ltr!important;
    text-align:left!important;
    padding:0 0 0 var(--emkan-tree-inset)!important;
  }

  html body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"]::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    z-index:0!important;
    top:calc(var(--emkan-tree-row) / 2)!important;
    bottom:calc(var(--emkan-tree-row) / 2)!important;
    width:1px!important;
    height:auto!important;
    background:var(--line)!important;
    border:0!important;
    transform:none!important;
    opacity:1!important;
    pointer-events:none!important;
  }
  html[lang="fa"] body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"]::before,
  html[lang="ar"] body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"]::before{right:var(--emkan-tree-spine)!important;left:auto!important}
  html[lang="en"] body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"]::before{left:var(--emkan-tree-spine)!important;right:auto!important}
  html body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"]::after{content:none!important;display:none!important}

  /* About tree. */
  html body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"]{
    box-sizing:border-box!important;
    position:relative!important;
    display:block!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
    list-style:none!important;
    min-width:0!important;
  }
  html[lang="fa"] body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"],
  html[lang="ar"] body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"]{
    direction:rtl!important;text-align:right!important;padding:0 var(--emkan-tree-inset) 0 0!important;
  }
  html[lang="en"] body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"]{
    direction:ltr!important;text-align:left!important;padding:0 0 0 var(--emkan-tree-inset)!important;
  }
  html body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"]::before{
    content:""!important;display:block!important;position:absolute!important;z-index:0!important;
    top:calc(var(--emkan-tree-row) / 2)!important;bottom:calc(var(--emkan-tree-row) / 2)!important;
    width:1px!important;height:auto!important;background:var(--line)!important;border:0!important;
    transform:none!important;opacity:1!important;pointer-events:none!important;
  }
  html[lang="fa"] body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"]::before,
  html[lang="ar"] body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"]::before{right:var(--emkan-tree-spine)!important;left:auto!important}
  html[lang="en"] body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"]::before{left:var(--emkan-tree-spine)!important;right:auto!important}
  html body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"]::after{content:none!important;display:none!important}

  /* Kill ALL legacy connector pseudos on wrappers. */
  html body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"] > li::before,
  html body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"] > li::after,
  html body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"] > li::before,
  html body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"] > li::after{
    content:none!important;display:none!important;border:0!important;background:none!important;box-shadow:none!important;
  }
  html body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"] > li,
  html body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"] > li{
    position:relative!important;margin:0!important;padding:0!important;border:0!important;min-height:0!important;list-style:none!important;
  }

  /* Canonical item geometry. */
  html body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"] > .emkan-v164-tree-item,
  html body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"] > li > .emkan-v164-tree-item,
  html body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"] > li > .emkan-v164-tree-item{
    box-sizing:border-box!important;
    position:relative!important;
    z-index:1!important;
    width:100%!important;
    min-width:0!important;
    min-height:var(--emkan-tree-row)!important;
    margin:0!important;
    padding:6px 0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    line-height:1.65!important;
    transform:none!important;
    white-space:normal!important;
    overflow:visible!important;
  }
  html[lang="fa"] body .emkan-v164-tree-item,
  html[lang="ar"] body .emkan-v164-tree-item{direction:rtl!important;text-align:right!important}
  html[lang="en"] body .emkan-v164-tree-item{direction:ltr!important;text-align:left!important}

  /* One and only one diamond per item. */
  html body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"] .emkan-v164-tree-item::before,
  html body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"] .emkan-v164-tree-item::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    z-index:3!important;
    top:50%!important;
    width:var(--emkan-tree-node)!important;
    height:var(--emkan-tree-node)!important;
    box-sizing:border-box!important;
    margin:0!important;
    padding:0!important;
    border:1px solid var(--muted,#8d959c)!important;
    background:var(--bg)!important;
    box-shadow:none!important;
    transform:translateY(-50%) rotate(45deg)!important;
    opacity:1!important;
    pointer-events:none!important;
  }
  html[lang="fa"] body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"] .emkan-v164-tree-item::before,
  html[lang="ar"] body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"] .emkan-v164-tree-item::before,
  html[lang="fa"] body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"] .emkan-v164-tree-item::before,
  html[lang="ar"] body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"] .emkan-v164-tree-item::before{
    right:calc(-1 * (var(--emkan-tree-inset) - var(--emkan-tree-spine) + (var(--emkan-tree-node) / 2) - .5px))!important;
    left:auto!important;
  }
  html[lang="en"] body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"] .emkan-v164-tree-item::before,
  html[lang="en"] body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"] .emkan-v164-tree-item::before{
    left:calc(-1 * (var(--emkan-tree-inset) - var(--emkan-tree-spine) + (var(--emkan-tree-node) / 2) - .5px))!important;
    right:auto!important;
  }
  html body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"] .emkan-v164-tree-item::after,
  html body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"] .emkan-v164-tree-item::after{
    content:none!important;display:none!important;background:none!important;border:0!important;
  }
  html body .emkan-v164-tree-item .axis-line{display:none!important}

  html body .emkan-v164-tree-item:is(.is-active,[aria-selected="true"]){color:var(--hover-accent)!important}
  html body .emkan-v164-tree-item:is(.is-active,[aria-selected="true"])::before{
    background:var(--hover-accent)!important;border-color:var(--hover-accent)!important;
  }
  html body .emkan-v164-tree-item:is(:hover,:focus-visible)::before{border-color:var(--hover-accent)!important}
}

/* v166: scoped repairs. Preserve existing colors, typography and mobile layout. */
@media(min-width:721px){
html body #contentApp#contentApp .emkan-v164-tree[data-emkan-v164-tree="1"] .emkan-v164-tree-item:is(:hover,:focus-visible,.is-active,[aria-selected="true"])::before,
html body .about-main.about-main .about-company-text-column .company-axis.emkan-v164-tree[data-emkan-v164-tree="1"] .emkan-v164-tree-item:is(:hover,:focus-visible,.is-active,[aria-selected="true"])::before{
 background:var(--hover-accent,var(--fg))!important;border-color:var(--hover-accent,var(--fg))!important;
}
}
html body .emkan-v164-context-path{cursor:default!important;gap:5px!important}
html body .emkan-v164-context-path a{color:inherit;text-decoration:none;pointer-events:auto;flex-shrink:0}
html body .emkan-v164-context-path a:is(:hover,:focus-visible){color:var(--hover-accent)!important;text-decoration:underline}
html body .emkan-v164-context-path a:focus-visible,html body .emkan-v164-context-back:focus-visible{outline:1px solid currentColor!important;outline-offset:3px!important}
/* Keep the existing two-line icon, suppress duplicate generated markers. */
html body #contentApp#contentApp details>summary:has(:is(.emkan-v146-lesson-mark,.emkan-v148-disclosure-mark,.emkan-v147-disclosure-mark,.emkan-v133-disclosure-mark,.emkan-v132-disclosure-mark,.emkan-v131-disclosure-mark,.emkan-disclosure-mark,.v49-filter-chevron))::before,
html body #contentApp#contentApp details>summary:has(:is(.emkan-v146-lesson-mark,.emkan-v148-disclosure-mark,.emkan-v147-disclosure-mark,.emkan-v133-disclosure-mark,.emkan-v132-disclosure-mark,.emkan-v131-disclosure-mark,.emkan-disclosure-mark,.v49-filter-chevron))::after{content:none!important;display:none!important}
html body #contentApp#contentApp details>summary{list-style:none!important}
html body #contentApp#contentApp details>summary::marker{content:""!important}
html body #contentApp#contentApp details>summary::-webkit-details-marker{display:none!important}
@media(min-width:901px){
 html body .architecture-main .gallery-items-container{row-gap:20px!important;align-content:start!important;grid-auto-rows:max-content!important}
 html body:is(.emkan-v166-four,.emkan-v166-graphic) #contentApp .v74-level2-wrap{width:100%!important;padding-top:clamp(28px,4vh,44px)!important}
 html body.emkan-v166-four #contentApp .v74-level2-grid{width:100%!important;grid-template-columns:repeat(4,minmax(0,192px))!important;gap:24px!important;justify-content:center!important}
 html body.emkan-v166-four #contentApp .v74-level2-grid :is(.category-card,.category-square){width:100%!important;max-width:192px!important;height:auto!important;aspect-ratio:auto!important}
 html body.emkan-v166-four #contentApp .v74-level2-grid .category-square{aspect-ratio:1!important}
 html body.emkan-v166-graphic #contentApp .v74-level2-grid{--compact-card:clamp(100px,calc((100vh - 300px)/2),192px);width:100%!important;grid-template-columns:repeat(3,minmax(0,var(--compact-card)))!important;gap:16px 32px!important;justify-content:center!important}
 html body.emkan-v166-graphic #contentApp .v74-level2-grid :is(.category-card,.category-square){width:100%!important;max-width:var(--compact-card)!important;height:auto!important}
 html body.emkan-v166-graphic #contentApp .v74-level2-grid .category-square{aspect-ratio:1!important}
 html body:is(.emkan-v142-civil-landing,.emkan-v142-research-landing) .module-main{padding-top:clamp(32px,5vh,52px)!important}
 html body.content-section-page:not(.emkan-v166-four):not(.emkan-v166-graphic) #contentApp .v74-level2-wrap{padding-top:clamp(28px,4vh,44px)!important}
}

html body #contentApp#contentApp summary:has(>.emkan-v148-disclosure-mark) :is(.emkan-v146-lesson-mark,.emkan-v147-disclosure-mark,.emkan-disclosure-mark,.category-chevron,.detail-subcategory-chevron,.v49-filter-chevron){display:none!important}

/* v167: readable, independent breadcrumb links without inherited hidden markup. */
html body .emkan-v164-context-path{overflow-x:auto!important;overflow-y:hidden!important;text-overflow:clip!important;scrollbar-width:thin;white-space:nowrap!important;gap:5px!important}
html body .emkan-v164-context-path>.emkan-v167-crumb{display:inline-block!important;flex:0 0 auto!important;visibility:visible!important;max-width:none!important;color:inherit;background:none;border:0;padding:0;margin:0;font:inherit}
html body .emkan-v164-context-path>.emkan-v167-crumb-sep{display:inline-block!important;flex:0 0 auto!important;opacity:.6}

html body .page-shell>.emkan-v164-context-portal[hidden]{display:none!important}
