/*
 * HomePro checkout checkbox repair.
 * Scoped to WooCommerce checkout only. It intentionally overrides older
 * HomePro custom CSS that used a text glyph for the checked mark.
 */
body.woocommerce-checkout form.checkout input[type="checkbox"],
body.woocommerce-checkout form.checkout input.input-checkbox,
body.woocommerce-checkout .woocommerce-checkout-review-order input[type="checkbox"],
body.woocommerce-checkout .woocommerce-checkout-review-order input.input-checkbox {
    -webkit-appearance: none !important;
    appearance: none !important;
    box-sizing: border-box !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    margin: 0 12px 0 0 !important;
    padding: 0 !important;
    position: relative !important;
    display: inline-block !important;
    opacity: 1 !important;
    transform: none !important;
    vertical-align: middle !important;
    background: #ffffff !important;
    border: 1px solid #333333 !important;
    border-radius: 4px !important;
    box-shadow: none !important;
    cursor: pointer !important;
    flex: 0 0 18px !important;
    transition: border-color .2s ease, background-color .2s ease !important;
}

body.woocommerce-checkout form.checkout input[type="checkbox"]:checked,
body.woocommerce-checkout form.checkout input.input-checkbox:checked,
body.woocommerce-checkout .woocommerce-checkout-review-order input[type="checkbox"]:checked,
body.woocommerce-checkout .woocommerce-checkout-review-order input.input-checkbox:checked {
    background: #0eaaa6 !important;
    border-color: #0eaaa6 !important;
}

/* Neutralize theme/legacy marks first. */
body.woocommerce-checkout form.checkout input[type="checkbox"]::before,
body.woocommerce-checkout form.checkout input.input-checkbox::before,
body.woocommerce-checkout .woocommerce-checkout-review-order input[type="checkbox"]::before,
body.woocommerce-checkout .woocommerce-checkout-review-order input.input-checkbox::before {
    display: none !important;
    content: none !important;
}

body.woocommerce-checkout form.checkout input[type="checkbox"]::after,
body.woocommerce-checkout form.checkout input.input-checkbox::after,
body.woocommerce-checkout .woocommerce-checkout-review-order input[type="checkbox"]::after,
body.woocommerce-checkout .woocommerce-checkout-review-order input.input-checkbox::after {
    content: "" !important;
    display: none !important;
}

/* Draw a true CSS tick; no text character or icon font is used. */
body.woocommerce-checkout form.checkout input[type="checkbox"]:checked::after,
body.woocommerce-checkout form.checkout input.input-checkbox:checked::after,
body.woocommerce-checkout .woocommerce-checkout-review-order input[type="checkbox"]:checked::after,
body.woocommerce-checkout .woocommerce-checkout-review-order input.input-checkbox:checked::after {
    content: "" !important;
    display: block !important;
    box-sizing: border-box !important;
    position: absolute !important;
    left: 5px !important;
    top: 1px !important;
    width: 6px !important;
    height: 11px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-style: solid !important;
    border-color: #ffffff !important;
    border-width: 0 2px 2px 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 1 !important;
    box-shadow: none !important;
    opacity: 1 !important;
    transform: rotate(45deg) !important;
}

body.woocommerce-checkout form.checkout input[type="checkbox"]:focus-visible,
body.woocommerce-checkout form.checkout input.input-checkbox:focus-visible,
body.woocommerce-checkout .woocommerce-checkout-review-order input[type="checkbox"]:focus-visible,
body.woocommerce-checkout .woocommerce-checkout-review-order input.input-checkbox:focus-visible {
    outline: 2px solid #087f7c !important;
    outline-offset: 3px !important;
}