/* Base style for heroicon replacements */
.hi {
    display: inline-block;
    width: 1.2em !important;
    height: 1.2em !important;
    line-height: 1;
    vertical-align: -0.2em; /* Adjusts baseline alignment */
}
  
/* Ensure that the inlined SVG scales with the element */
.hi svg {
    width: 100%;
    height: 100%;
    display: block;
}

.hi-2x {
    width: 2em !important;
    height: 2em !important;
    vertical-align: -0.3125em;
}

.hi-3x {
    width: 3em !important;
    height: 3em !important;
    vertical-align: -0.3125em;
}

.hi-spin {
    animation: hi-spin 1s linear infinite;
}

@keyframes hi-spin {
    100% {
        transform: rotate(360deg);
}
}