/* 
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: Elementor Team
Author URI: https://elementor.com/
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 */
:root{
  --gf-bg: #14161c;
  --gf-card-bg: #20242C;
  --gf-choice-bg: #262B34;
  --gf-choice-bg-hover: #2C323C;
  --gf-choice-border: #3A3F47;
  --gf-choice-border-active: #25D4B0;
  --gf-text: #FFFFFF;
  --gf-text-muted: #9CA1AA;
  --gf-accent: #25D4B0;
  --gf-accent-text: #0E241F;
  --gf-track: #3A3F47;
  --gf-radius-card: 20px;
  --gf-radius-choice: 14px;
  --gf-radius-input: 12px;
}

/* override Orbital's own scoped theme-color variables (high specificity, needs !important) */
.gform_wrapper.gform-theme{
  --gf-color-primary: var(--gf-accent) !important;
  --gf-color-primary-contrast: var(--gf-accent-text) !important;
  --gf-color-in-ctrl-primary: var(--gf-accent) !important;
  --gf-color-in-ctrl-primary-contrast: var(--gf-accent-text) !important;
}

.gform_wrapper{
  direction: rtl;
  text-align: right;
  max-width: 760px;
  margin: 0 auto;
  background: var(--gf-card-bg);
  border-radius: var(--gf-radius-card);
  padding: 48px 44px;
  box-shadow: 0 22px 48px -18px rgba(0,0,0,.55);
  font-family: 'Vazirmatn FaNum', Tahoma, sans-serif;
}

@media (max-width: 600px){
  .gform_wrapper{
    padding: 28px 20px;
    border-radius: 18px;
  }
}

/* form title — Orbital always renders this; shown here as a small muted eyebrow line.
   To hide it completely instead (to match the mockup exactly), replace this rule with:
   .gform_wrapper .gform_heading{ display: none; } */
.gform_wrapper .gform_heading .gform_title{
  color: var(--gf-text-muted);
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 4px;
}
.gform_wrapper .gform_heading .gform_description{
  color: var(--gf-text-muted);
  font-size: 14px;
}

.gform_wrapper .gf_progressbar_wrapper{
  margin-bottom: 32px;
}
.gform_wrapper .gf_progressbar_title{
  color: var(--gf-text-muted);
  font-size: 14px;
  margin-bottom: 10px;
}
.gform_wrapper .gf_progressbar{
  background: var(--gf-track) !important;
  height: 6px;
  border-radius: 999px;
  overflow: hidden;
}
.gform_wrapper .gf_progressbar_percentage{
  background: var(--gf-accent) !important;
  height: 100%;
  border-radius: 999px;
}
.gform_wrapper .gf_progressbar_percentage span{
  display: none;
}

.gform_wrapper .gfield_label,
.gform_wrapper legend.gfield_label{
  color: var(--gf-text);
  font-size: 26px;
  font-weight: 700;
  line-height: 1.6;
  margin-bottom: 24px;
}

.gform_wrapper .gfield_radio,
.gform_wrapper .gfield_checkbox{
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.gform_wrapper .gchoice{
  background: var(--gf-choice-bg);
  border: 1px solid var(--gf-choice-border);
  border-radius: var(--gf-radius-choice);
  padding: 18px 22px;
  display: flex;
  align-items: center;
  gap: 16px;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease;
}
.gform_wrapper .gchoice:hover{
  background: var(--gf-choice-bg-hover);
}
.gform_wrapper .gchoice input[type="radio"],
.gform_wrapper .gchoice input[type="checkbox"]{
  width: 22px;
  height: 22px;
  accent-color: var(--gf-accent);
  order: 2;
  margin: 0;
  flex-shrink: 0;
}
.gform_wrapper .gchoice label{
  color: var(--gf-text);
  font-size: 16px;
  font-weight: 600;
  order: 1;
  flex: 1;
  cursor: pointer;
}
.gform_wrapper .gchoice:has(input:checked){
  border-color: var(--gf-choice-border-active);
  background: rgba(37,212,176,.08);
}

.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="number"],
.gform_wrapper textarea,
.gform_wrapper select{
  background: var(--gf-choice-bg);
  border: 1px solid var(--gf-choice-border);
  border-radius: var(--gf-radius-input);
  color: var(--gf-text);
  padding: 16px 18px;
  font-size: 15px;
  width: 100%;
  box-sizing: border-box;
}
.gform_wrapper input::placeholder,
.gform_wrapper textarea::placeholder{
  color: var(--gf-text-muted);
}
.gform_wrapper input:focus,
.gform_wrapper textarea:focus,
.gform_wrapper select:focus{
  outline: none;
  border-color: var(--gf-accent);
}
.gform_wrapper .gfield label{
  color: var(--gf-text);
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 8px;
  display: block;
}

.gform_wrapper .gfield_description{
  color: var(--gf-text-muted);
  font-size: 14px;
  line-height: 1.8;
  margin-top: 6px;
}

.gform_wrapper .gform_button,
.gform_wrapper .gform_next_button{
  background: var(--gf-accent) !important;
  color: var(--gf-accent-text) !important;
  border: none !important;
  border-radius: var(--gf-radius-input);
  padding: 14px 28px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: opacity .2s ease;
}
.gform_wrapper .gform_button:hover,
.gform_wrapper .gform_next_button:hover{
  opacity: .88;
}
.gform_wrapper .gform_previous_button{
  background: transparent !important;
  color: var(--gf-text-muted) !important;
  border: 1px solid var(--gf-choice-border) !important;
  border-radius: var(--gf-radius-input);
  padding: 14px 28px;
  font-size: 14px;
  cursor: pointer;
}
.gform_wrapper .gform_page_footer{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 20px;
  margin-top: 32px;
}

.gform_wrapper .gfield_validation_message{
  color: #f87171;
  font-size: 13px;
  margin-top: 8px;
}
.gform_wrapper .gform_validation_error .gfield_error input,
.gform_wrapper .gform_validation_error .gfield_error textarea{
  border-color: #f87171 !important;
}