/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Description: Astra Child Theme
Author: Brainstorm Force
Author URI: https://wpastra.com/about/
Template: astra
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: custom-menu, custom-logo, entertainment, one-column, two-columns, left-sidebar, e-commerce, right-sidebar, custom-colors, editor-style, featured-images, full-width-template, microformats, post-formats, rtl-language-support, theme-options, threaded-comments, translation-ready, blog
Text Domain: astra-child
*/

/* -------------------------------
   Contact Form 7 Dark Theme
   ------------------------------- */

/* Main CF7 Container */
.wpcf7 {
  max-width: 750px !important;
  margin: 2rem auto !important;
  background-color: #111111 !important;
  padding: 60px 50px !important;
  border-radius: 12px !important;
  box-shadow: 0 0 0 40px #000000 !important;
  position: relative !important;
}

/* Extended dark background */
.wpcf7::before {
  content: '' !important;
  position: absolute !important;
  top: -40px !important;
  left: -40px !important;
  right: -40px !important;
  bottom: -40px !important;
  background-color: #000000 !important;
  border-radius: 20px !important;
  z-index: -1 !important;
  border: none !important;
}

/* Fix for white rectangle caused by hidden fields container */
.wpcf7 .hidden-fields-container {
    display: none !important;
}



/* Title */
.wpcf7 .form-title {
  color: #f1f1f1 !important;
  font-size: 28px !important;
  font-weight: 600 !important;
  text-align: center !important;
  margin-bottom: 35px !important;
}

/* Form rows */
.wpcf7 .form-row {
  margin-bottom: 25px !important;
}

/* Grid layout */
.wpcf7 .form-grid-2 {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 20px !important;
}

/* Labels */
.wpcf7 label {
  display: block !important;
  color: #aeaeae !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  margin-bottom: 8px !important;
}

/* Inputs, selects, textarea */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="date"],
.wpcf7 select,
.wpcf7 textarea {
  width: 100% !important;
  background-color: #222222 !important;
  border: 1px solid #444444 !important;
  color: #ffffff !important;
  padding: 14px 16px !important;
  border-radius: 8px !important;
  font-size: 16px !important;
  transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
  box-sizing: border-box !important;
}

/* Date picker */
.wpcf7 input[type="date"] {
  color-scheme: dark !important;
}

/* Select dropdown */
.wpcf7 select {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"><path fill="%23aeaeae" d="M0 0 L6 6 L12 0 Z"/></svg>') !important;
  background-repeat: no-repeat !important;
  background-position: right 16px center !important;
  background-size: 12px !important;
}

/* Focus states */
.wpcf7 input:focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus {
  outline: none !important;
  border-color: #cccccc !important;
  box-shadow: 0 0 0 3px rgba(200, 200, 200, 0.15) !important;
}

/* Placeholder */
.wpcf7 input::placeholder,
.wpcf7 textarea::placeholder {
  color: #777777 !important;
  opacity: 1 !important;
}

/* Submit button */
.wpcf7 input[type="submit"] {
  display: block !important;
  width: 100% !important;
  padding: 16px !important;
  border: none !important;
  border-radius: 8px !important;
  background-color: #ffffff !important;
  color: #000000 !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  cursor: pointer !important;
  margin-top: 20px !important;
  transition: all 0.3s ease !important;
}

.wpcf7 input[type="submit"]:hover {
  background-color: #cccccc !important;
  transform: scale(1.01) !important;
}

/* Response messages */
.wpcf7 .wpcf7-response-output {
  margin: 20px 0 !important;
  padding: 15px !important;
  border-radius: 8px !important;
  color: #fff !important;
}

.wpcf7 .wpcf7-mail-sent-ok {
  background-color: #2d5016 !important;
  border: 1px solid #4caf50 !important;
}

.wpcf7 .wpcf7-validation-errors {
  background-color: #5d1a1a !important;
  border: 1px solid #f44336 !important;
}

/* -------------------------------
   Responsive Adjustments
   ------------------------------- */
@media (max-width: 640px) {
  .wpcf7 .form-grid-2 {
    grid-template-columns: 1fr !important;
  }
  .wpcf7 {
    padding: 40px 25px !important;
  }
  .wpcf7 .form-title {
    font-size: 24px !important;
  }
  .wpcf7::before {
    top: -20px !important;
    left: -20px !important;
    right: -20px !important;
    bottom: -20px !important;
  }
}

/* -------------------------------
   miniOrange OTP Button
   ------------------------------- */
.wpcf7-form-container input[id^="miniorange_otp_token_submit_"],
input[id^="miniorange_otp_token_submit_"].button,
input[id^="miniorange_otp_token_submit_"].button.alt {
  width: auto !important;
  display: inline-block !important;
  padding: 8px 14px !important;
  background: #ffffff !important;
  color: #000000 !important;
  border: 1px solid #dddddd !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  line-height: 1 !important;
  text-align: center !important;
  cursor: pointer !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06) !important;
  transition: transform 0.12s ease, box-shadow 0.12s ease !important;
}

.wpcf7-form-container input[id^="miniorange_otp_token_submit_"]:hover,
input[id^="miniorange_otp_token_submit_"].button:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08) !important;
}

/* Full width on small screens */
@media (max-width: 640px) {
  .wpcf7-form-container input[id^="miniorange_otp_token_submit_"],
  input[id^="miniorange_otp_token_submit_"].button {
    width: 100% !important;
    display: block !important;
  }
}

/* miniOrange message box */
#mo_message {
  display: none;
  background-color: rgba(255, 255, 255, 0.95);
  color: #111;
  padding: 12px 14px;
  border-radius: 8px;
  margin-top: 8px;
  border: 1px solid #ececec;
  font-size: 14px;
}

/* OTP button spacing */
.otp-button-section {
  margin-bottom: 70px !important;
}

/* Verification input */
.verification-input {
  max-width: 100px !important;
  width: 100px !important;
  text-align: center !important;
  font-size: 16px !important;
  letter-spacing: 1px !important;
}

/* Labels & fields spacing */
.form-row label {
  margin-bottom: 3px !important;
  display: block !important;
}

.form-row input[type="text"],
.form-row input[type="email"],
.form-row input[type="tel"],
.form-row input[type="date"],
.form-row select,
.form-row textarea {
  margin-top: 3px !important;
}

.form-row {
  margin-bottom: 15px !important;
}

/* -------------------------------
   Verification Page Full Width
   ------------------------------- */
.ast-container,
.site-content .ast-container,
.entry-content {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.astra-appraisal-verify {
  width: 100vw !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
}
