/**
 * Icons Fix CSS - Kombinierte Font Awesome und Elementor Icons Fix
 * Spezielle CSS-Datei um Font Awesome und Elementor Icons korrekt darzustellen
 * Stadt Dorsten Theme
 */

/* ============================================================================
   FONT AWESOME ICONS FIX
   ============================================================================ */

/* Font Awesome @font-face Definitionen */
@font-face {
    font-family: "Font Awesome 6 Free";
    src: url("../font/font-awesome/fa-solid-900.woff2") format("woff2"),
         url("../font/font-awesome/fa-solid-900.ttf") format("truetype");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Font Awesome 6 Free";
    src: url("../font/font-awesome/fa-regular-400.woff2") format("woff2"),
         url("../font/font-awesome/fa-regular-400.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Font Awesome 6 Brands";
    src: url("../font/font-awesome/fa-brands-400.woff2") format("woff2"),
         url("../font/font-awesome/fa-brands-400.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* Font Awesome Icon Basis-Styles - Höchste Spezifität */
.fa, .fas, .far, .fab, .fal, .fad, .fass, .fasr, .fasl, .fasd,
[class*="fa-"]::before, [class^="fa-"]::before,
i[class*="fa-"]:not([class*="eicon"]):not([class^="eicon"]), 
i[class^="fa-"]:not([class*="eicon"]):not([class^="eicon"]),
span[class*="fa-"], span[class^="fa-"],
.button-content .fa, .button-content .fas, .button-content .far, .button-content .fab,
.button-content [class*="fa-"], .button-content [class^="fa-"],
a .fa, a .fas, a .far, a .fab,
a [class*="fa-"], a [class^="fa-"] {
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    font-style: normal !important;
    font-variant: normal !important;
    text-rendering: auto !important;
    line-height: 1 !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    display: inline-block !important;
    text-decoration: none !important;
}

/* Regular Icons */
.far, .fa-regular,
[class*="fa-"].far::before, [class^="fa-"].far::before {
    font-weight: 400 !important;
}

/* Brand Icons */
.fab, .fa-brands,
[class*="fa-"].fab::before, [class^="fa-"].fab::before {
    font-family: "Font Awesome 6 Brands" !important;
    font-weight: 400 !important;
}

/* Verhindern, dass andere CSS-Regeln die Font-Familie überschreiben */
body .fa:not([class*="eicon"]):not([class^="eicon"]), 
body .fas:not([class*="eicon"]):not([class^="eicon"]), 
body .far:not([class*="eicon"]):not([class^="eicon"]), 
body .fab:not([class*="eicon"]):not([class^="eicon"]),
body i[class*="fa-"]:not([class*="eicon"]):not([class^="eicon"]), 
body i[class^="fa-"]:not([class*="eicon"]):not([class^="eicon"]),
body span[class*="fa-"], body span[class^="fa-"],
.elementor-widget i[class*="fa-"]:not([class*="eicon"]):not([class^="eicon"]), 
.elementor-widget i[class^="fa-"]:not([class*="eicon"]):not([class^="eicon"]),
.elementor-icon i[class*="fa-"]:not([class*="eicon"]):not([class^="eicon"]), 
.elementor-icon i[class^="fa-"]:not([class*="eicon"]):not([class^="eicon"]),
.elementor-editor-active .fa:not([class*="eicon"]):not([class^="eicon"]), 
.elementor-editor-active .fas:not([class*="eicon"]):not([class^="eicon"]), 
.elementor-editor-active .far:not([class*="eicon"]):not([class^="eicon"]), 
.elementor-editor-active .fab:not([class*="eicon"]):not([class^="eicon"]) {
    font-family: "Font Awesome 6 Free" !important;
}

/* Spezifische Font-Awesome Übersteuerung für ::before Pseudo-Elemente */
body .fa:not([class*="eicon"]):not([class^="eicon"]):before, 
body .fas:not([class*="eicon"]):not([class^="eicon"]):before, 
body .far:not([class*="eicon"]):not([class^="eicon"]):before, 
body .fab:not([class*="eicon"]):not([class^="eicon"]):before,
body i[class*="fa-"]:not([class*="eicon"]):not([class^="eicon"]):before, 
body i[class^="fa-"]:not([class*="eicon"]):not([class^="eicon"]):before,
body span[class*="fa-"]:before, body span[class^="fa-"]:before,
.elementor-widget i[class*="fa-"]:not([class*="eicon"]):not([class^="eicon"]):before, 
.elementor-widget i[class^="fa-"]:not([class*="eicon"]):not([class^="eicon"]):before,
.elementor-icon i[class*="fa-"]:not([class*="eicon"]):not([class^="eicon"]):before, 
.elementor-icon i[class^="fa-"]:not([class*="eicon"]):not([class^="eicon"]):before,
.elementor-editor-active .fa:not([class*="eicon"]):not([class^="eicon"]):before, 
.elementor-editor-active .fas:not([class*="eicon"]):not([class^="eicon"]):before,
.elementor-editor-active .far:not([class*="eicon"]):not([class^="eicon"]):before, 
.elementor-editor-active .fab:not([class*="eicon"]):not([class^="eicon"]):before {
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
}

/* Regular Icons Before */
body .far:not([class*="eicon"]):not([class^="eicon"]):before, 
body i[class*="fa-"].far:not([class*="eicon"]):not([class^="eicon"]):before, 
body i[class^="fa-"].far:not([class*="eicon"]):not([class^="eicon"]):before,
.elementor-editor-active .far:not([class*="eicon"]):not([class^="eicon"]):before {
    font-weight: 400 !important;
}

/* Brand Icons Before */
body .fab:not([class*="eicon"]):not([class^="eicon"]):before, 
body i[class*="fa-"].fab:not([class*="eicon"]):not([class^="eicon"]):before, 
body i[class^="fa-"].fab:not([class*="eicon"]):not([class^="eicon"]):before,
.elementor-editor-active .fab:not([class*="eicon"]):not([class^="eicon"]):before {
    font-family: "Font Awesome 6 Brands" !important;
    font-weight: 400 !important;
}

/* Elementor spezifische Fixes für Font Awesome */
.elementor-widget-icon .elementor-icon i:not([class*="eicon"]):not([class^="eicon"]),
.elementor-widget-icon-box .elementor-icon i:not([class*="eicon"]):not([class^="eicon"]),
.elementor-widget-button .elementor-button-icon i:not([class*="eicon"]):not([class^="eicon"]),
.elementor-widget-social-icons .elementor-social-icon i:not([class*="eicon"]):not([class^="eicon"]) {
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
}

.elementor-widget-icon .elementor-icon i.far,
.elementor-widget-icon-box .elementor-icon i.far,
.elementor-widget-button .elementor-button-icon i.far,
.elementor-widget-social-icons .elementor-social-icon i.far {
    font-weight: 400 !important;
}

.elementor-widget-icon .elementor-icon i.fab,
.elementor-widget-icon-box .elementor-icon i.fab,
.elementor-widget-button .elementor-button-icon i.fab,
.elementor-widget-social-icons .elementor-social-icon i.fab {
    font-family: "Font Awesome 6 Brands" !important;
    font-weight: 400 !important;
}

/* Fix für häufig verwendete Icons mit korrekten Unicode-Codes */
.fa-calendar-alt:before, .fa-calendar-days:before { content: "\f073"; }
.fa-pencil-alt:before, .fa-pen-to-square:before { content: "\f044"; }
.fa-envelope:before { content: "\f0e0"; }
.fa-phone:before { content: "\f095"; }
.fa-map-marker:before, .fa-location-pin:before { content: "\f041"; }
.fa-user:before { content: "\f007"; }
.fa-home:before, .fa-house:before { content: "\f015"; }
.fa-search:before, .fa-magnifying-glass:before { content: "\f002"; }
.fa-info-circle:before, .fa-circle-info:before { content: "\f05a"; }
.fa-exclamation-triangle:before, .fa-triangle-exclamation:before { content: "\f071"; }
.fa-check:before { content: "\f00c"; }
.fa-times:before, .fa-xmark:before { content: "\f00d"; }
.fa-arrow-right:before { content: "\f061"; }
.fa-arrow-left:before { content: "\f060"; }
.fa-download:before { content: "\f019"; }
.fa-external-link:before, .fa-external-link-alt:before { content: "\f35d"; }
.fa-star:before { content: "\f005"; }
.fa-heart:before { content: "\f004"; }
.fa-thumbs-up:before { content: "\f164"; }
.fa-thumbs-down:before { content: "\f165"; }
.fa-comment:before { content: "\f075"; }
.fa-share:before { content: "\f064"; }
.fa-print:before { content: "\f02f"; }
.fa-edit:before, .fa-pen:before { content: "\f304"; }
.fa-trash:before, .fa-trash-can:before { content: "\f2ed"; }
.fa-plus:before { content: "\f067"; }
.fa-minus:before { content: "\f068"; }
.fa-newspaper:before { content: "\f1ea"; }
.fa-arrow-alt-circle-down:before, .fa-circle-arrow-down:before { content: "\f358"; }
.fa-download:before { content: "\f019"; }
.fa-arrow-circle-down:before { content: "\f0ab"; }

/* ============================================================================
   ELEMENTOR ICONS FIX
   ============================================================================ */

/* Elementor Icons müssen ihre eigene Schriftart verwenden - HÖCHSTE PRIORITÄT */
.eicon,
i[class*="eicon-"],
i[class^="eicon-"],
.elementor-widget .eicon,
.elementor-widget i[class*="eicon-"],
.elementor-widget i[class^="eicon-"],
.elementor-icon .eicon,
.elementor-icon i[class*="eicon-"],
.elementor-icon i[class^="eicon-"],
.elementor-widget-container .eicon,
.elementor-widget-container i[class*="eicon-"],
.elementor-widget-container i[class^="eicon-"] {
    font-family: "eicons" !important;
    font-weight: normal !important;
    font-style: normal !important;
    font-variant: normal !important;
    text-rendering: auto !important;
    line-height: 1 !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    display: inline-block !important;
    text-decoration: none !important;
}

/* Spezifische Elementor Icon Widgets */
.elementor-widget-icon .elementor-icon i[class*="eicon-"],
.elementor-widget-icon-box .elementor-icon i[class*="eicon-"],
.elementor-widget-button .elementor-button-icon i[class*="eicon-"],
.elementor-widget-social-icons .elementor-social-icon i[class*="eicon-"] {
    font-family: "eicons" !important;
    font-weight: normal !important;
}

/* Pseudo-Elemente für Elementor Icons */
.eicon:before,
i[class*="eicon-"]:before,
i[class^="eicon-"]:before,
.elementor-widget .eicon:before,
.elementor-widget i[class*="eicon-"]:before,
.elementor-widget i[class^="eicon-"]:before,
.elementor-icon .eicon:before,
.elementor-icon i[class*="eicon-"]:before,
.elementor-icon i[class^="eicon-"]:before,
.elementor-widget-container .eicon:before,
.elementor-widget-container i[class*="eicon-"]:before,
.elementor-widget-container i[class^="eicon-"]:before {
    font-family: "eicons" !important;
    font-weight: normal !important;
}

/* Elementor Button Icons */
.elementor-button .elementor-button-icon,
.elementor-button .elementor-button-icon i,
.elementor-button-wrapper .elementor-button-icon,
.elementor-button-wrapper .elementor-button-icon i {
    font-family: "eicons" !important;
}

/* Elementor Tab Icons */
.elementor-tab-title .elementor-tab-icon,
.elementor-tab-title .elementor-tab-icon i {
    font-family: "eicons" !important;
}

/* Elementor Accordion Icons */
.elementor-accordion .elementor-tab-title .elementor-accordion-icon,
.elementor-accordion .elementor-tab-title .elementor-accordion-icon i {
    font-family: "eicons" !important;
}

/* Elementor Progress Bar Icons */
.elementor-progress-wrapper .elementor-progress-bar .elementor-progress-percentage,
.elementor-progress-wrapper .elementor-progress-bar .elementor-progress-percentage i {
    font-family: "eicons" !important;
}

/* Elementor Social Icons */
.elementor-social-icons-wrapper .elementor-social-icon,
.elementor-social-icons-wrapper .elementor-social-icon i {
    font-family: "eicons" !important;
}

/* Elementor Navigation Menu Icons */
.elementor-nav-menu .elementor-item .elementor-item-icon,
.elementor-nav-menu .elementor-item .elementor-item-icon i {
    font-family: "eicons" !important;
}

/* Wichtig: Elementor Icon List Widget */
.elementor-icon-list-item .elementor-icon-list-icon,
.elementor-icon-list-item .elementor-icon-list-icon i {
    font-family: "eicons" !important;
}

/* Body-Level Overrides für höchste Spezifität */
body .elementor-widget-container .eicon,
body .elementor-widget-container i[class*="eicon-"],
body .elementor-widget-container i[class^="eicon-"],
body .elementor-icon .eicon,
body .elementor-icon i[class*="eicon-"],
body .elementor-icon i[class^="eicon-"] {
    font-family: "eicons" !important;
    font-weight: normal !important;
}

/* Editor-spezifische Styles */
.elementor-editor .elementor-widget-container .eicon,
.elementor-editor .elementor-widget-container i[class*="eicon-"],
.elementor-editor .elementor-widget-container i[class^="eicon-"] {
    font-family: "eicons" !important;
    font-weight: normal !important;
}

/* Responsive Überprüfung für mobile Geräte */
@media screen and (max-width: 768px) {
    .elementor-widget-container .eicon,
    .elementor-widget-container i[class*="eicon-"],
    .elementor-widget-container i[class^="eicon-"] {
        font-family: "eicons" !important;
        font-weight: normal !important;
    }
    
    .fa, .fas, .far, .fab,
    [class*="fa-"]:not([class*="eicon"]):not([class^="eicon"]), 
    [class^="fa-"]:not([class*="eicon"]):not([class^="eicon"]) {
        font-family: "Font Awesome 6 Free" !important;
        font-weight: 900 !important;
    }
    
    .fab, [class*="fa-"].fab, [class^="fa-"].fab {
        font-family: "Font Awesome 6 Brands" !important;
        font-weight: 400 !important;
    }
}
