/* EMKAN v144 FINAL STABILIZATION
   Purpose: restore one visual system without disturbing the established layout.
   Scope: disclosure marks, language visibility, Civil services, store product detail,
   responsive product gallery, and shared hairline/control consistency. */

/* --------------------------------------------------------------------------
   A. LANGUAGE VISIBILITY — never show labels from two/three languages together.
   -------------------------------------------------------------------------- */
html[lang="fa"] :is(.lang-en,.lang-ar),
html[lang="en"] :is(.lang-fa,.lang-ar),
html[lang="ar"] :is(.lang-fa,.lang-en){display:none!important;}

/* --------------------------------------------------------------------------
   B. ONE DISCLOSURE ICON EVERYWHERE — restore the original EMKAN stepped lines.
      Both lines remain visible when CLOSED and OPEN; only their lengths swap.
   -------------------------------------------------------------------------- */
html body :is(
  .emkan-v133-disclosure-mark,.emkan-v132-disclosure-mark,.emkan-v131-disclosure-mark,
  .emkan-disclosure-mark,.category-chevron,.article-category-chevron,.detail-subcategory-chevron,
  .v49-filter-chevron,.store-subcategory-mark,.store-sort-mark,.store-sort-filter-mark,
  .message-subject-chevron
){
  position:relative!important;
  display:inline-block!important;
  visibility:visible!important;
  opacity:.78!important;
  width:12px!important;
  height:10px!important;
  flex:0 0 12px!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
  color:currentColor!important;
}
html body :is(
  .emkan-v133-disclosure-mark,.emkan-v132-disclosure-mark,.emkan-v131-disclosure-mark,
  .emkan-disclosure-mark,.category-chevron,.article-category-chevron,.detail-subcategory-chevron,
  .v49-filter-chevron,.store-subcategory-mark,.store-sort-mark,.store-sort-filter-mark,
  .message-subject-chevron
)::before,
html body :is(
  .emkan-v133-disclosure-mark,.emkan-v132-disclosure-mark,.emkan-v131-disclosure-mark,
  .emkan-disclosure-mark,.category-chevron,.article-category-chevron,.detail-subcategory-chevron,
  .v49-filter-chevron,.store-subcategory-mark,.store-sort-mark,.store-sort-filter-mark,
  .message-subject-chevron
)::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset-inline-end:0!important;
  left:auto!important;
  height:1px!important;
  background:currentColor!important;
  border:0!important;
  opacity:1!important;
  transform:none!important;
  transition:width .2s cubic-bezier(.22,.61,.36,1)!important;
}
html body :is(
  .emkan-v133-disclosure-mark,.emkan-v132-disclosure-mark,.emkan-v131-disclosure-mark,
  .emkan-disclosure-mark,.category-chevron,.article-category-chevron,.detail-subcategory-chevron,
  .v49-filter-chevron,.store-subcategory-mark,.store-sort-mark,.store-sort-filter-mark,
  .message-subject-chevron
)::before{top:2px!important;width:6px!important;}
html body :is(
  .emkan-v133-disclosure-mark,.emkan-v132-disclosure-mark,.emkan-v131-disclosure-mark,
  .emkan-disclosure-mark,.category-chevron,.article-category-chevron,.detail-subcategory-chevron,
  .v49-filter-chevron,.store-subcategory-mark,.store-sort-mark,.store-sort-filter-mark,
  .message-subject-chevron
)::after{top:auto!important;bottom:2px!important;width:11px!important;}

html body details[open]>summary :is(
  .emkan-v133-disclosure-mark,.emkan-v132-disclosure-mark,.emkan-v131-disclosure-mark,
  .emkan-disclosure-mark,.detail-subcategory-chevron,.v49-filter-chevron,
  .store-subcategory-mark,.store-sort-mark,.store-sort-filter-mark
)::before,
html body :is(.category-toggle,.article-category-toggle,.message-subject-trigger)[aria-expanded="true"] :is(
  .emkan-v133-disclosure-mark,.emkan-v132-disclosure-mark,.emkan-v131-disclosure-mark,
  .category-chevron,.article-category-chevron,.message-subject-chevron
)::before,
html body .category-panel.is-open .category-toggle :is(.emkan-v133-disclosure-mark,.emkan-v132-disclosure-mark,.category-chevron)::before{width:11px!important;}

html body details[open]>summary :is(
  .emkan-v133-disclosure-mark,.emkan-v132-disclosure-mark,.emkan-v131-disclosure-mark,
  .emkan-disclosure-mark,.detail-subcategory-chevron,.v49-filter-chevron,
  .store-subcategory-mark,.store-sort-mark,.store-sort-filter-mark
)::after,
html body :is(.category-toggle,.article-category-toggle,.message-subject-trigger)[aria-expanded="true"] :is(
  .emkan-v133-disclosure-mark,.emkan-v132-disclosure-mark,.emkan-v131-disclosure-mark,
  .category-chevron,.article-category-chevron,.message-subject-chevron
)::after,
html body .category-panel.is-open .category-toggle :is(.emkan-v133-disclosure-mark,.emkan-v132-disclosure-mark,.category-chevron)::after{width:6px!important;opacity:1!important;}

/* Legacy disclosure summaries that use their own pseudo element. */
html body :is(.podcast-filter,.rail-filter)>summary::after{
  content:""!important;
  display:inline-block!important;
  visibility:visible!important;
  opacity:.78!important;
  width:12px!important;
  height:10px!important;
  flex:0 0 12px!important;
  border:0!important;
  transform:none!important;
  background:
    linear-gradient(currentColor,currentColor) 100% 2px/6px 1px no-repeat,
    linear-gradient(currentColor,currentColor) 100% 8px/11px 1px no-repeat!important;
}
html body :is(.podcast-filter,.rail-filter)[open]>summary::after{
  display:inline-block!important;
  visibility:visible!important;
  opacity:.9!important;
  background:
    linear-gradient(currentColor,currentColor) 100% 2px/11px 1px no-repeat,
    linear-gradient(currentColor,currentColor) 100% 8px/6px 1px no-repeat!important;
}

/* --------------------------------------------------------------------------
   C. SHARED LINE/CONTROL FINISH — no accidental heavy controls in public UI.
   -------------------------------------------------------------------------- */
html body :is(
  .category-toggle,.article-category-toggle,.detail-subcategory-filter>summary,
  .v49-plain-filter>summary,.store-subcategory-filter>summary,.store-sort-filter>summary,
  .podcast-filter>summary,.rail-filter>summary
){box-shadow:none!important;}

/* --------------------------------------------------------------------------
   D. CIVIL / SERVICES — four real entry covers, then each opens its own detail tree.
   -------------------------------------------------------------------------- */
.emkan-v143-service-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:28px 22px!important;
  width:100%!important;
  margin-top:24px!important;
}
.emkan-v143-service-media{aspect-ratio:1/1!important;}
@media(max-width:900px){
  .emkan-v143-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:22px 16px!important;}
}
@media(max-width:520px){
  .emkan-v143-service-grid{grid-template-columns:1fr!important;max-width:310px!important;margin:20px auto 0!important;gap:20px!important;}
}

/* --------------------------------------------------------------------------
   E. STORE PRODUCT DETAIL — compact editorial gallery, centered hero, small thumbs.
      This intentionally overrides the accumulated historical product CSS layers.
   -------------------------------------------------------------------------- */
html body .product-main{
  width:min(1040px,calc(100% - 48px))!important;
  margin:0 auto!important;
  padding:24px 0 64px!important;
}
html body .product-stage{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(320px,.9fr)!important;
  grid-template-areas:"media info"!important;
  gap:28px!important;
  align-items:start!important;
  padding-top:22px!important;
  border-bottom:1px solid var(--line)!important;
}
html body .product-gallery-panel{
  grid-area:media!important;
  min-width:0!important;
  padding:0 20px 26px!important;
  border-inline-end:1px solid var(--line)!important;
}
html body .product-gallery,
html[dir="ltr"] body .product-gallery{
  display:grid!important;
  grid-template-columns:52px minmax(0,1fr)!important;
  grid-template-areas:"thumbs hero"!important;
  gap:10px!important;
  align-items:start!important;
  width:min(100%,430px)!important;
  max-width:430px!important;
  margin-inline:auto!important;
}
html body .product-main-image{
  grid-area:hero!important;
  width:min(100%,350px)!important;
  max-width:350px!important;
  aspect-ratio:1/1!important;
  margin-inline:auto!important;
  align-self:start!important;
  overflow:hidden!important;
  border:1px solid var(--line)!important;
  background:var(--panel)!important;
}
html body .product-main-image img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  display:block!important;
}
html body .product-thumbs{
  grid-area:thumbs!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-auto-rows:52px!important;
  gap:7px!important;
  margin:0!important;
  padding:0!important;
  align-content:start!important;
}
html body .product-thumb{
  width:52px!important;
  height:52px!important;
  min-width:52px!important;
  aspect-ratio:1/1!important;
  margin:0!important;
  padding:0!important;
  border:1px solid var(--line)!important;
  background:transparent!important;
  overflow:hidden!important;
}
html body .product-thumb img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  display:block!important;
}
html body .product-info{
  grid-area:info!important;
  min-width:0!important;
  position:static!important;
  padding:0 20px 26px!important;
}
html body .buy-row{
  display:grid!important;
  grid-template-columns:74px minmax(0,1fr)!important;
  gap:10px!important;
  align-items:end!important;
  margin-top:20px!important;
}
html body #addToCart{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  height:34px!important;
  min-height:34px!important;
  padding:0 14px!important;
  line-height:1.2!important;
}

/* Exactly one add-to-cart label even before JS finishes. */
html body #addToCart>.lang-fa,
html body #addToCart>.lang-en,
html body #addToCart>.lang-ar{display:none!important;}
html[lang="fa"] body #addToCart>.lang-fa,
html[lang="en"] body #addToCart>.lang-en,
html[lang="ar"] body #addToCart>.lang-ar{display:inline!important;}

@media(max-width:900px){
  html body .product-main{width:min(100% - 36px,900px)!important;padding-top:20px!important;}
  html body .product-stage{
    grid-template-columns:1fr!important;
    grid-template-areas:"media" "info"!important;
    gap:22px!important;
    padding-top:18px!important;
  }
  html body .product-gallery-panel{
    padding:0 0 20px!important;
    border-inline-end:0!important;
    border-bottom:1px solid var(--line)!important;
  }
  html body .product-info{padding:0 0 24px!important;}
  html body .product-gallery,html[dir="ltr"] body .product-gallery{
    width:min(100%,390px)!important;
    max-width:390px!important;
  }
  html body .product-main-image{width:min(100%,330px)!important;max-width:330px!important;}
}
@media(max-width:620px){
  html body .product-main{width:calc(100% - 28px)!important;padding:16px 0 52px!important;}
  html body .product-stage{gap:18px!important;padding-top:14px!important;}
  html body .product-gallery,html[dir="ltr"] body .product-gallery{
    grid-template-columns:1fr!important;
    grid-template-areas:"hero" "thumbs"!important;
    width:100%!important;
    max-width:340px!important;
    gap:9px!important;
    margin-inline:auto!important;
  }
  html body .product-main-image{
    width:min(100%,300px)!important;
    max-width:300px!important;
    margin-inline:auto!important;
  }
  html body .product-thumbs{
    display:flex!important;
    flex-wrap:nowrap!important;
    justify-content:center!important;
    align-items:center!important;
    gap:7px!important;
    overflow-x:auto!important;
    scrollbar-width:none!important;
    padding:0 2px 2px!important;
  }
  html body .product-thumbs::-webkit-scrollbar{display:none!important;}
  html body .product-thumb{
    flex:0 0 44px!important;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
  }
  html body .buy-row{grid-template-columns:68px minmax(0,1fr)!important;gap:8px!important;}
}

/* Related product cards stay square and compact on every breakpoint. */
html body .related-media{aspect-ratio:1/1!important;}
html body .related-media img{width:100%!important;height:100%!important;object-fit:cover!important;}

/* --------------------------------------------------------------------------
   F. FINAL RESPONSIVE SAFETY — prevent public page horizontal overflow.
   -------------------------------------------------------------------------- */
html,body{max-width:100%;}
body{overflow-x:hidden;}
img,video,svg{max-width:100%;}