/* Clickable phone/email links injected into the footer "Customer Service" list.
   The <li> is added server-side by depotMikadoChildInjectFooterContactItem()
   in components/footer.php, matched by link content (not block ID).

   Layout notes (no !important needed):
   - We keep the <li> as the theme renders it (footer .widget ul li {display:block}).
     Each anchor is its own block so the number and email sit on their own lines,
     matching the plain text links in the rest of the list.
   - The theme forces the <a> color (footer .widget ul li a, and the page's dynamic
     color rule), so the link text inherits the same colour as the sibling menu
     links. The leading <i> glyph inherits that colour too via currentColor. */

/* Scoped to out-specify `footer .widget ul li` for top spacing. */
footer .widget ul li.mkd-child-footer-contact {
    padding-top: 10px;
}

.mkd-child-footer-contact a {
    display: block; /* stack phone and email on their own lines */
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.mkd-child-footer-contact a + a {
    margin-top: 6px; /* space between the phone and email rows */
}

.mkd-child-footer-contact a:hover,
.mkd-child-footer-contact a:focus {
    opacity: 0.7;
    text-decoration: underline;
}

.mkd-child-footer-contact i {
    margin-right: 8px; /* gap between glyph and the text it labels */
    font-size: 14px;
    width: 16px; /* fixed width aligns the phone and email text vertically */
    text-align: center;
}