/* FINAL Icon Fix - Override everything */

/* Ensure FontAwesome webfont loads */
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css');

/* Force all icons to use FontAwesome */
.fas, .far, .fab, .fa,
i.fas, i.far, i.fab, i.fa {
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    font-style: normal !important;
    -webkit-font-smoothing: antialiased !important;
    display: inline-block !important;
}

/* ===== SIDEBAR MENU STYLING ===== */
.sidebar-menu .menu-item {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    padding: 14px 18px !important;
}

.sidebar-menu .menu-item i {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    border-radius: 10px !important;
    font-size: 1rem !important;
}

/* Sidebar icon colors with backgrounds */
.sidebar-menu li:nth-child(1) .menu-item i { color: #60A5FA !important; background: rgba(96, 165, 250, 0.15) !important; }
.sidebar-menu li:nth-child(2) .menu-item i { color: #A78BFA !important; background: rgba(167, 139, 250, 0.15) !important; }
.sidebar-menu li:nth-child(3) .menu-item i { color: #4ADE80 !important; background: rgba(74, 222, 128, 0.15) !important; }
.sidebar-menu li:nth-child(4) .menu-item i { color: #F87171 !important; background: rgba(248, 113, 113, 0.15) !important; }
.sidebar-menu li:nth-child(5) .menu-item i { color: #FBBF24 !important; background: rgba(251, 191, 36, 0.15) !important; }
.sidebar-menu li:nth-child(6) .menu-item i { color: #22D3EE !important; background: rgba(34, 211, 238, 0.15) !important; }
.sidebar-menu li:nth-child(7) .menu-item i { color: #FB7185 !important; background: rgba(251, 113, 133, 0.15) !important; }
.sidebar-menu li:nth-child(8) .menu-item i { color: #2DD4BF !important; background: rgba(45, 212, 191, 0.15) !important; }
.sidebar-menu li:nth-child(9) .menu-item i { color: #94A3B8 !important; background: rgba(148, 163, 184, 0.15) !important; }
.sidebar-menu li:nth-child(10) .menu-item i { color: #F87171 !important; background: rgba(248, 113, 113, 0.15) !important; }

.sidebar-menu .menu-item.active i {
    color: #000 !important;
    background: rgba(255, 255, 255, 0.3) !important;
}

/* ===== STAT CARDS ===== */
.stat-card {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 20px !important;
}

.stat-icon {
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    border-radius: 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.stat-icon i {
    font-size: 1.5rem !important;
    color: #fff !important;
}

/* ===== ACTION BUTTONS ===== */
.action-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
}

.action-btn i {
    font-size: 1.1rem !important;
}

/* ===== HIDE USER AVATAR ON DESKTOP ===== */
@media (min-width: 993px) {
    .user-profile-summary .user-avatar {
        display: none !important;
    }
}

/* ===== CLOSE BUTTON ===== */
.drawer-close-btn {
    position: absolute !important;
    top: 15px !important;
    right: 15px !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.1) !important;
    border: none !important;
    color: #fff !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 10 !important;
}

.drawer-close-btn:hover {
    background: rgba(255, 56, 100, 0.3) !important;
}

/* ===== MOBILE STAT CARDS ===== */
@media (max-width: 768px) {
    .stat-card {
        flex-direction: column !important;
        text-align: center !important;
        padding: 16px !important;
        gap: 10px !important;
    }
    
    .stat-icon {
        width: 50px !important;
        height: 50px !important;
        min-width: 50px !important;
    }
    
    .stat-icon i {
        font-size: 1.3rem !important;
    }
    
    .stat-value {
        font-size: 1.4rem !important;
    }
    
    .stat-label {
        font-size: 0.7rem !important;
    }
}

/* ===== MOBILE TRANSACTIONS TABLE ===== */
@media (max-width: 768px) {
    .modern-table tbody tr {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 12px !important;
        padding: 16px !important;
        background: rgba(30, 27, 75, 0.6) !important;
        border-radius: 12px !important;
        margin-bottom: 12px !important;
        border: 1px solid rgba(139, 92, 246, 0.2) !important;
    }
    
    .modern-table thead {
        display: none !important;
    }
    
    .modern-table tbody td {
        display: flex !important;
        flex-direction: column !important;
        padding: 0 !important;
        border: none !important;
    }
    
    .modern-table tbody td::before {
        content: attr(data-label) !important;
        font-size: 0.65rem !important;
        font-weight: 600 !important;
        color: #94a3b8 !important;
        text-transform: uppercase !important;
        margin-bottom: 4px !important;
    }
    
    .modern-table tbody td:nth-child(1) { grid-column: 1; grid-row: 1; }
    .modern-table tbody td:nth-child(2) { grid-column: 2; grid-row: 1; }
    .modern-table tbody td:nth-child(3) { grid-column: 1; grid-row: 2; }
    .modern-table tbody td:nth-child(4) { grid-column: 2; grid-row: 2; }
}

/* CRITICAL: Override Poppins font on icon elements */
i.fas, i.far, i.fab, i.fa,
.fas, .far, .fab, .fa,
.sidebar-menu .menu-item i,
.stat-icon i,
.action-btn i,
.btn-dashboard i,
.btn-logout i,
.drawer-close-btn i,
.user-avatar i {
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
}
