/* B.7.1 - Potential Hazards */

/* YES - DARK GREEN */
#question6316 .answer-item:nth-of-type(1) {
    background-color: #166534 !important;
    border-color: #14532d !important;
    color: #ffffff !important;
}

/* NO - DARK RED */
#question6316 .answer-item:nth-of-type(2) {
    background-color: #991B1B !important;
    border-color: #7f1d1d !important;
    color: #ffffff !important;
}

/* White text and icons */
#question6316 .answer-item:nth-of-type(1) *,
#question6316 .answer-item:nth-of-type(2) * {
    color: #ffffff !important;
}

/* Hover */
#question6316 .answer-item:nth-of-type(1):hover {
    background-color: #14532d !important;
}

#question6316 .answer-item:nth-of-type(2):hover {
    background-color: #7f1d1d !important;
}

/* B.9.1.1 - Physical Demands */

/* YES - DARK GREEN */
#question6319 .answer-item:nth-of-type(1) {
    background-color: #166534 !important;
    border-color: #14532d !important;
    color: #ffffff !important;
}

/* NO - DARK RED */
#question6319 .answer-item:nth-of-type(2) {
    background-color: #991B1B !important;
    border-color: #7f1d1d !important;
    color: #ffffff !important;
}

/* White text and icons */
#question6319 .answer-item:nth-of-type(1) *,
#question6319 .answer-item:nth-of-type(2) * {
    color: #ffffff !important;
}

/* Hover */
#question6319 .answer-item:nth-of-type(1):hover {
    background-color: #14532d !important;
}

#question6319 .answer-item:nth-of-type(2):hover {
    background-color: #7f1d1d !important;
}

/* Hide LimeSurvey branding from the survey header */
.navbar-brand {
    display: none !important;
}

.navbar-brand img {
    display: none !important;
}

/* Replace LimeSurvey top-left logo with small Judiciary logo */

.navbar-brand {
    display: flex !important;
    align-items: center;
    width: 95px;
    height: 55px;
    padding: 5px 10px !important;
    margin: 0 !important;
    background-image: url('/upload/surveys/186743/images/logo1.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* Hide the original LimeSurvey logo */
.navbar-brand img {
    display: none !important;
}

/* B.4.1 - Financial Decisions */

/* YES - DARK GREEN */
#question6308 .answer-item:nth-of-type(1) {
    background-color: #166534 !important;
    border-color: #14532d !important;
    color: #ffffff !important;
}

/* NO - DARK RED */
#question6308 .answer-item:nth-of-type(2) {
    background-color: #991B1B !important;
    border-color: #7f1d1d !important;
    color: #ffffff !important;
}

/* White text and icons */
#question6308 .answer-item:nth-of-type(1) *,
#question6308 .answer-item:nth-of-type(2) * {
    color: #ffffff !important;
}

/* Hover */
#question6308 .answer-item:nth-of-type(1):hover {
    background-color: #14532d !important;
}

#question6308 .answer-item:nth-of-type(2):hover {
    background-color: #7f1d1d !important;
}

/* Judiciary top navigation */
.navbar,
.navbar-default,
.navbar-inverse {
    background-color: #162f25 !important;
    border-color: #162f25 !important;
}

/* Navigation text/icons */
.navbar a,
.navbar .navbar-brand,
.navbar .nav > li > a {
    color: #ffffff !important;
}

/* Small Judiciary logo in the top navigation */
.navbar-brand {
    width: 110px !important;
    height: 55px !important;
    padding: 5px 10px !important;
    margin: 0 !important;
    background-image: url('/upload/surveys/186743/images/logo1.png') !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    background-color: transparent !important;
}

/* Hide original LimeSurvey logo */
.navbar-brand img {
    display: none !important;
}

/* Mobile navigation */
.navbar-toggle {
    border-color: rgba(255,255,255,0.7) !important;
}

.navbar-toggle .icon-bar {
    background-color: #ffffff !important;
}

/* Navigation bottom border */
.navbar {
    box-shadow: 0 2px 6px rgba(0,0,0,0.12) !important;
}

/* =========================================================
   JUDICIARY TOP NAVIGATION
   ========================================================= */

/* Main top navigation */
.fruity .navbar,
.fruity nav.navbar,
.fruity #survey-nav,
#survey-nav {
    background-color: #162f25 !important;
    background-image: none !important;
    border: none !important;
    border-bottom: 3px solid #685e04 !important;
    min-height: 55px !important;
}

/* Navigation container */
.fruity .navbar-header,
.fruity .navbar-collapse,
.fruity .navbar-default {
    background-color: #162f25 !important;
    background-image: none !important;
}

/* Navigation links */
.fruity .navbar a,
.fruity .navbar-nav > li > a,
.fruity .navbar .nav-link,
.fruity .navbar-brand {
    color: #ffffff !important;
}

/* Hover */
.fruity .navbar-nav > li > a:hover,
.fruity .navbar-nav > li > a:focus {
    background-color: #14532d !important;
    color: #ffffff !important;
}

/* Small Judiciary logo in the navigation */
.fruity .navbar-brand {
    width: 110px !important;
    height: 55px !important;
    padding: 4px 8px !important;
    margin: 0 !important;
    background-color: transparent !important;
    background-image: url('/upload/surveys/186743/images/logo1.png') !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
}

/* Hide original LimeSurvey logo */
.fruity .navbar-brand img,
.fruity .navbar-brand .logo {
    display: none !important;
}

/* Mobile hamburger */
.fruity .navbar-toggle {
    background-color: transparent !important;
    border-color: rgba(255,255,255,0.7) !important;
}

.fruity .navbar-toggle .icon-bar {
    background-color: #ffffff !important;
}

/* Keep mobile header green */
@media (max-width: 767px) {
    .fruity .navbar,
    .fruity #survey-nav {
        background-color: #162f25 !important;
    }
}

/* =========================================================
   JOB ANALYSIS QUESTIONNAIRE TITLE
   ========================================================= */

.survey-name,
#surveynametext,
h1.survey-name {
    font-weight: 700 !important;
    color: #162f25 !important;
    letter-spacing: 0.2px !important;
}


/* =========================================================
   NEXT BUTTON - ALIGN WITH CONTENT BORDER
   ========================================================= */

@media (max-width: 767px) {

    #ls-button-submit {
        position: relative !important;
        right: 14px !important;
        left: auto !important;
        margin-right: 0 !important;
    }

    .fruity .navigator,
    .fruity .nav-buttons {
        text-align: right !important;
        padding-right: 0 !important;
    }
}

/* =========================================================
   BOLD MAIN QUESTION/GROUP HEADINGS
   ========================================================= */

/* Main group/question headings such as B.1, B.2, B.3... */
.fruity .group-name,
.fruity .group-title,
.fruity .group-name h2,
.fruity .group-name h1,
.fruity .group-title h2,
.fruity .group-title h1,
.fruity .question-group-title {
    font-weight: 700 !important;
}

/* Keep the heading text strong on mobile as well */
@media (max-width: 767px) {
    .fruity .group-name,
    .fruity .group-title,
    .fruity .group-name h2,
    .fruity .group-name h1,
    .fruity .group-title h2,
    .fruity .group-title h1,
    .fruity .question-group-title {
        font-weight: 700 !important;
    }
}

/* =========================================================
   B.2.1 - Do not show validation red on initial display
   ========================================================= */

#question6296 .has-error,
#question6296 .is-invalid {
    box-shadow: none !important;
}

/* Keep normal input appearance */
#question6296 input[type="text"] {
    border-color: #ccc !important;
    box-shadow: none !important;
}

/* B.2.1 - Normal black text while typing */
#question6296 input[type="text"],
#question6296 textarea {
    color: #000000 !important;
    background-color: #ffffff !important;
    font-weight: 400 !important;
}

/* Placeholder also normal grey */
#question6296 input[type="text"]::placeholder,
#question6296 textarea::placeholder {
    color: #777777 !important;
}

/* Prevent orange text while focused */
#question6296 input[type="text"]:focus,
#question6296 textarea:focus {
    color: #000000 !important;
    background-color: #ffffff !important;
}

/* Prevent Fruity validation/focus from changing typed text */
#question6296 .form-control {
    color: #000000 !important;
}

/* =========================================================
   STANDARDIZE ALL FORM FIELDS TO MATCH B.3.1
   ========================================================= */

/* ---------------------------------------------------------
   1. ALL TEXT / SEARCH / AUTOCOMPLETE INPUTS
   --------------------------------------------------------- */

.fruity .question-container .answer-container input[type="text"],
.fruity .question-container .answer-container input[type="email"],
.fruity .question-container .answer-container input[type="number"],
.fruity .question-container .answer-container input[type="tel"] {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
}


/* ---------------------------------------------------------
   2. AUTOCOMPLETE / SEARCH FIELD WRAPPERS
   --------------------------------------------------------- */

.fruity .question-container .answer-container .position-search,
.fruity .question-container .answer-container .position-search-container,
.fruity .question-container .answer-container .col-auto {
    width: 100% !important;
    max-width: none !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
}


/* ---------------------------------------------------------
   3. AUTOCOMPLETE FORM CONTROLS
   --------------------------------------------------------- */

.fruity .question-container .answer-container .position-search input,
.fruity .question-container .answer-container .position-search .form-control,
.fruity .question-container .answer-container .form-control {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
}


/* ---------------------------------------------------------
   4. DROPDOWNS
   --------------------------------------------------------- */

.fruity .question-container .answer-container select,
.fruity .question-container .answer-container select.form-control,
.fruity .question-container .answer-container select.form-select {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
}


/* Dropdown parent */
.fruity .question-container .answer-container select.form-control,
.fruity .question-container .answer-container select.form-select {
    flex: 1 1 auto !important;
}


/* ---------------------------------------------------------
   5. TEXTAREAS
   --------------------------------------------------------- */

.fruity .question-container .answer-container textarea {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
}


/* ---------------------------------------------------------
   6. ANSWER AREA
   --------------------------------------------------------- */

.fruity .question-container .answer-container {
    width: 100% !important;
    max-width: none !important;
}


/* ---------------------------------------------------------
   7. ANSWER ITEMS
   --------------------------------------------------------- */

.fruity .question-container .answer-item {
    width: 100% !important;
    max-width: none !important;
}


/* ---------------------------------------------------------
   8. MOBILE
   --------------------------------------------------------- */

@media (max-width: 767px) {

    .fruity .question-container .answer-container input[type="text"],
    .fruity .question-container .answer-container input[type="email"],
    .fruity .question-container .answer-container input[type="number"],
    .fruity .question-container .answer-container input[type="tel"],
    .fruity .question-container .answer-container textarea,
    .fruity .question-container .answer-container select,
    .fruity .question-container .answer-container .position-search {
        width: 100% !important;
        max-width: none !important;
    }
}