/*
 Theme Name:   CCF NSW Surveys
 Theme URI:    https://futuretheory.com.au
 Description:  CCF NSW Surveys
 Author:       Futuretheory
 Author URI:   https://futuretheory.com.au
 Template:     generatepress
 Version:      0.1
*/

span.red {
    color: red;
}

.progress-container {
    width: 100%;
    height: 12px;
    background: #f5f5f5;
    position: sticky;
    top: 0;
    z-index: 10000000000000000;
}
  
.progress-container .progress-bar {
    height: 12px;
    background: #4caf50;
    width: 0%;
}

.entry-header {
    text-align: center;
}

.acf-field .acf-label label {
    font-weight: 700 !important;
    margin: 0 !important;
}

.acf-fields>.acf-field {
    border: 0 !important;
}

.acf-field p.description, .acf-field[data-type="message"] .acf-input {
    font-size: 0.8em;
    opacity: 0.8 !important;
    margin: 12px 0 !important;
}

.acf-fields.-border {
    background: unset !important;
}

#age-demographics-survey .acf-field.acf-field-group .acf-notice.-error {
    display: none !important
}

.acf-field .acf-notice.-error + .acf-input-wrap input {
    background-color: #ffcccb !important;
    border-color: red !important;
}

/* AGE DEMOGRAPHICS SURVEY */

#age-demographics-survey .acf-field[data-name='postcode_of_head_office'] input {
    max-width: 100px;
}

ul.acf-radio-list li, ul.acf-checkbox-list li {
    font-size: 1em !important;
    width: 100%;
    margin-bottom: 8px !important;
}

.acf-field[data-name='areas'] ul.acf-checkbox-list {
    column-count: 4;
}

#age-demographics-survey > .acf-form-fields > .acf-field > .acf-label {
    font-size: 1.5em;
    font-weight: 500 !important;
}

form#age-demographics-survey .acf-fields.-border {
    border: 0 !important;
}

form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    grid-column-gap: 40px;
    padding: 0;
    border: 0 !important;
    margin: 8px 0px;
}

form#age-demographics-survey .acf-field-group .acf-fields > .acf-field.acf-field-group {
    padding: 12px 16px;
}

form#age-demographics-survey .acf-field-group .acf-fields > .acf-field.acf-field-group > .acf-label label {
    font-size: 1.5em;
    font-weight: 600 !important;
    line-height: 1.25;
} 

form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group:nth-of-type(odd) {
    background: #e6ebf2;
}

form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields {
    display: flex;
    justify-content: space-between;
}

form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields label {
    font-weight: 600 !important;
    font-size: 1em;
}

form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields .acf-field.acf-field-group {
    display: block;
    margin: 0;
    background: unset !important;
    padding: 0;
}

form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields .acf-field.acf-field-group > .acf-label {
    padding: 0 12px;
    margin-bottom: 0px;
}

form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields .acf-field.acf-field-group:first-of-type > .acf-label {
    text-align: right;
    padding-right: 30px;
}

form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields .acf-field.acf-field-group:first-of-type {
    flex-grow: 1;
}

form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields .acf-field.acf-field-group:first-of-type .acf-field {
    display: flex;
    justify-content: space-between;
}

form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields .acf-field.acf-field-group .acf-field {
    padding: 8px 12px;
    border-bottom: 1px solid #ccc !important;
}

form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields .acf-field.acf-field-group .acf-field:last-of-type {
    border-bottom: 0 !important;
}

form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields .acf-field.acf-field-group .acf-field .acf-label {
    margin: 0;
}

form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields .acf-field.acf-field-group .acf-field .acf-label label {
    padding: 0;
    margin: 0;
    margin-right: 40px;
}

form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields .acf-field.acf-field-group .acf-field input {
    max-width: 80px;
}

form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields .acf-field.acf-field-group:not(:first-child) .acf-input .acf-label {
    display: none;
} 

form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields {
    display: block;
}

@media (max-width: 1010px) {

    form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group {
        grid-template-columns: 1fr;
    }

    #age-demographics-survey > .acf-form-fields > .acf-field > .acf-label, form#age-demographics-survey .acf-field-group .acf-fields > .acf-field.acf-field-group > .acf-label label {
        font-size: 1em;
    }

}

@media (max-width: 1000px) {
    .acf-field[data-name='areas'] ul.acf-checkbox-list {
        column-count: 3;
    }
}

@media (max-width: 780px) {

    .acf-field[data-name='areas'] ul.acf-checkbox-list {
        column-count: 2;
    }

    form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields label {
        font-size: 0.9em;
    }

}
@media (max-width: 660px) {

    form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields .acf-field.acf-field-group:first-of-type .acf-field {
        align-items: center;
    }

    form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields label {
        font-size: 0.8em;
    }

}

@media (max-width: 630px) {

    form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group {
        overflow-x: scroll;
        min-width: 540px;
        width: 540px;
    }

    form#age-demographics-survey .acf-field-group .acf-fields .acf-field.acf-field-group .acf-fields .acf-field.acf-field-group {
        overflow: unset;
        min-width: unset;
        width: unset;
    }

}

@media (max-width: 560px) {

    .acf-field[data-name='areas'] ul.acf-checkbox-list {
        column-count: 1;
    }

}

/* RESULTS */

table#results thead tr td {
    background: #003A7E;
    text-transform: uppercase;
    font-size: 0.8em;
    color: #fff;
    font-weight: 600;
    border: 0;
}