/**
 * Sonder Icons
 */
.icon {
  display: inline-block;
  height: 1em;
  line-height: 1;
  &::before {
    content: "";
    box-sizing: border-box;
    background-color: currentColor;
    display: inline-block;
    mask-size: cover;
    mask-repeat: no-repeat;
    position: relative;
    aspect-ratio: 1/1;
    height: 100%;
    vertical-align: bottom;
  }
}

/* Chevrons */
.icon.chevron-right,
.icon.chevron-up,
.icon.chevron-down,
.icon.chevron-left {
  &::before {
    mask-image: url("./svg/chevron-left.svg");
  }
  &.small::before {
    mask-image: url("./svg/small-chevron-left.svg");
  }
}

.icon.chevron-up {
  &::before {
    transform: rotate(90deg);
  }
}

.icon.chevron-down {
  &::before {
    transform: rotate(-90deg);
  }
}

.icon.chevron-right {
  &::before {
    transform: rotate(180deg);
  }
}

/* Navigation */
.icon.map {
  &::before {
    mask-image: url("./svg/map.svg");
  }
}

.icon.location,
.icon.pin {
  &::before {
    mask-image: url("./svg/location.svg");
  }
}

/* Status */
.icon.status-danger {
  &::before {
    mask-image: url("./svg/status-danger.svg");
  }
  &.bold {
    &::before {
      mask-image: url("./svg/status-danger-bold.svg");
    }
  }
  &.filled {
    &::before {
      mask-image: url("./svg/status-danger-filled.svg");
    }
  }
}

.icon.status-info {
  &::before {
    mask-image: url("./svg/status-info.svg");
  }
  &.bold {
    &::before {
      mask-image: url("./svg/status-info-bold.svg");
    }
  }
}

.icon.status-faq {
  &::before {
    mask-image: url("./svg/status-faq.svg");
  }
  &.bold {
    &::before {
      mask-image: url("./svg/status-faq-bold.svg");
    }
  }
}

.icon.icon-success,
.icon.status-success {
  &::before {
    mask-image: url("./svg/status-success.svg");
  }
  &.bold {
    &::before {
      mask-image: url("./svg/status-success-bold.svg");
    }
  }
}

.icon.status-warning {
  &::before {
    mask-image: url("./svg/status-warning.svg");
  }
}

/* Actions */
.icon.lock-open {
  &::before {
    /* Do not modify this icon viewBox without scaling its path in same ratio */
    mask-image: url("./svg/lock-open.svg");
  }
}

.icon.lock-closed {
  &::before {
    mask-image: url("./svg/lock-closed.svg");
  }
}

.icon.pencil {
  &::before {
    /* Do not modify this icon viewBox without scaling its path in same ratio */
    mask-image: url("./svg/pencil.svg");
  }
}

.icon.notes {
  &::before {
    mask-image: url("./svg/notes.svg");
  }
}

.icon.notes-management {
  &::before {
    mask-image: url("./svg/notes-management.svg");
  }
}

.icon.external-link {
  &::before {
    mask-image: url("./svg/external-link.svg");
  }
}

/* Communication */
.icon.icon-chat {
  &::before {
    mask-image: url("./svg/icon-chat-outline.svg");
  }
  &.filled {
    &::before {
      mask-image: url("./svg/icon-chat-filled.svg");
    }
  }
}

.icon.icon-call {
  &::before {
    mask-image: url("./svg/icon-call-outline.svg");
  }
  &.filled {
    &::before {
      mask-image: url("./svg/icon-call-filled.svg");
    }
  }
}

.icon.icon-email {
  &::before {
    mask-image: url("./svg/icon-email.svg");
  }
}

/* Portal */
.icon.home-repair-services {
  &::before {
    mask-image: url("./svg/home-repair-services.svg");
  }
}

/* UI */
.icon.icon-check {
  &::before {
    mask-image: url("./svg/icon-check.svg");
  }
}

.icon.menu {
  &::before {
    mask-image: url("./svg/menu.svg");
  }
}

.icon.time {
  &::before {
    mask-image: url("./svg/time.svg");
  }
}

.icon.close {
  &::before {
    mask-image: url("./svg/close.svg");
  }
}

.icon.circle {
  &::before {
    mask-image: url("./svg/circle.svg");
  }
}

.icon.loading-spinner {
  &::before {
    background-color: transparent;
    background-image: url("./svg/loading-spinner.svg");
    background-size: contain;
    background-repeat: no-repeat;
    mask-image: none;
  }
}

/* Lucide */
.icon.download,
.icon.download.lucide {
  &::before {
    mask-image: url("./svg/lucide-download.svg");
  }
}

.icon.dumbbell,
.icon.dumbbell.lucide {
  &::before {
    mask-image: url("./svg/lucide-dumbbell.svg");
  }
}

.icon.hand-heart,
.icon.hand-heart.lucide {
  &::before {
    mask-image: url("./svg/lucide-hand-heart.svg");
  }
}

.icon.hospital,
.icon.hospital.lucide {
  &::before {
    mask-image: url("./svg/lucide-hospital.svg");
  }
}

.icon.stethoscope,
.icon.stethoscope.lucide {
  &::before {
    mask-image: url("./svg/lucide-stethoscope.svg");
  }
}

/* DEPRECATED */
.icon.alert-circle {
  &::before {
    mask-image: url("./svg/status-danger-filled.svg");
  }
}

/* Template
.icon.icon-name {
  &::before {
    mask-image: url('./svg/icon-name.svg');
    aspect-ratio: w / h;
  }
}
*/

/*# sourceMappingURL=sonder-icons.css.map */
