/* This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */

/* Hide the message about autofill availability since it's not relevant */
#country-warning-message {
  display: none;
}

/* Hide all form fields that are not explicitly requested
 * by the paymentOptions object.
 */
address-form[address-fields]:not([address-fields~='name']) #name-container,
address-form[address-fields] #organization-container,
address-form[address-fields] #street-address-container,
address-form[address-fields] #address-level2-container,
address-form[address-fields] #address-level1-container,
address-form[address-fields] #postal-code-container,
address-form[address-fields] #country-container,
address-form[address-fields]:not([address-fields~='email']) #email-container,
address-form[address-fields]:not([address-fields~='tel']) #tel-container {
  /* !important is needed because autofillEditForms.js sets
     inline styles on the form fields with display: flex; */
  display: none !important;
}

label[required] > span:first-of-type::after {
  /* The asterisk should be localized, bug 1472278 */
  content: "*";
}

.error-text:not(:empty) {
  color: #fff;
  background-color: #d70022;
  border-radius: 2px;
  /* The padding-top and padding-bottom are referenced by address-form.js */
  padding: 5px 12px;
  position: absolute;
  z-index: 1;
  pointer-events: none;
}

body[dir="ltr"] .error-text {
  left: 3px;
}

body[dir="rtl"] .error-text {
  right: 3px;
}

:-moz-any(input, textarea, select):focus + .error-text:not(:empty)::before {
  background-color: #d70022;
  top: -7px;
  content: '.';
  height: 16px;
  position: absolute;
  text-indent: -999px;
  transform: rotate(45deg);
  white-space: nowrap;
  width: 16px;
  z-index: -1
}

body[dir=ltr] .error-text::before {
  left: 12px
}

body[dir=rtl] .error-text::before {
  right: 12px
}

:-moz-any(input, textarea, select):not(:focus) + .error-text,
:-moz-any(input, textarea, select):valid + .error-text {
  display: none;
}
