/*
  Contact Us CSS

  Avid CNC, LLC.
  http://www.avidcnc.com
  Copyright (c) 2022 Avid CNC
*/

/* Hide the form while it is being configured. */
#contact_us_form { display: none; }

/* Contact us paragraph styling. */
#contactus-wrapper p { display: block; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; }

/* Fill out the rest of the body for osCommerce. */
.osc-body { /*background-color: #101010*/ }

/* Make feedback a little larger for osCommerce. */
.osc-body .invalid-feedback { font-size: 97%; }

/* Put the phone input on a separate line. */
/* Adjust the phone input country name drop down color. */
.iti { display: table-cell !important; }
.iti__divider { margin-bottom: 3px !important; padding-bottom: 3px !important; }
.iti__country { margin-bottom: 3px !important; padding-bottom: 3px !important; }
.iti__country-name { color: #999 }
.iti__selected-dial-code { color: black }

/* Show a red asterisk after the label for required inputs. */
.form-group.required .control-label:after { content: "*"; color: red; }

/* Make exceptions for the support site bootstrap/mkdocs differences. */
.d-none { display: none }
.form-group.form-group-footer { border-top: solid 1px #dee2e6; }
.form-group-footer { padding: 10px 10px 0 10px; }
.form-group-footer .form-button { border: none !important; }
.recaptcha-terms { font-size: 0.9rem; border: none !important; }

/* Contact us, survey, payment request success/error formatting. */
.contact-us-message { width: 100%; padding: 10px; margin: 5px; font-size: 0.9rem; border-radius: 18px; }
.contact-us-message ul { margin: 0 }
.contact-us-message.error { border: solid 2px black; background-color: #f17f7f; }
.contact-us-message.success { border: solid 2px black; background-color: #8cff8c; }
.contact-us-message h5 { font-weight: bold; color: black; text-align: center; }

/* Make it a little more obvious that placeholders are not values. */
.form-control::placeholder { opacity: 0.8; }
.form-control:-ms-input-placeholder { opacity: 0.8; }
.form-control::-ms-input-placeholder { opacity: 0.8; }

/* Google places autocomplete input */
.pac-target-input { font-size: 16px; border: 1px solid #b5b5b5; border-radius: 8px; padding: 10px; }

/* Address */
.address { margin-top: 10px !important; }
.address-container { /*border: 1px solid #b5b5b5; border-radius: 8px; padding: 10px; */}
.address-inputs { padding: 15px !important; }
.address-input-group { margin-bottom: 10px !important; font-size: 14px; }
.address-input {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; font-size: 16px; color: black;
  border: 1px solid #b5b5b5; padding: 10px;
}

/* Customer rating styling. */
.rating-bar { display: table-cell; padding: 0; }
.rating-bar-grouping { display: inline-block; text-align: center; }
.rating-bar-btn { display: none; }
.rating-bar-btn-label {
  display: inline-block; margin: 5px; cursor: pointer;
  text-align: center; background-color: white;
  border: 2px solid #ced4da; border-radius: 8px;
  color: #495057; font-size: 16px; padding: 12px;
}
.rating-bar-label { display: block !important; padding-top: 2px; font-size: 13px; }
.rating-bar-btn:checked + label { border: 2px solid #ab2228; }
.rating-bar-btn:hover + label { border: 2px solid #ab2228; }
.osc-body .rating-bar-btn-label { border: 3px solid white; background-color: white; padding: 10px; }
.osc-body .rating-bar-btn:checked + label { border: 3px solid #ab2228; padding-top: 11px; padding-bottom: 10px; }
.osc-body .rating-bar-btn:hover + label { border: 3px solid #ab2228; padding-top: 11px; padding-bottom: 10px; }

/* Alert styling. */
.alert { padding: 15px; margin-bottom: 20px; border: 1px solid transparent; border-radius: 4px; }
.alert-success { color: #3c763d; background-color: #dff0d8; border-color: #d6e9c6; }
.alert-danger { color: #a94442; background-color: #f2dede; border-color: #ebccd1; }
.alert-dismissable, .alert-dismissible { padding-right: 35px; }
.alert-text { color: red; }
.form-check .error-message { color: #ab2228; }