/* Fixed decoration only: field height, border, font and colors stay with the theme. */
input.site-phone-format,
input[name="billing_phone"],
input[name="shipping_phone"],
input[name="_billing_phone"],
input[name="_shipping_phone"],
.wpcf7 input.wpcf7-tel,
input#billing-phone,
input#shipping-phone {
    background-image: var(--site-phone-decoration, url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2256%22%20height%3D%2220%22%20viewBox%3D%220%200%2056%2020%22%3E%3Crect%20x%3D%220%22%20y%3D%223%22%20width%3D%2220%22%20height%3D%2214%22%20rx%3D%222%22%20fill%3D%22%23E30A17%22%2F%3E%3Ccircle%20cx%3D%227.1%22%20cy%3D%2210%22%20r%3D%223.5%22%20fill%3D%22%23fff%22%2F%3E%3Ccircle%20cx%3D%228%22%20cy%3D%2210%22%20r%3D%222.8%22%20fill%3D%22%23E30A17%22%2F%3E%3Cpolygon%20points%3D%2210.2%2C10%2012.6%2C10.8%2011.7%2C8.4%2011.7%2C11.6%2012.6%2C9.2%22%20fill%3D%22%23fff%22%2F%3E%3Ctext%20x%3D%2225%22%20y%3D%2214.5%22%20font-family%3D%22-apple-system%2C%20BlinkMacSystemFont%2C%20%27Segoe%20UI%27%2C%20Roboto%2C%20Helvetica%2C%20Arial%2C%20sans-serif%22%20font-size%3D%2213%22%20font-weight%3D%22bold%22%20fill%3D%22%23444444%22%3E%2B90%3C%2Ftext%3E%3C%2Fsvg%3E')) !important;
    background-repeat: no-repeat !important;
    background-position: left 12px center !important;
    padding-left: 4.8em !important;
    background-size: 3.8em 1.4em !important;
}

/* Keep the native floating label above the example in Checkout Blocks. */
.wc-block-components-text-input:has(input#billing-phone) label,
.wc-block-components-text-input:has(input#shipping-phone) label {
    top: 6px;
    transform: scale(.82);
}
.wc-block-components-text-input input#billing-phone,
.wc-block-components-text-input input#shipping-phone {
    padding-top: 1.5em !important;
    padding-bottom: .5em !important;
    background-position: left 12px bottom .5em !important;
}