/**
 * @name phantom-theme
 * @author novi.mp3
 * @description basically AMOLED-cord but better.
 * @version 1.3
 */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root,
.theme-dark,
.theme-midnight,
#app-mount {
    --font-primary: 'Space Grotesk', sans-serif;
    --font-display: 'Space Grotesk', sans-serif;
    --font-headline: 'Space Grotesk', sans-serif;
    --font-code: 'Consolas', monospace;

    --text-normal: #e4e4e7;
    --text-muted: #9ca3af;

    --brand-experiment: #a855f7;
    --brand-500: #a855f7;
    --brand-560: #a855f7;
    --background-brand: #a855f7;
    --text-brand: #a855f7;
    --text-link: #c084fc;
    --status-danger: #a855f7;

    --background-mentioned: rgba(168, 85, 247, 0.14);
    --background-mentioned-hover: rgba(168, 85, 247, 0.22);

    --background-base-lowest: #000000;
    --background-base-lower: #000000;
    --background-base-low: #050505;
    --background-surface-high: #000000;
    --background-surface-higher: #000000;

    --background-primary: #000000;
    --background-secondary: #000000;
    --background-secondary-alt: #000000;
    --background-tertiary: #000000;
    --background-floating: #000000;

    --modal-background: #000000;
    --modal-footer-background: #000000;
    --home-background: #000000;

    --background-modifier-hover: rgba(255,255,255,0.03);
    --background-modifier-active: rgba(255,255,255,0.05);
    --background-modifier-selected: rgba(255,255,255,0.07);
    --background-modifier-accent: transparent;

    --border-subtle: transparent;
    --border-muted: transparent;
    --app-frame-border: transparent;
}

/* sidebar */
[class*="sidebar_"],
[class*="sidebar_"] > div:not([class*="sidebarResizeHandle_"]),
[class*="sidebar_"] [class*="scroller_"] {
    background: #000000;
    background-color: #000000;
    background-image: none;
    box-shadow: none;
    border: none;
}

/* REMOVE the old line from DM button */
[class*="guilds_"] [class*="scroller_"] > div:first-child {
    position: relative;
    padding-bottom: 0;
    margin-bottom: 0;
}

[class*="guilds_"] [class*="scroller_"] > div:first-child::after {
    display: none;
}

/* ADD line before first server */
[class*="guilds_"] [class*="scroller_"] > div:nth-child(3) {
    position: relative;
    padding-top: 1px;
    margin-top: 7px;
}

[class*="guilds_"] [class*="scroller_"] > div:nth-child(3)::before {
    content: '';
    position: absolute;
    top: -6px;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 3px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 3px;
}

[class*="guilds_"] [class*="scroller_"] > div:first-child::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 3px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 3px;
}
/* voice channels - force black on every layer */
[class*="voiceUser_"],
[class*="voiceUser_"] > div,
[class*="voiceUser_"] > div > div,
[class*="voiceUsers_"] > li,
[class*="voiceUsers_"] > div,
[class*="draggable_"] > div,
[class*="containerDefault_"] [class*="list_"] > li,
[class*="containerDefault_"] [class*="list_"] > div {
    background: #000000;
    background-color: #000000;
    background-image: none;
    box-shadow: none;
    border: none;
}

[class*="voiceUser_"] [class*="username_"],
[class*="voiceUser_"] [class*="name_"] {
    color: var(--text-normal);
}

[class*="voiceUser_"] [class*="avatarSpeaking_"],
[class*="voiceUser_"] [class*="speaking_"] {
    box-shadow: inset 0 0 0 2px #a855f7;
}

/* remove server banners */
[class*="bannerImage_"],
[class*="animatedContainer_"],
[class*="animatedBanner_"] {
    background: #000000;
    background-image: none;
    box-shadow: none;
    border: none;
}

/* sidebar header */
[class*="sidebar_"] [class*="header_"],
[class*="headerContent_"] {
    background: #000000;
    background-image: none;
    border: none;
}

/* user panel */
[class*="panels_"] {
    background: #000000;
    background-image: none;
    border: none;
}

/* upsells */
[class*="sidebar_"] [class*="upsell_"],
[class*="sidebar_"] [class*="premiumPromo_"],
[class*="sidebar_"] [class*="nitroUpsell_"],
[class*="sidebar_"] [class*="perks_"],
[class*="sidebar_"] [class*="premium_"],
[class*="sidebar_"] [class*="guildPremium_"],
[class*="sidebar_"] [class*="boostProgressBar_"] {
    background: #000000;
    background-image: none;
    box-shadow: none;
    border: none;
}

/* page backgrounds */
[class*="pageBody_"],
[class*="peopleColumn_"],
[class*="privateChannels_"],
[class*="standardSidebarView_"],
[class*="contentRegion_"],
[class*="chatContent_"],
[class*="chat_"] > [class*="content_"] {
    background: #000000;
}

/* channels */
[class*="containerDefault_"] [class*="name_"] {
    color: #6b7280;
}

/* UNREAD channels - purple text */
[class*="modeUnread_"] [class*="name_"],
[class*="modeUnreadImportant_"] [class*="name_"] {
    color: #c084fc;
    font-weight: 600;
}

/* SELECTED channel - subtle purple bg tint */
[class*="modeSelected_"] [class*="wrapper_"] {
    background: rgba(168, 85, 247, 0.06);
    border-radius: 4px;
}

[class*="modeSelected_"] [class*="name_"] {
    color: #ffffff;
}

/* category headers - small purple section labels */
[class*="sidebar_"] [class*="container_"] > [class*="wrapper_"] > [class*="name_"] {
    color: #a855f7;
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 0.6px;
}

/* lines fix */
li[class*="containerDefault_"][class*="selected_"] {
    border-left: none;
}

[class*="mentioned_"]::before {
    display: none;
}

/* unread PILL - only inside channel rows, purple */
[class*="containerDefault_"] [class*="unread_"] {
    background: #a855f7;
}

/* KILL only the big top/bottom unread bars in sidebar - NOT channel pills */
[class*="sidebar_"] [class*="scroller_"] > div[class*="container_"][class*="bottom_"],
[class*="sidebar_"] [class*="scroller_"] > div[class*="container_"][class*="top_"] {
    background: #000000;
    background-color: #000000;
    background-image: none;
}

/* jump to present bar */
[class*="jumpToPresentBar_"] {
    background: #a855f7;
    background-color: #a855f7;
    background-image: none;
    box-shadow: none;
    border: none;
}

/* jump to present button */
[class*="jumpToPresentBar_"] [class*="button_"] {
    background: #7c3aed;
    background-color: #7c3aed;
    color: #ffffff;
    border: none;
}

/* hovers */
li[class*="containerDefault_"] div[class*="wrapper_"] {
    transition: transform 0.2s ease, background 0.2s ease;
}

li[class*="containerDefault_"]:hover div[class*="wrapper_"] {
    transform: translateX(4px);
    background: linear-gradient(90deg, rgba(168, 85, 247, 0.1) 0%, transparent 100%);
}

/* badges & pings */
[class*="numberBadge_"],
[class*="iconBadge_"],
[class*="mentionsBadge_"] {
    background: #a855f7;
    color: #ffffff;
}

/* mentions - purple, no gold hover */
span[class*="mention"],
span[class*="mention"]:hover,
span[class*="mention"]:active {
    color: #c084fc !important;
    background: rgba(168, 85, 247, 0.15) !important;
}

/* mentioned message background - stays same on hover */
[class*="mentioned_"] {
    background: rgba(168, 85, 247, 0.10);
}

[class*="message_"]:hover[class*="mentioned_"],
[class*="message_"][class*="mentioned_"]:hover,
[class*="message_"]:hover [class*="mentioned_"] {
    background: rgba(168, 85, 247, 0.10) !important;
}

/* chat */
div[class*="channelTextArea_"] div[class*="scrollableContainer_"] {
    background: #050505;
    border: none;
    border-radius: 8px;
}

div[class*="channelTextArea_"] div[class*="scrollableContainer_"]:focus-within {
    box-shadow: inset 0 0 0 1px #a855f7;
}

div[class*="messageContent_"],
div[class*="repliedMessage_"] {
    font-size: 15px;
    line-height: 1.5;
    font-weight: 500;
}

/* embeds - stop them from vanishing into black */
[class*="embedFull_"],
[class*="attachment_"],
[class*="wrapper_"][class*="media_"],
[class*="container_"][class*="embed_"] {
    background: #050505;
    border: 1px solid rgba(168, 85, 247, 0.15);
    border-radius: 6px;
}

/* embed left color bars */
[class*="embed_"] [class*="embedSideColor_"],
[class*="embedFull_"] [class*="side_"] {
    background: #a855f7;
}

/* embed text links */
[class*="embed_"] [class*="title_"],
[class*="embed_"] [class*="description_"] {
    color: #e4e4e7;
}

[class*="embed_"] a,
[class*="embed_"] [class*="anchor_"] {
    color: #c084fc;
}
/* idkkkk */
[class*="imageWrapper_"],
[class*="mediaAttachmentsContainer_"] > div,
[class*="oneByOneGrid_"] > div,
[class*="oneByTwoGrid_"] > div,
[class*="twoByOneGrid_"] > div,
[class*="twoByTwoGrid_"] > div,
[class*="mosaicItem_"] {
    background: #050505;
    border: 1px solid rgba(168, 85, 247, 0.12);
    border-radius: 6px;
}

/* video attachments */
[class*="videoWrapper_"],
[class*="videoContainer_"] {
    background: #050505;
    border: 1px solid rgba(168, 85, 247, 0.12);
    border-radius: 6px;
}

/* hidden elements */
button[aria-label="Send a gift"] {
    display: none;
}

[class*="scroller_"]::before,
[class*="scroller_"]::after {
    display: none;
}
/* ping colors (the important ensures that the code dosent break) */
[class*="numberBadge_"],
[class*="iconBadge_"],
[class*="mentionsBadge_"] {
    background: #a855f7 !important;
    color: #ffffff 
}

/* phantom logo on DMs button */
.childWrapper__6e9f8 {
    background-image: url('https://i.ibb.co/xSws4Bzv/6b723942-4b42-492c-8f28-e36b47ae421d.png');
    background-repeat: no-repeat;
    background-size: cover;
}

/* hide default Discord logo SVG inside DM button */
.childWrapper__6e9f8 svg {
    display: none;
}

/* DM ping badge - keep it subtle or match theme */
[class*="guilds_"] [class*="numberBadge_"] {
    background: #a855f7 !important;
    color: #ffffff !important;
}

#app-mount:hover::before {
    opacity: 1;
}