/* Sipariş Bildirimi */
.order-notification {
    position: fixed;
    bottom: 24px;
    left: 24px;
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: 16px;
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 16px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
    border: 1px solid rgba(0, 0, 0, 0.08);
    z-index: 2;
    min-width: 300px;
    max-width: 400px;
    transform: translateY(150%);
    transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.order-notification.show {
    transform: translateY(0);
}

.order-notification .notification-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    flex-shrink: 0;
}

.order-notification .notification-icon.instagram {
    background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
    color: white;
}

.order-notification .notification-icon.tiktok {
    background: linear-gradient(45deg, #010101 0%, #111 100%);
    color: white;
}

.notification-icon.youtube {
    background: linear-gradient(45deg, #FF0000 0%, #CC0000 100%);
    color: white;
}

.notification-icon.facebook {
    background: linear-gradient(45deg, #18ACFE 0%, #0088F7 100%);
    color: white;
}

/* Twitter/X */
.notification-icon.twitter,
.notification-icon.x {
    background: linear-gradient(45deg, #000000 0%, #14171A 100%);
    color: white;
}

/* Spotify */
.notification-icon.spotify {
    background: linear-gradient(45deg, #1DB954 0%, #1ed760 100%);
    color: white;
}

/* Twitch */
.notification-icon.twitch {
    background: linear-gradient(45deg, #9146FF 0%, #772ce8 100%);
    color: white;
}

/* Kick */
.notification-icon.kick {
    background: linear-gradient(45deg, #53FC18 0%, #45d113 100%);
    color: #000;
}

/* LinkedIn */
.notification-icon.linkedin {
    background: linear-gradient(45deg, #0077B5 0%, #005885 100%);
    color: white;
}

/* Reddit */
.notification-icon.reddit {
    background: linear-gradient(45deg, #FF4500 0%, #dd3c00 100%);
    color: white;
}

/* Pinterest */
.notification-icon.pinterest {
    background: linear-gradient(45deg, #E60023 0%, #bd001d 100%);
    color: white;
}

/* Snapchat */
.notification-icon.snapchat {
    background: linear-gradient(45deg, #FFFC00 0%, #ffe600 100%);
    color: #000;
}

/* Telegram */
.notification-icon.telegram {
    background: linear-gradient(45deg, #0088CC 0%, #006fa8 100%);
    color: white;
}

/* SoundCloud */
.notification-icon.soundcloud {
    background: linear-gradient(45deg, #FF3300 0%, #ff5722 100%);
    color: white;
}

/* Shazam */
.notification-icon.shazam {
    background: linear-gradient(45deg, #0088FF 0%, #006dd9 100%);
    color: white;
}

/* Vimeo */
.notification-icon.vimeo {
    background: linear-gradient(45deg, #1AB7EA 0%, #1396c4 100%);
    color: white;
}

/* Kwai */
.notification-icon.kwai {
    background: linear-gradient(45deg, #FF6F00 0%, #ff8c1a 100%);
    color: white;
}

/* WhatsApp */
.notification-icon.whatsapp {
    background: linear-gradient(45deg, #25D366 0%, #20b858 100%);
    color: white;
}

/* Dailymotion */
.notification-icon.dailymotion {
    background: linear-gradient(45deg, #0066DC 0%, #0052b3 100%);
    color: white;
}

/* Discord */
.notification-icon.discord {
    background: linear-gradient(45deg, #5865F2 0%, #4752c4 100%);
    color: white;
}

/* Tinder */
.notification-icon.tinder {
    background: linear-gradient(45deg, #FF6B6B 0%, #FE3C72 100%);
    color: white;
}

/* Clubhouse */
.notification-icon.clubhouse {
    background: linear-gradient(45deg, #F2EE93 0%, #F0E68C 100%);
    color: #000;
}

/* PUBG */
.notification-icon.pubg {
    background: linear-gradient(45deg, #F7A004 0%, #d88a03 100%);
    color: white;
}

/* Trovo */
.notification-icon.trovo {
    background: linear-gradient(45deg, #20E070 0%, #19bc5d 100%);
    color: white;
}

/* Tumblr */
.notification-icon.tumblr {
    background: linear-gradient(45deg, #35465C 0%, #2a3749 100%);
    color: white;
}

/* Google */
.notification-icon.google {
    background: linear-gradient(45deg, #4285F4 0%, #3367d6 100%);
    color: white;
}

/* ChatGPT */
.notification-icon.chatgpt {
    background: linear-gradient(45deg, #10A37F 0%, #0d8968 100%);
    color: white;
}

/* VK */
.notification-icon.vk {
    background: linear-gradient(45deg, #0077FF 0%, #0063d9 100%);
    color: white;
}

/* Deezer */
.notification-icon.deezer {
    background: linear-gradient(45deg, #FF0092 0%, #d90077 100%);
    color: white;
}

/* Bigo Live */
.notification-icon.bigolive,
.notification-icon.bigo-live {
    background: linear-gradient(45deg, #FF6B9D 0%, #ff4e85 100%);
    color: white;
}

/* TripAdvisor */
.notification-icon.tripadvisor {
    background: linear-gradient(45deg, #00AF87 0%, #008f6f 100%);
    color: white;
}

/* Trustpilot */
.notification-icon.trustpilot {
    background: linear-gradient(45deg, #00B67A 0%, #009963 100%);
    color: white;
}

/* Default fallback for undefined platforms */
.order-notification .notification-icon:not(.instagram):not(.tiktok):not(.youtube):not(.facebook):not(.twitter):not(.x):not(.spotify):not(.twitch):not(.kick):not(.linkedin):not(.reddit):not(.pinterest):not(.snapchat):not(.telegram):not(.soundcloud):not(.shazam):not(.vimeo):not(.kwai):not(.whatsapp):not(.dailymotion):not(.discord):not(.tinder):not(.clubhouse):not(.pubg):not(.trovo):not(.tumblr):not(.google):not(.chatgpt):not(.vk):not(.deezer):not(.bigolive):not(.bigo-live):not(.tripadvisor):not(.trustpilot) {
    background: linear-gradient(45deg, #667eea 0%, #764ba2 100%);
    color: white;
}


.order-notification .notification-content {
    flex: 1;
}

.order-notification .notification-text {
    font-size: 14px;
    color: #1a1a1a;
    margin-bottom: 4px;
    line-height: 1.4;
}

.notification-time {
    font-size: 12px;
    color: #666;
}

@media (max-width: 576px) {
    .order-notification {
        left: 5vw;
        right: 5vw;
        bottom: 16px;
        min-width: 80vw;
    }
    .order-notification.show {
        transform: translateY(0);
        bottom: 85px;
       
    }
} 