.link {
    --tw-bg-opacity: 1;
    background-color: rgb(194 83 225 / var(--tw-bg-opacity));
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity));
}

.link:hover {
    --tw-brightness: brightness(0.9);
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast)
        var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert)
        var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.link-beatport {
    color: #000;
    background-color: #01ff95;
}

.link-instagram {
    background-color: #c13584;
    background: linear-gradient(
        45deg,
        #405de6,
        #5851db,
        #833ab4,
        #c13584,
        #e1306c,
        #fd1d1d
    );
}

.link-apple-music {
    background-color: #f94c57;
    background: linear-gradient(120deg, #f94c57, #fc3c44);
}

.link-soundcloud {
    background-color: #f80;
    background: linear-gradient(120deg, #ff8800, #ff3300);
}

.link-traxsource {
    background-color: #262626;

    i {
        color: #40a0ff;
    }
}

.link-twitter {
    background-color: #000;
}

.link-spotify {
    background-color: #191414;
}

.link-tiktok {
    color: #000;
    background-color: #25f4ee;
}

.link-linktree {
    color: #acdc5c;
}

.link-tidal {
    background-color: #000;
}

.icon-youtube-white {
    position: relative;
}

.icon-youtube-white::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-35%, -50%);
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 18px solid white;
}

.link-youtube {
    background-color: #fff !important;
    color: #282828 !important;
}

.link-youtube i {
    color: #ff0000 !important;
}

.link-youtube:hover {
    --tw-brightness: brightness(0.9);
    filter: var(--tw-brightness);
}

.carousel { position: relative; width: 100%; overflow: hidden; }
.carousel-inner { display: flex; transition: transform 0.3s ease; }
.carousel-item { flex-shrink: 0; width: 200px; height: 200px; margin: 0 10px; display: flex; justify-content: center; align-items: center; }
.carousel-item img { max-width: 100%; max-height: 100%; object-fit: contain; }
.carousel-prev, .carousel-next { cursor: pointer; font-size: 2rem; background: rgba(0,0,0,0.5); color: white; border: none; padding: 10px; border-radius: 50%; }