.elementor-21857 .elementor-element.elementor-element-ebc3ce3{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-21857 .elementor-element.elementor-element-401970b{--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:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:41px;--padding-bottom:41px;--padding-left:41px;--padding-right:41px;}.elementor-21857 .elementor-element.elementor-element-401970b.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-21857 .elementor-element.elementor-element-b95b32d > .elementor-widget-container{margin:30px 0px 16px 0px;padding:20px 20px 20px 20px;}.elementor-21857 .elementor-element.elementor-element-24994b1{--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:-40px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-21857 .elementor-element.elementor-element-c77eb40 > .elementor-widget-container{margin:23px 0px 6px 0px;}.elementor-21857 .elementor-element.elementor-element-419366e > .elementor-widget-container{margin:23px 0px 35px 0px;}.elementor-21857 .elementor-element.elementor-element-419366e{text-align:center;}.elementor-21857 .elementor-element.elementor-element-419366e .elementor-heading-title{font-family:"Vazirmatn", Sans-serif;font-size:30px;color:#224D49;}.elementor-21857 .elementor-element.elementor-element-f66ddca > .elementor-widget-container{margin:0px 0px 0px 0px;padding:52px 52px 52px 52px;}@media(min-width:769px){.elementor-21857 .elementor-element.elementor-element-401970b{--width:49.658%;}.elementor-21857 .elementor-element.elementor-element-24994b1{--width:50%;}}@media(max-width:768px){.elementor-21857 .elementor-element.elementor-element-ebc3ce3{--margin-top:0px;--margin-bottom:0px;--margin-left:39px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:70px;--padding-right:21px;}.elementor-21857 .elementor-element.elementor-element-401970b{--width:292px;--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-21857 .elementor-element.elementor-element-b95b32d{width:100%;max-width:100%;}.elementor-21857 .elementor-element.elementor-element-b95b32d > .elementor-widget-container{margin:-85px -46px -87px -71px;padding:60px 50px 0px 10px;}.elementor-21857 .elementor-element.elementor-element-24994b1{--margin-top:74px;--margin-bottom:0px;--margin-left:0px;--margin-right:32px;}.elementor-21857 .elementor-element.elementor-element-419366e > .elementor-widget-container{margin:6px 0px 0px 0px;}.elementor-21857 .elementor-element.elementor-element-419366e .elementor-heading-title{font-size:34px;line-height:1.5em;}}/* Start custom CSS for html, class: .elementor-element-b95b32d *//* استایل کلی فرم */
form {
  width: 500px !important;
  margin: 30px auto!important;
  padding: 20px 30px !important ;
  background-color: #f9f9f9;
  border-radius: 12px;
  border: 1px solid #ddd;
  color: #4a4a4a;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  direction: rtl; /* راست چین کردن کل فرم */
}

/* استایل برچسب‌ها */
label {
  font-size: 14px;
  color: #283E3C;
  margin-bottom: 8px;
  display: block;
  text-align: right; /* راست چین کردن متن برچسب‌ها */
}

/* استایل فیلدهای ورودی و انتخاب */
input, select {
  width: 100%;
  padding: 10px;
  margin-bottom: 20px;
  border: 1px solid #ccc;
  border-radius: 8px;
  font-size: 14px;
  background-color: #fefefe;
  box-sizing: border-box;
  text-align: right; /* راست چین کردن متن داخل فیلدها */
}

/* استایل متن placeholder */
input::placeholder {
  color:#283E3C;
  font-style: italic;
  text-align: right; /* راست چین کردن placeholder */
}

button {
  background-color: #224D49 !important;
  color: #ffffff !important;
  border: none !important;
}

/* استایل دکمه */
button {
  display: block !important ;
  width: 100% !important;
  padding: 20px 0 !important;
  font-size: 20px !important;
  font-weight: bold !important;
  color: #224D49;
  background-color: #B38936;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

button:hover {
  background-color: #B38936 !important;
}

/* استایل تیتر نتیجه */
h3 {
  font-size: 18px;
  color: #283E3C;
  margin-top: 20px;
  margin-bottom: 10px;
  text-align: center;
}

/* استایل نتیجه‌ها */
p {
  font-size: 14px;
  color: #666;
  line-height: 1.6;
  text-align: center;
}

/* استایل حاشیه بین فیلدها */
input, select {
  border: 1px solid #283E3C;
}

/* مخفی کردن ادمین بار */
#wpadminbar {
  display: none !important;
}

/* استایل برای ایجاد فاصله 20 پیکسل */
form label, form input, form button {
  margin-bottom: 20px;
} 

/* استایل کلی برای فرم */
form {
  background-color: #f9f9f9;
  padding: 20px;
  border: 1px solid #ddd;
  border-radius: 5px;
  margin-bottom: 20px;
}



@media (max-width: 600px) {
  form {
    width: 97% !important;
    padding: 10px !important;
  }

  input, select, button {
    font-size: 14px !important;
    text-align: right; /* راست چین کردن متن در فیلدها */
  }

  /* چیدمان گزینه‌های رادیویی در موبایل */
  .radio-group {
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
    /* راست چین شدن در موبایل */
  }



  .radio-group input[type="radio"] {
    margin-right: 5px;
  }

  /* دکمه محاسبه در موبایل */
  button {
    margin-top: 15px;
    padding: 15px;
  }
}
.radio-group label {
  display: flex;
  align-items: margin-right;
  justify-content: flex-end; /* راست‌چین کردن متن و رادیو */
  background-color: #ffffff;
  padding: 10px 20px;
  border: 1px solid #ddd;
  border-radius: 10px;
  white-space: nowrap;
  width: 28%; /* عرض را 100% قرار بده */
  text-align: left ;
  direction: rtl;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f66ddca *//* From Uiverse.io by KhaledMatalkah */ 
.cube-container {
  width: 200px;
  height: 200px;
  perspective: 800px;
  margin: 50px auto;
}

.cube {
  position: relative;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  animation: rotate 8s infinite linear;
}

.face {
  position: absolute;
  width: 200px;
  height: 200px;
  color: rgb(1, 21, 21);
  font-size: 18px;
  text-align: center;
  line-height: 200px;
  background: transparent;
  opacity: 0.9;
  border: 2px solid;
  border-image: linear-gradient(to right, #B38936, #B38936, #B38936, #B38936, #B38936) 1;
 
}

.front {
  transform: translateZ(100px);
}

.back {
  transform: rotateY(180deg) translateZ(100px);
}

.right {
  transform: rotateY(90deg) translateZ(100px);
}

.left {
  transform: rotateY(-90deg) translateZ(100px);
}

.top {
  transform: rotateX(90deg) translateZ(100px);
}

.bottom {
  transform: rotateX(-90deg) translateZ(100px);
}

.cube-container:hover .cube {
  animation-play-state: paused;
}

@keyframes rotate {
  0% {
    transform: rotateX(0) rotateY(0) rotateZ(0);
  }

  100% {
    transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg);
  }
}/* End custom CSS */