/**
 * RCS Referral Form Styles
 * Clean, minimalist design matching the reference image
 */

/* Form Wrapper */
.rcs-referral-form-wrapper {
    max-width: 900px;
    margin-bottom:100px;
    background: #fff;
}

/* Orange Header - REMOVED */

/* Language Switcher */
.rcs-language-switcher {
    text-align: right;
    margin-bottom: 20px;
    padding: 10px 0;
    font-family: "Poppins", sans-serif;
}

.rcs-language-switcher .rcs-lang-toggle {
    color: #D04A00;
    text-decoration: none;
    padding: 5px 10px;
    transition: color 0.3s;
    font-weight: 400;
}

.rcs-language-switcher .rcs-lang-toggle:hover {
    color: #000;
    text-decoration: underline;
}

.rcs-language-switcher .rcs-lang-toggle.active {
    font-weight: 600;
    color: #D04A00;
    text-decoration: none;
}

.rcs-language-switcher .rcs-lang-separator {
    margin: 0 10px;
    color: #D04A00;
}

/* Form Container */
.rcs-referral-form-container {
    max-width: 900px;
    background: #fff;
}

/* Form Styling - Clean Minimalist */
.rcs-referral-form-container .gform_wrapper {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 1em;
    background: #fff;
    padding: 0;
}

@media (min-width: 576px) {
    .rcs-referral-form-container .gform_wrapper {
        font-size: 18px;
    }
}

/* Labels - Dark Grey, Bold, Always Visible */
.rcs-referral-form-container .gform_wrapper .gfield_label,
.rcs-referral-form-container .gform_wrapper label.gfield_label {
    color: #363636 !important;
    font-weight: 600 !important; /* Bold labels */
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    font-size: 1em;
}

/* Required Indicator - Red Asterisk */
/* JavaScript handles the replacement, CSS just ensures proper styling */
.rcs-referral-form-container .gform_wrapper .gfield_required {
    display: inline !important;
    margin-left: 3px !important;
}

/* Style the asterisk span added by JavaScript */
.rcs-referral-form-container .gform_wrapper .gfield_required span {
    color: #d63638 !important;
    font-weight: 600 !important;
}

/* Field Layout - Labels Left, Fields Right */
.rcs-referral-form-container .gform_wrapper .gfield {
    display: flex;
    flex-direction: row;
    margin-bottom: 0.9em; /* Reduced by 40% from 1.5em */
    align-items: flex-start; /* Top align labels and fields */
    background: #fff;
}

/* Labels - Left Side */
.rcs-referral-form-container .gform_wrapper .gfield_label {
    flex-basis: 0;
    flex-grow: 2;
    flex-shrink: 0;
    padding-right: 29px !important; /* Column gap between labels and fields */
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    color: #363636 !important;
    margin-top: 0;
    margin-bottom: 0;
/*     text-align: right !important; */ /* Right align labels */
    min-width: 200px;
    align-self: flex-start; /* Top align label */
    /* padding-top: 12px !important; */
}

/* Field Inputs - Right Side */
.rcs-referral-form-container .gform_wrapper .ginput_container,
.rcs-referral-form-container .gform_wrapper .gfield_description {
    flex-basis: 0;
    flex-grow: 4;
    flex-shrink: 1;
    min-width: 0;
    display: flex !important;
    align-items: flex-start; /* Top align inputs */
    visibility: visible !important;
    opacity: 1 !important;
}

/* Text Inputs - Clean, Light Borders */
.rcs-referral-form-container .gform_wrapper input[type="text"],
.rcs-referral-form-container .gform_wrapper input[type="email"],
.rcs-referral-form-container .gform_wrapper input[type="tel"],
.rcs-referral-form-container .gform_wrapper input[type="date"],
.rcs-referral-form-container .gform_wrapper textarea {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-size: 1em;
/*     border-radius: 6px !important; */
    border: 1px solid #ccc;
    padding: 0.5em 0.75em;
    width: 100%;
    box-sizing: border-box;
    background-color: #fff;
    color: #363636;
    box-shadow: none !important; /* Remove box shadow */
}

.rcs-referral-form-container .gform_wrapper .gform_fields {
    row-gap: 10px !important;
}

.rcs-referral-form-container .gform_wrapper input[type="text"]:focus,
.rcs-referral-form-container .gform_wrapper input[type="email"]:focus,
.rcs-referral-form-container .gform_wrapper input[type="tel"]:focus,
.rcs-referral-form-container .gform_wrapper input[type="date"]:focus,
.rcs-referral-form-container .gform_wrapper textarea:focus {
    outline: none;
    border-color: #015562;
}

/* Placeholder Text - Lighter Grey */
.rcs-referral-form-container .gform_wrapper input[type="text"]::placeholder,
.rcs-referral-form-container .gform_wrapper input[type="email"]::placeholder,
.rcs-referral-form-container .gform_wrapper input[type="tel"]::placeholder,
.rcs-referral-form-container .gform_wrapper input[type="date"]::placeholder,
.rcs-referral-form-container .gform_wrapper textarea::placeholder {
    color: #999999 !important;
    opacity: 1 !important;
}

.rcs-referral-form-container .gform_wrapper input[type="text"]::-webkit-input-placeholder,
.rcs-referral-form-container .gform_wrapper input[type="email"]::-webkit-input-placeholder,
.rcs-referral-form-container .gform_wrapper input[type="tel"]::-webkit-input-placeholder,
.rcs-referral-form-container .gform_wrapper input[type="date"]::-webkit-input-placeholder,
.rcs-referral-form-container .gform_wrapper textarea::-webkit-input-placeholder {
    color: #999999 !important;
}

.rcs-referral-form-container .gform_wrapper input[type="text"]::-moz-placeholder,
.rcs-referral-form-container .gform_wrapper input[type="email"]::-moz-placeholder,
.rcs-referral-form-container .gform_wrapper input[type="tel"]::-moz-placeholder,
.rcs-referral-form-container .gform_wrapper input[type="date"]::-moz-placeholder,
.rcs-referral-form-container .gform_wrapper textarea::-moz-placeholder {
    color: #999999 !important;
    opacity: 1 !important;
}

.rcs-referral-form-container .gform_wrapper input[type="text"]:-ms-input-placeholder,
.rcs-referral-form-container .gform_wrapper input[type="email"]:-ms-input-placeholder,
.rcs-referral-form-container .gform_wrapper input[type="tel"]:-ms-input-placeholder,
.rcs-referral-form-container .gform_wrapper input[type="date"]:-ms-input-placeholder,
.rcs-referral-form-container .gform_wrapper textarea:-ms-input-placeholder {
    color: #999999 !important;
}

@media (min-width: 576px) {
    .rcs-referral-form-container .gform_wrapper input[type="text"],
    .rcs-referral-form-container .gform_wrapper input[type="email"],
    .rcs-referral-form-container .gform_wrapper input[type="tel"],
    .rcs-referral-form-container .gform_wrapper input[type="date"],
    .rcs-referral-form-container .gform_wrapper textarea {
        font-size: 18px;
    }
}

/* Select Dropdowns - Blue Arrow Icon */
.rcs-referral-form-container .gform_wrapper select,
.rcs-referral-form-container .gform_wrapper .ginput_container select {
    font-family: "Poppins", sans-serif !important;
    font-weight: 400 !important;
    font-size: 1em !important;
/*     border-radius: 6px !important; */
    border: 1px solid #ccc !important;
    padding: 0.5em 0.75em !important;
    padding-right: 2.5em !important;
    width: 100% !important;
    box-sizing: border-box !important;
    box-shadow: none !important; /* Remove box shadow */
    background-color: #fff !important;
    /* Blue arrow icon */
    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='%23007bff' d='M6 9L1 4h10z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75em center !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    cursor: pointer !important;
    min-height: 2.5em;
    height: 2.5em !important;
    line-height: 1.5 !important;
    display: block !important;
    vertical-align: middle !important;
    margin: 0 !important;
    color: #363636;
}

@media (min-width: 576px) {
    .rcs-referral-form-container .gform_wrapper select,
    .rcs-referral-form-container .gform_wrapper .ginput_container select {
        font-size: 18px !important;
    }
}

.rcs-referral-form-container .gform_wrapper select:focus,
.rcs-referral-form-container .gform_wrapper .ginput_container select:focus {
    outline: none !important;
    border-color: #015562 !important;
}

/* Select Containers */
.rcs-referral-form-container .gform_wrapper .ginput_container_select {
    width: 100% !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.rcs-referral-form-container .gform_wrapper .ginput_container_select select {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Radio Button Containers - Inline */
.rcs-referral-form-container .gform_wrapper .ginput_container_radio,
.rcs-referral-form-container .gform_wrapper .ginput_container_checkbox {
    display: flex !important;
    flex-direction: row !important; /* Inline radio buttons */
    align-items: center !important;
    flex-wrap: wrap !important;
    row-gap: 10px !important; /* Vertical spacing between rows */
    column-gap: 1.5em !important; /* Horizontal spacing between items */
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
}

/* Radio Buttons - Standard Circular */
.rcs-referral-form-container .gform_wrapper .gfield_radio label,
.rcs-referral-form-container .gform_wrapper .gfield_checkbox label,
.rcs-referral-form-container .gform_wrapper .gfield_radio .gchoice_label,
.rcs-referral-form-container .gform_wrapper .gfield_checkbox .gchoice_label {
    font-family: "Poppins", sans-serif !important;
    font-weight: 400 !important;
/*     font-size: calc(1em - 3px) !important; /* Reduce text size by 3px */ */
    margin-left: 0.5em !important;
    display: inline-block !important;
    color: #363636 !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.rcs-referral-form-container .gform_wrapper .gfield_radio li,
.rcs-referral-form-container .gform_wrapper .gfield_checkbox li {
    margin-bottom: 0 !important; /* No bottom margin for inline layout */
    margin-right: 1.5em !important; /* Right margin for spacing */
    list-style: none;
}

.rcs-referral-form-container .gform_wrapper .gfield_radio ul,
.rcs-referral-form-container .gform_wrapper .gfield_checkbox ul {
    display: flex !important; /* Row layout for radio buttons */
    flex-direction: row !important;
    flex-wrap: wrap !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    gap: 1.5em !important;
}

/* Radio Buttons - Default Browser Styling */
.rcs-referral-form-container .gform_wrapper .gfield_radio input[type="radio"],
.rcs-referral-form-container .gform_wrapper .gfield_checkbox input[type="checkbox"] {
    margin-right: 0.5em !important;
    display: inline-block !important;
    vertical-align: middle !important;
    appearance: auto !important;
    -webkit-appearance: radio !important;
    -moz-appearance: radio !important;
    opacity: 1 !important;
    visibility: visible !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    min-width: 18px !important;
    min-height: 18px !important;
    cursor: pointer !important;
}

.rcs-referral-form-container .gform_wrapper .gfield_checkbox input[type="checkbox"] {
    -webkit-appearance: checkbox !important;
    -moz-appearance: checkbox !important;
}

/* Remove focus outline from radio buttons and checkboxes */
.rcs-referral-form-container .gform_wrapper .gfield_radio input[type="radio"]:focus,
.rcs-referral-form-container .gform_wrapper .gfield_checkbox input[type="checkbox"]:focus {
    outline: none !important;
    box-shadow: none !important;
}

/* Radio/Checkbox Choice Containers - Inline */
.rcs-referral-form-container .gform_wrapper .gfield_radio .gchoice,
.rcs-referral-form-container .gform_wrapper .gfield_checkbox .gchoice {
    display: inline-flex !important;
    align-items: center !important;
    margin-bottom: 0 !important;
    margin-right: 1.5em !important;
}

.rcs-referral-form-container .gform_wrapper .gfield_radio .gchoice label,
.rcs-referral-form-container .gform_wrapper .gfield_checkbox .gchoice label {
    color: #363636 !important;
    margin: 0;
/*     font-size: calc(1em - 3px) !important; /* Reduce text size by 3px */ */
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Date Picker - Calendar Icon */
.rcs-referral-form-container .gform_wrapper input[type="date"] {
    position: relative;
}

/* Date picker icon styling - handled by browser or datepicker library */
.rcs-referral-form-container .gform_wrapper .ginput_container_date input[type="date"]::-webkit-calendar-picker-indicator {
    cursor: pointer;
    opacity: 1;
}

/* Submit Button */
.rcs-referral-form-container .gform_wrapper .gform_button {
    background-color: #015562 !important;
    border-radius: 40px;
/*
    padding: 15px 30px !important;
    font-size: 1.1em !important;
    font-family: "Poppins", sans-serif;
    font-weight: 600;
*/
    transition: background-color 0.3s;
    color: #fff !important;
    border: none;
    cursor: pointer;
    margin-top: 30px;
}

.rcs-referral-form-container .gform_wrapper .gform_button:hover {
    background-color: #000 !important;
}

/* Error Messages */
.rcs-form-error {
    padding: 15px;
    background: #f8d7da;
    border: 1px solid #f5c6cb;
    border-radius: 6px !important;
    color: #721c24;
    margin: 20px 0;
    font-family: "Poppins", sans-serif;
}

.rcs-referral-form-container .gform_wrapper .validation_message {
    color: #d63638;
    font-family: "Poppins", sans-serif;
    margin-top: 0.5em;
    font-size: 0.9em;
    display: block !important;
    width: 100% !important;
    clear: both !important;
}

/* Ensure error fields maintain flex layout */
.rcs-referral-form-container .gform_wrapper .gfield.gfield_error {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    flex-wrap: wrap !important; /* Allow wrapping for validation messages */
}

/* Validation messages should appear below the input, aligned with input fields */
.rcs-referral-form-container .gform_wrapper .gfield_error .gfield_description.validation_message,
.rcs-referral-form-container .gform_wrapper .gfield_error .validation_message {
    flex-basis: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-top: 0.5em !important;
    margin-bottom: 0 !important;
    order: 10 !important; /* Ensure it appears last */
    padding-left: calc(200px + 29px) !important; /* Align with input fields */
    clear: both !important;
}

/* Ensure error input containers maintain layout */
.rcs-referral-form-container .gform_wrapper .gfield_error .ginput_container {
    flex-basis: 0 !important;
    flex-grow: 4 !important;
    flex-shrink: 1 !important;
    /* width: auto !important; */
    min-width: 0 !important;
}

/* Position validation message to align with input fields - merged with above rule */

/* Mobile Responsive - Stack labels above fields */
@media screen and (max-width: 768px) {
    .rcs-referral-form-container .gform_wrapper .gfield {
        flex-direction: column;
        align-items: flex-start;
    }

    .gfield_label{
        width:100%!important;
    }
    
    /* All text left-aligned on mobile */
    .rcs-referral-form-container .gform_wrapper .gfield_label {
        flex-grow: 1;
        padding-right: 0;
        margin-bottom: 0.5em;
        min-width: auto;
        text-align: left !important; /* Left align labels */
    }
    
    /* All fields 100% width on mobile */
    .rcs-referral-form-container .gform_wrapper .ginput_container {
        flex-grow: 1;
        width: 100% !important;
    }
    
    .rcs-referral-form-container .gform_wrapper input[type="text"],
    .rcs-referral-form-container .gform_wrapper input[type="email"],
    .rcs-referral-form-container .gform_wrapper input[type="tel"],
    .rcs-referral-form-container .gform_wrapper input[type="date"],
    .rcs-referral-form-container .gform_wrapper textarea,
    .rcs-referral-form-container .gform_wrapper select {
        width: 100% !important;
    }
    
    /* Radio button labels left-aligned */
    .rcs-referral-form-container .gform_wrapper .gfield_radio label,
    .rcs-referral-form-container .gform_wrapper .gfield_checkbox label,
    .rcs-referral-form-container .gform_wrapper .gfield_radio .gchoice_label,
    .rcs-referral-form-container .gform_wrapper .gfield_checkbox .gchoice_label {
        text-align: left !important;
    }
    
    .rcs-referral-form-container .gform_wrapper .gfield_radio .gchoice label,
    .rcs-referral-form-container .gform_wrapper .gfield_checkbox .gchoice label {
        text-align: left !important;
    }
    
    /* Ensure error fields maintain layout on mobile */
    .rcs-referral-form-container .gform_wrapper .gfield.gfield_error {
        flex-direction: column !important;
    }
    
    .rcs-referral-form-container .gform_wrapper .gfield_error .gfield_description.validation_message {
        width: 100% !important;
        margin-left: 0 !important;
        padding-left: 0 !important; /* No left padding on mobile */
        margin-top: 0.5em !important;
    }
}


@media screen and (min-width: 769px) {
.rcs-referral-form-container .gform_wrapper label.gfield_label{
    /* padding-top:12px!important; */
    margin:auto!important;
}
}

/* ============================================
   CLIENT CUSTOMISATIONS SECTION
   ============================================
   This section is reserved for client-specific CSS customisations.
   Any styles added below will override the plugin's default styles.
   Please add your custom CSS below this comment block.
   ============================================ */

/* Add your custom CSS below this line */