/**
 * CockpitOS CM-Immo Theme - Boxicons Integration
 * 
 * Branding-Farben & Custom Styles für Boxicons
 * 
 * @package CockpitOS_CM_Immo_Theme
 * @version 4.0.0 - Boxicons Migration
 * @link https://v2.boxicons.com/usage
 */

/* ============================================
   Boxicons Base Styles
   ============================================ */

.bx,
.bxs,
.bxl {
    display: inline-block;
    font-family: 'boxicons' !important;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    line-height: 1;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ============================================
   🎨 BRANDING COLORS für Boxicons
   ============================================ */

/* Primary Color (CM-Immo Rot) */
.bx.bx-color-primary,
.bx.bx-color-brand-red {
    color: var(--color-primary, #da2032) !important;
}

/* Secondary Color (CM-Immo Rosa) */
.bx.bx-color-secondary,
.bx.bx-color-brand-pink {
    color: var(--color-secondary, #F25363) !important;
}

/* Accent Colors */
.bx.bx-color-brand-coral {
    color: var(--color-accent-coral, #e85d75) !important;
}

.bx.bx-color-brand-pink-light {
    color: var(--color-accent-pink, #fce4ec) !important;
}

.bx.bx-color-brand-beige {
    color: var(--color-accent-beige, #faf3e0) !important;
}

/* Grayscale */
.bx.bx-color-gray {
    color: var(--color-gray-600, #475569) !important;
}

.bx.bx-color-gray-dark {
    color: var(--color-gray-800, #1e293b) !important;
}

.bx.bx-color-gray-light {
    color: var(--color-gray-400, #94a3b8) !important;
}

.bx.bx-color-white {
    color: var(--color-white, #ffffff) !important;
}

.bx.bx-color-black {
    color: var(--color-black, #000000) !important;
}

/* Status Colors */
.bx.bx-color-success {
    color: var(--color-success, #22c55e) !important;
}

.bx.bx-color-warning {
    color: var(--color-warning, #f59e0b) !important;
}

.bx.bx-color-error,
.bx.bx-color-danger {
    color: var(--color-error, #ef4444) !important;
}

.bx.bx-color-info {
    color: var(--color-info, #3b82f6) !important;
}

.bx.bx-color-gold {
    color: var(--color-gold, #f59e0b) !important;
}

/* ============================================
   Fallback für fehlende Icons
   ============================================ */

.bx-fallback {
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: middle;
    font-size: inherit;
}

/* ============================================
   Accessibility
   ============================================ */

[aria-hidden="true"] {
    speak: none;
}

/* ============================================
   Dark Mode Support
   ============================================ */

@media (prefers-color-scheme: dark) {
    .bx {
        /* Boxicons are automatically responsive to color schemes */
    }
}