/* Font Awesome Free icons, shared by main.css and admin.css. The files are in /images/icons/.
   Each icon is a mask over the text colour, so it takes the colour of the text around it:
   terracotta on the customer pages and blue or slate in the admin area, from the same file.
   The icons are decorative: the markup is <span class="icon icon-name" aria-hidden="true"></span>,
   before a text label. To add one, copy its SVG from svgs/solid/ in the npm package
   @fortawesome/fontawesome-free, and add a rule for it below. */

.icon {
  display: inline-block;
  flex: none;
  width: 1.1em;
  height: 1.1em;
  margin-inline-end: 0.45em;
  vertical-align: -0.15em;
  background-color: currentColor;
  -webkit-mask: var(--icon) center / contain no-repeat;
  mask: var(--icon) center / contain no-repeat;
}

.icon-arrow-right-arrow-left { --icon: url("/images/icons/arrow-right-arrow-left.svg"); }
.icon-calendar-check { --icon: url("/images/icons/calendar-check.svg"); }
.icon-calendar-days { --icon: url("/images/icons/calendar-days.svg"); }
.icon-calendar-plus { --icon: url("/images/icons/calendar-plus.svg"); }
.icon-camera { --icon: url("/images/icons/camera.svg"); }
.icon-check { --icon: url("/images/icons/check.svg"); }
.icon-circle-check { --icon: url("/images/icons/circle-check.svg"); }
.icon-circle-question { --icon: url("/images/icons/circle-question.svg"); }
.icon-clock-rotate-left { --icon: url("/images/icons/clock-rotate-left.svg"); }
.icon-compact-disc { --icon: url("/images/icons/compact-disc.svg"); }
.icon-credit-card { --icon: url("/images/icons/credit-card.svg"); }
.icon-envelope { --icon: url("/images/icons/envelope.svg"); }
.icon-envelope-open-text { --icon: url("/images/icons/envelope-open-text.svg"); }
.icon-floppy-disk { --icon: url("/images/icons/floppy-disk.svg"); }
.icon-gift { --icon: url("/images/icons/gift.svg"); }
.icon-hourglass-half { --icon: url("/images/icons/hourglass-half.svg"); }
.icon-house { --icon: url("/images/icons/house.svg"); }
.icon-id-card { --icon: url("/images/icons/id-card.svg"); }
.icon-images { --icon: url("/images/icons/images.svg"); }
.icon-inbox { --icon: url("/images/icons/inbox.svg"); }
.icon-key { --icon: url("/images/icons/key.svg"); }
.icon-laptop { --icon: url("/images/icons/laptop.svg"); }
.icon-list { --icon: url("/images/icons/list.svg"); }
.icon-list-check { --icon: url("/images/icons/list-check.svg"); }
.icon-lock { --icon: url("/images/icons/lock.svg"); }
.icon-mobile-screen { --icon: url("/images/icons/mobile-screen.svg"); }
.icon-note-sticky { --icon: url("/images/icons/note-sticky.svg"); }
.icon-paper-plane { --icon: url("/images/icons/paper-plane.svg"); }
.icon-pen { --icon: url("/images/icons/pen.svg"); }
.icon-phone { --icon: url("/images/icons/phone.svg"); }
.icon-right-from-bracket { --icon: url("/images/icons/right-from-bracket.svg"); }
.icon-right-to-bracket { --icon: url("/images/icons/right-to-bracket.svg"); }
.icon-sd-card { --icon: url("/images/icons/sd-card.svg"); }
.icon-shield-halved { --icon: url("/images/icons/shield-halved.svg"); }
.icon-sterling-sign { --icon: url("/images/icons/sterling-sign.svg"); }
.icon-tag { --icon: url("/images/icons/tag.svg"); }
.icon-toolbox { --icon: url("/images/icons/toolbox.svg"); }
.icon-trash-can { --icon: url("/images/icons/trash-can.svg"); }
.icon-user { --icon: url("/images/icons/user.svg"); }
.icon-user-check { --icon: url("/images/icons/user-check.svg"); }
.icon-user-group { --icon: url("/images/icons/user-group.svg"); }
.icon-user-plus { --icon: url("/images/icons/user-plus.svg"); }
.icon-users { --icon: url("/images/icons/users.svg"); }
.icon-vault { --icon: url("/images/icons/vault.svg"); }
.icon-xmark { --icon: url("/images/icons/xmark.svg"); }
