/* Mobile Icon Fix CSS - JetKings Website */
/* This file ensures icons display correctly on mobile devices */
/* Created: 2026-02-03 */

/* Import the main icon fix styles */
@import url('assets/css/icon-fix.css');

/* Mobile-specific icon adjustments */
@media (max-width: 768px) {
    /* Ensure icons are visible on mobile */
    .icon-f-06:before,
    .icon-f-01:before,
    .icon-s-02:before,
    .icon-c-01:before,
    .icon-c-02:before,
    .icon-f-04:before,
    .icon-f-02:before,
    .icon-s-01:before,
    .icon-f-7:before,
    .icon-f-07:before,
    .icon-f-03:before,
    .icon-f-05:before,
    .icon-s-03:before,
    .icon-c-04:before,
    .icon-envelop:before,
    .icon-arrow:before {
        font-family: "Font Awesome 6 Free" !important;
        font-weight: 900 !important;
        display: inline-block !important;
        font-style: normal !important;
        font-variant: normal !important;
        text-rendering: auto !important;
        -webkit-font-smoothing: antialiased !important;
    }
    
    /* Fix icon sizing on mobile */
    .service-icon i,
    .feature-icon i,
    .about-icon i {
        font-size: 2rem !important;
        line-height: 1.2 !important;
    }
    
    /* Ensure flaticon fallback works */
    [class^="flaticon-"]:before,
    [class*=" flaticon-"]:before {
        font-family: "Font Awesome 6 Free", "flaticon" !important;
    }
}

/* Tablet adjustments */
@media (max-width: 992px) and (min-width: 769px) {
    .service-icon i,
    .feature-icon i {
        font-size: 2.5rem !important;
    }
}

/* Fix for icons not loading on some mobile browsers */
.icon-f-06, .icon-f-01, .icon-s-02, .icon-c-01, .icon-c-02, .icon-f-04,
.icon-f-02, .icon-s-01, .icon-f-7, .icon-f-07, .icon-f-03, .icon-f-05,
.icon-s-03, .icon-c-04, .icon-envelop, .icon-arrow {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Service Page Icons - Mobile Override */
.icon-f-06:before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f043" !important; /* droplet for driveway cleaning */
    font-weight: 900 !important;
}

.icon-f-01:before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f5d2" !important; /* broom for patio cleaning */
    font-weight: 900 !important;
}

.icon-s-02:before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f015" !important; /* house for roof cleaning */
    font-weight: 900 !important;
}

.icon-c-01:before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f773" !important; /* tint-slash for gutter cleaning */
    font-weight: 900 !important;
}

.icon-c-02:before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f751" !important; /* spray-can for pressure washing */
    font-weight: 900 !important;
}

.icon-f-04:before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f1ad" !important; /* building for commercial cleaning */
    font-weight: 900 !important;
}

/* About Page Icons */
.icon-f-02:before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f005" !important; /* star for quality */
    font-weight: 900 !important;
}

.icon-s-01:before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f2f2" !important; /* check-square for reliability */
    font-weight: 900 !important;
}

.icon-f-7:before,
.icon-f-07:before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f0e7" !important; /* lightning for efficiency */
    font-weight: 900 !important;
}

/* Additional Service Icons */
.icon-f-03:before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f0f3" !important; /* bell for notifications */
    font-weight: 900 !important;
}

.icon-f-05:before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f560" !important; /* file-excel for reports */
    font-weight: 900 !important;
}

.icon-s-03:before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f521" !important; /* tools for maintenance */
    font-weight: 900 !important;
}

.icon-c-04:before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f095" !important; /* phone for contact */
    font-weight: 900 !important;
}

.icon-envelop:before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f0e0" !important; /* envelope for email */
    font-weight: 900 !important;
}

.icon-arrow:before {
    font-family: "Font Awesome 6 Free" !important;
    content: "\f061" !important; /* arrow-right */
    font-weight: 900 !important;
}