/* Custom overrides: loads after main/responsive to ensure precedence */

/* Ensure icon font swaps instantly (avoid FOIT/CLS). */
@font-face{
  font-family:'FontAwesome';
  src:url('../fonts/fontawesome-webfont.eot?v=4.7.0');
  src:url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'),
      url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'),
      url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'),
      url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'),
      url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
  font-weight:normal;
  font-style:normal;
  font-display:swap;
}

/* Breadcrumbs */
.breadcrumb-wrapper {
  width: 100%;
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  direction: rtl;
  margin-top: 8px;
  margin-bottom: 12px;
}

/* Product-page CLS: reserve title height to avoid font-swap reflow
   PSI culprit: html → IRANSansWeb.woff2 → h1.product-title */
.product-page .product .product-info .product-headline h1.product-title{
  min-height: 48px; /* 2 lines * 24px line-height (see main.css) */
  display: block;   /* avoid inline-block width reflow affecting layout */
}

/* Product page: shrink main image (~30%) */
.product-page #img-product-zoom{
  width: 100%;
  max-width: 420px; /* 600px → 420px */
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  margin: 0 auto;
  display: block;
}
@media (max-width: 991px){
  .product-page #img-product-zoom{
    max-width: 252px; /* 360px → 252px */
  }
}

/* Product page: related products rail */
.product-page .related-products,
.related-products{
  margin-top: 16px;
  margin-bottom: 8px;
  max-width: 100%;
  width: 100%;
  padding: 0 12px;
  box-sizing: border-box;
}
.product-page .related-products-title,
.related-products-title{
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 10px;
}
.product-page .related-products-rail,
.related-products-rail{
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: stretch;
  gap: 10px;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 5px;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}
.product-page .related-products-item,
.related-products-item{
  display: block;
  float: none;
  clear: none;
  flex: 0 0 120px; /* keep each card fixed-width */
  width: 120px;
  scroll-snap-align: start;
  text-decoration: none;
  color: #333;
}
.product-page .related-products-card,
.related-products-card{
  border: 1px solid #eee;
  border-radius: 8px;
  padding: 8px;
  width: 100%;
  box-sizing: border-box;
}
.product-page .related-products-img,
.related-products-img{
  width: 100%;
  aspect-ratio: 1 / 1;
  height: auto;
  object-fit: contain;
  background: #fff;
  border-radius: 6px;
  display: block;
}
.product-page .related-products-name,
.related-products-name{
  font-size: 12px;
  margin-top: 6px;
  height: 34px;
  overflow: hidden;
}
.product-page .related-products-price,
.related-products-price{
  font-size: 13px;
  font-weight: 600;
  margin-top: 4px;
  color: #000;
}

.breadcrumb-path {
  list-style: none;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
   flex-wrap: nowrap !important;
  gap: 12px;
  padding: 0;
  margin: 0;
  font-size: 13px;
  color: #555;
  white-space: nowrap;
}

.breadcrumb-path li {
  display: inline-flex !important;
  align-items: center;
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}

.breadcrumb-path li span {
  display: inline-flex;
}

.breadcrumb-path li a {
  display: inline-flex;
  align-items: center;
  color: #555;
  text-decoration: none;
  white-space: nowrap !important;
  padding: 4px 8px;
  border-radius: 16px;
  border: 1px solid transparent;
  font-size: 13px;
}

/* Reinforce breadcrumb flex layout */
.breadcrumb-wrapper ul.breadcrumb-path {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: nowrap !important;
  gap: 12px !important;
}

.breadcrumb-wrapper ul.breadcrumb-path > li {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
}

.breadcrumb-path li a:hover {
  color: #2196f3;
}

/* Archive toolbar layout */
body {
  border: none !important;
}

.archive-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  gap: 12px;
  padding: 10px 14px;
  border-radius: 10px;
  background: #f7f7f9;
  border: 1px solid #ececf0;
  margin-bottom: 16px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.archive-toolbar-left .archive-total {
  font-size: 13px;
  color: #666;
}

.archive-toolbar-right {
  display: flex !important;
  align-items: center !important;
  order: 1;
  flex-wrap: nowrap !important;
}

.archive-toolbar-left {
  order: 2;
  margin-inline-start: auto;
}

.archive-sort-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 12px !important;
  font-size: 13px;
  white-space: nowrap !important;
}

.archive-sort-list li {
  display: inline-flex !important;
  flex: 0 0 auto !important;
}

.archive-sort-list a {
  display: inline-flex !important;
  align-items: center !important;
  text-decoration: none;
  color: #0d47a1;
  padding: 4px 10px;
  border-radius: 16px;
  border: 1px solid #bbdefb;
  background: #e3f2fd;
  transition: all 0.2s ease;
}

.archive-sort-list a:hover {
  color: #0b3a85;
  border-color: #90caf9;
}

.archive-sort-list a.active {
  color: #fff;
  background: #1565c0;
  border-color: #1565c0;
  box-shadow: 0 2px 8px rgba(21, 101, 192, 0.25);
}


.filter-pill {
  color: #00695c !important;
  background: #e0f2f1 !important;
  border: 1px solid #b2dfdb !important;
  border-radius: 18px !important;
  padding: 4px 10px !important;
}

.filter-pill:hover {
  color: #004d40 !important;
  border-color: #80cbc4 !important;
}

@media (max-width: 768px) {
  .archive-toolbar {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .archive-sort-list {
    flex-wrap: wrap;
    white-space: normal;
    row-gap: 6px;
  }
}

/* Filter list and widgets */
.form-check.filter-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: nowrap;
  padding: 2px 0 !important;
  margin-bottom: 6px !important;
  direction: rtl;
  text-align: right;
}

.form-check.filter-item .form-check-input {
  position: relative !important;
  margin: 0 !important;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
}

.form-check.filter-item .form-check-label {
  white-space: normal !important;
  line-height: 1.6;
  flex: 1;
  min-width: 0;
  font-size: 13px;
  cursor: pointer;
}

.widget.widget-product.card {
  padding: 10px 12px;
  border-radius: 10px;
  margin-bottom: 16px;
}

.widget.widget-product .widget-title {
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 8px;
}

/* Layout fixes for grid alignment */
.container-main .row {
  display: flex !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.container-main [class*="col-"] {
  padding-left: 12px !important;
  padding-right: 12px !important;
  box-sizing: border-box !important;
}

  .shop-archive-content {
    margin-top: 16px;
    margin-right: 0 !important;
    padding-right: 0 !important;
  }

.sticky-sidebar {
  padding-right: 0 !important;
  margin-right: 0 !important;
  max-width: 260px !important;
}

.col-lg-9, .col-md-9, .col-xs-12 {
  float: right !important;
  width: 75% !important;
}

/* Product cards */
.product-box {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start;
  height: 360px !important;
  padding: 10px;
  border-radius: 10px;
  background: #fff;
}

.product-box .thumb {
  flex: 0 0 auto;
  text-align: center;
  margin-bottom: 8px;
}

.product-box .thumb img {
  height: 220px;
  width: 100%;
  object-fit: contain;
}

.product-box .title {
  flex: 0 0 auto;
  margin-bottom: 8px;
}

.product-box .title a {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  min-height: 66px;
  font-size: 13px;
  line-height: 1.7;
}

.product-box .price {
  margin-top: auto;
  font-weight: 600;
}

/* Add a small gap between amount and currency */
.product-box .price .amount span {
  display: inline-block;
  margin-right: 4px;
}

@media (max-width: 768px) {
  .shop-archive-content .product-box {
    height: auto !important;
    min-height: 140px !important;
    padding: 10px 12px !important;
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 1.2fr 1fr !important;
    grid-template-rows: auto auto !important;
    align-items: center !important;
    column-gap: 10px !important;
    row-gap: 6px !important;
  }

  .shop-archive-content .product-box .thumb {
    margin-bottom: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    grid-column: 1 !important;
    grid-row: 1 / 3 !important;
  }

  .shop-archive-content .product-box .thumb img {
    aspect-ratio: 1 / 1;
    height: auto !important;
    max-height: 110px !important;
    width: 100% !important;
    object-fit: contain;
  }

  .shop-archive-content .product-box .title {
    margin-bottom: 6px !important;
    flex: 1 1 auto !important;
    padding-left: 4px !important;
    display: flex !important;
    align-items: flex-start !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
  }

  .shop-archive-content .product-box .price {
    margin-top: auto !important;
    padding-bottom: 6px !important;
    text-align: right !important;
    align-self: flex-end !important;
    grid-column: 2 !important;
    grid-row: 2 !important;
  }

  .shop-archive-content .row {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 2px 2px !important;
    margin-left: -2px !important;
    margin-right: -2px !important;
    width: 100% !important;
  }

  .shop-archive-content .row > [class*="col-"] {
    padding-left: 2px !important;
    padding-right: 2px !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }

  .shop-archive-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .archive-toolbar {
    padding: 8px 10px !important;
    gap: 8px !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .archive-sort-list {
    gap: 8px !important;
  }

  .archive-toolbar-left .archive-total {
    display: none !important;
  }

  /* Hide sidebar widgets on mobile and expand content */
  .sticky-sidebar {
    display: none !important;
  }

  .col-lg-9,
  .col-md-9,
  .col-xs-12 {
    width: 100% !important;
    float: none !important;
  }

  /* Mobile bottom-sheet modal for categories */
  #mobileCatModal .modal-dialog.modal-bottomsheet {
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    position: fixed !important;
    bottom: 0;
    left: 0;
    right: 0;
    transform: translate(0, 0) !important;
  }

  #mobileCatModal .modal-content {
    border-radius: 16px 16px 0 0;
    border: 0;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.1);
  }

  #mobileCatModal .modal-header,
  #mobileCatModal .modal-footer {
    border: 0;
    padding: 12px 16px;
  }

  #mobileCatModal .modal-body {
    max-height: 60vh;
    overflow: auto;
    padding: 0 16px 12px;
  }

  #mobileCatModal .form-check.filter-item {
    margin-bottom: 10px !important;
  }
}

/* Login page logo override */
.page-account-box .ds-userlogin a.account-box-logo {
  width: 156px;
  height: 60px;
  margin: 15px auto 18px;
  background: none !important;
  text-indent: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
  position: static;
  padding: 6px 0;
}

.page-account-box .ds-userlogin a.account-box-logo img {
  max-height: 48px;
  max-width: 160px;
  width: auto;
  height: auto;
}

/* Center login box */
.page-account-box {
  display: flex;
  justify-content: center;
}

.page-account-box .row {
  display: flex;
  justify-content: center;
}

.page-account-box .col-lg {
  display: flex;
  justify-content: center;
}

.page-account-box .ds-userlogin {
  margin: 0 auto;
  max-width: 520px;
  width: 100%;
}
/* Mega menu: show only level-2 items as a vertical list (no level-3). */
.header-main-nav ul.menu-ul li.menu-item > ul.is-mega-menu.mega-menu--flat {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end; /* RTL: keep links on the right */
  padding-left: 270px !important; /* reserve space for left-side image (250px + gap) */
}

.header-main-nav ul.menu-ul li.menu-item > ul.is-mega-menu.mega-menu--flat.mega-menu--auto-cols {
  display: grid !important;
  direction: rtl;
  grid-auto-flow: column;
  grid-template-rows: repeat(10, max-content);
  grid-auto-columns: minmax(0, 1fr);
  gap: 0 28px;
  align-content: start;
  justify-content: start; /* RTL: start == right */
  justify-items: stretch;
}

.header-main-nav ul.menu-ul li.menu-item ul.is-mega-menu.mega-menu--flat li.menu-mega-item {
  width: 100% !important;
  float: none !important;
  clear: both;
  text-align: right;
}

.header-main-nav ul.menu-ul li.menu-item ul.is-mega-menu.mega-menu--flat li.menu-mega-item a.mega-menu-link {
  display: flex !important;
  align-items: center;
  justify-content: flex-start; /* RTL: start == right */
  gap: 8px;
  direction: rtl;
  width: 100%;
  margin-right: 15px;
  line-height: 34px;
}

.header-main-nav ul.menu-ul li.menu-item ul.is-mega-menu.mega-menu--flat li.menu-mega-item a.mega-menu-link img.mega-menu-link-icon {
  width: 24px;
  height: 24px;
  object-fit: contain;
  flex: 0 0 auto;
}

.header-main-nav ul.menu-ul li.menu-item ul.is-mega-menu.mega-menu--flat li.menu-mega-item a.mega-menu-link span.mega-menu-link-title {
  flex: 1 1 auto;
}

/* Ensure text alignment stays RTL when auto columns are enabled */
.header-main-nav ul.menu-ul li.menu-item ul.is-mega-menu.mega-menu--flat.mega-menu--auto-cols li.menu-mega-item a.mega-menu-link {
  text-align: right;
  width: 100%;
}

/* Sidebar category menu (level-two list): split into columns after 10 items */
.megamenu-widget .header-main-menu ul.main-menu-ul li.main-menu-item ul.mega-menu-category li.menu-category-item ul.sub-menu-category.mega-menu--auto-cols {
  display: grid;
  direction: rtl;
  grid-auto-flow: column;
  grid-template-rows: repeat(10, max-content);
  grid-auto-columns: minmax(0, 1fr);
  gap: 0 18px;
  align-content: start;
  justify-content: start; /* RTL: start == right */
  justify-items: stretch;
}

.megamenu-widget .header-main-menu ul.main-menu-ul li.main-menu-item ul.mega-menu-category li.menu-category-item ul.sub-menu-category.mega-menu--auto-cols li.menu-category-item-there a {
  text-align: right;
  width: 100%;
}

.megamenu-widget .header-main-menu ul.main-menu-ul li.main-menu-item ul.mega-menu-category li.menu-category-item ul.sub-menu-category.mega-menu--auto-cols li.menu-category-item-there {
  text-align: right;
}