@layer components {
    .icon {
        -webkit-touch-callout: none;
        background-color: currentColor;
        block-size: var(--icon-size, 1em);
        display: inline-block;
        flex-shrink: 0;
        inline-size: var(--icon-size, 1em);
        mask-image: var(--svg);
        mask-position: center;
        mask-repeat: no-repeat;
        mask-size: var(--icon-size, 1em);
        pointer-events: none;
        user-select: none;
    }

    img.icon {
        background: none;
    }

    .icon--arpedon {
        --svg: url("../icons/logo.2f6d011bb4ab.svg");
    }

    .icon--add {
        --svg: url("../icons/add.85aa755292d6.svg");
    }

    .icon--add--meta {
        --svg: url("../icons/add--meta.df4c9925653a.svg");
    }

    .icon--arrow-left {
        --svg: url("../icons/arrow-left.92220d207baa.svg");
    }

    .icon--arrow-right {
        --svg: url("../icons/arrow-right.425c3166bf63.svg");
    }

    .icon--arrow-up {
        --svg: url("../icons/arrow-up.36a88af01371.svg");
    }

    .icon--art {
        --svg: url("../icons/art.d5df9c8ba232.svg");
    }

    .icon--asset {
        --svg: url("../icons/asset.660946749811.svg");
    }

    .icon--assigned {
        --svg: url("../icons/assigned.734c2f7b791a.svg");
    }

    .icon--attachment {
        --svg: url("../icons/attachment.4080801c557e.svg");
    }

    .icon--bell-alert {
        --svg: url("../icons/bell-alert.6663713a5ba7.svg");
    }

    .icon--bell-off {
        --svg: url("../icons/bell-off.b294383cb3fb.svg");
    }

    .icon--bell {
        --svg: url("../icons/bell.882489a1a1c3.svg");
    }

    .icon--bolt {
        --svg: url("../icons/bolt.bef43ca3f7a3.svg");
    }

    .icon--bookmark-outline {
        --svg: url("../icons/bookmark-outline.095d7b6c38ea.svg");
    }

    .icon--bookmark {
        --svg: url("../icons/bookmark.ab729cba8fbc.svg");
    }

    .icon--boost {
        --svg: url("../icons/boost.8955c949ce67.svg");
    }

    .icon--camera {
        --svg: url("../icons/camera.54439bcdbdb9.svg");
    }

    .icon--caret-down {
        --svg: url("../icons/chevron-down.f4f215b10295.svg");
    }

    .icon--check {
        --svg: url("../icons/check.73f64d1a9f0f.svg");
    }

    .icon--check-circle {
        --svg: url("../icons/check-circle.68e4583a8ea2.svg");
    }

    .icon--check-all {
        --svg: url("check-all.svg");
    }

    .icon--clipboard {
        --svg: url("../icons/clipboard.ece250eea746.svg");
    }

    .icon--close {
        --svg: url("../icons/xmark.1461375544bd.svg");
    }

    .icon--close-circle {
        --svg: url("../icons/close-circle.b820cccb23a3.svg");
    }

    .icon--collapse {
        --svg: url("../icons/collapse.6a732a1bdb0f.svg");
    }

    .icon--section {
        --svg: url("../icons/section.0a72712f4c07.svg");
    }

    .icon--column-left {
        --svg: url("../icons/column-left.53aa9a8957f0.svg");
    }

    .icon--column-right {
        --svg: url("../icons/column-right.25d4342a8830.svg");
    }

    .icon--comment {
        --svg: url("../icons/comment.ece013988000.svg");
    }

    .icon--copy-paste {
        --svg: url("../icons/copy-paste.c8193391b348.svg");
    }

    .icon--crown {
        --svg: url("../icons/crown.55f7fe0932f6.svg");
    }

    .icon--email {
        --svg: url("../icons/email.44a5b4d17e32.svg");
    }

    .icon--everyone {
        --svg: url("../icons/everyone.a96ee84a0894.svg");
    }

    .icon--expand {
        --svg: url("../icons/expand.95f87ca755da.svg");
    }

    .icon--eye {
        --svg: url("../icons/eye.9ed0d9eb886f.svg");
    }

    .icon--eye-slash {
        --svg: url("../icons/eye-slash.fdd22e45d470.svg");
    }

    .icon--gear {
        --svg: url("../icons/gear.bed17658006d.svg");
    }

    .icon--grid {
        --svg: url("../icons/grid.4d9eccc4717c.svg");
    }

    .icon--grip {
        --svg: url("../icons/grip.ca28df94a110.svg");
    }

    .icon--filter {
        --svg: url("../icons/filter.de63f763a4ab.svg");
    }

    .icon--fizzy {
        --svg: url("../icons/fizzy.ec768e69fa78.svg");
    }

    .icon--globe {
        --svg: url("../icons/globe.cfafefa3a604.svg");
    }

    .icon--golden-ticket {
        --svg: url("../icons/golden-ticket.74b4a16108f0.svg");
    }

    .icon--history {
        --svg: url("../icons/history.d55f58fc247c.svg");
    }

    .icon--home {
        --svg: url("../icons/home.54c3a1082d1f.svg");
    }

    .icon--install {
        --svg: url("../icons/install.74d7df6558b8.svg");
    }

    .icon--install {
        --svg: url("../icons/install.74d7df6558b8.svg");
    }

    .icon--install-edge {
        --svg: url("../icons/install-edge.4e2a627c7a41.svg");
    }

    .icon--lifebuoy {
        --svg: url("../icons/lifebuoy.a659a554a614.svg");
    }

    .icon--lock {
        --svg: url("../icons/lock.81c6c7566dfc.svg");
    }

    .icon--logout {
        --svg: url("../icons/logout.6db143025174.svg");
    }

    .icon--marker {
        --svg: url("../icons/marker.4ea57301ab32.svg");
    }

    .icon--maximize {
        --svg: url("../icons/maximize.88cce0eef380.svg");
    }

    .icon--menu {
        --svg: url("menu.svg");
    }

    .icon--menu-dots-horizontal {
        --svg: url("../icons/menu-dots-horizontal.a2c2b3228cac.svg");
    }

    .icon--menu-dots-vertical {
        --svg: url("../icons/menu-dots-vertical.5618eb64903c.svg");
    }

    .icon--minus {
        --svg: url("../icons/minus.05795d92eadc.svg");
    }

    .icon--move {
        --svg: url("../icons/move.3a9ec4917c57.svg");
    }

    .icon--notification-bell-access-only {
        --svg: url("../icons/bell.882489a1a1c3.svg");
    }

    .icon--notification-bell-watching {
        --svg: url("../icons/bell-off.b294383cb3fb.svg");
    }

    .icon--notification-bell-reverse-access-only {
        --svg: url("../icons/bell-off.b294383cb3fb.svg");
    }

    .icon--notification-bell-reverse-watching {
        --svg: url("../icons/bell.882489a1a1c3.svg");
    }

    .icon--password {
        --svg: url("../icons/password.f583843514cf.svg");
    }

    .icon--point-add {
        --svg: url("../icons/point-add.66f163951bf2.svg");
    }

    .icon--pencil {
        --svg: url("../icons/pencil.a87400d20376.svg");
    }

    .icon--person {
        --svg: url("../icons/person.1a111c1a96b6.svg");
    }

    .icon--person-add {
        --svg: url("../icons/person-add.f1849759826e.svg");
    }

    .icon--picture-add {
        --svg: url("../icons/picture-add.e78902a12c3c.svg");
    }

    .icon--picture-double {
        --svg: url("picture-double.svg");
    }

    .icon--picture-remove {
        --svg: url("../icons/picture-remove.3cbfd4df065b.svg");
    }

    .icon--picture-zoom {
        --svg: url("../icons/picture-zoom.2e53b177a15b.svg");
    }

    .icon--pinned {
        --svg: url("../icons/pinned.a9d7dbd3d5f6.svg");
    }

    .icon--qr-code {
        --svg: url("../icons/qr-code.9b8645268bfa.svg");
    }

    .icon--route {
        --svg: url("../icons/route.69d9b5beb48a.svg");
    }

    .icon--refresh {
        --svg: url("../icons/arrows-rotate.17e28c73de83.svg");
    }

    .icon--refresh--meta {
        --svg: url("../icons/arrows-rotate.17e28c73de83.svg");
    }

    .icon--remove {
        --svg: url("../icons/remove.9c5df20915ae.svg");
    }

    .icon--rename {
        --svg: url("../icons/rename.0fe2feef5acb.svg");
    }

    .icon--search {
        --svg: url("../icons/search.199bb941690d.svg");
    }

    .icon--settings {
        --svg: url("../icons/settings.fc4c00261b90.svg");
    }

    .icon--share {
        --svg: url("../icons/share.1cc56f0febdb.svg");
    }

    .icon--siren {
        --svg: url("../icons/siren.46e020a87427.svg");
    }

    .icon--sliders {
        --svg: url("../icons/sliders.fc4c00261b90.svg");
    }

    .icon--switch {
        --svg: url("../icons/switch.3524f02af0c3.svg");
    }

    .icon--tag {
        --svg: url("../icons/tag.f69d100d9359.svg");
    }

    .icon--tag-outline {
        --svg: url("../icons/tag-outline.7d30f0b45f0f.svg");
    }

    .icon--triangle {
        --svg: url("../icons/triangle.6b6eeaab8a51.svg");
    }

    .icon--thumb-up {
        --svg: url("../icons/thumb-up.ac42820f545d.svg");
    }

    .icon--trash {
        --svg: url("../icons/trash.9806740de93e.svg");
    }

    .icon--unpinned {
        --svg: url("../icons/unpinned.d968921f4435.svg");
    }

    .icon--unseen {
        --svg: url("../icons/unseen.633ecff96293.svg");
    }

    .icon--warning {
        --svg: url("../icons/warning.ba2ec40b450e.svg");
    }

    .icon--world {
        --svg: url("../icons/world.17f5c51254d9.svg");
    }

    .icon--xmark {
        --svg: url("../icons/xmark.1461375544bd.svg");
    }

    .icon--youtube {
        --svg: url("../icons/youtube.02cc19ccf2e9.svg");
    }

    .icon--zone {
        --svg: url("../icons/zone.4eea49b0843f.svg");
    }

    /* Measurement type icons */
    .icon--thermometer {
        --svg: url("../icons/thermometer.1a8fac22c83e.svg");
    }

    .icon--waveform {
        --svg: url("../icons/waveform.c050ca966363.svg");
    }

    .icon--analysis {
        --svg: url("../icons/analysis.cbce87e77949.svg");
    }

    .icon--gauge {
        --svg: url("../icons/gauge.af42c2bf17ee.svg");
    }

    .icon--empty-set {
        --svg: url("../icons/empty-set.52f1edc9e709.svg");
    }

    .icon--droplet {
        --svg: url("../icons/droplet.b0494a7c7542.svg");
    }

    .icon--lightning {
        --svg: url("../icons/lightning.c93fd4520e61.svg");
    }

    .icon--tachometer {
        --svg: url("../icons/tachometer.c273ca4e676d.svg");
    }

    .icon--thermography {
        --svg: url("../icons/thermography.765d98bbbc48.svg");
    }

    .icon--vibration {
        --svg: url("../icons/waveform.c050ca966363.svg");
    }

    .icon--ultrasound {
        --svg: url("../icons/waveform-lines.f118aa65ab1b.svg");
    }

    /* Icon colors for measurement types */
    .icon--temp-color {
        color: oklch(var(--lch-red-medium));
    }

    .icon--vibration-color {
        color: oklch(var(--lch-blue-medium));
    }

    .icon--pressure-color {
        color: oklch(var(--lch-purple-medium, 55% 0.2 290));
    }

    .icon--flow-color {
        color: oklch(var(--lch-cyan-medium, 65% 0.15 200));
    }

    .icon--electrical-color {
        color: oklch(var(--lch-yellow-medium));
    }
}