/* EMKAN v150 — precision repair layer
   Scope: shared header/context geometry, Civil > Services, Store product divider,
   Education > Learning resource layout, and Global Search heading only.
   Loaded after v149 so no other module styling is changed. */

/* ========================================================================== 
   1) SHARED HEADER + CONTEXT GEOMETRY
   One invariant on desktop/tablet: the navigation rail is always narrower
   than the breadcrumb/back rule below it. Context rows stay centred without
   translate-based overflow.
   ========================================================================== */
@media (min-width:1280px){
  html body .site-header{
    width:min(1040px,calc(100% - 160px))!important;
    max-width:1040px!important;
    margin-inline:auto!important;
  }
  :root{--emkan-v150-context-width:min(1180px,calc(100vw - 96px))}
}
@media (min-width:901px) and (max-width:1279px){
  html body .site-header{
    width:min(1000px,calc(100% - 64px))!important;
    max-width:1000px!important;
    margin-inline:auto!important;
  }
  :root{--emkan-v150-context-width:min(1120px,calc(100vw - 32px))}
}
@media (max-width:900px){
  html body .site-header{
    width:min(720px,calc(100% - 34px))!important;
    max-width:720px!important;
    margin-inline:auto!important;
  }
  :root{--emkan-v150-context-width:min(752px,calc(100vw - 18px))}
}
@media (max-width:560px){
  html body .site-header{width:calc(100% - 28px)!important}
  :root{--emkan-v150-context-width:calc(100vw - 16px)}
}

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:auto!important;
  right:auto!important;
  inset-inline:auto!important;
  transform:none!important;
  width:var(--emkan-v150-context-width)!important;
  max-width:none!important;
  min-width:0!important;
  margin-top:var(--emkan-context-top,14px)!important;
  margin-bottom:var(--emkan-context-bottom,20px)!important;
  margin-left:calc((100% - var(--emkan-v150-context-width))/2)!important;
  margin-right:calc((100% - var(--emkan-v150-context-width))/2)!important;
  padding:0 0 var(--emkan-context-rule-pad,11px)!important;
  box-sizing:border-box!important;
  border:0!important;
  border-bottom:1px solid var(--line)!important;
  overflow:visible!important;
}
html body .emkan-v147-context-inner{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  box-sizing:border-box!important;
}

/* ========================================================================== 
   2) CIVIL > SERVICES
   A dedicated breadcrumb/back pair avoids legacy breadcrumb observers that do
   not understand the newer service/sample query parameters.
   ========================================================================== */
body.emkan-v150-civil-context-active .emkan-v147-context-inner > :is(.emkan-context-path,.emkan-context-back){display:none!important}
body.emkan-v150-civil-context-active .emkan-v150-civil-path{
  flex:1 1 auto!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
  color:var(--category-muted,var(--fg))!important;
  font:inherit!important;
  line-height:1.7!important;
}
body.emkan-v150-civil-context-active .emkan-v150-civil-back{
  flex:0 0 auto!important;
  margin:0!important;
  padding:0!important;
  color:var(--category-muted,var(--fg))!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  font:inherit!important;
  line-height:1.7!important;
}
body.emkan-v150-civil-context-active :is(.emkan-v150-civil-path a,.emkan-v150-civil-back){color:inherit!important;text-decoration:none!important}
body.emkan-v150-civil-context-active :is(.emkan-v150-civil-path a,.emkan-v150-civil-back):is(:hover,:focus-visible){color:var(--hover-accent)!important;outline:0!important}
:is(html[lang="fa"],html[lang="ar"]) body.emkan-v150-civil-context-active .emkan-v150-civil-path{direction:rtl!important;text-align:right!important}
html[lang="en"] body.emkan-v150-civil-context-active .emkan-v150-civil-path{direction:ltr!important;text-align:left!important}

/* Service landing remains untouched. Once a service is opened, use the same
   balanced three-column geometry used elsewhere instead of three fixed cards
   pinned to one edge. */
@media(min-width:901px){
  html body.emkan-v149-civil-service-page .emkan-v149-civil-internal-layout{
    width:100%!important;
    max-width:1040px!important;
    margin-inline:auto!important;
    gap:34px!important;
  }
  html body.emkan-v149-civil-service-page .emkan-v149-civil-internal-content{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
  }
  html body.emkan-v149-civil-service-page .emkan-v147-samples-grid{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:28px!important;
    justify-content:stretch!important;
    align-items:start!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
  }
  html body.emkan-v149-civil-service-page .emkan-v147-sample-card{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin:0!important;
  }
}

/* Civil service search: explicit physical padding/positioning prevents older
   logical-direction rules from placing the icon on top of the placeholder. */
:is(html[lang="fa"],html[lang="ar"]) body:is(.emkan-v149-civil-service-page,.emkan-v149-civil-sample-page) .emkan-v149-civil-search input[type="search"]{
  direction:rtl!important;
  text-align:right!important;
  padding:0 2px 5px 30px!important;
}
:is(html[lang="fa"],html[lang="ar"]) body:is(.emkan-v149-civil-service-page,.emkan-v149-civil-sample-page) .emkan-v149-civil-search > svg.search-icon{
  left:8px!important;
  right:auto!important;
  top:50%!important;
  transform:translateY(-58%)!important;
}
html[lang="en"] body:is(.emkan-v149-civil-service-page,.emkan-v149-civil-sample-page) .emkan-v149-civil-search input[type="search"]{
  direction:ltr!important;
  text-align:left!important;
  padding:0 30px 5px 2px!important;
}
html[lang="en"] body:is(.emkan-v149-civil-service-page,.emkan-v149-civil-sample-page) .emkan-v149-civil-search > svg.search-icon{
  right:8px!important;
  left:auto!important;
  top:50%!important;
  transform:translateY(-58%)!important;
}

/* ========================================================================== 
   3) STORE > PRODUCT
   Historical layers draw both a border and a ::after separator. Remove only
   this duplicated central divider; the stage/tab/specification rules remain.
   ========================================================================== */
html body .product-main .product-gallery-panel{
  border-inline-end:0!important;
}
html body .product-main .product-gallery-panel::before,
html body .product-main .product-gallery-panel::after{
  content:none!important;
  display:none!important;
  width:0!important;
  height:0!important;
  background:transparent!important;
  border:0!important;
}

/* ========================================================================== 
   4) CONTENT CREATION > EDUCATION > LEARNING RESOURCE
   Important: older compiled CSS uses #contentApp#contentApp and forces the
   detail layout to display:block. Match/exceed that specificity here so the
   rail and body really form two columns in FA/AR/EN.
   ========================================================================== */
@media(min-width:901px){
  html body.emkan-v149-learning-resource #contentApp#contentApp > .v69-content-detail-layout,
  html body.emkan-v149-learning-resource #contentApp#contentApp > .v69-content-detail-layout.v90-education-detail-layout{
    display:grid!important;
    width:100%!important;
    max-width:1180px!important;
    min-width:0!important;
    margin:0 auto!important;
    padding:0!important;
    align-items:start!important;
    grid-auto-flow:row!important;
    gap:34px!important;
    direction:ltr!important;
    transform:none!important;
  }
  :is(html[lang="fa"],html[lang="ar"]) body.emkan-v149-learning-resource #contentApp#contentApp > .v69-content-detail-layout{
    grid-template-columns:minmax(0,1fr) 190px!important;
    grid-template-areas:"content rail"!important;
  }
  html[lang="en"] body.emkan-v149-learning-resource #contentApp#contentApp > .v69-content-detail-layout{
    grid-template-columns:190px minmax(0,1fr)!important;
    grid-template-areas:"rail content"!important;
  }
  html body.emkan-v149-learning-resource #contentApp#contentApp > .v69-content-detail-layout > .v69-content-search-rail{
    display:block!important;
    grid-area:rail!important;
    align-self:start!important;
    width:190px!important;
    min-width:190px!important;
    max-width:190px!important;
    margin:0!important;
    padding:0!important;
    position:static!important;
    inset:auto!important;
    transform:none!important;
  }
  html body.emkan-v149-learning-resource #contentApp#contentApp > .v69-content-detail-layout > .v69-content-detail-body,
  html body.emkan-v149-learning-resource #contentApp#contentApp > .v69-content-detail-layout > article.v69-content-detail-body,
  html body.emkan-v149-learning-resource #contentApp#contentApp > .v69-content-detail-layout > article.v86-course-detail{
    display:block!important;
    grid-area:content!important;
    align-self:start!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    position:static!important;
    inset:auto!important;
    transform:none!important;
  }
  html body.emkan-v149-learning-resource #contentApp#contentApp .v69-content-search-rail > :is(.learning-side,.v90-rail-learning-side){
    display:block!important;
    visibility:visible!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:12px 0 0!important;
    padding:0!important;
    position:static!important;
    inset:auto!important;
    transform:none!important;
  }
  html body.emkan-v149-learning-resource #contentApp#contentApp .learning-workspace,
  html body.emkan-v149-learning-resource #contentApp#contentApp .learning-workspace.v90-learning-workspace,
  html body.emkan-v149-learning-resource #contentApp#contentApp .learning-panels{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    transform:none!important;
  }
  html body.emkan-v149-learning-resource #contentApp#contentApp .emkan-v147-learning-header{
    display:grid!important;
    align-self:start!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin:0 0 24px!important;
    padding:0 0 18px!important;
    gap:22px!important;
    position:static!important;
    inset:auto!important;
    transform:none!important;
    direction:ltr!important;
  }
  :is(html[lang="fa"],html[lang="ar"]) body.emkan-v149-learning-resource #contentApp#contentApp .emkan-v147-learning-header{
    grid-template-columns:minmax(0,1fr) 190px!important;
    grid-template-areas:"copy poster"!important;
  }
  html[lang="en"] body.emkan-v149-learning-resource #contentApp#contentApp .emkan-v147-learning-header{
    grid-template-columns:190px minmax(0,1fr)!important;
    grid-template-areas:"poster copy"!important;
  }
  html body.emkan-v149-learning-resource #contentApp#contentApp .emkan-v147-learning-poster{
    display:block!important;
    grid-area:poster!important;
    align-self:start!important;
    width:190px!important;
    height:190px!important;
    max-width:190px!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    position:static!important;
    transform:none!important;
  }
  html body.emkan-v149-learning-resource #contentApp#contentApp .emkan-v147-learning-poster img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }
  html body.emkan-v149-learning-resource #contentApp#contentApp .emkan-v147-learning-copy{
    display:block!important;
    grid-area:copy!important;
    align-self:start!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    position:static!important;
    transform:none!important;
  }
  :is(html[lang="fa"],html[lang="ar"]) body.emkan-v149-learning-resource #contentApp#contentApp :is(.v69-content-search-rail,.v69-content-detail-body,.emkan-v147-learning-copy){direction:rtl!important;text-align:right!important}
  html[lang="en"] body.emkan-v149-learning-resource #contentApp#contentApp :is(.v69-content-search-rail,.v69-content-detail-body,.emkan-v147-learning-copy){direction:ltr!important;text-align:left!important}
}

@media(max-width:900px){
  html body.emkan-v149-learning-resource #contentApp#contentApp > .v69-content-detail-layout{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-areas:"rail" "content"!important;
    gap:18px!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
  }
  html body.emkan-v149-learning-resource #contentApp#contentApp > .v69-content-detail-layout > .v69-content-search-rail,
  html body.emkan-v149-learning-resource #contentApp#contentApp > .v69-content-detail-layout > .v69-content-detail-body{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    position:static!important;
    transform:none!important;
  }
  html body.emkan-v149-learning-resource #contentApp#contentApp .v69-content-search-rail > :is(.learning-side,.v90-rail-learning-side){display:block!important;visibility:visible!important;width:100%!important;max-width:none!important;margin-top:10px!important}
}

/* ========================================================================== 
   5) GLOBAL SEARCH — quieter, more editorial page title.
   ========================================================================== */
html body.emkan-global-search-page .emkan-search-head #searchTitle{
  display:block!important;
  margin:0!important;
  font-size:clamp(20px,2.25vw,31px)!important;
  font-weight:430!important;
  line-height:1.45!important;
  letter-spacing:-.012em!important;
}
