/* Icon System für Programmierung.net */

/* Icon Font - Font Awesome Free */
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css');

/* Icon Wrapper Classes */
.icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25em;
    height: 1.25em;
    margin-right: 0.5rem;
    flex-shrink: 0;
}

.icon-sm {
    font-size: 0.875rem;
}

.icon-lg {
    font-size: 1.5rem;
}

.icon-xl {
    font-size: 2rem;
}

/* Icon Colors */
.icon-primary {
    color: var(--primary-color);
}

.icon-secondary {
    color: var(--secondary-color);
}

.icon-success {
    color: var(--success, #48bb78);
}

.icon-danger {
    color: var(--danger, #f56565);
}

.icon-warning {
    color: var(--warning, #ed8936);
}

.icon-info {
    color: var(--info, #4299e1);
}

/* Navigation Icons */
.nav-icon {
    width: 20px;
    height: 20px;
    margin-right: 0.75rem;
    opacity: 0.8;
}

.nav-link:hover .nav-icon {
    opacity: 1;
}

/* Social Media Icons */
.social-icon {
    font-size: 1.25rem;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    transition: all 0.3s ease;
}

.social-icon:hover {
    background-color: var(--primary-color);
    transform: translateY(-2px);
}

/* Admin Icon Mappings */
.icon-dashboard::before { content: "\f3fd"; font-family: "Font Awesome 6 Free"; font-weight: 900; }
.icon-products::before { content: "\f466"; font-family: "Font Awesome 6 Free"; font-weight: 900; }
.icon-wiki::before { content: "\f02d"; font-family: "Font Awesome 6 Free"; font-weight: 900; }
.icon-glossary::before { content: "\f518"; font-family: "Font Awesome 6 Free"; font-weight: 900; }
.icon-blog::before { content: "\f781"; font-family: "Font Awesome 6 Free"; font-weight: 900; }
.icon-references::before { content: "\f091"; font-family: "Font Awesome 6 Free"; font-weight: 900; }
.icon-jobs::before { content: "\f0b1"; font-family: "Font Awesome 6 Free"; font-weight: 900; }
.icon-users::before { content: "\f0c0"; font-family: "Font Awesome 6 Free"; font-weight: 900; }
.icon-settings::before { content: "\f013"; font-family: "Font Awesome 6 Free"; font-weight: 900; }
.icon-logout::before { content: "\f2f5"; font-family: "Font Awesome 6 Free"; font-weight: 900; }

/* Feature Icons */
.icon-check::before { content: "\f00c"; font-family: "Font Awesome 6 Free"; font-weight: 900; color: var(--success, #48bb78); }
.icon-times::before { content: "\f00d"; font-family: "Font Awesome 6 Free"; font-weight: 900; color: var(--danger, #f56565); }
.icon-info-circle::before { content: "\f05a"; font-family: "Font Awesome 6 Free"; font-weight: 900; color: var(--info, #4299e1); }
.icon-warning::before { content: "\f071"; font-family: "Font Awesome 6 Free"; font-weight: 900; color: var(--warning, #ed8936); }

/* Action Icons */
.icon-add::before { content: "\f067"; font-family: "Font Awesome 6 Free"; font-weight: 900; }
.icon-edit::before { content: "\f303"; font-family: "Font Awesome 6 Free"; font-weight: 900; }
.icon-delete::before { content: "\f2ed"; font-family: "Font Awesome 6 Free"; font-weight: 900; }
.icon-search::before { content: "\f002"; font-family: "Font Awesome 6 Free"; font-weight: 900; }
.icon-filter::before { content: "\f0b0"; font-family: "Font Awesome 6 Free"; font-weight: 900; }
.icon-sort::before { content: "\f0dc"; font-family: "Font Awesome 6 Free"; font-weight: 900; }

/* Social Media Specific */
.icon-linkedin::before { content: "\f08c"; font-family: "Font Awesome 6 Brands"; }
.icon-twitter::before { content: "\f099"; font-family: "Font Awesome 6 Brands"; }
.icon-github::before { content: "\f09b"; font-family: "Font Awesome 6 Brands"; }
.icon-facebook::before { content: "\f09a"; font-family: "Font Awesome 6 Brands"; }
.icon-instagram::before { content: "\f16d"; font-family: "Font Awesome 6 Brands"; }

/* Loading Spinner */
.icon-spinner {
    animation: spin 1s linear infinite;
}

.icon-spinner::before { 
    content: "\f110"; 
    font-family: "Font Awesome 6 Free"; 
    font-weight: 900; 
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Icon Buttons */
.btn-icon {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-icon-only {
    padding: 0.5rem;
    width: 2.5rem;
    height: 2.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Utility Classes */
.icon-left {
    margin-right: 0.5rem;
    margin-left: 0;
}

.icon-right {
    margin-left: 0.5rem;
    margin-right: 0;
}

.icon-no-margin {
    margin: 0;
}