// _partial/_form.scss

.cmtx_form_container {
    width: 100%;
}

.cmtx_form_heading {
    display: inline-block;
    margin-bottom: 12px;
    margin-top: 0;
}

#cmtx_perm_0 {
    border: 1px dashed $grey;
    margin-bottom: 20px;
    margin-top: 10px;
    padding-bottom: 5px;
}

.cmtx_preview_text {
    color: $grey;
    font-size: .8em;
    font-weight: normal;
    margin-top: 9px;
}

.cmtx_maintenance_mode_admin, .cmtx_javascript_disabled {
    background-color: $beige;
    border: 1px dotted $grey;
    font-size: .9em;
    margin-bottom: 15px;
    padding: 7px;
}

.cmtx_maintenance_mode_admin {
    color: $grey-dark;
}

.cmtx_javascript_disabled {
    color: $red;
    font-weight: bold;
}

.cmtx_required_text {
    color: $red;
    font-size: 12px;
    margin-bottom: 10px;
}

.cmtx_rows {
    margin-top: -10px;
}

.cmtx_message_notify ~ .cmtx_form .cmtx_rows {
    margin-top: -15px;
}

.cmtx_honeypot {
    display: none !important;
}

.cmtx_row [class*='cmtx_col_'] {
    display: block;
    float: left;
    min-height: 1px;
}

.cmtx_row [class*='cmtx_col_']:first-child {
    padding-right: 15px;
}

.cmtx_row [class*='cmtx_col_']:last-child {
    padding-left: 15px;
}

.cmtx_row [class*='cmtx_col_']:only-child {
    padding-left: 0;
    padding-right: 0;
}

.cmtx_row [class*='cmtx_col_']:not(:first-child):not(:last-child) {
    padding-left: 15px;
    padding-right: 15px;
}

.cmtx_col_1 {
    width: 8.33%;
}

.cmtx_col_2 {
    width: 16.66%;
}

.cmtx_col_3 {
    width: 25%;
}

.cmtx_col_4 {
    width: 33.33%;
}

.cmtx_col_5 {
    width: 41.66%;
}

.cmtx_col_6 {
    width: 50%;
}

.cmtx_col_7 {
    width: 58.33%;
}

.cmtx_col_8 {
    width: 66.66%;
}

.cmtx_col_9 {
    width: 75%;
}

.cmtx_col_10 {
    width: 83.33%;
}

.cmtx_col_11 {
    width: 91.66%;
}

.cmtx_col_12 {
    width: 100%;
}

.cmtx_message {
    background-position: 5px center;
    background-repeat: no-repeat;
    border: 1px solid;
    display: none;
    margin-bottom: 12px;
    padding: 5px 5px 5px 25px;
    position: relative;
}

.cmtx_message_success {
    background-color: #e8fcdc;
    background-image: url('../../image/message/success.png');
    color: #4f8a10;
}

.cmtx_message_error {
    background-color: #ffbaba;
    background-image: url('../../image/message/error.png');
    color: #d8000c;
}

.cmtx_message_info {
    background-color: #bde5f8;
    background-image: url('../../image/message/information.png');
    color: #00529b;
}

.cmtx_message_warning {
    background-color: #bde5f8;
    background-image: url('../../image/message/warning.png');
    color: #00529b;
}

.cmtx_message_reply a {
    color: $blue;
    text-decoration: none;
}

.cmtx_error {
    color: $red;
    display: block;
    font-size: .9em;
    margin-top: 2px;
}

.cmtx_field {
    background-color: $white !important;
    border: 1px solid $grey-lighter;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, .075) inset;
    color: $black !important;
    font-weight: normal;
    height: 35px !important;
    padding: 4px 6px;
    text-align: center !important;
    vertical-align: middle;
}

.cmtx_field_error {
    border: 1px solid $red !important;
}

.cmtx_field[disabled], .cmtx_field[readonly] {
    background-color: $grey-lighter !important;
    cursor: not-allowed;
    user-select: none;
}

.cmtx_text_field, .cmtx_textarea_field, .cmtx_select_field {
    width: 100%;
}

.cmtx_textarea_field {
    height: 35px !important;
    min-height: 35px !important;
}

.cmtx_required {
    background-image: url('../../image/misc/asterisk.png');
    background-position: 5px 57%;
    background-repeat: no-repeat;
}

.cmtx_wait_for_comment, .cmtx_wait_for_user {
    display: none;
}

.cmtx_hide {
    display: none;
}

.cmtx_comment_group {
    margin-top: 20px;
}

.cmtx_icons_container {
    background-image: linear-gradient(to bottom, #fbfbfb, $white);
    border: 1px solid $grey-lighter;
    border-radius: 3px;
    cursor: default;
    padding: 3px;
}

.cmtx_bb_code_container, .cmtx_smilies_container {
    float: left;
}

.cmtx_bb_code {
    background-image: url('../../image/bb_code/sprite.png');
    background-repeat: no-repeat;
    display: inline-block;
    height: 16px;
    vertical-align: middle;
    width: 16px;
}

.cmtx_bb_code:not(:first-child) {
    margin-left: 15px;
}

.cmtx_bb_code_bold {
    background-position: -5px -5px;
}

.cmtx_bb_code_bullet {
    background-position: -31px -5px;
}

.cmtx_bb_code_code {
    background-position: -57px -5px;
}

.cmtx_bb_code_email {
    background-position: -83px -5px;
}

.cmtx_bb_code_image {
    background-position: -5px -31px;
}

.cmtx_bb_code_italic {
    background-position: -31px -31px;
}

.cmtx_bb_code_line {
    background-position: -57px -31px;
}

.cmtx_bb_code_link {
    background-position: -83px -31px;
}

.cmtx_bb_code_numeric {
    background-position: -5px -57px;
}

.cmtx_bb_code_php {
    background-position: -31px -57px;
}

.cmtx_bb_code_quote {
    background-position: -57px -57px;
}

.cmtx_bb_code_strike {
    background-position: -83px -57px;
}

.cmtx_bb_code_subscript {
    background-position: -5px -83px;
}

.cmtx_bb_code_superscript {
    background-position: -31px -83px;
}

.cmtx_bb_code_underline {
    background-position: -57px -83px;
}

.cmtx_bb_code_youtube {
    background-position: -83px -83px;
}

.cmtx_icons_separator {
    border-left: 1px solid $grey-lighter;
    float: left;
    height: 22px;
    margin-left: 15px;
    margin-right: 15px;
}

.cmtx_smiley {
    background-image: url('../../image/smilies/sprite.png');
    background-repeat: no-repeat;
    display: inline-block;
    height: 20px;
    vertical-align: middle;
    width: 20px;
}

.cmtx_icons_container .cmtx_smiley:not(:first-child) {
    margin-left: 15px;
}

.cmtx_smiley_blush {
    background-position: -5px -5px;
}

.cmtx_smiley_cool {
    background-position: -63px -5px;
}

.cmtx_smiley_cry {
    background-position: -93px -5px;
}

.cmtx_smiley_grin {
    background-position: -5px -35px;
}

.cmtx_smiley_huh {
    background-position: -35px -35px;
}

.cmtx_smiley_laugh {
    background-position: -65px -35px;
}

.cmtx_smiley_mad {
    background-position: -5px -65px;
}

.cmtx_smiley_sad {
    background-position: -35px -65px;
}

.cmtx_smiley_scared {
    background-position: -65px -65px;
}

.cmtx_smiley_shocked {
    background-position: -121px -5px;
}

.cmtx_smiley_sleep {
    background-position: -95px -35px;
}

.cmtx_smiley_smile {
    background-position: -95px -65px;
}

.cmtx_smiley_tongue {
    background-position: -5px -95px;
}

.cmtx_smiley_confused {
    background-position: -35px -5px;
}

.cmtx_smiley_wink {
    background-position: -35px -95px;
}

.cmtx_comment_field {
    font-size: 14px;
    line-height: initial !important;
    overflow: hidden;
    padding: 8px 0 !important;
    resize: none;
}

.cmtx_comment_field_active {
    background-image: none;
    font-size: inherit;
    height: 125px !important;
    line-height: normal;
    padding: 5px !important;
    text-align: left !important;
}

.cmtx_comment_field_transition {
    transition: height .25s ease-in !important;
}

.cmtx_comment_field_near_bottom:hover {
    cursor: ns-resize;
}

.cmtx_counter {
    color: $grey;
    font-size: 13px;
}

.cmtx_headline_row {
    margin-top: 20px;
}

.cmtx_upload_row {
    margin-top: 20px;
}

.cmtx_image_container {
    border: 1px solid $grey-lighter;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, .075) inset;
    padding: 5px;
}

.cmtx_image_row {
    margin-top: 20px;
}

.cmtx_user_row {
    margin-top: 20px;
}

.cmtx_rating_row {
    margin-top: 20px;
}

.cmtx_rating {
    background-color: $white;
    border: 1px solid $grey-lighter;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, .075) inset;
    text-align: center;
}

.cmtx_rating_block {
    display: inline-block;
    vertical-align: middle;
}

.cmtx_rating_block > input {
    display: none;
}

.cmtx_rating_block > label::before {
    content: '\f005';
    display: inline-block;
    font-family: FontAwesome;
    font-size: 1.25em;
    margin: 5px;
}

.cmtx_rating_block > label {
    color: $star-empty;
    float: right;
}

.cmtx_rating_block > input:checked ~ label, .cmtx_rating_block:not(:checked) > label:hover, .cmtx_rating_block:not(:checked) > label:hover ~ label {
    color: $star-full;
}

.cmtx_rating_block > input:checked + label:hover, .cmtx_rating_block > input:checked ~ label:hover, .cmtx_rating_block > label:hover ~ input:checked ~ label, .cmtx_rating_block > input:checked ~ label:hover ~ label {
    color: $star-hover;
}

.cmtx_website_row {
    margin-top: 20px;
}

.cmtx_geo_row {
    margin-top: 20px;
}

select.cmtx_required {
    padding-left: 15px;
}

.cmtx_required select option {
    padding-left: 0;
}

.cmtx_country_field option:first-child {
    color: $grey-lighter;
    display: none;
}

.cmtx_state_field option:first-child {
    color: $grey-lighter;
    display: none;
}

.cmtx_question_row {
    margin-top: 20px;
}

.cmtx_extra_row {
    margin-top: 20px;
}

.cmtx_extra_textarea_container textarea {
    height: 70px !important;
    resize: none;
    text-align: left !important;
    width: 100%;
}

.cmtx_extra_textarea_container textarea.cmtx_required {
    padding-left: 20px;
}

.cmtx_recaptcha_row {
    margin-top: 20px;
}

.cmtx_captcha_row {
    margin-top: 20px;
}

.cmtx_checkbox_container {
    margin-top: 20px;
}

.cmtx_checkbox_container input {
    display: inline-block;
    margin-right: 2px !important;
    vertical-align: baseline;
    width: auto;
}

.cmtx_checkbox_container label {
    display: inline-block;
    float: none;
    width: auto;
}

.cmtx_button_row {
    margin-top: 20px;
}

.cmtx_button_row .cmtx_col_2 {
    min-width: 150px;
    width: auto;
}

.cmtx_question_field {
    cursor: default;
    height: auto !important;
    line-height: 23px;
    padding: 6px;
}

#cmtx_captcha_image, .cmtx_captcha_field {
    width: 215px;
}

.cmtx_captcha_refresh {
    color: $grey;
    cursor: pointer;
    font-size: 14px;
    margin-left: 5px;
    vertical-align: top;
}

.cmtx_admin_button {
    box-shadow: 0 0 8px #00cd00;
}

.cmtx_powered_by_container {
    margin-top: 10px;
}

.cmtx_powered_by {
    color: $grey;
    font-size: 10px;
}

.cmtx_parsing_box {
    background-color: $grey-lightest;
    border: 1px solid $grey-lighter;
    box-shadow: 3px 3px 5px $grey;
    color: #242424;
    display: inline-block;
    font-family: 'Lucida Console';
    font-size: 11px;
    margin-top: 10px;
    padding: 5px;
    width: auto;
}

@media all and (max-width: 1100px) {
    .cmtx_icons_separator {
        display: none;
    }

    .cmtx_bb_code_container, .cmtx_smilies_container {
        float: none;
    }

    .cmtx_icons_separator + .cmtx_smilies_container {
        margin-top: 5px;
    }
}

@media all and (max-width: 800px) {
    .cmtx_user_row .cmtx_col_6 {
        float: none;
        width: 100%;
    }

    .cmtx_name_spacing {
        margin-bottom: 20px;
    }

    .cmtx_geo_row [class*='cmtx_col_'] {
        float: none;
        width: 100%;
    }

    .cmtx_town_container, .cmtx_country_container {
        margin-bottom: 15px;
    }

    .cmtx_question_row .cmtx_col_6 {
        float: none;
        width: 100%;
    }

    .cmtx_question_container {
        margin-bottom: 15px;
    }

    .cmtx_button_row .cmtx_col_2 {
        width: 50%;
    }

    .cmtx_button_row [class*='cmtx_col_']:not(:first-child):not(:last-child) {
        padding: 0 !important;
    }

    .cmtx_row:not(.cmtx_button_row) [class*='cmtx_col_'] {
        padding: 0 !important;
    }
}

@media all and (max-width: 500px) {
    .cmtx_button_row .cmtx_col_2 {
        float: none;
        width: 100%;
    }

    .cmtx_button_row [class*='cmtx_col_'] {
        padding: 0 !important;
    }

    .cmtx_preview_button_container {
        margin-top: 15px;
    }

    .cmtx_parsing_box {
        float: none;
        width: 100%;
    }
}

@media all and (max-width: 450px) {
    .cmtx_checkbox_extra {
        display: none;
    }

    .cmtx_info_extra {
        display: none;
    }
}
