/* ==========================================================================
   ME26 AĞI - KÜRESEL STİL DOSYASI (style.css)
   ========================================================================== */

/* 1. RENK DEĞİŞKENLERİ VE KÖK AYARLAR */
:root { 
    /* Sistemin Kalbi: Altın Sarısı / Kaos Rengi */
    --neon-hex: #F6C104; 
    --neon-rgb: 246, 193, 4; 
}

html {
    scroll-behavior: smooth;
}

/* 2. ÖZEL GÖLGELER VE PARLAMALAR */
.shadow-kaos {
    box-shadow: 0 0 15px rgba(var(--neon-rgb), 0.4);
}
.shadow-kaos-lg {
    box-shadow: 0 0 40px rgba(var(--neon-rgb), 0.5);
}
.text-outline-kaos {
    text-shadow: 0 0 20px rgba(var(--neon-rgb), 0.3);
}
.hover-border-kaos {
    transition: all 0.3s ease;
}
.hover-border-kaos:hover {
    border-color: var(--neon-hex);
    box-shadow: 0 0 20px rgba(var(--neon-rgb), 0.2);
}

/* 3. DİJİTAL KİMLİK KARTI (Hologram / Cam Efekti) */
.id-card {
    background: linear-gradient(135deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.01) 100%);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,0.18);
    box-shadow: 0 8px 32px 0 rgba(0,0,0,0.37);
    position: relative; 
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Kimlik Kartı Hover Parlama (Flaş Efekti) */
.id-card::before {
    content: ''; 
    position: absolute; 
    top: -50%; 
    left: -50%; 
    width: 200%; 
    height: 200%;
    background: radial-gradient(circle, rgba(var(--neon-rgb), 0.15) 0%, transparent 50%);
    opacity: 0; 
    transition: opacity 0.5s ease-in-out;
    pointer-events: none;
}

.id-card:hover::before { 
    opacity: 1; 
}

/* 4. ÖZEL KAYDIRMA ÇUBUĞU (Custom Scrollbar - Chrome & Firefox Destekli) */
.custom-scrollbar {
    /* Firefox Desteği */
    scrollbar-width: thin; 
    scrollbar-color: rgba(var(--neon-rgb), 0.5) rgba(0,0,0,0.1); 
}

/* Chrome, Edge, Safari Desteği */
.custom-scrollbar::-webkit-scrollbar { 
    width: 5px; 
}
.custom-scrollbar::-webkit-scrollbar-track { 
    background: rgba(0,0,0,0.1); 
    border-radius: 8px; 
}
.custom-scrollbar::-webkit-scrollbar-thumb { 
    background: rgba(var(--neon-rgb), 0.5); 
    border-radius: 10px; 
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: rgba(var(--neon-rgb), 0.8);
}

/* 5. ŞEHİR TRİBÜNLERİ (Kayan Bant - Marquee) */
.marquee-container { 
    overflow: hidden; 
    white-space: nowrap; 
    width: 100%; 
    display: flex; 
}
.marquee-content { 
    display: inline-flex; 
    padding-left: 100%; 
    animation: marquee 25s linear infinite; 
}
.marquee-content:hover { 
    animation-play-state: paused; /* Üzerine gelince durur */
}

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

/* 6. ARKA PLAN EFEKTLERİ (Radyal Işıklar) */
.bg-radial-kaos-lg { 
    background: radial-gradient(circle, rgba(var(--neon-rgb), 0.12) 0%, transparent 70%); 
}
.bg-radial-kaos-sm { 
    background: radial-gradient(circle, rgba(var(--neon-rgb), 0.08) 0%, transparent 60%); 
}

/* 7. GÜVENLİK VE LİYAKAT KİLİTLERİ (Bulanıklaştırma) */
.locked-content { 
    filter: blur(5px); 
    opacity: 0.6; 
    pointer-events: none; 
    user-select: none; 
    transition: all 0.5s ease; 
}

.lock-overlay { 
    transition: opacity 0.5s ease; 
    z-index: 20; 
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

/* 8. ÖZEL ANİMASYONLAR */
@keyframes pulse-slow {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: .85; transform: scale(1.02); }
}
.animate-pulse-slow {
    animation: pulse-slow 3s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes pulse-fast {
    0%, 100% { opacity: 1; }
    50% { opacity: .4; }
}
.animate-pulse-fast {
    animation: pulse-fast 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

/* Toast Bildirim Animasyonları */
@keyframes toastIn {
    0% { transform: translateX(-100%); opacity: 0; }
    100% { transform: translateX(0); opacity: 1; }
}
@keyframes toastOut {
    0% { transform: translateX(0); opacity: 1; }
    100% { transform: translateX(-100%); opacity: 0; }
}
.toast-in { animation: toastIn 0.5s ease-out forwards; }
.toast-out { animation: toastOut 0.5s ease-in forwards; }


/* ==========================================================================
   İLERİ SEVİYE: KATLANIR SARI CETVEL EFEKTİ
   Katlanır Sarı Cetvel marka efekti temel sürüm olarak korunmuştur.
   ========================================================================== */
.cetvel-kok { display: flex; justify-content: center; align-items: center; transition: transform 0.3s ease; }
.cetvel-p {
    width: 130px; height: 16px;
    background-color: #F6C104; border-radius: 8px; position: absolute;
    left: 114px; top: 0; transform-origin: 8px 8px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.5), inset 0 1px 1px rgba(255,255,255,0.4);
    border: 1px solid #B8860B;
    background-image: linear-gradient(90deg, #111 1px, transparent 1px), linear-gradient(90deg, #111 2px, transparent 2px);
    background-size: 8px 5px, 40px 10px; background-repeat: repeat-x; background-position: 16px 0px, 16px 0px;
    transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.c1 { position: relative; left: 0; top: 0; transform: rotate(-85deg); transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1); }
.percin {
    width: 8px; height: 8px; background: radial-gradient(circle, #222 2px, #ccc 3px, #888 8px);
    border-radius: 50%; position: absolute; top: 3px; box-shadow: 0 1px 1px rgba(0,0,0,0.6);
}
.p-left { left: 4px; } .p-right { right: 4px; }
.fold-pos { transform: rotate(176deg); } .fold-neg { transform: rotate(-176deg); }

/* ========================================================================== 
   ME26 v0.80 - Canlı Premium Kabuk Dokunuşları
   Mevcut Tailwind sınıflarını bozmadan görsel kaliteyi yükseltir.
   ========================================================================== */
.me26-premium-live {
    background:
        radial-gradient(circle at 18% 12%, rgba(246, 193, 4, 0.13), transparent 28%),
        radial-gradient(circle at 82% 4%, rgba(30, 64, 175, 0.18), transparent 30%),
        linear-gradient(135deg, #05070d 0%, #0b1020 42%, #05070d 100%);
}

.me26-premium-live .text-kaos { text-shadow: 0 0 18px rgba(246, 193, 4, 0.18); }

.me26-premium-live .bg-slate-900,
.me26-premium-live .bg-black\/40,
.me26-premium-live .bg-black\/50,
.me26-premium-live .bg-black\/60 {
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.035), 0 18px 60px rgba(0,0,0,0.18);
}

.me26-premium-live button,
.me26-premium-live .rounded-xl,
.me26-premium-live .rounded-2xl,
.me26-premium-live .rounded-3xl {
    backface-visibility: hidden;
}

.me26-premium-live button:focus-visible,
.me26-premium-live input:focus-visible,
.me26-premium-live select:focus-visible,
.me26-premium-live textarea:focus-visible {
    outline: 2px solid rgba(246, 193, 4, 0.85);
    outline-offset: 2px;
}

.me26-premium-live .border-slate-700,
.me26-premium-live .border-slate-800 {
    border-color: rgba(148, 163, 184, 0.18);
}

.me26-premium-live .bg-kaos {
    background-image: linear-gradient(135deg, #ffd84d, #f6c104 42%, #a87300);
    box-shadow: 0 12px 34px rgba(246, 193, 4, 0.18);
}

@media (max-width: 768px) {
    .me26-premium-live { overflow-x: hidden; }
    .me26-premium-live .tracking-widest { letter-spacing: 0.09em; }
}