/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */
.storybook-component--breadcrumb {
  padding: calc(var(--hg-spacing, 4px) * 3);
}
@layer components {
  .breadcrumb-home i {
    color: var(--hgc-color-breadcrumb-home);
    &:hover, &:focus {
      color: var(--hgc-color-breadcrumb-home-hover);
    }
  }
  .breadcrumb-caret {
    color: var(--hgc-color-breadcrumb-caret);
  }
  .breadcrumb-dots {
    color: var(--hgc-color-breadcrumb-dots);
  }
  .breadcrumb-item {
    color: var(--hgc-color-breadcrumb);
    &.active {
      --hgc-color-breadcrumb: var(--hgc-color-breadcrumb-active);
    }
    .breadcrumb-home {
      &:hover, &:focus {
        --hgc-color-breadcrumb-icon: var(--hgc-color-breadcrumb-icon-hover);
      }
    }
    a {
      color: var(--hgc-color-breadcrumb);
      &:hover, &:focus {
        --hgc-color-breadcrumb: var(--hgc-color-breadcrumb-hover);
      }
    }
  }
}
