/* 1. Global Page Layout & Spacing */
#webform-submission-raise-a-concern-add-form,
form.webform-submission-form {
    max-width: 1200px !important;
    margin: 0 auto 0 0 !important;
    padding: 0 24px !important;
    display: block !important;
}

/* 2. Spacing below top introduction text block */
form.webform-submission-form [id*="introduction-text"],
form.webform-submission-form [id*="introduction_text"],
form.webform-submission-form .webform-element-markup {
    padding-left: 0px !important;
    margin-top: 30px !important;   
    margin-bottom: 40px !important;
    line-height: 1.6 !important;   
}

/* 3. Stop letters like g, y, and p from cutting off at the bottom of the box */
form.webform-submission-form .form-floating label {
    overflow: visible !important;
    padding-bottom: 2px !important;
    height: auto !important;
}

/* 4. Dynamic Gray Asterisk Rule */
form.webform-submission-form .js-form-item.form-required label::after,
form.webform-submission-form .form-item.required label::after,
form.webform-submission-form .form-required label::after,
form.webform-submission-form [class*="required"] label::after,
form.webform-submission-form .form-required::after,
form.webform-submission-form .webform-section [required] ~ label::after {
    content: " *" !important;
    display: inline !important; 
    position: static !important; 
    color: #747474 !important; 
    font-weight: normal !important;
    margin-left: 4px !important; 
    visibility: visible !important;
    opacity: 1 !important;
}

/* 5. Layout Container Gap Above Footer */
form.webform-submission-form .form-actions {
    display: block !important;
    margin-top: 2rem !important; 
    margin-bottom: 40px !important; 
    padding-right: 0 !important;
}

/* 6. Fix text size, make it black, and match the working button exactly */
form.webform-submission-form .form-actions input[type="submit"].js-form-submit {
    font-size: 1.3rem !important; /* Makes the font bigger to match */
    color: #030833 !important; /* Forces the text to be dark navy/black */
    background: none !important;
    border: 0 !important;
    outline: 0 !important;
    padding: 0 8rem 0 1rem !important; /* Exact padding combo from the working page */
    width: 100% !important;
    text-align: left !important; /* Aligns text cleanly to the left inside the pill */
    font-weight: normal !important;
    box-shadow: none !important;
}

/* 7. Sizing Fix for Floating Textarea Errors */
form.webform-submission-form .form-floating > div {
    padding-bottom: 27px !important;
}