/*
 * Icon set. Each icon is an SVG used as a CSS mask, so it takes the text colour (or background-color for the
 * section/nav/dropzone icons) of whatever it sits in.
 *
 *   <span class="icon icon-check" aria-hidden="true"></span>        sized with the surrounding text
 *   <span class="icon icon-lg icon-trash-can"></span>               .icon-sm, .icon-lg and .icon-xl scale it
 *   <span class="menu-icon icon-wrench"></span>                     fixed 1rem, for menus
 *
 * Files live in /assets/images/icons. Font Awesome files are named <name>-regular-full.svg; the few simple
 * icons drawn for this project are <name>-custom.svg.
 */

/* Shared masking for every class that carries an icon-* class */
.icon,
.menu-icon,
.section-icon,
.nav-icon,
.dropzone-icon {
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

.icon,
.menu-icon {
    display: inline-block;
    flex: 0 0 auto;
    background-color: currentColor;
    vertical-align: -0.125em;
}

.icon {
    width: 1em;
    height: 1em;
}

.menu-icon {
    width: 1rem;
    height: 1rem;
    flex-basis: 1rem;
    vertical-align: baseline;
}

.icon-sm { width: 0.8em; height: 0.8em; }
.icon-lg { width: 1.5em; height: 1.5em; }
.icon-xl { width: 2.5em; height: 2.5em; }

/* Navigation and general */
.icon-address-book {
    -webkit-mask-image: url("/assets/images/icons/address-book-regular-full.svg");
    mask-image: url("/assets/images/icons/address-book-regular-full.svg");
}

.icon-aperture {
    -webkit-mask-image: url("/assets/images/icons/aperture-regular-full.svg");
    mask-image: url("/assets/images/icons/aperture-regular-full.svg");
}

.icon-camera-viewfinder {
    -webkit-mask-image: url("/assets/images/icons/camera-viewfinder-regular-full.svg");
    mask-image: url("/assets/images/icons/camera-viewfinder-regular-full.svg");
}

.icon-circle-small {
    -webkit-mask-image: url("/assets/images/icons/circle-small-regular-full.svg");
    mask-image: url("/assets/images/icons/circle-small-regular-full.svg");
}

.icon-circle-user {
    -webkit-mask-image: url("/assets/images/icons/circle-user-regular-full.svg");
    mask-image: url("/assets/images/icons/circle-user-regular-full.svg");
}

.icon-dollar-sign {
    -webkit-mask-image: url("/assets/images/icons/circle-dollar-regular-full.svg");
    mask-image: url("/assets/images/icons/circle-dollar-regular-full.svg");
}

.icon-earth-americas {
    -webkit-mask-image: url("/assets/images/icons/earth-americas-regular-full.svg");
    mask-image: url("/assets/images/icons/earth-americas-regular-full.svg");
}

.icon-face-smile-wink {
    -webkit-mask-image: url("/assets/images/icons/face-smile-wink-regular-full.svg");
    mask-image: url("/assets/images/icons/face-smile-wink-regular-full.svg");
}

.icon-face-swear {
    -webkit-mask-image: url("/assets/images/icons/face-swear-regular-full.svg");
    mask-image: url("/assets/images/icons/face-swear-regular-full.svg");
}

.icon-image {
    -webkit-mask-image: url("/assets/images/icons/image-regular-full.svg");
    mask-image: url("/assets/images/icons/image-regular-full.svg");
}

.icon-image-landscape {
    -webkit-mask-image: url("/assets/images/icons/image-landscape-regular-full.svg");
    mask-image: url("/assets/images/icons/image-landscape-regular-full.svg");
}

.icon-lightbulb-on {
    -webkit-mask-image: url("/assets/images/icons/lightbulb-on-regular-full.svg");
    mask-image: url("/assets/images/icons/lightbulb-on-regular-full.svg");
}

.icon-lips {
    -webkit-mask-image: url("/assets/images/icons/lips-regular-full.svg");
    mask-image: url("/assets/images/icons/lips-regular-full.svg");
}

.icon-list-ul {
    -webkit-mask-image: url("/assets/images/icons/list-ul-solid-full.svg");
    mask-image: url("/assets/images/icons/list-ul-solid-full.svg");
}

.icon-magnifying-glass-chart {
    -webkit-mask-image: url("/assets/images/icons/magnifying-glass-chart-regular-full.svg");
    mask-image: url("/assets/images/icons/magnifying-glass-chart-regular-full.svg");
}

.icon-money-check-pen {
    -webkit-mask-image: url("/assets/images/icons/money-check-pen-regular-full.svg");
    mask-image: url("/assets/images/icons/money-check-pen-regular-full.svg");
}

.icon-pencil {
    -webkit-mask-image: url("/assets/images/icons/pencil-regular-full.svg");
    mask-image: url("/assets/images/icons/pencil-regular-full.svg");
}

.icon-person-carry-empty {
    -webkit-mask-image: url("/assets/images/icons/person-carry-empty-regular-full.svg");
    mask-image: url("/assets/images/icons/person-carry-empty-regular-full.svg");
}

.icon-user-gear {
    -webkit-mask-image: url("/assets/images/icons/user-gear-regular-full.svg");
    mask-image: url("/assets/images/icons/user-gear-regular-full.svg");
}

.icon-user-hair-long {
    -webkit-mask-image: url("/assets/images/icons/user-hair-long-regular-full.svg");
    mask-image: url("/assets/images/icons/user-hair-long-regular-full.svg");
}

.icon-video {
    -webkit-mask-image: url("/assets/images/icons/video-regular-full.svg");
    mask-image: url("/assets/images/icons/video-regular-full.svg");
}

.icon-wardrobe {
    -webkit-mask-image: url("/assets/images/icons/wardrobe-regular-full.svg");
    mask-image: url("/assets/images/icons/wardrobe-regular-full.svg");
}

.icon-wrench {
    -webkit-mask-image: url("/assets/images/icons/wrench-regular-full.svg");
    mask-image: url("/assets/images/icons/wrench-regular-full.svg");
}


/* Status and actions (custom) */
.icon-check {
    -webkit-mask-image: url("/assets/images/icons/check-custom.svg");
    mask-image: url("/assets/images/icons/check-custom.svg");
}

.icon-copy {
    -webkit-mask-image: url("/assets/images/icons/copy-custom.svg");
    mask-image: url("/assets/images/icons/copy-custom.svg");
}

.icon-copy-regular {
    -webkit-mask-image: url("/assets/images/icons/copy-regular-full.svg");
    mask-image: url("/assets/images/icons/copy-regular-full.svg");
}

.icon-share {
    -webkit-mask-image: url("/assets/images/icons/share-custom.svg");
    mask-image: url("/assets/images/icons/share-custom.svg");
}

.icon-download {
    -webkit-mask-image: url("/assets/images/icons/download-custom.svg");
    mask-image: url("/assets/images/icons/download-custom.svg");
}

.icon-calendar {
    -webkit-mask-image: url("/assets/images/icons/calendar-custom.svg");
    mask-image: url("/assets/images/icons/calendar-custom.svg");
}

.icon-heart {
    -webkit-mask-image: url("/assets/images/icons/heart-custom.svg");
    mask-image: url("/assets/images/icons/heart-custom.svg");
}

.icon-users {
    -webkit-mask-image: url("/assets/images/icons/users-custom.svg");
    mask-image: url("/assets/images/icons/users-custom.svg");
}

.icon-flag {
    -webkit-mask-image: url("/assets/images/icons/flag-custom.svg");
    mask-image: url("/assets/images/icons/flag-custom.svg");
}

.icon-map-marker {
    -webkit-mask-image: url("/assets/images/icons/map-marker-custom.svg");
    mask-image: url("/assets/images/icons/map-marker-custom.svg");
}

.icon-quote {
    -webkit-mask-image: url("/assets/images/icons/quote-custom.svg");
    mask-image: url("/assets/images/icons/quote-custom.svg");
}

.icon-eye {
    -webkit-mask-image: url("/assets/images/icons/eye-custom.svg");
    mask-image: url("/assets/images/icons/eye-custom.svg");
}

.icon-droplet {
    -webkit-mask-image: url("/assets/images/icons/droplet-custom.svg");
    mask-image: url("/assets/images/icons/droplet-custom.svg");
}

.icon-person {
    -webkit-mask-image: url("/assets/images/icons/person-custom.svg");
    mask-image: url("/assets/images/icons/person-custom.svg");
}

.icon-star {
    -webkit-mask-image: url("/assets/images/icons/star-custom.svg");
    mask-image: url("/assets/images/icons/star-custom.svg");
}

.icon-circle {
    -webkit-mask-image: url("/assets/images/icons/circle-custom.svg");
    mask-image: url("/assets/images/icons/circle-custom.svg");
}

.icon-circle-question {
    -webkit-mask-image: url("/assets/images/icons/circle-question-custom.svg");
    mask-image: url("/assets/images/icons/circle-question-custom.svg");
}

.icon-circle-info {
    -webkit-mask-image: url("/assets/images/icons/circle-info-custom.svg");
    mask-image: url("/assets/images/icons/circle-info-custom.svg");
}

.icon-circle-dot {
    -webkit-mask-image: url("/assets/images/icons/circle-dot-custom.svg");
    mask-image: url("/assets/images/icons/circle-dot-custom.svg");
}

.icon-lock {
    -webkit-mask-image: url("/assets/images/icons/lock-custom.svg");
    mask-image: url("/assets/images/icons/lock-custom.svg");
}

.icon-thumbtack-angle {
    -webkit-mask-image: url("/assets/images/icons/thumbtack-angle-regular-full.svg");
    mask-image: url("/assets/images/icons/thumbtack-angle-regular-full.svg");
}

.icon-eye-slash {
    -webkit-mask-image: url("/assets/images/icons/eye-slash-regular-full.svg");
    mask-image: url("/assets/images/icons/eye-slash-regular-full.svg");
}

.icon-sparkles {
    -webkit-mask-image: url("/assets/images/icons/sparkles-regular-full.svg");
    mask-image: url("/assets/images/icons/sparkles-regular-full.svg");
}

.icon-pin {
    -webkit-mask-image: url("/assets/images/icons/pin-custom.svg");
    mask-image: url("/assets/images/icons/pin-custom.svg");
}

.icon-plus {
    -webkit-mask-image: url("/assets/images/icons/plus-custom.svg");
    mask-image: url("/assets/images/icons/plus-custom.svg");
}

.icon-trash-can {
    -webkit-mask-image: url("/assets/images/icons/trash-can-custom.svg");
    mask-image: url("/assets/images/icons/trash-can-custom.svg");
}

.icon-triangle-exclamation {
    -webkit-mask-image: url("/assets/images/icons/triangle-exclamation-custom.svg");
    mask-image: url("/assets/images/icons/triangle-exclamation-custom.svg");
}

.icon-xmark {
    -webkit-mask-image: url("/assets/images/icons/xmark-custom.svg");
    mask-image: url("/assets/images/icons/xmark-custom.svg");
}


/* Pulse personality aspects */
.icon-pulse-additional-instructions {
    -webkit-mask-image: url("/assets/images/icons/list-ul-solid-full.svg");
    mask-image: url("/assets/images/icons/list-ul-solid-full.svg");
}

.icon-pulse-background {
    -webkit-mask-image: url("/assets/images/icons/book-user-regular-full.svg");
    mask-image: url("/assets/images/icons/book-user-regular-full.svg");
}

.icon-pulse-daily-life {
    -webkit-mask-image: url("/assets/images/icons/house-regular-full.svg");
    mask-image: url("/assets/images/icons/house-regular-full.svg");
}

.icon-pulse-desire-sexuality {
    -webkit-mask-image: url("/assets/images/icons/fire-flame-curved-regular-full.svg");
    mask-image: url("/assets/images/icons/fire-flame-curved-regular-full.svg");
}

.icon-pulse-drives-shadow {
    -webkit-mask-image: url("/assets/images/icons/brain-arrow-curved-right-regular-full.svg");
    mask-image: url("/assets/images/icons/brain-arrow-curved-right-regular-full.svg");
}

.icon-pulse-final-text {
    -webkit-mask-image: url("/assets/images/icons/money-check-pen-regular-full.svg");
    mask-image: url("/assets/images/icons/money-check-pen-regular-full.svg");
}

.icon-pulse-hidden-threads {
    -webkit-mask-image: url("/assets/images/icons/box-archive-regular-full.svg");
    mask-image: url("/assets/images/icons/box-archive-regular-full.svg");
}

.icon-pulse-limits {
    -webkit-mask-image: url("/assets/images/icons/hand-regular-full.svg");
    mask-image: url("/assets/images/icons/hand-regular-full.svg");
}

.icon-pulse-mask-tells {
    -webkit-mask-image: url("/assets/images/icons/face-smile-wink-regular-full.svg");
    mask-image: url("/assets/images/icons/face-smile-wink-regular-full.svg");
}

.icon-pulse-mind-morals {
    -webkit-mask-image: url("/assets/images/icons/head-side-gear-regular-full.svg");
    mask-image: url("/assets/images/icons/head-side-gear-regular-full.svg");
}

.icon-pulse-my-changes {
    -webkit-mask-image: url("/assets/images/icons/pencil-regular-full.svg");
    mask-image: url("/assets/images/icons/pencil-regular-full.svg");
}

.icon-pulse-natural-behaviour {
    -webkit-mask-image: url("/assets/images/icons/circle-small-regular-full.svg");
    mask-image: url("/assets/images/icons/circle-small-regular-full.svg");
}

.icon-pulse-relationship-engine {
    -webkit-mask-image: url("/assets/images/icons/user-gear-regular-full.svg");
    mask-image: url("/assets/images/icons/user-gear-regular-full.svg");
}

.icon-pulse-romance-intimacy {
    -webkit-mask-image: url("/assets/images/icons/hearts-regular-full.svg");
    mask-image: url("/assets/images/icons/hearts-regular-full.svg");
}

.icon-pulse-sensory-stress {
    -webkit-mask-image: url("/assets/images/icons/face-weary-regular-full.svg");
    mask-image: url("/assets/images/icons/face-weary-regular-full.svg");
}

.icon-pulse-size {
    -webkit-mask-image: url("/assets/images/icons/chart-bars-custom.svg");
    mask-image: url("/assets/images/icons/chart-bars-custom.svg");
}

.icon-pulse-snapshot {
    -webkit-mask-image: url("/assets/images/icons/camera-viewfinder-regular-full.svg");
    mask-image: url("/assets/images/icons/camera-viewfinder-regular-full.svg");
}

.icon-pulse-social-conflict {
    -webkit-mask-image: url("/assets/images/icons/sword-regular-full.svg");
    mask-image: url("/assets/images/icons/sword-regular-full.svg");
}

.icon-pulse-voice-conversation {
    -webkit-mask-image: url("/assets/images/icons/lips-regular-full.svg");
    mask-image: url("/assets/images/icons/lips-regular-full.svg");
}

/* Character setup choice cards */
.icon-camera {
    -webkit-mask-image: url("/assets/images/icons/camera-regular-full.svg");
    mask-image: url("/assets/images/icons/camera-regular-full.svg");
}

.icon-crystal-ball {
    -webkit-mask-image: url("/assets/images/icons/crystal-ball-regular-full.svg");
    mask-image: url("/assets/images/icons/crystal-ball-regular-full.svg");
}

.icon-palette {
    -webkit-mask-image: url("/assets/images/icons/palette-regular-full.svg");
    mask-image: url("/assets/images/icons/palette-regular-full.svg");
}
