/* Language Badges */

.language-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin: 1rem 0;
    position: relative;
    z-index: 1;
}

.language-badge {
    background-color: var(--bg-secondary);
    color: var(--text-secondary);
    padding: 0.3rem 0.8rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 500;
    border: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    gap: 0.4rem;
    transition: all 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.language-badge:hover {
    transform: scale(1.05);
    color: #fff;
}

.language-color {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

.language-icon {
    margin-right: 0.5rem;
    font-size: 0.9rem;
    color: var(--accent);
    transition: color 0.7s cubic-bezier(0.77, 0, 0.175, 1);
}

/* Badge Gradient Colors */

.language-badge.Javascript {
    background-color: rgba(241, 224, 90, 0.1);
    border-color: #f1e05a;
}
.language-badge.Javascript:hover {
    background-color: #f1e05a;
}

.language-badge.Python {
    background-color: rgba(53, 114, 165, 0.1);
    border-color: #3572A5;
}
.language-badge.Python:hover {
    background-color: #3572A5;
}

.language-badge.Java {
    background-color: rgba(176, 114, 25, 0.1);
    border-color: #b07219;
}
.language-badge.Java:hover {
    background-color: #b07219;
}

.language-badge.TypeScript {
    background-color: rgba(49, 120, 198, 0.1);
    border-color: #3178c6;
}
.language-badge.TypeScript:hover {
    background-color: #3178c6;
}

.language-badge.Ruby {
    background-color: rgba(112, 21, 22, 0.1);
    border-color: #701516;
}
.language-badge.Ruby:hover {
    background-color: #701516;
}

.language-badge.PHP {
    background-color: rgba(79, 93, 149, 0.1);
    border-color: #4F5D95;
}
.language-badge.PHP:hover {
    background-color: #4F5D95;
}

.language-badge.C-Sharp {
    background-color: rgba(23, 134, 0, 0.1);
    border-color: #178600;
}
.language-badge.C-Sharp:hover {
    background-color: #178600;
}

.language-badge.C-Plus-Plus {
    background-color: rgba(243, 75, 125, 0.1);
    border-color: #f34b7d;
}
.language-badge.C-Plus-Plus:hover {
    background-color: #f34b7d;
}

.language-badge.Go {
    background-color: rgba(0, 173, 216, 0.1);
    border-color: #00ADD8;
}
.language-badge.Go:hover {
    background-color: #00ADD8;
}

.language-badge.Swift {
    background-color: rgba(255, 172, 69, 0.1);
    border-color: #ffac45;
}
.language-badge.Swift:hover {
    background-color: #ffac45;
}

.language-badge.Kotlin {
    background-color: rgba(169, 123, 255, 0.1);
    border-color: #A97BFF;
}
.language-badge.Kotlin:hover {
    background-color: #A97BFF;
}

.language-badge.Rust {
    background-color: rgba(222, 165, 132, 0.1);
    border-color: #dea584;
}
.language-badge.Rust:hover {
    background-color: #dea584;
}

.language-badge.HTML {
    background-color: rgba(227, 76, 38, 0.1);
    border-color: #e34c26;
}
.language-badge.HTML:hover {
    background-color: #e34c26;
}

.language-badge.CSS {
    background-color: rgba(86, 61, 124, 0.1);
    border-color: #563d7c;
}
.language-badge.CSS:hover {
    background-color: #563d7c;
}

.language-badge.Lua {
    background-color: rgba(0, 0, 128, 0.1);
    border-color: #000080;
}
.language-badge.Lua:hover {
    background-color: #000080;
}

.language-badge.Batchfile {
    background-color: rgba(139, 148, 158, 0.1);
    border-color: #8b949e;
}
.language-badge.Batchfile:hover {
    background-color: #8b949e;
}

.language-badge.EJS {
    background-color: rgba(169, 17, 79, 0.1);
    border-color: #a9114f;
}
.language-badge.EJS:hover {
    background-color: #a9114f;
}

.language-badge.Shell {
    background-color: rgba(137, 224, 81, 0.1);
    border-color: #89e051;
}
.language-badge.Shell:hover {
    background-color: #89e051;
}

.language-badge.PowerShell {
    background-color: rgba(1, 36, 86, 0.1);
    border-color: #012456;
}
.language-badge.PowerShell:hover {
    background-color: #012456;
}

.language-badge.Dockerfile {
    background-color: rgba(36, 150, 237, 0.1);
    border-color: #2496ed;
}
.language-badge.Dockerfile:hover {
    background-color: #2496ed;
}

.language-badge.Nix {
    background-color: rgba(126, 126, 255, 0.1);
    border-color: #7e7eff;
}
.language-badge.Nix:hover {
    background-color: #7e7eff;
}

.language-badge.Stylus {
    background-color: rgba(255, 99, 71, 0.1);
    border-color: #ff6347;
}
.language-badge.Stylus:hover {
    background-color: #ff6347;
}

.language-badge.Jupyter-Notebook {
    background-color: rgba(243, 118, 38, 0.1);
    border-color: #f37626;
}
.language-badge.Jupyter-Notebook:hover {
    background-color: #f37626;
}

.language-badge.HCL {
    background-color: rgba(111, 78, 55, 0.1);
    border-color: #6f4e37;
}
.language-badge.HCL:hover {
    background-color: #6f4e37;
}

.language-badge.Makefile {
    background-color: rgba(66, 120, 25, 0.1);
    border-color: #427819;
}
.language-badge.Makefile:hover {
    background-color: #427819;
}

.language-badge.SCSS {
    background-color: rgba(198, 83, 140, 0.1);
    border-color: #c6538c;
}
.language-badge.SCSS:hover {
    background-color: #c6538c;
}

.language-badge.Sass {
    background-color: rgba(204, 102, 153, 0.1);
    border-color: #c69;
}
.language-badge.Sass:hover {
    background-color: #c69;
}

.language-badge.Less {
    background-color: rgba(29, 54, 93, 0.1);
    border-color: #1d365d;
}
.language-badge.Less:hover {
    background-color: #1d365d;
}

.language-badge.SQL {
    background-color: rgba(227, 140, 0, 0.1);
    border-color: #e38c00;
}
.language-badge.SQL:hover {
    background-color: #e38c00;
}

.language-badge.GraphQL {
    background-color: rgba(229, 53, 171, 0.1);
    border-color: #e535ab;
}
.language-badge.GraphQL:hover {
    background-color: #e535ab;
}

.language-badge.R {
    background-color: rgba(25, 140, 231, 0.1);
    border-color: #198CE7;
}
.language-badge.R:hover {
    background-color: #198CE7;
}

.language-badge.Markdown {
    background-color: rgba(8, 63, 161, 0.1);
    border-color: #083fa1;
}
.language-badge.Markdown:hover {
    background-color: #083fa1;
}

.language-badge.YAML {
    background-color: rgba(203, 23, 30, 0.1);
    border-color: #cb171e;
}
.language-badge.YAML:hover {
    background-color: #cb171e;
}

.language-badge.JSON {
    background-color: rgba(41, 41, 41, 0.1);
    border-color: #292929;
}
.language-badge.JSON:hover {
    background-color: #292929;
}

.language-badge.Terraform {
    background-color: rgba(92, 53, 181, 0.1);
    border-color: #5C35B5;
}
.language-badge.Terraform:hover {
    background-color: #5C35B5;
}

.language-badge.Perl {
    background-color: rgba(57, 74, 149, 0.1);
    border-color: #394A95;
}
.language-badge.Perl:hover {
    background-color: #394A95;
}

.language-badge.Dart {
    background-color: rgba(0, 180, 255, 0.1);
    border-color: #00B4FF;
}
.language-badge.Dart:hover {
    background-color: #00B4FF;
}

.language-badge.Elixir {
    background-color: rgba(110, 74, 141, 0.1);
    border-color: #6E4A8D;
}
.language-badge.Elixir:hover {
    background-color: #6E4A8D;
}

.language-badge.Erlang {
    background-color: rgba(169, 17, 57, 0.1);
    border-color: #A91139;
}
.language-badge.Erlang:hover {
    background-color: #A91139;
}

.language-badge.Vim-Script {
    background-color: rgba(25, 153, 64, 0.1);
    border-color: #199940;
}
.language-badge.Vim-Script:hover {
    background-color: #199940;
}

.language-badge.Groovy {
    background-color: rgba(98, 149, 184, 0.1);
    border-color: #6295B8;
}
.language-badge.Groovy:hover {
    background-color: #6295B8;
}

.language-badge.TOML {
    background-color: rgba(156, 89, 35, 0.1);
    border-color: #9C5923;
}
.language-badge.TOML:hover {
    background-color: #9C5923;
}