/* Gaming Icons System */
.game-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: bold;
    color: #1b2838;
    margin-right: 8px;
    vertical-align: middle;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

/* Minecraft Icon */
.game-icon.minecraft {
    background: linear-gradient(135deg, #8B4513 0%, #A0522D 50%, #8B4513 100%);
    border: 2px solid #654321;
}

.game-icon.minecraft::before {
    content: "MC";
    font-size: 8px;
    color: #FFFFFF;
    font-weight: bold;
}

/* Terraria Icon */
.game-icon.terraria {
    background: linear-gradient(135deg, #4169E1 0%, #6495ED 50%, #4169E1 100%);
    border: 2px solid #1E90FF;
}

.game-icon.terraria::before {
    content: "TR";
    font-size: 8px;
    color: #FFD700;
    font-weight: bold;
}

/* Fortnite Icon */
.game-icon.fortnite {
    background: linear-gradient(135deg, #9146FF 0%, #B19CD9 50%, #9146FF 100%);
    border: 2px solid #7B68EE;
}

.game-icon.fortnite::before {
    content: "FN";
    font-size: 8px;
    color: #FFD700;
    font-weight: bold;
}

/* Counter-Strike Icon */
.game-icon.counterstrike {
    background: linear-gradient(135deg, #FF6B35 0%, #FF8C42 50%, #FF6B35 100%);
    border: 2px solid #E55A2B;
}

.game-icon.counterstrike::before {
    content: "CS";
    font-size: 8px;
    color: #FFFFFF;
    font-weight: bold;
}

/* Among Us Icon */
.game-icon.amongus {
    background: linear-gradient(135deg, #FF0000 0%, #FF4444 50%, #FF0000 100%);
    border: 2px solid #CC0000;
}

.game-icon.amongus::before {
    content: "AU";
    font-size: 8px;
    color: #FFFFFF;
    font-weight: bold;
}

/* Fall Guys Icon */
.game-icon.fallguys {
    background: linear-gradient(135deg, #FF69B4 0%, #FFB6C1 50%, #FF69B4 100%);
    border: 2px solid #FF1493;
}

.game-icon.fallguys::before {
    content: "FG";
    font-size: 8px;
    color: #FFFFFF;
    font-weight: bold;
}

/* Retro Games Icon */
.game-icon.retro {
    background: linear-gradient(135deg, #32CD32 0%, #90EE90 50%, #32CD32 100%);
    border: 2px solid #228B22;
}

.game-icon.retro::before {
    content: "RT";
    font-size: 8px;
    color: #1b2838;
    font-weight: bold;
}

/* Generic Gaming Icon */
.game-icon.generic {
    background: linear-gradient(135deg, #66c0f4 0%, #4c9bd1 50%, #66c0f4 100%);
    border: 2px solid #4c9bd1;
}

.game-icon.generic::before {
    content: "GM";
    font-size: 8px;
    color: #1b2838;
    font-weight: bold;
}

/* Large variant for headers */
.game-icon.large {
    width: 32px;
    height: 32px;
    font-size: 18px;
    margin-right: 12px;
}

.game-icon.large::before {
    font-size: 16px;
}

/* Small variant for inline text */
.game-icon.small {
    width: 18px;
    height: 18px;
    font-size: 10px;
    margin-right: 6px;
}

.game-icon.small::before {
    font-size: 10px;
}

/* Hover effects */
.game-icon:hover {
    transform: scale(1.1);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
    transition: all 0.2s ease;
}

/* Game text with icon helper */
.game-text {
    display: inline-flex;
    align-items: center;
    font-weight: bold;
}

.game-text .game-icon {
    margin-right: 8px;
}

/* Game Icons CSS */
.game-icon {
    width: 24px;
    height: 24px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: inline-block;
    vertical-align: middle;
    margin-right: 8px;
}

.game-icon.minecraft {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%2366BB6A"><rect x="6" y="6" width="12" height="12" rx="1"/><rect x="8" y="8" width="2" height="2" fill="%23fff"/><rect x="14" y="8" width="2" height="2" fill="%23fff"/><rect x="10" y="12" width="4" height="2" fill="%23fff"/></svg>');
}

.game-icon.terraria {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%234CAF50"><circle cx="12" cy="12" r="10"/><path d="M8 10h8v4H8z" fill="%23fff"/><circle cx="10" cy="11" r="1" fill="%234CAF50"/><circle cx="14" cy="11" r="1" fill="%234CAF50"/></svg>');
}

.game-icon.fortnite {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23FF6B35"><path d="M12 2L3 7v10l9 5 9-5V7l-9-5z"/><path d="M12 8v8" stroke="%23fff" stroke-width="2"/><path d="M8 10l8 4" stroke="%23fff" stroke-width="1"/></svg>');
}

.game-icon.valorant {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23FF4655"><path d="M12 2l-8 6v8l8 6 8-6V7l-8-6z"/><path d="M8 8l4 4 4-4v8l-4-4-4 4V8z" fill="%23fff"/></svg>');
}

.game-icon.csgo {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23F57C00"><circle cx="12" cy="12" r="10"/><path d="M8 8l8 8M16 8l-8 8" stroke="%23fff" stroke-width="2"/><circle cx="12" cy="12" r="2" fill="%23fff"/></svg>');
}

.game-icon.lol {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23C89B3C"><path d="M12 2L2 7v10l10 5 10-5V7L12 2z"/><path d="M12 6v12M6 9l12 6M18 9L6 15" stroke="%23fff" stroke-width="1"/></svg>');
}

.game-icon.apex {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23FF6700"><path d="M12 2l-8 20h16L12 2z"/><path d="M12 8l-4 10h8l-4-10z" fill="%23fff"/></svg>');
}

.game-icon.overwatch {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23F99E1A"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="6" fill="none" stroke="%23fff" stroke-width="2"/><circle cx="12" cy="8" r="2" fill="%23fff"/><circle cx="12" cy="16" r="2" fill="%23fff"/></svg>');
}

.game-icon.rocket-league {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23FF6B00"><ellipse cx="12" cy="16" rx="8" ry="4"/><circle cx="12" cy="8" r="4" fill="%23fff"/><path d="M8 12h8" stroke="%23fff" stroke-width="2"/></svg>');
}

.game-icon.fall-guys {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23FF69B4"><ellipse cx="12" cy="12" rx="8" ry="10"/><circle cx="10" cy="9" r="1.5" fill="%23000"/><circle cx="14" cy="9" r="1.5" fill="%23000"/><ellipse cx="12" cy="14" rx="2" ry="1" fill="%23000"/></svg>');
}

/* Generic game icon for unknown games */
.game-icon.generic {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%236A4C93"><rect x="4" y="6" width="16" height="12" rx="2"/><circle cx="8" cy="10" r="1.5" fill="%23fff"/><circle cx="16" cy="10" r="1.5" fill="%23fff"/><rect x="10" y="14" width="4" height="1" fill="%23fff"/></svg>');
}