.elementor-20501 .elementor-element.elementor-element-2f9eb4b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0rem;--margin-bottom:0rem;--margin-left:0rem;--margin-right:0rem;}.elementor-20501 .elementor-element.elementor-element-06a5f36{--display:grid;--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(3, 1fr);--grid-auto-flow:row;--margin-top:7rem;--margin-bottom:0rem;--margin-left:0rem;--margin-right:0rem;}.elementor-widget-theme-site-logo .widget-image-caption{color:var( --e-global-color-text );font-weight:var( --e-global-typography-text-font-weight );}.elementor-20501 .elementor-element.elementor-element-e10c599 > .elementor-widget-container{margin:2rem 0rem 0rem 0rem;}body:not(.rtl) .elementor-20501 .elementor-element.elementor-element-e10c599{left:0px;}body.rtl .elementor-20501 .elementor-element.elementor-element-e10c599{right:0px;}.elementor-20501 .elementor-element.elementor-element-e10c599{top:0px;}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-family:var( --e-global-typography-primary-font-family );font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-text );fill:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:hover,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );}.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
					.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-accent );}.elementor-widget-nav-menu .e--pointer-framed .elementor-item:before,
					.elementor-widget-nav-menu .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-accent );}.elementor-widget-nav-menu{--e-nav-menu-divider-color:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item, .elementor-widget-nav-menu .elementor-nav-menu--dropdown  .elementor-sub-item{font-family:var( --e-global-typography-accent-font-family );font-weight:var( --e-global-typography-accent-font-weight );}.elementor-20501 .elementor-element.elementor-element-2eec1b1{width:100%;max-width:100%;}.elementor-20501 .elementor-element.elementor-element-2eec1b1 > .elementor-widget-container{margin:2rem 0rem 0rem 0rem;}.elementor-20501 .elementor-element.elementor-element-2eec1b1 .elementor-nav-menu--dropdown .elementor-item, .elementor-20501 .elementor-element.elementor-element-2eec1b1 .elementor-nav-menu--dropdown  .elementor-sub-item{font-weight:500;}.elementor-20501 .elementor-element.elementor-element-7919595{--grid-template-columns:repeat(3, auto);width:auto;max-width:auto;align-self:center;--icon-size:16px;--grid-column-gap:5px;--grid-row-gap:0px;}.elementor-20501 .elementor-element.elementor-element-7919595 .elementor-widget-container{text-align:center;}.elementor-20501 .elementor-element.elementor-element-7fd8785{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-20501 .elementor-element.elementor-element-0d27920{--display:grid;--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-20501 .elementor-element.elementor-element-34a409d{width:var( --container-widget-width, 8% );max-width:8%;--container-widget-width:8%;--container-widget-flex-grow:0;}.elementor-20501 .elementor-element.elementor-element-2dda283 .elementor-menu-toggle{margin-left:auto;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(max-width:1024px){.elementor-20501 .elementor-element.elementor-element-06a5f36{--grid-auto-flow:row;}.elementor-20501 .elementor-element.elementor-element-e10c599 > .elementor-widget-container{margin:2rem 0rem 0rem 0rem;}.elementor-20501 .elementor-element.elementor-element-2eec1b1 > .elementor-widget-container{margin:7rem 0rem 0rem 0rem;}.elementor-20501 .elementor-element.elementor-element-7919595{--icon-size:14px;--grid-column-gap:2px;}.elementor-20501 .elementor-element.elementor-element-0d27920{--grid-auto-flow:row;}}@media(min-width:768px){.elementor-20501 .elementor-element.elementor-element-2f9eb4b{--width:18%;}}@media(max-width:767px){.elementor-20501 .elementor-element.elementor-element-06a5f36{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-20501 .elementor-element.elementor-element-7fd8785{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:13px;--padding-bottom:13px;--padding-left:13px;--padding-right:13px;}.elementor-20501 .elementor-element.elementor-element-0d27920{--e-con-grid-template-columns:repeat(2, 1fr);--grid-auto-flow:row;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-20501 .elementor-element.elementor-element-34a409d{--container-widget-width:40px;--container-widget-flex-grow:0;width:var( --container-widget-width, 40px );max-width:40px;}.elementor-20501 .elementor-element.elementor-element-2dda283.elementor-element{--align-self:stretch;--flex-grow:0;--flex-shrink:0;}.elementor-20501 .elementor-element.elementor-element-2dda283 .elementor-nav-menu--dropdown a{padding-left:16px;padding-right:16px;padding-top:10px;padding-bottom:10px;}.elementor-20501 .elementor-element.elementor-element-2dda283 .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-nav-menu--dropdown, .elementor-20501 .elementor-element.elementor-element-2dda283 .elementor-nav-menu__container.elementor-nav-menu--dropdown{margin-top:18px !important;}}/* Start custom CSS for container, class: .elementor-element-2f9eb4b *//* ==== منوی عمودی با مگا منو و افکت بلور و رنگ گرادیانت ==== */
#vertical-header {
	z-index: 99999 !important;
    position: fixed;
    left: 0;
    top: 0;
    width: 70px; /* عرض کوچک اولیه */
    height: 100vh;
    
    background: linear-gradient(-45deg, hsla(0,0%,100%,0.3), hsla(0,0%,100%,0.6));
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

    border-right: 1px solid #ddd;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    overflow: visible; /* برای نمایش زیرمنوها خارج از هدر */
    transition: width 0.3s ease;
}

/* آیتم‌های منو */
#vertical-header .elementor-nav-menu > li {
    position: relative;
}

/* لینک‌ها: آیکن وسط و متن مخفی */
#vertical-header .elementor-nav-menu > li > a {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 12px 0;
    color: black;
    text-decoration: none;
    transition: all 0.3s ease;
}

/* متن منوهای اصلی مخفی */
#vertical-header .elementor-nav-menu > li > a span {
    display: none;
}

/* آیکن‌ها بزرگ در حالت collapsed */
#vertical-header .elementor-nav-menu > li > a i,
#vertical-header .elementor-nav-menu > li > a svg {
    font-size: 2rem !important;
    transition: font-size 0.3s ease;
}

/* حالت hover روی کل هدر — باز شدن هدر */
#vertical-header:hover {
    width: 250px; /* عرض expanded */
}

/* متن منوها هنگام hover روی هدر */
#vertical-header:hover .elementor-nav-menu > li > a span {
    display: inline-block;
    margin-left: 10px; /* فاصله متن از آیکن */
}

/* آیکن‌ها کوچکتر در حالت expanded */
#vertical-header:hover .elementor-nav-menu > li > a i,
#vertical-header:hover .elementor-nav-menu > li > a svg {
    font-size: 1.25rem;
}

/* مخفی کردن آیکن‌های شبکه‌های اجتماعی در حالت collapsed */
#vertical-header .elementor-social-icons-wrapper {
    opacity: 0;
    transition: opacity 0.3s ease;
}

/* نمایش آیکن‌های شبکه‌ها در حالت hover */
#vertical-header:hover .elementor-social-icons-wrapper {
    opacity: 1;
}





/*  زیرمنوهای مربوط به محصولات */
#vertical-header .elementor-nav-menu li.menu-item-has-children.has-mega.menu-item-has-image:hover > .elementor-nav-menu--dropdown{
    position: fixed !important;
    left: -214%;
    height: 100vh;
    padding-top: 2rem;
}



/* زیرمنوهای مگا — پیش‌فرض مخفی با موقعیت و افکت اولیه */
#vertical-header .elementor-nav-menu li.menu-item-has-children.has-mega > .elementor-nav-menu--dropdown,
#vertical-header .sub-menu {
    position: absolute !important;
    top: 0 !important;
    right:-31.5rem !important; /* ابتدا پشت هدر اصلی */
    z-index: 99999 !important;
    display: grid !important;
    visibility: hidden;
    opacity: 0;
    transform: translateX(-20rem); /* کمی سمت چپ */
    
background: white;    
min-width: 500px;
    padding: 15px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    grid-template-columns: repeat(3, minmax(120px, 1fr));
    gap: 10px;
    transition: all 0.5s ease; /* انیمیشن نرم */
}

/* نمایش زیرمنو هنگام هاور روی منوی والد با حرکت نرم از چپ به راست */

#vertical-header .elementor-nav-menu li.menu-item-has-children.has-mega:hover > .elementor-nav-menu--dropdown{
        width: 82.5vw;
    visibility: visible;
    opacity: 1;
    transform: translateX(49rem);
    
   
}



#vertical-header .elementor-nav-menu li.menu-item-has-children.has-mega > .elementor-nav-menu--dropdown{
    width: 83vw !important;
        transform: translateX(49rem) !important; /* شروع کمی سمت چپ */

    
    
}

/* زیرمنوها زیر کل هدر باز شوند و حرکت نرم از چپ به راست داشته باشند */
#vertical-header .elementor-nav-menu li.menu-item-has-children.has-mega > .elementor-nav-menu--dropdown {
    position: absolute;        /* موقعیت نسبت به هدر */
    top: 100%;                 /* دقیقاً زیر هدر */
    right: 0;                   /* شروع از سمت چپ هدر */
    width: 83vw;              /* عرض دلخواه زیرمنو */
    z-index: 9999;
    display: grid !important;
    visibility: hidden;
    opacity: 0;
    transform: translateX(49.5rem); /* شروع کمی سمت چپ */
    transition: all 0.3s ease-out;    /* حرکت نرم */
}

/* هنگام هاور روی والد منو */
#vertical-header .elementor-nav-menu li.menu-item-has-children.has-mega:hover > .elementor-nav-menu--dropdown {
    visibility: visible;
    opacity: 1;
    transform: translateX(1rem); /* به موقعیت اصلی برسد */
}





/* لینک‌های داخل زیرمنو */
#vertical-header .elementor-nav-menu--dropdown .elementor-item {
    display: block;
    padding: 8px 10px;
    color: #333;
    transition: background 0.2s, color 0.2s;
}

#vertical-header .elementor-nav-menu--dropdown .elementor-item:hover {
    background: rgba(212,79,108,0.1);
    color: #d44f6c;
}


/* فرض: کلاس .menu-item-has-image دارد، و تصویر داخل <img> است */
.sub-menu .menu-item-has-image {
  display: flex;
  align-items: center;
}
.sub-menu .menu-item-has-image img {
  width: 40px;  /* سایز دلخواه */
  height: auto;
  margin-right: 8px;
}






@media (max-width: 768px) {
  #vertical-header {
    display: none;     
  }
}


/* فقط زیرمنوهای منوی All Products */
.menu-item-has-image .sub-menu .menu-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
}

/* عکس‌ها در زیرمنو */
.menu-item-has-image .sub-menu .menu-item img.menu-image {
  width: 45px;
  height: 45px;
  object-fit: cover;
  border-radius: 6px;
  transition: transform 0.3s ease;
}

/* افکت روی هاور */
.menu-item-has-image .sub-menu .menu-item:hover img.menu-image {
  transform: scale(1.05);
}

/* استایل نوشته‌ها */
.menu-item-has-image .sub-menu .menu-item a {
  color: #333;
  text-decoration: none;
  font-weight: 500;
}



/* فقط زیرمنوهای منوی All Products */
.menu-item-has-image .sub-menu .menu-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
}

/* عکس‌ها در زیرمنو */
.menu-item-has-image .sub-menu .menu-item img.menu-image {
  width: 45px;
  height: 45px;
  object-fit: cover;
  border-radius: 6px;
  transition: transform 0.3s ease;
}

/* افکت روی هاور */
.menu-item-has-image .sub-menu .menu-item:hover img.menu-image {
  transform: scale(1.05);
}

/* استایل نوشته‌ها */
.menu-item-has-image .sub-menu .menu-item a {
  color: #333;
  text-decoration: none;
  font-weight: 500;
}

/* فقط زیرمنوهای منوی All Products */
.menu-item-has-image .sub-menu {
  display: flex;
  flex-wrap: wrap; /* برای اینکه کارت‌ها ردیفی بچینن */
  gap: 15px; /* فاصله بین کارت‌ها */
  padding: 15px;
}

/* هر آیتم زیرمنو به شکل کارت */
.menu-item-has-image .sub-menu .menu-item {
  display: flex;
  flex-direction: column; /* عکس بالای متن */
  align-items: center;
  text-align: center;
  width: 120px; /* عرض کارت */
  padding: 10px;
  transition: transform 0.3s ease;
}

/* افکت هاور روی کارت */
.menu-item-has-image .sub-menu .menu-item:hover {
  transform: translateY(-5px);
}

/* تصویر محصول */
.menu-item-has-image .sub-menu .menu-item img.menu-image {
  width: 100px;
  height: 100px;
  object-fit: cover;
  border-radius: 8px;
  margin-bottom: 8px;
}

/* متن زیر تصویر */
.menu-item-has-image .sub-menu .menu-item a {
  font-size: 16px; /* اندازه متن بزرگتر */
  font-weight: 700; /* بولد */
  color: #333;
  text-decoration: none;
}

/* افکت هاور روی متن */
.menu-item-has-image .sub-menu .menu-item:hover a {
  color: #d44f6c; /* یا هر رنگ دلخواه */
}



.menu-item-has-image .sub-menu .menu-item a.elementor-sub-item{
    
    display: contents !important;
}/* End custom CSS */
/* Start custom CSS for nav-menu, class: .elementor-element-2dda283 *//* overlay منو fullscreen روی کل صفحه */
.fullscreen-submenu .overlay-menu {
    position: fixed; /* روی کل صفحه */
    top: 0;
    left: 0;
    width: 100vw;   /* تمام عرض viewport */
    height: 0;      /* شروع از صفر */
    z-index: 99999; /* بالاتر از همه عناصر */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden; /* جلوگیری از اسکرول */
    transition: height 0.5s ease;
}

/* وقتی overlay فعال شد */
.fullscreen-submenu.active .overlay-menu {
    height: 100vh; /* کل ارتفاع viewport */
    overflow: hidden; /* جلوگیری از اسکرول */

    background: red !important;
}

/* آیتم‌های منو داخل overlay */
.fullscreen-submenu.active .overlay-menu .elementor-nav-menu > li {
    opacity: 1;
    transform: translateY(0);
    transition: all 0.4s ease;
    margin: 15px 0;
}

/* لینک‌ها داخل زیرمنو */
.fullscreen-submenu .overlay-menu .elementor-nav-menu > li > a {
    color: black;
    font-size: 1.5rem;
    text-decoration: none;
}

.fullscreen-submenu .overlay-menu .elementor-nav-menu > li > a:hover {
    color: #d44f6c;
   
}

/* حالت مخفی اولیه آیتم‌ها */
.fullscreen-submenu .overlay-menu .elementor-nav-menu > li {
    opacity: 0;
    transform: translateY(-20px);
}

/* جلوگیری از اسکرول body وقتی منو باز است */
body.menu-open {
    overflow: hidden;
}

.elementor-nav-menu--dropdown.elementor-nav-menu__container{
    z-index: 10000 !important;
    height: 100vh;
        background: rgba(0,0,0,0.3); /* بلوری مشکی سبک */
    backdrop-filter: blur(10px);
    
    

}


/* وقتی منو باز است، رنگ پس‌زمینه bgheader سفید شود */
body.menu-open .bgheader {
    background-color: #ffffff !important;
    transition: background-color 0.4s ease;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-7fd8785 */.bgheader{
    height: 64px;
    position: fixed;
    z-index: 10000 !important;

}


nav.elementor-nav-menu--dropdown.elementor-nav-menu__container{
    height: 100vh !important
}/* End custom CSS */