/* Local Font Awesome Icons - HOST V1 Specific */
/* Using Unicode symbols that match Font Awesome icons */

.fas {
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    display: inline-block;
    color: white;
    font-weight: bold;
    background: none;
    border-radius: 0px;
    padding: 0;
    margin: 0 2px;
    text-shadow: none;
}

/* Specific icons used in HOST V1 - Professional line art symbols */
.fa-sync-alt:before { content: "↻"; }
.fa-shield-alt:before { content: "◊"; }
.fa-building:before { content: "▦"; }
.fa-cogs:before { content: "⚙"; }
.fa-video:before { content: "⧈"; }
.fa-user-shield:before { content: "⧉"; }
.fa-exclamation-triangle:before { content: "⚠"; }
.fa-file-alt:before { content: "▤"; }
.fa-question-circle:before { content: "?"; }
.fa-trash:before { content: "⌫"; }
.fa-info-circle:before { content: "ⓘ"; }
.fa-crown:before { content: "◈"; }
.fa-plus:before { content: "+"; }
.fa-check-circle:before { content: "✓"; }
.fa-file-pdf:before { content: "▤"; }
.fa-file-word:before { content: "▥"; }
.fa-print:before { content: "⧉"; }
.fa-save:before { content: "⬇"; }
.fa-upload:before { content: "⬆"; }
.fa-chevron-up:before { content: "▲"; }
.fa-chevron-down:before { content: "▼"; }
.fa-database:before { content: "◉"; }
.fa-lightbulb:before { content: "◐"; }
.fa-spinner:before { content: "◐"; }
.fa-spin:before { content: "◐"; animation: fa-spin 2s infinite linear; }
.fa-magic:before { content: "✦"; }
.fa-map-marker-alt:before { content: "◯"; }
.fa-play:before { content: "▶"; }

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

/* Icon sizing */
.fa-sm { font-size: 0.875em; }
.fa-lg { font-size: 1.33333em; line-height: 0.75em; vertical-align: -0.0667em; }
.fa-xl { font-size: 1.5em; line-height: 0.04167em; vertical-align: -0.125em; }
.fa-2xl { font-size: 2em; line-height: 0.03125em; vertical-align: -0.1875em; }

/* Context-specific styling */
.btn .fas {
    color: white;
    background: rgba(255, 255, 255, 0.2);
    text-shadow: none;
}

.header .fas {
    color: white;
    background: rgba(255, 255, 255, 0.2);
    text-shadow: none;
}

.card .fas {
    color: white;
    background: var(--cisa-primary-blue);
    text-shadow: none;
}

.help-icon {
    color: var(--cisa-primary-blue);
    background: none;
    cursor: help;
    text-shadow: none;
    padding: 0;
    margin: 0;
}

.help-icon:hover {
    color: var(--cisa-light-blue);
    background: none;
}