/* 
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 */


/* Container styling */
.cf7-form-container {
  max-width: 600px;
  margin: 0 auto;
  padding: 30px;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
  font-family: 'Arial', sans-serif;
}

/* Form group styling */
.cf7-form-group {
  position: relative;
  margin-bottom: 25px;
}

/* Input and textarea styling */
.cf7-input,
.cf7-textarea {
  width: 100%;
  padding: 14px 12px;
  font-size: 16px;
  border: 1.5px solid #ccc;
  border-radius: 8px;
  outline: none;
  transition: all 0.3s ease;
  background: transparent;
}

/* Textarea adjustments */
.cf7-textarea {
  min-height: 120px;
  resize: vertical;
}

/* Floating label styling */
.cf7-form-group label {
  position: absolute;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
  color: #999;
  font-size: 16px;
  pointer-events: none;
  transition: all 0.3s ease;
  background: #fff;
  padding: 0 5px;
}

/* Focus or filled state */
.cf7-input:focus + label,
.cf7-input:not(:placeholder-shown) + label,
.cf7-textarea:focus + label,
.cf7-textarea:not(:placeholder-shown) + label {
  top: -10px;
  left: 10px;
  font-size: 13px;
  color: #007bff;
}

/* Input focus border */
.cf7-input:focus,
.cf7-textarea:focus {
  border-color: #007bff;
  box-shadow: 0 0 5px rgba(0, 123, 255, 0.3);
}

/* Submit button styling */
.cf7-submit {
  display: inline-block;
  padding: 14px 30px;
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  background-color: #007bff;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.3s ease;
}

/* Submit button hover */
.cf7-submit:hover {
  background-color: #0056b3;
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(0, 123, 255, 0.4);
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .cf7-form-container {
    padding: 20px;
  }
}

.With_us ul {
  list-style: none;
  padding-left: 0;
}

.With_us ul li {
  position: relative;
  padding-left: 36px;
  margin-bottom: 14px;
  line-height: 1.7;
}

.With_us ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  background: url('data:image/svg+xml;utf8,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 2C6.49 2 2 6.49 2 12C2 17.51 6.49 22 12 22C17.51 22 22 17.51 22 12C22 6.49 17.51 2 12 2ZM16.78 9.7L11.11 15.37C10.97 15.51 10.78 15.59 10.58 15.59C10.38 15.59 10.19 15.51 10.05 15.37L7.22 12.54C6.93 12.25 6.93 11.77 7.22 11.48C7.51 11.19 7.99 11.19 8.28 11.48L10.58 13.78L15.72 8.64C16.01 8.35 16.49 8.35 16.78 8.64C17.07 8.93 17.07 9.4 16.78 9.7Z" fill="%234CAF50"/></svg>') no-repeat center center;
  background-size: contain;
}

.With_others ul {
  list-style: none;
  padding-left: 0;
}

.With_others ul li {
  position: relative;
  padding-left: 36px;
  margin-bottom: 14px;
  line-height: 1.7;
}

.With_others ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  background: url('data:image/svg+xml;utf8,<svg width="24" height="24" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg"><circle fill="none" stroke="%23FF5722" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" cx="24" cy="24" r="23"/><line fill="none" stroke="%23FF5722" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" y1="12" x2="36" y2="36"/><line fill="none" stroke="%23FF5722" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" x1="12" y1="36" x2="36" y2="12"/></svg>') no-repeat center center;
  background-size: contain;
}