You can customize the Arrives By Delivery Time app block using your own CSS without directly modifying your theme code.
From your theme editor got to Theme Settings > Custom CSS
Here are different classes you can use to target your CSS
.arrivesby-dt | This wraps the entire Delivery Time component |
.date-text | The entire text of the delivery time including prefix and suffix. |
.date-range | The delivery date range including the separator text |
.inline-icon | The icon shown preceding the delivery time text. |
Example
Add to Custom CSS section of your theme. Gives Arrives By Delivery Time app block a light blue background with rounded corners and changes the delivery date text to red. Also adjust the font so everything is bold.
.arrivesby-dt {
background-color: lightblue;
padding: 1em;
border-radius: 10px;
font-weight: bold;
}
.arrivesby-dt .date-range {
color: red;
}