/* Import Google Font with Turkish Support */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

/* Apply Font Globally */
body, html {
    font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

@keyframes marquee {
    0% { transform: translateX(100%); }
    100% { transform: translateX(-100%); }
}

.animate-marquee {
    animation: marquee 10s linear infinite;
    min-width: 100%;
}

/* Hide scrollbar for Chrome, Safari and Opera */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.no-scrollbar {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

/* Smooth Scrolling */
html {
    scroll-behavior: smooth;
}

/* Video Container specifics */
.video-container video {
    object-fit: cover;
}

/* Buy Button Pulse Animation */
@keyframes pulse-custom {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(219, 39, 119, 0.7);
    }
    50% {
        box-shadow: 0 0 0 10px rgba(219, 39, 119, 0);
    }
}

.buy-button {
    animation: pulse-custom 2s infinite;
}

/* Mask Gradient for Chat */
.mask-image-gradient {
    mask-image: linear-gradient(to bottom, transparent, black 10%, black 100%);
    -webkit-mask-image: linear-gradient(to bottom, transparent, black 10%, black 100%);
}

/* Vertical Mask Gradient for Credits */
.mask-image-gradient-vertical {
    mask-image: linear-gradient(to bottom, transparent, black 20%, black 80%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, transparent, black 20%, black 80%, transparent 100%);
}

/* Marquee Vertical Animation */
@keyframes marquee-vertical {
    0% { transform: translateY(100%); }
    100% { transform: translateY(-150%); }
}

.animate-marquee-vertical {
    animation: marquee-vertical 10s linear infinite;
}

/* Slide Down Animation */
@keyframes slide-down {
    from { transform: translateY(-100%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}
.animate-slide-down {
    animation: slide-down 0.5s ease-out forwards;
}

/* Bounce In Animation */
@keyframes bounce-in {
    0% { transform: scale(0); opacity: 0; }
    50% { transform: scale(1.2); opacity: 1; }
    100% { transform: scale(1); opacity: 1; }
}
.animate-bounce-in {
    animation: bounce-in 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
}

/* Fade In Animation */
@keyframes fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}
.animate-fade-in {
    animation: fade-in 1s ease-in forwards;
}

/* Pulse Slow */
@keyframes pulse-slow {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.8; }
}
.animate-pulse-slow {
    animation: pulse-slow 3s infinite;
}

/* Spin Slow */
@keyframes spin-slow {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
.animate-spin-slow {
    animation: spin-slow 3s linear infinite;
}


/* Starburst Effect for Final Countdown */
@keyframes rotate-bg {
    0% { transform: translate(-50%, -50%) rotate(0deg); }
    100% { transform: translate(-50%, -50%) rotate(360deg); }
}

.starburst-bg {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 200vmax;
    height: 200vmax;
    background: repeating-conic-gradient(
        from 0deg,
        rgba(242, 140, 40, 0.3) 0deg 10deg,
        transparent 10deg 20deg
    );
    transform: translate(-50%, -50%);
    animation: rotate-bg 20s linear infinite;
    z-index: -1;
    pointer-events: none;
}

.final-countdown-text {
    font-family: 'Arial Black', sans-serif;
    text-shadow: 0 0 20px rgba(242, 140, 40, 0.8), 0 0 40px rgba(242, 140, 40, 0.4);
}

@keyframes zoom-pulse {
    0% { transform: scale(1); opacity: 0.8; }
    50% { transform: scale(1.2); opacity: 1; }
    100% { transform: scale(1); opacity: 0.8; }
}

.animate-zoom-pulse {
    animation: zoom-pulse 0.8s infinite;
}

/* Profile Long Press Animation */
@keyframes circle-fill {
    0% { stroke-dasharray: 0 100; stroke: #ef4444; }
    100% { stroke-dasharray: 100 0; stroke: #ef4444; }
}

.long-press-ring {
    position: absolute;
    top: -4px;
    left: -4px;
    width: calc(100% + 8px);
    height: calc(100% + 8px);
    pointer-events: none;
    transform: rotate(-90deg);
    z-index: 50;
    opacity: 0;
    transition: opacity 0.2s;
}

.long-press-active .long-press-ring {
    opacity: 1;
}

.long-press-circle {
    fill: none;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-dasharray: 0 100;
}

.long-press-active .long-press-circle {
    animation: circle-fill 1.5s linear forwards;
}

.long-press-overlay {
    position: absolute;
    inset: -6px;
    background: rgba(239, 68, 68, 0.95);
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 10px;
    font-weight: 900;
    opacity: 0;
    transform: scale(0.8);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 60;
    border: 2px solid white;
    box-shadow: 0 0 15px rgba(239, 68, 68, 0.6);
}

.long-press-complete .long-press-overlay {
    opacity: 1;
    transform: scale(1);
    animation: pulse-red 1s infinite;
}

@keyframes pulse-red {
    0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.7); }
    50% { box-shadow: 0 0 0 10px rgba(239, 68, 68, 0); }
}