/*
Theme Name: Solarva Child
Theme URI: http://demo.casethemes.net/solarva
Author: Case-Themes
Author URI: https://casethemes.net/
Description: Solarva is a stunning, professional and flexible Ecology, Solar Energy, and Renewable Energy WordPress theme. Solarva based on in-depth research into Solar power, Wind power, Hydro power, Geothermal energy, Biomass, Biofuels, etc. Solarva is the new outstanding, extremely modern WordPress Theme, designed for energy efficiency company, solar and alternative energy and eco friendly technologies websites.
Version: 1.0.0
Tested up to: 6.0
Requires PHP: 7.4
License: ThemeForest
License URI: https://themeforest.net/licenses
Template: solarva
Text Domain: solarva-child
Tags: eco, ecology, electricity, energy, energy business, environment, environmental, green energy, natural, nature, nature theme, renewable energy, solar, wind
Copyright (c) 2024 Case-Themes. All rights reserved.
This theme is licensed under the GPL-2.0+ license.
*/
/* --- Solar Consultation Form Styles --- */

/* Main container for the form */
.solar-consultation-form {
    background-color: #fff;
    padding: 30px;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    max-width: 450px;
    margin: auto;
    font-family: sans-serif;
}

.solar-consultation-form h3 {
    text-align: center;
    font-size: 24px;
    margin-top: 0;
    margin-bottom: 8px;
    color: #111;
}

.solar-consultation-form > p {
    text-align: center;
    margin-top: 0;
    margin-bottom: 24px;
    color: #555;
}

/* General style for form groups */
.solar-consultation-form .form-group {
    margin-bottom: 20px;
}

/* Style for input fields */
.solar-consultation-form .form-field {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-sizing: border-box; /* Important */
}

.solar-consultation-form .form-field:focus {
    outline: none;
    border-color: #0073e6;
}

.solar-consultation-form label {
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
    color: #333;
    font-size: 14px;
}

.solar-consultation-form .required-asterisk {
    color: red;
}

/* --- Radio Buttons Styled as Buttons (FIXED) --- */

/* Hide the actual radio button circle */
.solar-consultation-form input[type="radio"] {
    display: none;
}

/* Span that CF7 creates around each radio/label */
.solar-consultation-form .wpcf7-list-item {
    margin: 0 5px 5px 0;
}

/* Style the label to look like a button */
.solar-consultation-form .wpcf7-list-item-label {
    display: inline-block;
    padding: 10px 18px;
    border: 1px solid #ccc;
    border-radius: 30px;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 14px;
    font-weight: 500; /* ADD THIS LINE */
    box-sizing: border-box; /* ADD THIS for extra stability */
}

/* Style for the selected radio button's label */
.solar-consultation-form input[type="radio"]:checked + .wpcf7-list-item-label {
    background-color: #eef2ff;
    border-color: #6366f1;
    color: #4338ca;
    /* font-weight: 500; */ /* This is now in the base style above */
}

/* Styles for smaller buttons */
.button-group-small .wpcf7-list-item-label {
    padding: 8px 14px;
    font-size: 13px;
}


/* --- Acceptance Checkbox --- */
.acceptance-group .wpcf7-list-item-label {
    font-size: 14px;
    color: #555;
}
.acceptance-group a {
    color: #4338ca;
    text-decoration: none;
}
.acceptance-group a:hover {
    text-decoration: underline;
}


/* --- Submit Button --- */
.solar-consultation-form .btn-submit {
    width: 100%;
    padding: 14px 20px;
    background: linear-gradient(to right, #4338ca, #1e1b4b);
    color: white !important; /* UPDATED: Added !important to force white color */
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    transition: opacity 0.3s ease;
}

.solar-consultation-form .btn-submit:hover {
    opacity: 0.9;
}



/* Career Form Css */
.career-form-wrapper {
  max-width: 500px;
  margin: 30px auto;
  padding: 25px;
  background: #ffffff;
  border-radius: 15px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.1);
  font-family: "Poppins", sans-serif;
}

.career-form-title {
  font-size: 22px;
  font-weight: 600;
  margin-bottom: 20px;
  text-align: center;
  color: #2c3e50;
}

.wpcf7-form label {
  display: block;
  margin-bottom: 8px;
  font-weight: 500;
  color: #333;
}

.wpcf7-form input,
.wpcf7-form textarea,
.wpcf7-form select {
  width: 100%;
  padding: 12px;
  margin-bottom: 18px;
  border: 1px solid #ddd;
  border-radius: 10px;
  font-size: 15px;
  transition: border 0.3s ease, box-shadow 0.3s ease;
}

.wpcf7-form input:focus,
.wpcf7-form textarea:focus,
.wpcf7-form select:focus {
  border-color: #3498db;
  box-shadow: 0 0 6px rgba(52, 152, 219, 0.3);
  outline: none;
}

.wpcf7-submit {
  background: #3498db;
  color: #fff;
  padding: 14px;
  border: none;
  border-radius: 10px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.3s ease;
  width: 100%;
}

.wpcf7-submit:hover {
  background: #217dbb;
}

/* Refer Form */
/* Card container */
.cf7-card {
  background: #fff;
  border-radius: 16px;
  padding: 28px;
  box-shadow: 0 10px 24px rgba(0,0,0,0.08);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
  max-width: 900px;
  margin: 0 auto;
}
.cf7-card:hover {
  box-shadow: 0 16px 36px rgba(0,0,0,0.12);
  transform: translateY(-2px);
}
.cf7-card h3 {
  margin: 0 0 18px 0;
  font-size: 1.25rem;
  line-height: 1.3;
}

/* Responsive grid: multi-input per row on larger screens */
.form-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}
.field.full {
  grid-column: 1 / -1;
}

/* Labels and inputs */
.field label {
  display: block;
  font-weight: 500;
  color: #1f2937;
  margin-bottom: 6px;
}
.wpcf7 .form-input,
.wpcf7 input[type="text"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="email"],
.wpcf7 textarea,
.wpcf7 select {
  width: 100%;
  appearance: none;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 16px;
  line-height: 1.4;
  color: #111827;
  background: #fff;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.wpcf7 .form-input::placeholder {
  color: #9ca3af;
}
.wpcf7 .form-input:focus,
.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 textarea:focus,
.wpcf7 select:focus {
  outline: none;
  border-color: #5fbf5b;
  box-shadow: 0 0 0 3px rgba(50, 131, 39, 0.15);
}

/* Acceptance: keep checkbox and text aligned on one line */
.acceptances {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.wpcf7-acceptance .wpcf7-list-item {
  display: flex;
  align-items: center;
  margin: 0;
}
.wpcf7-acceptance .wpcf7-list-item label {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 400;
  color: #374151;
}
.wpcf7-acceptance input[type="checkbox"] {
  accent-color: #328327; /* modern browsers */
}

/* Submit button with #328327 gradient */
.wpcf7 .btn-submit {
  display: inline-block;
  width: 100%;
  border: 0;
  cursor: pointer;
  border-radius: 12px;
  padding: 14px 18px;
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  background: linear-gradient(135deg, #328327 0%, #2a6b22 100%);
  box-shadow: 0 8px 18px rgba(50, 131, 39, 0.25);
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
}
.wpcf7 .btn-submit:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(50, 131, 39, 0.32);
  filter: brightness(1.02);
}
.wpcf7 .btn-submit:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px rgba(50,131,39,0.28);
}

/* CF7 response messages tweak (optional) */
.wpcf7 form .wpcf7-response-output {
  border-radius: 10px;
  margin: 18px 0 0;
}

/* refer form end */