/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Techroot
Author URI: https://Techroot.ir/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */
p {
  margin: 0;
}

.head-title b {
  color: #ED0CA8 !important;
}

.Dropslider {
  position: relative;
  overflow: hidden;
  height: 48px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  /* ارتفاع ثابت باکس، مطابق با ارتفاع آیتم */
}

.Dropslider ul {
  height: 38px;
  min-height: 30px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  margin: auto;
  overflow: hidden;
  position: absolute;
  top: 10px;
}

.Dropslider .elementor-icon-list-item {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  opacity: 0;
  transform: translateY(-100%);
  transition: transform 0.5s ease, opacity 0.5s ease;
}

.Dropslider .elementor-icon-list-item.active {
  opacity: 1;
  transform: translateY(0);
}

.Dropslider .elementor-icon-list-item.exit {
  opacity: 0;
  transform: translateY(100%);
}

.motion-path-widget {
  position: relative;
  width: 100%;
  height: 400px;
  overflow: hidden;
}

.motion-path-widget svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.motion-path-widget .dot {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  position: absolute;
  overflow: hidden;
  background: #fff;
}

.motion-path-widget .dot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.motion-path-widget svg path {
  fill: transparent;
  stroke: transparent;
}

.end,
#pathEnd {
  display: none;
}

/* مخفی کردن خط وسط در دسکتاپ */
@media (max-width: 769px) {

  .end,
  #pathEnd {
    display: block;
  }


  /* تنظیم موقعیت مسیرها برای ۲ خط در دسکتاپ */
  .motion-path-widget svg #pathTop {
    d: path('M-100,200 A600,160 0 0 1 1100,200');
  }



  .motion-path-widget svg #pathBottom {
    d: path('M1100,300 A600,160 0 0 0 -100,300');
  }

  .motion-path-widget {
    height: 280px;
    aspect-ratio: 1000 / 300;
  }

  .motion-path-widget .dot {
    width: 42px;
    height: 42px;
  }

  .motion-path-widget .dots.middle {
    display: block !important;
  }

  /* تنظیم موقعیت مسیرها برای ۳ خط در موبایل با فاصله مناسب */
  .motion-path-widget svg #pathTop {
    d: path('M-100,120 A600,120 0 0 1 1100,120');
  }

  .motion-path-widget svg #pathMiddle {
    d: path('M-100,200 A600,120 0 0 1 1100,200');
    display: block;
  }

  .motion-path-widget svg #pathBottom {
    d: path('M1100,280 A600,120 0 0 0 -100,280');
  }
}

.card {
  background: #fff;
  width: 100%;
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .08);
  font-family: "Kalameh", Sans-serif;
}

.amount {
  text-align: center;
  font-size: 36px;
  font-weight: 700;
  margin-bottom: 16px;
}

.amount span {
  background: linear-gradient(100.52deg, #312783 -14.96%, #B80E80 95.55%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

input[type=range] {
  width: 100%;
  accent-color: #7a3df0;
  cursor: pointer;
}

.range-labels {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: #888;
  margin-top: 6px;
}

.section {
  margin-top: 20px;
}

.terms {
  display: flex;
  gap: 10px;
}

.term {
  flex: 1;
  padding: 8px 0;
  border-radius: 10px;
  background: #f3f1fb;
  text-align: center;
  cursor: pointer;
  color: #7F7F80;
  font-weight: 400;
}

.term.active {
  background: #e6ddff;
  color: #7a3df0;
  font-weight: 700;
}

.info {
  background: #F8F8FA;
  border-radius: 12px;
  padding: 30px;
  margin-top: 20px;
  font-size: 16px;
}

.info .row span:first-child {
  color: #7F7F80;
}

.info .row span:last-child {
  color: #232324;
  font-weight: 600;
}

.info .row span span:last-child {
  color: #7F7F80;
  font-size: 16px;
  font-weight: 400;
}

.info .total span {
  color: #5825C5 !important;
}

.row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}

.total {
  color: #7a3df0;
  font-weight: 700;
  background-color: #F2EEFC;
  padding: 1rem;
  min-width: 108%;
  margin: auto;
  right: -19px;
  position: relative;
  padding-right: 20px;

}

.actions {
  display: flex;
  gap: 12px;
  margin-top: 20px;
}

.btn-primary {
  flex: 1;
  background: #5b2ecc;
  color: #fff;
  border: none;
  border-radius: 12px;
  padding: 10px;
  cursor: pointer;
  min-width: 60%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'IRANSansX';
}

.btn-primary svg {
  margin-right: 5px;
}

.btn-outline {
  flex: 1;
  background: #fff;
  color: #5b2ecc;
  border: 2px solid #d9ccff;
  border-radius: 10px;
  padding: 10px;
  cursor: pointer;
  min-width: 30%;
  font-family: 'IRANSansX';
  max-width: 172px;
}

.detail {
  font-weight: 400;
  font-size: 14px;
  color: #7F7F80;
  padding: 1rem;
  padding-bottom: 0;
  text-align: center;
}

.card .section>div {
  font-weight: 700;
  color: #0D0D0D;
  font-size: 14px;
  padding-bottom: 0.5rem;
}

.plus {
  margin-left: auto;
  left: 2rem;
  position: absolute;

}

.minus {
  margin-right: auto;
  right: 2rem;
  position: absolute;
}

.plus,
.minus {
  color: #5825C5;
  font-size: 40px;
  background-color: #F2EEFC;
  border-radius: 8px;
  border: none;
  width: 56px;
  height: 56px;
  line-height: 0;
}

@media (max-width: 769px) {
  .total {
    min-width: 115%;
    right: -17px;
    padding-right: 17px;
  }

  .btn-primary svg {
    display: none;
  }

  .amount {
    font-size: 20px;
    margin-bottom: 16px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .plus,
  .minus {
    width: 48px;
    height: 48px;
    font-size: 48px;
    padding: 0;
  }

  .info {
    font-size: 14px;
  }

  .detail {
    text-align: justify;
    font-size: 12px;
  }

  .btn-outline,
  .btn-primary {
    font-size: 14px;
  }

  .total {
    border-radius: 16px;
  }
}



.header {
  height: 96px;
}

.jet-color-image-list__row.swiper-slide img,
.jet-color-image-list__row.swiper-slide .jet-color-image-list__decorator,
.swiper-slide span.jet-color-image-list__image {
  width: 80px;
  min-width: 80px;
  height: 80px;
  object-fit: contain;
}

.jet-color-image-list__row.swiper-slide .jet-color-im-list__label {
  display: flex;
  align-items: center;
}

.jet-color-image-list__row.swiper-slide .content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;

}
.jet-color-image-list__row.swiper-slide .content span:first-child
{
font-family: "Dana", Sans-serif;
  color:#232324;
  font-weight: 700;
  font-size: 14px;
}
.jet-color-image-list__row.swiper-slide .content span:last-child {
  font-size: 16px;
  font-weight: 400;
  color: #ADADAE;
  white-space: nowrap;
  margin-left: auto;
  margin-top: 10px;
}
.jet-color-image-list__row.swiper-slide.actived{
      box-shadow: 1px 4px 7px;
}
.jet-color-image-list__row.swiper-slide .jet-color-image-list__image{
  border: none !important;
  display: flex;
      align-items: center;
}

@media (max-width: 767px) {
  .header {
    height: 72px;
  }

  .header ul.elementor-nav-menu {
    max-width: fit-content;
    background-color: #DDD;
    float: right;
    min-width: 65vw;
  }

  .header ul.elementor-nav-menu .sub-arrow {
    margin-right: auto;
    position: relative;
    float: left;
    margin-right: auto;

  }

  .header ul.elementor-nav-menu .has-submenu .sub-arrow::after {
    content: '';
    width: 14px;
    height: 14px;
    background-repeat: no-repeat;
    background-size: contain;
    margin: auto;
    right: 0;
    left: 0;
    position: absolute;
  }

  .header ul.elementor-nav-menu .has-submenu .sub-arrow[aria-expanded="false"]::after {

    background-image: url(../hello-theme-child-master/assets/plus.svg);

  }

  .header ul.elementor-nav-menu .has-submenu .sub-arrow[aria-expanded="true"]::after {

    background-image: url(../hello-theme-child-master/assets/plus1.svg);

  }

  .header ul.elementor-nav-menu .sub-arrow svg {
    display: none;

  }

  .jet-color-image-list__row.swiper-slide img {
    width: 57px;
    height: 57px;
  }
  .jet-color-image-list__row.swiper-slide .content span:last-child{
    font-size: 14px;
  }
}