/* ==========================================================================
   Contact Form 7 Custom Styles - Matching HTML Version
   ========================================================================== */

/* Universal selectors - максимальна специфічність */
.contact-form-container input[type="text"],
.contact-form-container input[type="email"],
.contact-form-container input[type="tel"],
.contact-form-container input[type="url"],
.contact-form-container input[type="number"],
.contact-form-container select,
.contact-form-container textarea,
.contact-form-container .wpcf7 input[type="text"],
.contact-form-container .wpcf7 input[type="email"],
.contact-form-container .wpcf7 input[type="tel"],
.contact-form-container .wpcf7 input[type="url"],
.contact-form-container .wpcf7 select,
.contact-form-container .wpcf7 textarea,
.contact-form-container .wpcf7-form input[type="text"],
.contact-form-container .wpcf7-form input[type="email"],
.contact-form-container .wpcf7-form input[type="tel"],
.contact-form-container .wpcf7-form input[type="url"],
.contact-form-container .wpcf7-form select,
.contact-form-container .wpcf7-form textarea,
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 select,
.wpcf7 textarea,
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="url"],
.wpcf7-form select,
.wpcf7-form textarea {
  width: 100% !important;
  padding: 12px 16px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  font-size: 1rem !important;
  font-family: inherit !important;
  transition: border-color 0.2s ease !important;
  background: white !important;
  color: #0f172a !important;
  box-sizing: border-box !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  margin: 0 !important;
}

/* Focus states */
.contact-form-container input[type="text"]:focus,
.contact-form-container input[type="email"]:focus,
.contact-form-container input[type="tel"]:focus,
.contact-form-container input[type="url"]:focus,
.contact-form-container select:focus,
.contact-form-container textarea:focus,
.contact-form-container .wpcf7 input[type="text"]:focus,
.contact-form-container .wpcf7 input[type="email"]:focus,
.contact-form-container .wpcf7 input[type="tel"]:focus,
.contact-form-container .wpcf7 select:focus,
.contact-form-container .wpcf7 textarea:focus,
.contact-form-container .wpcf7-form input[type="text"]:focus,
.contact-form-container .wpcf7-form input[type="email"]:focus,
.contact-form-container .wpcf7-form input[type="tel"]:focus,
.contact-form-container .wpcf7-form select:focus,
.contact-form-container .wpcf7-form textarea:focus,
.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus,
.wpcf7-form input[type="text"]:focus,
.wpcf7-form input[type="email"]:focus,
.wpcf7-form input[type="tel"]:focus,
.wpcf7-form select:focus,
.wpcf7-form textarea:focus {
  outline: none !important;
  border-color: #5b63ff !important;
  box-shadow: 0 0 0 3px rgba(91, 99, 255, 0.1) !important;
}

/* Textarea specific */
.contact-form-container textarea,
.contact-form-container .wpcf7 textarea,
.contact-form-container .wpcf7-form textarea,
.wpcf7 textarea,
.wpcf7-form textarea {
  resize: vertical !important;
  min-height: 200px !important;
  line-height: 1.6 !important;
}

/* Select dropdown */
.contact-form-container select,
.contact-form-container .wpcf7 select,
.contact-form-container .wpcf7-form select,
.wpcf7 select,
.wpcf7-form select {
  cursor: pointer !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23333' d='M6 9L1 4h10z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 12px !important;
  padding-right: 40px !important;
}

/* Submit button */
.contact-form-container input[type="submit"],
.contact-form-container .wpcf7 input[type="submit"],
.contact-form-container .wpcf7-form input[type="submit"],
.contact-form-container .wpcf7-submit,
.contact-form-container .wpcf7-form .wpcf7-submit,
.wpcf7 input[type="submit"],
.wpcf7-form input[type="submit"],
.wpcf7 .wpcf7-submit,
.wpcf7-form .wpcf7-submit {
  width: 100% !important;
  padding: 14px !important;
  background: #5b63ff !important;
  color: white !important;
  border: none !important;
  border-radius: 12px !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  text-transform: none !important;
  font-family: inherit !important;
  box-shadow: none !important;
}

.contact-form-container input[type="submit"]:hover,
.contact-form-container .wpcf7 input[type="submit"]:hover,
.contact-form-container .wpcf7-form input[type="submit"]:hover,
.contact-form-container .wpcf7-submit:hover,
.contact-form-container .wpcf7-form .wpcf7-submit:hover,
.wpcf7 input[type="submit"]:hover,
.wpcf7-form input[type="submit"]:hover,
.wpcf7 .wpcf7-submit:hover,
.wpcf7-form .wpcf7-submit:hover {
  background: #4338ca !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(91, 99, 255, 0.3) !important;
}

/* Labels */
.contact-form-container label,
.contact-form-container .wpcf7 label,
.contact-form-container .wpcf7-form label,
.wpcf7 label,
.wpcf7-form label {
  display: block !important;
  font-weight: 500 !important;
  margin-bottom: 8px !important;
  color: #0f172a !important;
  font-size: 1rem !important;
}

/* Form structure */
.contact-form-container .wpcf7-form,
.contact-form-container .wpcf7 {
  margin: 0 !important;
  padding: 0 !important;
}

.contact-form-container .wpcf7-form p,
.contact-form-container .wpcf7 p {
  margin-bottom: 20px !important;
}

.contact-form-container .wpcf7-form p:last-child,
.contact-form-container .wpcf7 p:last-child {
  margin-bottom: 0 !important;
}

/* Two-column layout for desktop */
@media (min-width: 769px) {
  .contact-form-container .wpcf7-form {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 20px !important;
  }
  
  /* First row: Name (1st) and Email (2nd) */
  .contact-form-container .wpcf7-form p:nth-of-type(1),
  .contact-form-container .wpcf7-form p:nth-of-type(2) {
    display: block !important;
    width: 100% !important;
    margin-right: 0 !important;
  }
  
  /* Second row: Phone (3rd) and Subject (4th) */
  .contact-form-container .wpcf7-form p:nth-of-type(3),
  .contact-form-container .wpcf7-form p:nth-of-type(4) {
    display: block !important;
    width: 100% !important;
    margin-right: 0 !important;
  }
  
  /* Message textarea - full width (5th or later) */
  .contact-form-container .wpcf7-form p:nth-of-type(5),
  .contact-form-container .wpcf7-form p:has(textarea) {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }
  
  /* Submit button - full width (last or has submit) */
  .contact-form-container .wpcf7-form p:has(input[type="submit"]),
  .contact-form-container .wpcf7-form p:has(.wpcf7-submit),
  .contact-form-container .wpcf7-form p:last-child:has(input[type="submit"]),
  .contact-form-container .wpcf7-form p:last-child:has(.wpcf7-submit) {
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }
}