@font-face {
  font-family: "Font Awesome 6 Free";
  font-style: normal;
  font-weight: 900; /* solid icons */
  src: url("fa-solid-900.woff2") format("woff2"),
       url("fa-solid-900.woff") format("woff");
}

@font-face {
  font-family: "Font Awesome 6 Brands";
  font-style: normal;
  font-weight: 400; /* brand icons */
  src: url("fa-brands-400.woff2") format("woff2"),
       url("fa-brands-400.woff") format("woff");
}

/* 2. Classes */
.fas { font-family: "Font Awesome 6 Free"; font-weight: 900; font-style: normal; }
.fab { font-family: "Font Awesome 6 Brands"; font-weight: 400; font-style: normal; }

/* 3. Solid icon content codes */
.fas.fa-download:before { content: "\f019"; }

.fas.fa-info-circle:before { content: "\f05a"; }
.fas.fa-terminal:before { content: "\f120"; }
.fas.fa-bug:before { content: "\f188"; }
.fas.fa-receipt:before { content: "\f543"; }
.fas.fa-file-code:before { content: "\f1c9"; }
.fas.fa-database:before { content: "\f1c0"; }
.fas.fa-project-diagram:before { content: "\f542"; }
.fas.fa-key:before { content: "\f084"; }
.fas.fa-laptop-code:before { content: "\f5fc"; }
.fas.fa-table:before { content: "\f0ce"; }
.fas.fa-window-maximize:before { content: "\f2d0"; }
.fas.fa-code:before { content: "\f121"; }
.fas.fa-window-restore:before { content: "\f2d2"; }
.fas.fa-star:before { content: "\f005"; }
.fas.fa-bell:before { content: "\f0f3"; }
.fas.fa-box-open:before { content: "\f49e"; }
.fas.fa-shopping-cart:before { content: "\f07a"; }
.fas.fa-users:before { content: "\f0c0"; }
.fas.fa-link:before { content: "\f0c1"; }
.fas.fa-user-lock:before { content: "\f502"; }
.fas.fa-bullhorn:before { content: "\f0a1"; }
.fas.fa-file-alt:before { content: "\f15c"; }
.fas.fa-user-shield:before { content: "\f505"; }
.fas.fa-mobile-alt:before { content: "\f3ce"; }
.fas.fa-cart-shopping:before { content: "\f07a"; }
.fas.fa-server:before { content: "\f233"; }
.fas.fa-envelope:before { content: "\f0e0"; }
.fas.fa-user-plus:before { content: "\f234"; } /* NEW icon added */

/* 4. Brand icons */
.fab.fa-php:before { content: "\f457"; }
.fab.fa-android:before { content: "\f17b"; }
.fab.fa-node-js:before { content: "\f3d3"; }
.fab.fa-java:before { content: "\f4e4"; }
.fab.fa-python:before { content: "\f3e2"; }
.fab.fa-wordpress:before { content: "\f19a"; }

/* 5. Styling */
.tablinks i,
.pluginmenu i {
    margin-right: 8px;
    font-size: 16px;
    vertical-align: middle;
    color: #333;
    transition: color 0.3s;
}

.tablinks:hover i,
.pluginmenu a:hover i {
    color: #007bff;
}

@media (max-width: 768px) {
    .tablinks i,
    .pluginmenu i {
        font-size: 14px;
        margin-right: 6px;
    }
}