/* Single-tone icons (Phosphor Icons, regular weight; see assets/icons/SOURCES.md), website only.
   - The navigation caret, icon('arrow'): one thin ">" in the text colour, no second tone. CSS turns it where it
     points elsewhere (back = left, back to top = up, previous photo = left).
   - The send envelope, icon('send'), before the label of every "send enquiry" button.
   icon() (includes/bootstrap.php) crops both to their own shape and takes their height from --caret-size and
   --send-size; each place below sets only that and the gap to its label. Loaded after the other stylesheets. */
:root { --caret-size: 12px; --send-size: 15px; }

/* Gold buttons with a caret after the label. */
.button:has(> .icon-arrow), .button:has(> .icon-send) { gap: 10px; }
.site-header .nav-menu-all { --caret-size: 12px; }

/* Text links. */
.footer-contact .footer-map, .contact-detail .contact-directions, .article-back { gap: 8px; --caret-size: 11px; }
.inner-page .template-text-link { gap: 10px; }

/* The date and guests band. */
.stay-search .stay-search-submit { --caret-size: 16px; }

/* Homepage rooms list: the caret at the right of each room. */
.room-detail-link { --caret-size: 18px; }

/* Round and square controls: previous/next photo, back to top. */
.arrow-button, .back-to-top { --caret-size: 20px; }

/* The send buttons: envelope, then the label, centred. */
.form-submit { justify-content: center; }

@media (max-width: 600px) {
  .arrow-button, .back-to-top { --caret-size: 18px; }
  .room-detail-link { --caret-size: 16px; }
  .stay-search .stay-search-submit { --caret-size: 15px; }
}