/* Use this to change color style of checkout form
   1/ rename this file to color-change.css
   2/ specify target color in attributes below
   3/ go to codepen and enter target color there https://codepen.io/sosuke/pen/Pjoqqp
   4/ change filter attribute as per calculation on codepen
*/

.page-content .checkout-block[class*='num-'] .block-header:before,
.page-content .custom-checkbox input[type=checkbox] + span .checkbox-checked,
.mark-required .page-content .form-group.text label.required .field-label::after,
.mark-required .page-content .form-group.text.need-dni label .field-label::after,
.mark-required .page-content .form-group.email label.required .field-label::after,
.mark-required .page-content .form-group.password label.required .field-label::after,
.mark-required .page-content .form-group.tel label.required .field-label::after,
.mark-required .page-content .form-group.select label.required .field-label::after,
.mark-required .page-content .form-group.countrySelect label.required .field-label::after,
.page-content span.carrier-delay,
.page-content .product-price {
  color: #e1d066;
}

body#checkout .page-content .checkout-block .inner-area .offer-login a,
body#checkout .checkout-block .inner-area .offer-login a:hover,
body#checkout .has-discount .discount {
  background-color: #e1d066;
}

#content.page-content .custom-checkbox input[type=checkbox] + span {
  border-color: #e1d066;
}

#content.page-content .custom-checkbox input[type=checkbox]:checked + span,
#content.page-content .custom-radio input[type=radio]:checked + span {
    background-image: url(../img/checkmark-bw.png)!important;
    border-color: black;
    filter: invert(75%) sepia(74%) saturate(308%) hue-rotate(7deg) brightness(101%) contrast(85%);
}

.checkout-block .inner-area .offer-login a:hover {
    opacity: 0.7;
}

.cart-voucher > p > a.promo-code-button.collapsed {
    background: #ededed;
    color: #000;
}

.promo-input-button > * {
    height: 40px !important;
}