/*
Theme Name: the7dtchild
Author: Dream-Theme
Author URI: http://dream-theme.com/
Description: The7 is perfectly scalable, performance and SEO optimized, responsive, retina ready multipurpose WordPress theme. It will fit every site – big or small. From huge corporate portals to studio or personal sites – The7 will become a great foundation for your next project!
Version: 1.0.0
License: This WordPress theme is comprised of two parts: (1) The PHP code and integrated HTML are licensed under the GPL license as is WordPress itself.  You will find a copy of the license text in the same directory as this text file. Or you can read it here: http://wordpress.org/about/gpl/ (2) All other parts of the theme including, but not limited to the CSS code, images, and design are licensed according to the license purchased. Read about licensing details here: http://themeforest.net/licenses/regular_extended
Template: dt-the7
*/

/* =============================================
   ASHA Corporate Contact Form (CF7)
   ============================================= */

/* Grid wrapper */
.asha-form-grid {
    width: 100%;
    font-family: "Aktiv Grotesk Ex", "Manrope", sans-serif;
}

/* Each 3-column row */
.asha-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 32px 40px;
    margin-bottom: 32px;
    align-items: end;
}

/* Individual field wrapper */
.asha-form-field {
    display: flex;
    flex-direction: column;
}

/* Labels */
.asha-form-field > label {
    font-size: 16px;
    font-weight: 400;
    color: #333333;
    margin-bottom: 6px;
    letter-spacing: 0.01em;
}

/* Text / email / tel inputs */
.asha-form-grid .wpcf7-form-control.wpcf7-text,
.asha-form-grid .wpcf7-form-control.wpcf7-email,
.asha-form-grid .wpcf7-form-control.wpcf7-tel {
    width: 100%;
    border: none !important;
    border-bottom: 1.5px solid #333333 !important;
    border-radius: 0 !important;
    background: transparent !important;
    padding: 6px 0;
    font-size: 15px;
    color: #333333;
    font-family: inherit;
    outline: none;
    box-shadow: none !important;
    transition: border-color 0.2s;
}

.asha-form-grid .wpcf7-form-control.wpcf7-text:focus,
.asha-form-grid .wpcf7-form-control.wpcf7-email:focus,
.asha-form-grid .wpcf7-form-control.wpcf7-tel:focus {
    border-bottom-color: #7D8C68 !important;
    outline: none !important;
}

/* Placeholders */
.asha-form-grid .wpcf7-form-control::placeholder {
    color: #aaaaaa;
    font-size: 15px;
}

/* Select / dropdown fields */
.asha-form-grid .wpcf7-form-control.wpcf7-select {
    width: 100%;
    border: none;
    border-bottom: 1.5px solid #333333;
    border-radius: 0;
    background: transparent;
    padding: 6px 24px 6px 0;
    font-size: 15px;
    color: #aaaaaa;
    font-family: inherit;
    outline: none;
    box-shadow: none;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%23333' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 4px center;
    transition: border-color 0.2s;
}

.asha-form-grid .wpcf7-form-control.wpcf7-select:focus {
    border-bottom-color: #7D8C68;
}

.asha-form-grid .wpcf7-form-control.wpcf7-select option:not(:first-child) {
    color: #333333;
}

/* Last-name field has no label — align input to bottom like labelled fields */
.asha-no-label {
    justify-content: flex-end;
}

/* Submit field — vertically aligned to bottom */
.asha-submit-field {
    justify-content: flex-end;
}

.asha-form-grid .wpcf7-submit {
    width: 100%;
    background-color: #7D8C68;
    color: #ffffff;
    border: none;
    border-radius: 0;
    padding: 14px 20px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-family: inherit;
    cursor: pointer;
    transition: background-color 0.2s;
}

.asha-form-grid .wpcf7-submit:hover {
    background-color: #6a7a57;
}

/* Validation error messages */
.asha-form-grid .wpcf7-not-valid-tip {
    font-size: 12px;
    color: #cc0000;
    margin-top: 4px;
}

.asha-form-grid .wpcf7-response-output {
    margin-top: 16px;
    padding: 10px 14px;
    font-size: 14px;
    border-radius: 2px;
}

/* Retreat form — 2-column row (Country | Enquiry) */
.asha-retreat-form .asha-row-2col {
    grid-template-columns: 1fr 2fr;
}

/* Enquiry field spans wider naturally via the 2fr column */
.asha-retreat-form .asha-enquiry-field .wpcf7-form-control {
    width: 100%;
}

/* Submit row — single left-aligned column */
.asha-retreat-form .asha-row-submit {
    grid-template-columns: auto 1fr 1fr;
}

.asha-retreat-form .asha-row-submit .asha-submit-field {
    justify-content: flex-start;
}

.asha-retreat-form .wpcf7-submit {
    width: auto;
    min-width: 120px;
    padding: 12px 40px;
}

/* ---- Responsive ---- */

/* Tablet: 2 columns */
@media (max-width: 1024px) {
    .asha-form-row {
        grid-template-columns: 1fr 1fr;
        gap: 24px 32px;
    }

    .asha-submit-field {
        grid-column: span 2;
    }

    .asha-form-grid .wpcf7-submit {
        width: auto;
        min-width: 200px;
        float: right;
    }
}

/* Mobile: single column */
@media (max-width: 640px) {
    .asha-form-row {
        grid-template-columns: 1fr 1fr;
        gap: 20px;
    }

    /* First row: keep First|Last side by side, Email full-width below */
    .asha-form-row:first-child .asha-no-label {
        /* stays in col 2 */
    }

    .asha-form-row:first-child .asha-form-field:last-child {
        grid-column: span 2;
    }

    .asha-submit-field {
        grid-column: span 2;
    }

    .asha-form-grid .wpcf7-submit {
        width: 100%;
        float: none;
    }
}

@media (max-width: 480px) {
    .asha-form-row {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .asha-form-row:first-child .asha-form-field:last-child {
        grid-column: span 1;
    }

    .asha-no-label {
        justify-content: flex-start;
    }

    .asha-submit-field {
        grid-column: span 1;
    }

    .asha-form-grid .wpcf7-submit {
        width: 100%;
    }
}
