_patterns_icons.scss

@import 'settings';

@mixin vf-p-icons {
  @include vf-p-icons-common;
  @include vf-p-icon-sizes;

  // core icons
  @include vf-p-icon-anchor;
  @include vf-p-icon-plus;
  @include vf-p-icon-minus;
  @include vf-p-icon-expand;
  @include vf-p-icon-collapse;
  @include vf-p-icon-chevron;
  @include vf-p-icon-close;
  @include vf-p-icon-help;
  @include vf-p-icon-info;
  @include vf-p-icon-delete;
  @include vf-p-icon-error;
  @include vf-p-icon-warning;
  @include vf-p-icon-external-link;
  @include vf-p-icon-drag;
  @include vf-p-icon-code;
  @include vf-p-icon-menu;
  @include vf-p-icon-copy;
  @include vf-p-icon-search;
  @include vf-p-icon-success;
  @include vf-p-icon-success-grey;
  @include vf-p-icon-error-grey;
  @include vf-p-icon-share;
  @include vf-p-icon-user;
  @include vf-p-icon-spinner;
  @include vf-p-icon-show;
  @include vf-p-icon-hide;

  // social icons
  @include vf-p-icon-facebook;
  @include vf-p-icon-github;
  @include vf-p-icon-twitter;
  @include vf-p-icon-instagram;
  @include vf-p-icon-linkedin;
  @include vf-p-icon-youtube;
  @include vf-p-icon-rss;
  @include vf-p-icon-email;
}

@mixin vf-p-icons-common {
  // backwards compatibility for dark themed icons in --dark strips and with is-light class name
  // DEPRECATED: use is-dark instead
  [class*='--dark'] [class*='p-icon--'],
  [class*='p-icon--'].is-light {
    @include vf-theme-dark;
  }

  // stylelint-disable selector-max-type
  h1,
  .p-heading--1,
  .u-match-h1 {
    [class*='p-icon'] {
      @include vf-icon-size($x-height);

      vertical-align: 0;
    }
  }

  h2,
  .p-heading--2,
  .u-match-h2 {
    [class*='p-icon'] {
      @include vf-icon-size($x-height);

      vertical-align: 0;
    }
  }

  h3,
  .p-heading--3,
  .u-match-h3 {
    [class*='p-icon'] {
      @include vf-icon-size($default-icon-size);

      vertical-align: 0;
    }
  }

  h4,
  .p-heading--4,
  .u-match-h4 {
    [class*='p-icon'] {
      vertical-align: 0;
    }
  }

  p > [class*='p-icon'] {
    vertical-align: middle;
  }
  // stylelint-enable selector-max-type
}

/// Icons
@mixin vf-p-icon-anchor {
  .p-icon--anchor {
    @extend %icon;
    @include vf-icon-anchor-themed;
  }
}

@mixin vf-p-icon-plus {
  .p-icon--plus {
    @extend %icon;
    @include vf-icon-plus-themed;
  }
}

@mixin vf-p-icon-minus {
  .p-icon--minus {
    @extend %icon;
    @include vf-icon-minus-themed;
  }
}

@mixin vf-p-icon-expand {
  .p-icon--expand {
    @extend %icon;
    @include vf-icon-expand-themed;
  }
}

@mixin vf-p-icon-collapse {
  .p-icon--collapse {
    @extend %icon;
    @include vf-icon-collapse-themed;
  }
}

@mixin vf-p-icon-chevron {
  .p-icon--chevron-up {
    @include vf-icon-chevron-up-themed;
  }
  .p-icon--chevron-right {
    @include vf-icon-chevron-right-themed;
  }
  .p-icon--chevron-down {
    @include vf-icon-chevron-down-themed;
  }
  .p-icon--chevron-left {
    @include vf-icon-chevron-left-themed;
  }

  .p-icon--chevron-up,
  .p-icon--chevron-right,
  .p-icon--chevron-down,
  .p-icon--chevron-left {
    @extend %icon;
  }
}

@mixin vf-p-icon-close {
  .p-icon--close {
    @extend %icon;
    @include vf-icon-close-themed;
  }
}

@mixin vf-p-icon-help {
  .p-icon--help,
  .p-icon--question {
    @extend %icon;
    @include vf-icon-help-themed;
  }
}

@mixin vf-p-icon-info {
  .p-icon--information {
    @extend %icon;
    @include vf-icon-info-themed;
  }
}

@mixin vf-p-icon-delete {
  .p-icon--delete {
    @extend %icon;
    @include vf-icon-delete-themed;
  }
}

@mixin vf-p-icon-error {
  .p-icon--error {
    @extend %icon;
    @include vf-icon-error-themed;
  }
}

@mixin vf-p-icon-warning {
  .p-icon--warning {
    @extend %icon;
    @include vf-icon-warning-themed;
  }
}

@mixin vf-p-icon-external-link {
  .p-icon--external-link {
    @extend %icon;
    @include vf-icon-external-link-themed;
  }
}

@mixin vf-p-icon-drag {
  .p-icon--drag {
    @extend %icon;
    @include vf-icon-drag-themed;
  }
}

@mixin vf-p-icon-code {
  .p-icon--code {
    @extend %icon;
    @include vf-icon-code-themed;
  }
}

@mixin vf-p-icon-menu {
  .p-icon--menu {
    @extend %icon;
    @include vf-icon-menu-themed;
  }
}

@mixin vf-p-icon-copy {
  .p-icon--copy {
    @extend %icon;
    @include vf-icon-copy-themed;
  }
}

@mixin vf-p-icon-search {
  .p-icon--search {
    @extend %icon;
    @include vf-icon-search-themed;
  }
}

@mixin vf-p-icon-success {
  .p-icon--success {
    @extend %icon;
    @include vf-icon-success-themed;
  }
}

@mixin vf-p-icon-share {
  .p-icon--share {
    @extend %icon;
    @include vf-icon-share-themed;
  }
}

@mixin vf-p-icon-user {
  .p-icon--user {
    @extend %icon;
    @include vf-icon-user-themed;
  }
}

@mixin vf-p-icon-spinner {
  .p-icon--spinner {
    @extend %icon;
    @include vf-icon-spinner-themed;
  }
}

@mixin vf-p-icon-show {
  .p-icon--show {
    @extend %icon;
    @include vf-icon-show-themed;
  }
}

@mixin vf-p-icon-hide {
  .p-icon--hide {
    @extend %icon;
    @include vf-icon-hide-themed;
  }
}

@mixin vf-p-icon-success-grey {
  .p-icon--success-grey {
    @extend %icon;
    @include vf-icon-success-grey-themed;
  }
}

@mixin vf-p-icon-error-grey {
  .p-icon--error-grey {
    @extend %icon;
    @include vf-icon-error-grey-themed;
  }
}

@mixin vf-p-icon-facebook {
  .p-icon--facebook {
    @extend %social-icon;
    @include vf-icon-facebook;
  }
}

@mixin vf-p-icon-github {
  .p-icon--github {
    @extend %social-icon;
    @include vf-icon-github-themed;
  }
}

@mixin vf-p-icon-twitter {
  .p-icon--twitter {
    @extend %social-icon;
    @include vf-icon-twitter-themed;
  }
}

@mixin vf-p-icon-instagram {
  .p-icon--instagram {
    @extend %social-icon;
    @include vf-icon-instagram;
  }
}

@mixin vf-p-icon-linkedin {
  .p-icon--linkedin {
    @extend %social-icon;
    @include vf-icon-linkedin;
  }
}

@mixin vf-p-icon-youtube {
  .p-icon--youtube {
    @extend %social-icon;
    @include vf-icon-youtube;
  }
}

@mixin vf-p-icon-rss {
  .p-icon--rss {
    @extend %social-icon;
    @include vf-icon-rss;
  }
}

@mixin vf-p-icon-email {
  .p-icon--email {
    @extend %social-icon;
    @include vf-icon-email;
  }
}

@mixin vf-p-icon-sizes {
  .p-icon--medium {
    @include vf-icon-size(1.25rem);
  }

  .p-icon--large {
    @include vf-icon-size($sp-large);
  }

  .p-icon--x-large {
    @include vf-icon-size(2.25rem);
  }

  .p-icon--xx-large {
    @include vf-icon-size($sp-xxx-large);
  }
}

// stylelint-disable selector-max-type -- allow theme class on body for legacy theming support on icons
@mixin vf-p-icon-applications {
  .p-icon--applications {
    @extend %icon;
    @include vf-icon-applications($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-applications($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-controllers {
  .p-icon--controllers {
    @extend %icon;
    @include vf-icon-controllers($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-controllers($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-fullscreen {
  .p-icon--fullscreen {
    @extend %icon;
    @include vf-icon-fullscreen($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-fullscreen($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-models {
  .p-icon--models {
    @extend %icon;
    @include vf-icon-models($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-models($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-machines {
  .p-icon--machines {
    @extend %icon;
    @include vf-icon-machines($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-machines($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-pin {
  .p-icon--pin {
    @extend %icon;
    @include vf-icon-pin($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-pin($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-units {
  .p-icon--units {
    @extend %icon;
    @include vf-icon-units($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-units($colors--dark-theme--icon);
    }
  }
}

// ADDITIONAL

@mixin vf-p-icon-priority-critical {
  .p-icon--priority-critical {
    @extend %icon;
    @include vf-icon-priority-critical($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-priority-critical($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-priority-high {
  .p-icon--priority-high {
    @extend %icon;
    @include vf-icon-priority-high($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-priority-high($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-priority-low {
  .p-icon--priority-low {
    @extend %icon;
    @include vf-icon-priority-low($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-priority-low($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-priority-medium {
  .p-icon--priority-medium {
    @extend %icon;
    @include vf-icon-priority-medium($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-priority-medium($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-priority-negligible {
  .p-icon--priority-negligible {
    @extend %icon;
    @include vf-icon-priority-negligible($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-priority-negligible($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-priority-unknown {
  .p-icon--priority-unknown {
    @extend %icon;
    @include vf-icon-priority-unknown($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-priority-unknown($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-add-canvas {
  .p-icon--add-canvas {
    @extend %icon;
    @include vf-icon-add-canvas($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-add-canvas($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-add-logical-volume {
  .p-icon--add-logical-volume {
    @extend %icon;
    @include vf-icon-add-logical-volume($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-add-logical-volume($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-add-partition {
  .p-icon--add-partition {
    @extend %icon;
    @include vf-icon-add-partition($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-add-partition($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-back-to-top {
  .p-icon--back-to-top {
    @extend %icon;
    @include vf-icon-back-to-top($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-back-to-top($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-begin-downloading {
  .p-icon--begin-downloading {
    @extend %icon;
    @include vf-icon-begin-downloading($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-begin-downloading($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-bundle {
  .p-icon--bundle {
    @extend %icon;
    @include vf-icon-bundle($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-bundle($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-canvas {
  .p-icon--canvas {
    @extend %icon;
    @include vf-icon-canvas($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-canvas($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-change-version {
  .p-icon--change-version {
    @extend %icon;
    @include vf-icon-change-version($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-change-version($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-comments {
  .p-icon--comments {
    @extend %icon;
    @include vf-icon-comments($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-comments($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-conflict-grey {
  .p-icon--conflict-grey {
    @extend %icon;
    @include vf-icon-conflict-grey($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-conflict-grey($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-conflict-resolution-grey {
  .p-icon--conflict-resolution-grey {
    @extend %icon;
    @include vf-icon-conflict-resolution-grey($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-conflict-resolution-grey($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-conflict-resolution {
  .p-icon--conflict-resolution {
    @extend %icon;
    @include vf-icon-conflict-resolution($color-positive, $colors--dark-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-conflict-resolution($color-positive, $colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-conflict {
  .p-icon--conflict {
    @extend %icon;
    @include vf-icon-conflict($color-caution, $colors--dark-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-conflict($color-caution, $colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-connected {
  .p-icon--connected {
    @extend %icon;
    @include vf-icon-connected($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-connected($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-containers {
  .p-icon--containers {
    @extend %icon;
    @include vf-icon-containers($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-containers($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-copy-to-clipboard {
  .p-icon--copy-to-clipboard {
    @extend %icon;
    @include vf-icon-copy-to-clipboard($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-copy-to-clipboard($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-disconnect {
  .p-icon--disconnect {
    @extend %icon;
    @include vf-icon-disconnect($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-disconnect($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-edit {
  .p-icon--edit {
    @extend %icon;
    @include vf-icon-edit($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-edit($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-export {
  .p-icon--export {
    @extend %icon;
    @include vf-icon-export($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-export($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-exposed {
  .p-icon--exposed {
    @extend %icon;
    @include vf-icon-exposed($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-exposed($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-filter {
  .p-icon--filter {
    @extend %icon;
    @include vf-icon-filter($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-filter($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-fork {
  .p-icon--fork {
    @extend %icon;
    @include vf-icon-fork($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-fork($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-get-link {
  .p-icon--get-link {
    @extend %icon;
    @include vf-icon-get-link($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-get-link($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-halfscreen-bar {
  .p-icon--halfscreen-bar {
    @extend %icon;
    @include vf-icon-halfscreen-bar($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-halfscreen-bar($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-highlight-off {
  .p-icon--highlight-off {
    @extend %icon;
    @include vf-icon-highlight-off($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-highlight-off($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-highlight-on {
  .p-icon--highlight-on {
    @extend %icon;
    @include vf-icon-highlight-on($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-highlight-on($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-home {
  .p-icon--home {
    @extend %icon;
    @include vf-icon-home($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-home($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-import {
  .p-icon--import {
    @extend %icon;
    @include vf-icon-import($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-import($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-in-progress {
  .p-icon--in-progress {
    @extend %icon;
    @include vf-icon-in-progress($colors--dark-theme--icon, $colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-in-progress($colors--dark-theme--icon, $colors--light-theme--icon);
    }
  }
}

@mixin vf-p-icon-inspector-debug {
  .p-icon--inspector-debug {
    @extend %icon;
    @include vf-icon-inspector-debug($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-inspector-debug($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-loading-steps {
  .p-icon--loading-steps {
    @extend %icon;
    @include vf-icon-loading-steps($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-loading-steps($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-lock-locked-active {
  .p-icon--lock-locked-active {
    @extend %icon;
    @include vf-icon-lock-locked-active($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-lock-locked-active($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-lock-locked {
  .p-icon--lock-locked {
    @extend %icon;
    @include vf-icon-lock-locked($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-lock-locked($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-lock-unlock {
  .p-icon--lock-unlock {
    @extend %icon;
    @include vf-icon-lock-unlock($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-lock-unlock($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-maximise-bar {
  .p-icon--maximise-bar {
    @extend %icon;
    @include vf-icon-maximise-bar($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-maximise-bar($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-minimise-bar {
  .p-icon--minimise-bar {
    @extend %icon;
    @include vf-icon-minimise-bar($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-minimise-bar($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-mount-2 {
  .p-icon--mount-2 {
    @extend %icon;
    @include vf-icon-mount-2($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-mount-2($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-mount {
  .p-icon--mount {
    @extend %icon;
    @include vf-icon-mount($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-mount($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-open-terminal {
  .p-icon--open-terminal {
    @extend %icon;
    @include vf-icon-open-terminal($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-open-terminal($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-plans {
  .p-icon--plans {
    @extend %icon;
    @include vf-icon-plans($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-plans($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-pods {
  .p-icon--pods {
    @extend %icon;
    @include vf-icon-pods($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-pods($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-power-error {
  .p-icon--power-error {
    @extend %icon;
    @include vf-icon-power-error($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-power-error($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-power-off {
  .p-icon--power-off {
    @extend %icon;
    @include vf-icon-power-off($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-power-off($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-power-on {
  .p-icon--power-on {
    @extend %icon;
    @include vf-icon-power-on($colors--light-theme--icon, $colors--dark-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-power-on($colors--light-theme--icon, $colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-profile {
  .p-icon--profile {
    @extend %icon;
    @include vf-icon-profile($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-profile($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-restart {
  .p-icon--restart {
    @extend %icon;
    @include vf-icon-restart-themed;
  }
}

@mixin vf-p-icon-revisions {
  .p-icon--revisions {
    @extend %icon;
    @include vf-icon-revisions($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-revisions($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-security {
  .p-icon--security {
    @extend %icon;
    @include vf-icon-security($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-security($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-settings {
  .p-icon--settings {
    @extend %icon;
    @include vf-icon-settings($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-settings($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-sort-both {
  .p-icon--sort-both {
    @extend %icon;
    @include vf-icon-sort-both($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-sort-both($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-sort-down {
  .p-icon--sort-down {
    @extend %icon;
    @include vf-icon-sort-down($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-sort-down($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-sort-up {
  .p-icon--sort-up {
    @extend %icon;
    @include vf-icon-sort-up($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-sort-up($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-starred {
  .p-icon--starred {
    @extend %icon;
    @include vf-icon-starred($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-starred($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-status-failed-small {
  .p-icon--status-failed-small {
    @extend %icon;
    @include vf-icon-status-small($color-negative);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-status-small($color-negative);
    }
  }
}

@mixin vf-p-icon-status-in-progress-small {
  .p-icon--status-in-progress-small {
    @extend %icon;
    @include vf-icon-status-small($color-information);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-status-small($color-information);
    }
  }
}

@mixin vf-p-icon-status-in-progress {
  .p-icon--status-in-progress {
    @extend %icon;
    @include vf-icon-status-in-progress($color-information, $color-light, $colors--dark-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-status-in-progress($color-information, $color-light, $colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-status-queued-small {
  .p-icon--status-queued-small {
    @extend %icon;
    @include vf-icon-status-small($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-status-small($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-status-queued {
  .p-icon--status-queued {
    @extend %icon;
    @include vf-icon-status-queued($colors--dark-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-status-queued($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-status-succeeded-small {
  .p-icon--status-succeeded-small {
    @extend %icon;
    @include vf-icon-status-small($color-positive);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-status-small($color-positive);
    }
  }
}

@mixin vf-p-icon-status-waiting-small {
  .p-icon--status-waiting-small {
    @extend %icon;
    @include vf-icon-status-small($color-caution);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-status-small($color-caution);
    }
  }
}

@mixin vf-p-icon-status-waiting {
  .p-icon--status-waiting {
    @extend %icon;
    @include vf-icon-status-waiting($color-caution, $color-mid-light, $color-light, $colors--dark-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-status-waiting($color-caution, $color-mid-light, $color-light, $colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-status {
  .p-icon--status {
    @extend %icon;
    @include vf-icon-status($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-status($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-submit-bug {
  .p-icon--submit-bug {
    @extend %icon;
    @include vf-icon-submit-bug($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-submit-bug($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-switcher-dashboard {
  .p-icon--switcher-dashboard {
    @extend %icon;
    @include vf-icon-switcher-dashboard($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-switcher-dashboard($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-switcher-environments {
  .p-icon--switcher-environments {
    @extend %icon;
    @include vf-icon-switcher-environments($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-switcher-environments($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-switcher {
  .p-icon--switcher {
    @extend %icon;
    @include vf-icon-switcher($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-switcher($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-tag {
  .p-icon--tag {
    @extend %icon;
    @include vf-icon-tag($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-tag($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-task-outstanding {
  .p-icon--task-outstanding {
    @extend %icon;
    @include vf-icon-task-outstanding($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-task-outstanding($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-timed-out-grey {
  .p-icon--timed-out-grey {
    @extend %icon;
    @include vf-icon-timed-out-grey($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-timed-out-grey($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-timed-out {
  .p-icon--timed-out {
    @extend %icon;
    @include vf-icon-timed-out($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-timed-out($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-topic {
  .p-icon--topic {
    @extend %icon;
    @include vf-icon-topic($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-topic($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-unit-pending {
  .p-icon--unit-pending {
    @extend %icon;
    @include vf-icon-unit-pending($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-unit-pending($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-unit-running {
  .p-icon--unit-running {
    @extend %icon;
    @include vf-icon-unit-running($color-positive, $colors--dark-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-unit-running($color-positive, $colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-unmount {
  .p-icon--unmount {
    @extend %icon;
    @include vf-icon-unmount($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-unmount($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-unstarred {
  .p-icon--unstarred {
    @extend %icon;
    @include vf-icon-unstarred($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-unstarred($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-user-group {
  .p-icon--user-group {
    @extend %icon;
    @include vf-icon-user-group($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-user-group($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-video-play {
  .p-icon--video-play {
    @extend %icon;
    @include vf-icon-video-play($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-video-play($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-warning-grey {
  .p-icon--warning-grey {
    @extend %icon;
    @include vf-icon-warning-grey($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-warning-grey($colors--dark-theme--icon);
    }
  }
}

@mixin vf-p-icon-desktop {
  .p-icon--desktop {
    @extend %icon;
    @include vf-icon-desktop($colors--light-theme--icon);

    [class*='--dark'] &,
    body.is-dark &,
    &.is-light, // DEPRECATED: use is-dark instead
    &.is-dark {
      @include vf-icon-desktop($color-mid-x-light);
    }
  }
}

@mixin vf-p-icon-play {
  .p-icon--play {
    @extend %icon;
    @include vf-icon-play-themed;
  }
}

@mixin vf-p-icon-pause {
  .p-icon--pause {
    @extend %icon;
    @include vf-icon-pause-themed;
  }
}

@mixin vf-p-icon-stop {
  .p-icon--stop {
    @extend %icon;
    @include vf-icon-stop-themed;
  }
}

// stylelint-enable selector-max-type

// ICONS ADDED IN OCTOBER 2024

@mixin vf-p-icon-archive {
  .p-icon--archive {
    @extend %icon;
    @include vf-icon-archive-themed;
  }
}

@mixin vf-p-icon-arrow-bottom-left {
  .p-icon--arrow-bottom-left {
    @extend %icon;
    @include vf-icon-arrow-bottom-left-themed;
  }
}

@mixin vf-p-icon-arrow-bottom-right {
  .p-icon--arrow-bottom-right {
    @extend %icon;
    @include vf-icon-arrow-bottom-right-themed;
  }
}

@mixin vf-p-icon-arrow-down {
  .p-icon--arrow-down {
    @extend %icon;
    @include vf-icon-arrow-down-themed;
  }
}

@mixin vf-p-icon-arrow-left {
  .p-icon--arrow-left {
    @extend %icon;
    @include vf-icon-arrow-left-themed;
  }
}

@mixin vf-p-icon-arrow-right {
  .p-icon--arrow-right {
    @extend %icon;
    @include vf-icon-arrow-right-themed;
  }
}

@mixin vf-p-icon-arrow-top-left {
  .p-icon--arrow-top-left {
    @extend %icon;
    @include vf-icon-arrow-top-left-themed;
  }
}

@mixin vf-p-icon-arrow-top-right {
  .p-icon--arrow-top-right {
    @extend %icon;
    @include vf-icon-arrow-top-right-themed;
  }
}

@mixin vf-p-icon-arrow-up {
  .p-icon--arrow-up {
    @extend %icon;
    @include vf-icon-arrow-up-themed;
  }
}

@mixin vf-p-icon-blueprint {
  .p-icon--blueprint {
    @extend %icon;
    @include vf-icon-blueprint-themed;
  }
}

@mixin vf-p-icon-book {
  .p-icon--book {
    @extend %icon;
    @include vf-icon-book-themed;
  }
}

@mixin vf-p-icon-certificate {
  .p-icon--certificate {
    @extend %icon;
    @include vf-icon-certificate-themed;
  }
}

@mixin vf-p-icon-certification {
  .p-icon--certification {
    @extend %icon;
    @include vf-icon-certification-themed;
  }
}

@mixin vf-p-icon-cluster-host {
  .p-icon--cluster-host {
    @extend %icon;
    @include vf-icon-cluster-host-themed;
  }
}

@mixin vf-p-icon-contact {
  .p-icon--contact {
    @extend %icon;
    @include vf-icon-contact-themed;
  }
}

@mixin vf-p-icon-contextual-menu {
  .p-icon--contextual-menu {
    @extend %icon;
    @include vf-icon-contextual-menu-themed;
  }
}

@mixin vf-p-icon-cursor {
  .p-icon--cursor {
    @extend %icon;
    @include vf-icon-cursor-themed;
  }
}

@mixin vf-p-icon-file-blank {
  .p-icon--file-blank {
    @extend %icon;
    @include vf-icon-file-blank-themed;
  }
}

@mixin vf-p-icon-file {
  .p-icon--file {
    @extend %icon;
    @include vf-icon-file-themed;
  }
}

@mixin vf-p-icon-folder {
  .p-icon--folder {
    @extend %icon;
    @include vf-icon-folder-themed;
  }
}

@mixin vf-p-icon-gift {
  .p-icon--gift {
    @extend %icon;
    @include vf-icon-gift-themed;
  }
}

@mixin vf-p-icon-image {
  .p-icon--image {
    @extend %icon;
    @include vf-icon-image-themed;
  }
}

@mixin vf-p-icon-iso {
  .p-icon--iso {
    @extend %icon;
    @include vf-icon-iso-themed;
  }
}

@mixin vf-p-icon-location {
  .p-icon--location {
    @extend %icon;
    @include vf-icon-location-themed;
  }
}

@mixin vf-p-icon-log-out {
  .p-icon--log-out {
    @extend %icon;
    @include vf-icon-log-out-themed;
  }
}

@mixin vf-p-icon-map {
  .p-icon--map {
    @extend %icon;
    @include vf-icon-map-themed;
  }
}

@mixin vf-p-icon-notifications {
  .p-icon--notifications {
    @extend %icon;
    @include vf-icon-notifications-themed;
  }
}

@mixin vf-p-icon-private-key {
  .p-icon--private-key {
    @extend %icon;
    @include vf-icon-private-key-themed;
  }
}

@mixin vf-p-icon-profiles {
  .p-icon--profiles {
    @extend %icon;
    @include vf-icon-profiles-themed;
  }
}

@mixin vf-p-icon-repository {
  .p-icon--repository {
    @extend %icon;
    @include vf-icon-repository-themed;
  }
}

@mixin vf-p-icon-security-error {
  .p-icon--security-error {
    @extend %icon;
    @include vf-icon-security-error-themed;
  }
}

@mixin vf-p-icon-security-tick {
  .p-icon--security-tick {
    @extend %icon;
    @include vf-icon-security-tick-themed;
  }
}

@mixin vf-p-icon-security-warning {
  .p-icon--security-warning {
    @extend %icon;
    @include vf-icon-security-warning-themed;
  }
}

@mixin vf-p-icon-select-add {
  .p-icon--select-add {
    @extend %icon;
    @include vf-icon-select-add-themed;
  }
}

@mixin vf-p-icon-select-remove {
  .p-icon--select-remove {
    @extend %icon;
    @include vf-icon-select-remove-themed;
  }
}

@mixin vf-p-icon-select {
  .p-icon--select {
    @extend %icon;
    @include vf-icon-select-themed;
  }
}

@mixin vf-p-icon-single-host {
  .p-icon--single-host {
    @extend %icon;
    @include vf-icon-single-host-themed;
  }
}

@mixin vf-p-icon-snapshot {
  .p-icon--snapshot {
    @extend %icon;
    @include vf-icon-snapshot-themed;
  }
}

@mixin vf-p-icon-snooze {
  .p-icon--snooze {
    @extend %icon;
    @include vf-icon-snooze-themed;
  }
}

@mixin vf-p-icon-statistics {
  .p-icon--statistics {
    @extend %icon;
    @include vf-icon-statistics-themed;
  }
}

@mixin vf-p-icon-thumbs-down {
  .p-icon--thumbs-down {
    @extend %icon;
    @include vf-icon-thumbs-down-themed;
  }
}

@mixin vf-p-icon-thumbs-up {
  .p-icon--thumbs-up {
    @extend %icon;
    @include vf-icon-thumbs-up-themed;
  }
}

@mixin vf-p-icon-tidy {
  .p-icon--tidy {
    @extend %icon;
    @include vf-icon-tidy-themed;
  }
}

@mixin vf-p-icon-toggle-side-nav {
  .p-icon--toggle-side-nav {
    @extend %icon;
    @include vf-icon-toggle-side-nav-themed;
  }
}

@mixin vf-p-icon-turn-off-notification {
  .p-icon--turn-off-notification {
    @extend %icon;
    @include vf-icon-turn-off-notification-themed;
  }
}

@mixin vf-p-icon-upload {
  .p-icon--upload {
    @extend %icon;
    @include vf-icon-upload-themed;
  }
}

@mixin vf-p-icon-usb {
  .p-icon--usb {
    @extend %icon;
    @include vf-icon-usb-themed;
  }
}

@mixin vf-p-icon-website {
  .p-icon--website {
    @extend %icon;
    @include vf-icon-website-themed;
  }
}

// ICONS ADDED IN JANUARY 2025

@mixin vf-p-icon-credit-card {
  .p-icon--credit-card {
    @extend %icon;
    @include vf-icon-credit-card-themed;
  }
}

// ICONS ADDED IN MARCH 2025

@mixin vf-p-icon-heading {
  .p-icon--heading {
    @extend %icon;
    @include vf-icon-heading-themed;
  }
}

@mixin vf-p-icon-quote {
  .p-icon--quote {
    @extend %icon;
    @include vf-icon-quote-themed;
  }
}

@mixin vf-p-icon-history {
  .p-icon--history {
    @extend %icon;
    @include vf-icon-history-themed;
  }
}

@mixin vf-p-icon-generative-ai {
  .p-icon--generative-ai {
    @extend %icon;
    @include vf-icon-generative-ai-themed;
  }
}

@mixin vf-p-icon-ignored {
  .p-icon--ignored {
    @extend %icon;
    @include vf-icon-ignored-themed;
  }
}

@mixin vf-p-icon-vulnerable {
  .p-icon--vulnerable {
    @extend %icon;
    @include vf-icon-vulnerable-themed;
  }
}

// ICONS ADDED IN FEBRUARY 2026

@mixin vf-p-icon-storage-bucket {
  .p-icon--storage-bucket {
    @extend %icon;
    @include vf-icon-storage-bucket-themed;
  }
}

@mixin vf-p-icon-storage-pool {
  .p-icon--storage-pool {
    @extend %icon;
    @include vf-icon-storage-pool-themed;
  }
}

@mixin vf-p-icon-storage-volume {
  .p-icon--storage-volume {
    @extend %icon;
    @include vf-icon-storage-volume-themed;
  }
}

// **Base and Pattern mixins accurate as of February 2026**