/* ── Icon system ─────────────────────────────────────────────────────────────
 *
 * CSS mask technique: the element is a solid-coloured rectangle; the SVG acts
 * as a stencil. Opaque SVG pixels let background-color: currentColor through;
 * transparent pixels are clipped. Icon colour is controlled entirely by the
 * parent's CSS `color` property — no JS, no font loading, no DOM SVG markup.
 *
 * See doc/icons.org for the full process of adding new icons.
 * ─────────────────────────────────────────────────────────────────────────── */

.icon {
  background-color: currentColor;
  display: inline-block;
  flex-shrink: 0;
  width:  var(--icon-size, 1.1em);
  height: var(--icon-size, 1.1em);
  mask-image:    var(--svg);
  mask-position: center;
  mask-repeat:   no-repeat;
  mask-size:     var(--icon-size, 1.1em);
  -webkit-mask-image:    var(--svg);
  -webkit-mask-position: center;
  -webkit-mask-repeat:   no-repeat;
  -webkit-mask-size:     var(--icon-size, 1.1em);
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
  vertical-align: middle;
}

/* ── Icon registry (alphabetical) ─────────────────────────────────────────── */
.icon--bug              { --svg: url("/assets/icons/bug-348040b2.svg"); }
.icon--calendar         { --svg: url("/assets/icons/calendar-e507808d.svg"); }
.icon--camera           { --svg: url("/assets/icons/camera-57849926.svg"); }
.icon--chart-line       { --svg: url("/assets/icons/chart-line-e2697238.svg"); }
.icon--chevron-left     { --svg: url("/assets/icons/chevron-left-7f66bb17.svg"); }
.icon--chevron-right    { --svg: url("/assets/icons/chevron-right-8d3222f8.svg"); }
.icon--chevrons-down-up { --svg: url("/assets/icons/chevrons-down-up-ac100b78.svg"); }
.icon--chevrons-up-down { --svg: url("/assets/icons/chevrons-up-down-d11e649e.svg"); }
.icon--circle-check     { --svg: url("/assets/icons/circle-check-fb350e8e.svg"); }
.icon--circle-plus      { --svg: url("/assets/icons/circle-plus-1f4cc0c2.svg"); }
.icon--circle-x         { --svg: url("/assets/icons/circle-x-80fb3c44.svg"); }
.icon--clipboard-list   { --svg: url("/assets/icons/clipboard-list-6b5467f2.svg"); }
.icon--cog              { --svg: url("/assets/icons/cog-ee521a6d.svg"); }
.icon--layout-dashboard { --svg: url("/assets/icons/layout-dashboard-0ce21a4e.svg"); }
.icon--palette          { --svg: url("/assets/icons/palette-af6b0d1a.svg"); }
.icon--pencil           { --svg: url("/assets/icons/pencil-e5e34c50.svg"); }
.icon--qr-code          { --svg: url("/assets/icons/qr-code-8ff234be.svg"); }
.icon--receipt          { --svg: url("/assets/icons/receipt-57c4bf64.svg"); }
.icon--siren            { --svg: url("/assets/icons/siren-b32414f9.svg"); }
.icon--table-2          { --svg: url("/assets/icons/table-2-4ecad12b.svg"); }
.icon--tag              { --svg: url("/assets/icons/tag-ef257c93.svg"); }
.icon--text-cursor-input { --svg: url("/assets/icons/text-cursor-input-4a896ee3.svg"); }
.icon--trash-2          { --svg: url("/assets/icons/trash-2-649b56f2.svg"); }
.icon--user             { --svg: url("/assets/icons/user-02b957fb.svg"); }
.icon--wallet           { --svg: url("/assets/icons/wallet-212f8ff5.svg"); }
.icon--x               { --svg: url("/assets/icons/x-de169dd0.svg"); }