/* ==========================================================================
   DEĞİŞKENLER & TEMEL AYARLAR (ROOT & RESET)
   ========================================================================== */
:root {
    --primary: #3b82f6;
    --primary-hover: #2563eb;
    --secondary: #f3f4f6;
    --text-dark: #1f2937;
    --text-light: #6b7280;
    --white: #f8f9fa;
    --bg: #dddddd;
    --main-bg-color: #fcfcfc;
    --danger: #ef4444;
    --success: #10b981;
    --border: #d1d5db;
    --card-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --transition: all 0.2s ease;
}
*, *::before, *::after {
    box-sizing: border-box;
}
body {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    background-color: var(--bg);
    margin: 0;
    color: var(--text-dark);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}
/* Sayfa geçişleri için hayati kodlar */
.view { display: none; }
.view.active { display: block; }
/* Scrollbar Özelleştirme */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }


/* ==========================================================================
   ANİMASYONLAR
   ========================================================================== */
.fade-in-up { animation: fadeInUp 0.4s ease forwards; }
.scale-in { animation: scaleIn 0.3s ease forwards; }

@keyframes fadeInUp { from { opacity: 0; transform: translateY(15px); } to { opacity: 1; transform: translateY(0); } }
@keyframes scaleIn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
@keyframes popInLevel { to { transform: scale(1); opacity: 1; } }
@keyframes fadeInOverlay { from { opacity: 0; } to { opacity: 1; } }
@keyframes floatBadge { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-15px); } }
@keyframes rotateGlow { from { transform: translate(-50%, -50%) rotate(0deg); } to { transform: translate(-50%, -50%) rotate(360deg); } }
@keyframes fadeInDropdown { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } }

/* ==========================================================================
   DARK MODE
   ========================================================================== */
body.dark-mode { --bg: #121212; --white: #1e1e1e; --text-dark: #e0e0e0; --text-light: #a0a0a0; --border: #333333; --secondary: #252525; --card-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.5); --primary: #60a5fa; }
body.dark-mode input,
body.dark-mode select,
body.dark-mode textarea { background-color: #121212 !important; color: #ffffff !important; border-color: #444 !important; }
body.dark-mode .api-results { background-color: #1e1e1e; border-color: #333; }
body.dark-mode .api-item:hover { background-color: #252525; }
body.dark-mode .settings-add-cat-wrapper,
body.dark-mode .settings-card,
body.dark-mode .oneri-controls,
body.dark-mode .settings-list li { background-color: #1e1e1e !important; border-color: #333 !important; }
body.dark-mode .settings-nav-item.active { background: #1e1e1e; color: #60a5fa; }
body.dark-mode .kart-tamamlandi::before { background: var(--kat-renk-bg, rgba(16, 185, 129, 0.15)); }
body.dark-mode .modal-content.modal-wide { background-color: #1e1e1e; border: 1px solid #333; }
body.dark-mode .modal-main-form label { color: #a0a0a0; }
body.dark-mode .search-radio:hover .radio-box { background: #333; color: white; }
body.dark-mode .showcase-header { border-bottom-color: rgba(255,255,255,0.1); }
body.dark-mode .mystery-banner { background: linear-gradient(135deg, #3730a3 0%, #5b21b6 100%); }
body.dark-mode .kategori-ayar-kart { background: #1e1e1e; border-color: #333; }