/**
 * Self-hosted Font Awesome Icon Styles
 * Mimics Font Awesome's CSS for SVG icons
 */

/* Base SVG icon styles */
svg.fa,
svg.fas,
svg.far,
svg.fal,
svg.fat,
svg.fab,
svg.fa-solid,
svg.fa-regular,
svg.fa-light,
svg.fa-thin,
svg.fa-brands,
svg[class*="fa-"] {
    display: inline-block;
    height: 1em;
    width: 1em;
    vertical-align: -0.125em;
    fill: currentColor;
}

/* Fixed width icons */
svg.fa-fw {
    width: 1.25em;
    text-align: center;
}

/* Icon sizes */
svg.fa-xs {
    height: 0.75em;
    width: 0.75em;
}

svg.fa-sm {
    height: 0.875em;
    width: 0.875em;
}

svg.fa-lg {
    height: 1.33333em;
    width: 1.33333em;
    vertical-align: -0.225em;
}

svg.fa-xl {
    height: 1.5em;
    width: 1.5em;
}

svg.fa-2x {
    height: 2em;
    width: 2em;
}

svg.fa-3x {
    height: 3em;
    width: 3em;
}

svg.fa-4x {
    height: 4em;
    width: 4em;
}

svg.fa-5x {
    height: 5em;
    width: 5em;
}

svg.fa-6x {
    height: 6em;
    width: 6em;
}

svg.fa-7x {
    height: 7em;
    width: 7em;
}

svg.fa-8x {
    height: 8em;
    width: 8em;
}

svg.fa-9x {
    height: 9em;
    width: 9em;
}

svg.fa-10x {
    height: 10em;
    width: 10em;
}

/* Rotations */
svg.fa-rotate-90 {
    transform: rotate(90deg);
}

svg.fa-rotate-180 {
    transform: rotate(180deg);
}

svg.fa-rotate-270 {
    transform: rotate(270deg);
}

/* Flips */
svg.fa-flip-horizontal {
    transform: scaleX(-1);
}

svg.fa-flip-vertical {
    transform: scaleY(-1);
}

svg.fa-flip-both {
    transform: scale(-1);
}

/* Animations */
@keyframes fa-spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

svg.fa-spin {
    animation: fa-spin 2s linear infinite;
}

svg.fa-pulse {
    animation: fa-spin 1s steps(8) infinite;
}

/* Bordered icons */
svg.fa-border {
    border: 0.08em solid currentColor;
    border-radius: 0.1em;
    padding: 0.2em 0.25em 0.15em;
}

/* Pull left/right */
svg.fa-pull-left {
    float: left;
    margin-right: 0.3em;
}

svg.fa-pull-right {
    float: right;
    margin-left: 0.3em;
}

/* Stacking */
.fa-stack {
    display: inline-block;
    height: 2em;
    line-height: 2em;
    position: relative;
    vertical-align: middle;
    width: 2.5em;
}

.fa-stack-1x,
.fa-stack-2x {
    left: 0;
    position: absolute;
    text-align: center;
    width: 100%;
}

.fa-stack-1x {
    line-height: inherit;
}

.fa-stack-2x {
    font-size: 2em;
}

/* Ensure icons maintain aspect ratio */
svg[class*="fa-"] use {
    pointer-events: none;
}

/* For buttons with icons */
button svg[class*="fa-"],
a svg[class*="fa-"] {
    pointer-events: none;
}

/* Visually hidden text for accessibility */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}