/* ==========================================================================
   SMM PANEL - PREMIUM GLASSMORPHIC DARK DESIGN SYSTEM
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap');

:root {
  --bg-main: #070a12;
  /* backdrop-filter kaldirildi (performans); kaybolan bulanik katmani telafi etmek
     icin kart arka planlari opaklastirildi. Gorunum pratikte ayni kalir. */
  --bg-card: rgba(16, 24, 44, 0.94);
  --bg-card-hover: rgba(30, 41, 59, 0.96);
  --bg-glass: rgba(255, 255, 255, 0.03);
  --border-glass: rgba(255, 255, 255, 0.08);
  --border-glow: rgba(139, 92, 246, 0.3);

  --primary: #8b5cf6;
  --primary-hover: #7c3aed;
  --primary-glow: rgba(139, 92, 246, 0.4);
  --accent-cyan: #06b6d4;
  --accent-cyan-glow: rgba(6, 182, 212, 0.3);
  --accent-pink: #ec4899;

  --text-main: #f8fafc;
  --text-muted: #94a3b8;
  --text-dim: #64748b;

  --success: #10b981;
  --warning: #f59e0b;
  --danger: #ef4444;

  --font-main: 'Outfit', 'Plus Jakarta Sans', sans-serif;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: var(--font-main);
  background-color: var(--bg-main);
  color: var(--text-main);
  min-height: 100vh;
  overflow-x: hidden;
  line-height: 1.5;
  background-image: 
    radial-gradient(circle at 15% 15%, rgba(139, 92, 246, 0.15) 0%, transparent 40%),
    radial-gradient(circle at 85% 85%, rgba(6, 182, 212, 0.12) 0%, transparent 45%),
    radial-gradient(circle at 50% 50%, rgba(236, 72, 153, 0.05) 0%, transparent 50%);
  /* Fixed layered gradients force a full-page repaint while scrolling. */
  background-attachment: scroll;
}

a {
  color: var(--primary);
  text-decoration: none;
  transition: var(--transition);
}

a:hover {
  color: var(--accent-cyan);
}

button, input, select, textarea {
  font-family: var(--font-main);
}

.language-selector { width: 82px; padding: 5px 8px; font-size: .82rem; }

/* Scrollbar */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: var(--bg-main);
}
::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.15);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--primary);
}

/* Header & Navbar */
.navbar {
  position: sticky;
  top: 0;
  z-index: 100;
  /* Sticky + backdrop-filter, her scroll karesinde tum genislikte yeniden
     bulanıklastirma demekti; scroll janki'nin ana kaynagiydi. Opak arka plan
     ayni gorunumu bedelsiz verir. */
  background: rgba(8, 11, 20, 0.97);
  border-bottom: 1px solid var(--border-glass);
  padding: 1rem 2rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.brand-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: -0.5px;
  color: #fff;
}

.brand-icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--primary), var(--accent-cyan));
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 20px var(--primary-glow);
  color: #fff;
  font-size: 1.2rem;
}

.brand-gradient {
  background: linear-gradient(135deg, #fff 30%, var(--primary) 70%, var(--accent-cyan) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.nav-links {
  display: flex;
  align-items: center;
  gap: 24px;
  list-style: none;
}

.nav-link {
  color: var(--text-muted);
  font-weight: 500;
  font-size: 0.95rem;
  padding: 8px 14px;
  border-radius: var(--radius-sm);
  transition: var(--transition);
  cursor: pointer;
}

.nav-link:hover, .nav-link.active {
  color: #fff;
  background: rgba(255, 255, 255, 0.05);
}

.user-badge {
  display: flex;
  align-items: center;
  gap: 16px;
  background: var(--bg-card);
  padding: 6px 16px;
  border-radius: 50px;
  border: 1px solid var(--border-glass);
}

.balance-pill {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.15), rgba(6, 182, 212, 0.15));
  border: 1px solid rgba(16, 185, 129, 0.3);
  color: var(--success);
  padding: 4px 12px;
  border-radius: 20px;
  font-weight: 700;
  font-size: 0.9rem;
}

/* Glass Card Component */
.glass-card {
  background: var(--bg-card);
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-lg);
  padding: 24px;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.32);
  transition: border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1),
              box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1),
              transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.glass-card:hover {
  border-color: rgba(139, 92, 246, 0.25);
}

.glass-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15), transparent);
}

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 24px;
  border-radius: var(--radius-md);
  font-weight: 600;
  font-size: 0.95rem;
  cursor: pointer;
  border: none;
  /* "all" yerine yalnizca gercekten degisen ozellikler: hover'da tarayici
     tum animasyonlanabilir ozellikleri taramak zorunda kalmaz. */
  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1),
              box-shadow 0.25s cubic-bezier(0.4, 0, 0.2, 1),
              background-color 0.25s cubic-bezier(0.4, 0, 0.2, 1),
              opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  outline: none;
}

.btn-primary {
  background: linear-gradient(135deg, var(--primary), #6d28d9);
  color: #fff;
  box-shadow: 0 0 25px var(--primary-glow);
}

.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 35px var(--primary-glow);
  background: linear-gradient(135deg, #7c3aed, #5b21b6);
}

.btn-cyan {
  background: linear-gradient(135deg, var(--accent-cyan), #0284c7);
  color: #fff;
  box-shadow: 0 0 25px var(--accent-cyan-glow);
}

.btn-cyan:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 35px var(--accent-cyan-glow);
}

.btn-outline {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--border-glass);
  color: var(--text-main);
}

.btn-outline:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: var(--primary);
}

.btn-sm {
  padding: 6px 14px;
  font-size: 0.85rem;
  border-radius: var(--radius-sm);
  /* Tablo satirlarinda onlarca kez tekrarlanir; kalici glow golgesi burada
     hem gorsel olarak gereksiz hem de boyama maliyetini katliyordu. */
  box-shadow: none;
}
.btn-sm:hover {
  box-shadow: none;
}

/* Hero Section (Landing Page) */
.hero-container {
  max-width: 1200px;
  margin: 60px auto 40px;
  text-align: center;
  padding: 0 20px;
}

.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(139, 92, 246, 0.12);
  border: 1px solid rgba(139, 92, 246, 0.3);
  padding: 6px 18px;
  border-radius: 50px;
  color: #c084fc;
  font-weight: 600;
  font-size: 0.85rem;
  margin-bottom: 24px;
}

.hero-title {
  font-size: 3.5rem;
  font-weight: 800;
  line-height: 1.15;
  margin-bottom: 20px;
  letter-spacing: -1px;
}

.hero-subtitle {
  font-size: 1.2rem;
  color: var(--text-muted);
  max-width: 700px;
  margin: 0 auto 36px;
  font-weight: 400;
}

/* Platform Filter Badges */
.platform-tabs {
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 30px;
}

.tab-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--bg-card);
  border: 1px solid var(--border-glass);
  color: var(--text-muted);
  padding: 10px 20px;
  border-radius: 50px;
  font-weight: 600;
  font-size: 0.9rem;
  cursor: pointer;
  transition: var(--transition);
}

.tab-btn:hover, .tab-btn.active {
  color: #fff;
  background: linear-gradient(135deg, rgba(139, 92, 246, 0.2), rgba(6, 182, 212, 0.2));
  border-color: var(--primary);
  box-shadow: 0 0 20px rgba(139, 92, 246, 0.2);
}

/* Stats Cards */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
  margin-bottom: 30px;
}

.stat-card {
  display: flex;
  align-items: center;
  gap: 16px;
}

.stat-icon {
  width: 50px;
  height: 50px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  background: rgba(139, 92, 246, 0.15);
  color: var(--primary);
  border: 1px solid rgba(139, 92, 246, 0.2);
}

.stat-icon.cyan {
  background: rgba(6, 182, 212, 0.15);
  color: var(--accent-cyan);
  border-color: rgba(6, 182, 212, 0.2);
}

.stat-icon.green {
  background: rgba(16, 185, 129, 0.15);
  color: var(--success);
  border-color: rgba(16, 185, 129, 0.2);
}

.stat-val {
  font-size: 1.6rem;
  font-weight: 800;
  color: #fff;
  line-height: 1.2;
}

.stat-lbl {
  font-size: 0.85rem;
  color: var(--text-muted);
}

/* Data Tables */
.table-responsive {
  width: 100%;
  max-height: 600px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: var(--radius-md);
  position: relative;
}

.table-responsive::-webkit-scrollbar {
  width: 8px;
  height: 10px;
}
.table-responsive::-webkit-scrollbar-track {
  background: rgba(7, 10, 18, 0.7);
  border-radius: 4px;
}
.table-responsive::-webkit-scrollbar-thumb {
  background: var(--primary);
  border-radius: 4px;
}
.table-responsive::-webkit-scrollbar-thumb:hover {
  background: var(--accent-cyan);
}

.custom-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 6px;
  text-align: left;
}

.custom-table th {
  position: sticky;
  top: 0;
  z-index: 10;
  background: #0f172a;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.6);
  padding: 14px 16px;
  color: var(--accent-cyan);
  font-size: 0.82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 2px solid rgba(139, 92, 246, 0.3);
  white-space: nowrap;
}

.custom-table td {
  padding: 14px 16px;
  background: rgba(15, 23, 42, 0.6);
  color: var(--text-main);
  font-size: 0.9rem;
  vertical-align: middle;
  white-space: nowrap;
}

.table-fit-screen {
  width: 100%;
  table-layout: fixed;
}

.cell-service-title {
  max-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
}

.cell-truncate {
  white-space: nowrap;
}

.cell-nowrap {
  white-space: nowrap;
}

.cell-actions {
  white-space: nowrap;
  min-width: 170px;
}

.custom-table tr td:first-child {
  border-top-left-radius: var(--radius-md);
  border-bottom-left-radius: var(--radius-md);
}

.custom-table tr td:last-child {
  border-top-right-radius: var(--radius-md);
  border-bottom-right-radius: var(--radius-md);
}

.custom-table tr:hover td {
  background: rgba(30, 41, 59, 0.7);
}

/* Status Badges */
.badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

.badge-completed {
  background: rgba(16, 185, 129, 0.15);
  color: #34d399;
  border: 1px solid rgba(16, 185, 129, 0.3);
}

.badge-processing {
  background: rgba(6, 182, 212, 0.15);
  color: #38bdf8;
  border: 1px solid rgba(6, 182, 212, 0.3);
}

.badge-pending {
  background: rgba(245, 158, 11, 0.15);
  color: #fbbf24;
  border: 1px solid rgba(245, 158, 11, 0.3);
}

.badge-canceled {
  background: rgba(239, 68, 68, 0.15);
  color: #f87171;
  border: 1px solid rgba(239, 68, 68, 0.3);
}

/* Form Inputs */
.form-group {
  margin-bottom: 20px;
}

.form-label {
  display: block;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-muted);
  margin-bottom: 8px;
}

.form-control {
  width: 100%;
  padding: 12px 16px;
  background: rgba(7, 10, 18, 0.6);
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-md);
  color: #fff;
  font-size: 0.95rem;
  transition: var(--transition);
}

.form-control:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 15px var(--primary-glow);
}

/* Modal System */
.modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /* Tam ekran backdrop-filter en pahali tekil efektti; ortu zaten %75 opak
     oldugu icin blur gorsel olarak neredeyse hic katki vermiyordu. */
  background: rgba(0, 0, 0, 0.82);
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: var(--transition);
}

.modal-backdrop.active {
  opacity: 1;
  pointer-events: auto;
}

.modal-body {
  width: 100%;
  max-width: 480px;
  margin: 20px;
}

/* Fullscreen Modal Override for Provider Explorer Workspace */
.modal-backdrop.fullscreen {
  padding: 15px;
}

.modal-backdrop.fullscreen .modal-body {
  width: 98vw;
  height: 94vh;
  max-width: none;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 24px;
}

.explorer-scroll-container {
  flex: 1;
  overflow: auto;
  margin-top: 15px;
  border-radius: var(--radius-md);
  position: relative;
}

.explorer-scroll-container::-webkit-scrollbar {
  width: 8px;
  height: 10px;
}
.explorer-scroll-container::-webkit-scrollbar-track {
  background: rgba(7, 10, 18, 0.7);
  border-radius: 4px;
}
.explorer-scroll-container::-webkit-scrollbar-thumb {
  background: var(--primary);
  border-radius: 4px;
}

/* Admin Sidebar Layout */
.app-layout {
  display: flex;
  min-height: calc(100vh - 73px);
}

.sidebar {
  width: 260px;
  background: rgba(15, 23, 42, 0.5);
  border-right: 1px solid var(--border-glass);
  padding: 24px 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sidebar-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  color: var(--text-muted);
  border-radius: var(--radius-md);
  font-weight: 600;
  font-size: 0.95rem;
  cursor: pointer;
  transition: var(--transition);
}

.sidebar-item:hover, .sidebar-item.active {
  color: #fff;
  background: linear-gradient(135deg, rgba(139, 92, 246, 0.2), rgba(6, 182, 212, 0.15));
  border-left: 3px solid var(--primary);
}

.main-content {
  flex: 1;
  padding: 30px;
  max-width: 1300px;
  margin: 0 auto;
  width: 100%;
}

/* Utilities */
.text-center { text-align: center; }
.flex-between { display: flex; justify-content: space-between; align-items: center; }
.gap-10 { gap: 10px; }
.mt-20 { margin-top: 20px; }
.mb-20 { margin-bottom: 20px; }
.mb-30 { margin-bottom: 30px; }

@media (max-width: 900px) {
  .hero-title { font-size: 2.3rem; }
  .app-layout { flex-direction: column; }
  .sidebar { width: 100%; border-right: none; border-bottom: 1px solid var(--border-glass); }
}

/* Bilingual content editor & AI operations */
.admin-help { margin-top: 5px; color: var(--admin-muted, var(--text-muted)); font-size: .84rem; }
.blog-editor-modal { width: min(1180px, 96vw); max-height: 92vh; overflow-y: auto; }
.blog-editor-meta-grid { display: grid; grid-template-columns: 2fr .7fr .8fr; gap: 14px; }
.bilingual-editor-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.bilingual-editor-grid.compact-grid { gap: 12px; }
.language-editor-card { padding: 16px; border: 1px solid var(--admin-line, var(--border-glass)); border-radius: 13px; background: rgba(7, 12, 22, .42); }
.language-editor-title { display: flex; align-items: center; gap: 9px; margin-bottom: 15px; font-size: 1rem; }
.blog-content-editor { min-height: 290px; line-height: 1.65; resize: vertical; }
.blog-detail-content h2, #blog-detail-content h2 { margin: 32px 0 12px; color: #fff; font-size: 1.55rem; line-height: 1.3; }
#blog-detail-content h3 { margin: 24px 0 10px; color: #dbeafe; font-size: 1.2rem; }
#blog-detail-content p { margin: 0 0 16px; }
#blog-detail-content ul, #blog-detail-content ol { margin: 0 0 20px 24px; display: grid; gap: 8px; }
#blog-detail-content blockquote { margin: 22px 0; padding: 16px 18px; border-left: 4px solid var(--accent-cyan); border-radius: 0 12px 12px 0; background: rgba(34, 211, 238, .08); color: #dbeafe; }
#blog-detail-content table { width: 100%; margin: 22px 0; border-collapse: collapse; overflow: hidden; border-radius: 12px; }
#blog-detail-content th, #blog-detail-content td { padding: 11px 13px; border: 1px solid var(--border-glass); text-align: left; }
#blog-detail-content th { background: rgba(99, 102, 241, .18); color: #fff; }
#blog-detail-content tr:nth-child(even) td { background: rgba(255,255,255,.025); }
#blog-detail-content a { color: var(--accent-cyan); text-decoration: underline; }
.editor-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 16px; }

.ai-studio-grid { display: grid; grid-template-columns: minmax(260px, 330px) minmax(0, 1fr); gap: 16px; align-items: stretch; }
.ai-config-panel, .ai-chat-panel { padding: 18px !important; }
.ai-provider-form { display: grid; gap: 9px; margin: 14px 0 18px; }
.check-row { display: flex; align-items: center; gap: 8px; color: var(--admin-muted, var(--text-muted)); font-size: .8rem; }
.ai-provider-list { display: grid; gap: 8px; max-height: 280px; overflow-y: auto; }
.ai-provider-item { padding: 10px; border: 1px solid var(--admin-line, var(--border-glass)); border-radius: 10px; background: rgba(7, 12, 22, .4); }
.ai-provider-item strong, .ai-provider-item small { display: block; }
.ai-provider-item small { margin: 3px 0 8px; color: var(--admin-muted, var(--text-muted)); }
.ai-provider-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.ai-model-picker { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--admin-line, var(--border-glass)); }
.ai-model-picker[hidden] { display: none; }
.provider-price-audit-modal { width: min(1500px, 96vw); max-width: 1500px; max-height: 92vh; overflow: hidden; display: flex; flex-direction: column; }
.price-audit-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 14px; }
.price-audit-table-wrap { overflow: auto; flex: 1; min-height: 260px; }
.price-audit-table { min-width: 1180px; }
.price-audit-row-increased { background: rgba(239, 68, 68, .14) !important; box-shadow: inset 4px 0 0 #ef4444; }
.price-audit-row-decreased { background: rgba(34, 197, 94, .09) !important; box-shadow: inset 4px 0 0 #22c55e; }
.price-audit-row-updated { background: rgba(34, 211, 238, .1) !important; box-shadow: inset 4px 0 0 var(--accent-cyan); }
.price-audit-margin-input { width: 105px; min-width: 105px; }
@media (max-width: 760px) { .price-audit-toolbar { align-items: stretch; flex-direction: column; } .price-audit-toolbar .btn { width: 100%; } }
.ai-conversation-button { width: 100%; padding: 10px; color: #dbeafe; text-align: left; border: 1px solid var(--admin-line, var(--border-glass)); border-radius: 9px; background: rgba(7,12,22,.38); cursor: pointer; }
.ai-conversation-button:hover { border-color: var(--primary); }
.ai-conversation-button strong, .ai-conversation-button small { display: block; }
.ai-conversation-button small { margin-top: 3px; color: var(--admin-muted, var(--text-muted)); }
.ai-chat-panel { min-height: 680px; display: flex; flex-direction: column; }
.ai-chat-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--admin-line, var(--border-glass)); }
.ai-chat-toolbar .form-control { max-width: 320px; }
.ai-safe-badge { color: #86efac; font-size: .74rem; }
.ai-chat-messages { flex: 1; min-height: 380px; max-height: 520px; overflow-y: auto; padding: 18px 4px; }
.ai-empty-state { min-height: 330px; display: grid; place-content: center; justify-items: center; gap: 9px; color: var(--admin-muted, var(--text-muted)); text-align: center; }
.ai-empty-state i { color: var(--primary); font-size: 2.2rem; }
.ai-message { max-width: 86%; margin-bottom: 12px; padding: 12px 14px; border-radius: 13px; white-space: pre-wrap; line-height: 1.55; font-size: .87rem; }
.ai-message.user { margin-left: auto; color: #fff; background: linear-gradient(135deg, #6d28d9, #4f46e5); }
.ai-message.assistant { border: 1px solid var(--admin-line, var(--border-glass)); background: #101a2d; }
.ai-action-queue { display: grid; gap: 8px; margin-bottom: 12px; }
.ai-action-card { padding: 11px 12px; border: 1px solid rgba(245, 158, 11, .35); border-radius: 11px; background: rgba(120, 53, 15, .16); }
.ai-action-card pre { max-height: 130px; margin: 8px 0; overflow: auto; color: #cbd5e1; font-size: .69rem; white-space: pre-wrap; }
.ai-action-buttons { display: flex; justify-content: flex-end; gap: 7px; }
.ai-chat-composer { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: end; padding-top: 12px; border-top: 1px solid var(--admin-line, var(--border-glass)); }

@media (max-width: 980px) {
  .ai-studio-grid, .bilingual-editor-grid, .blog-editor-meta-grid { grid-template-columns: 1fr; }
  .ai-chat-panel { min-height: 600px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/* Theme Custom Color Overrides */
body[data-theme="gold"] {
  --primary: #f59e0b;
  --primary-hover: #d97706;
  --primary-glow: rgba(245, 158, 11, 0.4);
  --accent-cyan: #eab308;
  --border-glow: rgba(245, 158, 11, 0.3);
}

body[data-theme="emerald"] {
  --primary: #10b981;
  --primary-hover: #059669;
  --primary-glow: rgba(16, 185, 129, 0.4);
  --accent-cyan: #14b8a6;
  --border-glow: rgba(16, 185, 129, 0.3);
}

body[data-theme="ocean"] {
  --primary: #3b82f6;
  --primary-hover: #2563eb;
  --primary-glow: rgba(59, 130, 246, 0.4);
  --accent-cyan: #06b6d4;
  --border-glow: rgba(59, 130, 246, 0.3);
}

/* Floating Telegram Button */
.floating-telegram-btn {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 999;
  background: linear-gradient(135deg, #0088cc, #00b0ff);
  color: #fff;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.8rem;
  box-shadow: 0 8px 25px rgba(0, 136, 204, 0.4);
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  text-decoration: none;
}

.floating-telegram-btn:hover {
  transform: scale(1.12) rotate(-8deg);
  box-shadow: 0 12px 30px rgba(0, 136, 204, 0.6);
  color: #fff;
}

.floating-telegram-btn .telegram-pulse {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: rgba(0, 136, 204, 0.5);
  animation: pulse-ring 2s infinite;
  z-index: -1;
}

@keyframes pulse-ring {
  0% { transform: scale(0.95); opacity: 0.8; }
  100% { transform: scale(1.6); opacity: 0; }
}

/* VIP Badge System */
.vip-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 20px;
  font-weight: 700;
  font-size: 0.78rem;
  text-transform: uppercase;
}

.vip-bronz { background: rgba(217, 119, 6, 0.2); color: #fbbf24; border: 1px solid rgba(217, 119, 6, 0.4); }
.vip-gumus { background: rgba(148, 163, 184, 0.2); color: #e2e8f0; border: 1px solid rgba(148, 163, 184, 0.4); }
.vip-altin { background: rgba(234, 179, 8, 0.2); color: #facc15; border: 1px solid rgba(234, 179, 8, 0.4); }
.vip-elmas { background: rgba(6, 182, 212, 0.2); color: #22d3ee; border: 1px solid rgba(6, 182, 212, 0.4); }

/* Supported Platforms Bar (Image 1 - Marquee Slider) */
.platforms-bar-container {
  background: rgba(7, 10, 18, 0.95);
  border-top: 1px solid rgba(99, 102, 241, 0.2);
  border-bottom: 1px solid rgba(99, 102, 241, 0.2);
  padding: 16px 0;
  overflow: hidden;
  position: relative;
  margin: 30px 0;
}
.platforms-scroll-track {
  display: flex;
  width: max-content;
  gap: 16px;
  animation: marqueePlatforms 30s linear infinite;
  will-change: transform;
}
.platforms-scroll-track:hover {
  animation-play-state: paused;
}
@keyframes marqueePlatforms {
  0% { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-50%, 0, 0); }
}
.platform-badge-item {
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(15, 23, 42, 0.8);
  border: 1px solid rgba(255, 255, 255, 0.08);
  padding: 10px 20px;
  border-radius: 12px;
  font-weight: 700;
  font-size: 0.95rem;
  color: #fff;
  white-space: nowrap;
  transition: var(--transition);
  cursor: pointer;
}
.platform-badge-item:hover {
  border-color: var(--primary);
  box-shadow: 0 4px 15px var(--primary-glow);
  transform: translateY(-2px);
}

/* Metrics Banner (Image 2) */
.metrics-banner-card {
  background: rgba(255, 255, 255, 0.96);
  color: #0f172a;
  border-radius: 24px;
  padding: 20px 26px;
  display: grid;
  /* 5 metrik: genis ekranda tek sirada durur, dar ekranda kendiliginden sarar. */
  grid-template-columns: repeat(auto-fit, minmax(185px, 1fr));
  gap: 20px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
  margin: 40px auto;
  max-width: 1280px;
}
.metric-item {
  display: flex;
  align-items: center;
  gap: 14px;
}
.metric-icon-box {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: rgba(225, 29, 72, 0.1);
  color: #e11d48;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.3rem;
}
.metric-value {
  font-size: 1.4rem;
  font-weight: 800;
  color: #e11d48;
}
.metric-label {
  font-size: 0.82rem;
  color: #64748b;
  font-weight: 600;
}

/* Featured Cards Marquee Slider (Image 3) */
.featured-cards-grid {
  overflow: hidden;
  position: relative;
  width: 100%;
  padding: 10px 0;
  margin: 30px 0;
}
.featured-cards-track {
  display: flex;
  width: max-content;
  gap: 20px;
  animation: marqueeCards 35s linear infinite;
  will-change: transform;
}
.featured-cards-track:hover {
  animation-play-state: paused;
}
@keyframes marqueeCards {
  0% { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-50%, 0, 0); }
}
.featured-card-box {
  background: #0f172a;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 24px 16px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  min-height: 220px;
  transition: var(--transition);
}
.featured-card-box:hover {
  border-color: #d946ef;
  box-shadow: 0 10px 25px rgba(217, 70, 239, 0.25);
  transform: translateY(-4px);
}
.featured-card-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 12px;
}
.featured-card-sub {
  font-size: 1.5rem;
  font-weight: 800;
  color: #fff;
  margin-bottom: 4px;
}
.featured-card-highlight {
  font-size: 1.1rem;
  color: rgba(255, 255, 255, 0.4);
  font-weight: 600;
  margin-bottom: 20px;
}
.btn-magenta {
  background: linear-gradient(135deg, #db2777, #e11d48);
  color: #fff;
  border: none;
  padding: 10px 0;
  width: 100%;
  border-radius: 10px;
  font-weight: 700;
  font-size: 0.9rem;
  cursor: pointer;
  transition: var(--transition);
}
.btn-magenta:hover {
  background: linear-gradient(135deg, #be185d, #be123c);
  box-shadow: 0 4px 15px rgba(225, 29, 72, 0.4);
}

/* Blog Cards Grid */
.blog-cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.blog-card {
  background: var(--bg-card);
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-md);
  overflow: hidden;
  transition: var(--transition);
}
.blog-card:hover {
  transform: translateY(-4px);
  border-color: var(--primary);
  box-shadow: 0 10px 30px var(--primary-glow);
}
.blog-card-img {
  width: 100%;
  height: 180px;
  object-fit: cover;
}

@media (max-width: 1024px) {
  .featured-cards-grid { grid-template-columns: repeat(2, 1fr); }
  .metrics-banner-card { grid-template-columns: repeat(2, 1fr); padding: 18px 20px; }
  .blog-cards-grid { grid-template-columns: 1fr; }
}

/* SPLIT-SCREEN AUTH CONTAINER (Image Style) */
.auth-split-container {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 40px;
  align-items: center;
  max-width: 1200px;
  margin: 20px auto;
  padding: 20px;
}

.auth-info-side {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.auth-pill-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text-muted);
  width: fit-content;
}

.auth-headline {
  font-size: 2.6rem;
  font-weight: 900;
  line-height: 1.15;
  color: #fff;
}

.auth-paragraph {
  font-size: 0.92rem;
  color: var(--text-muted);
  line-height: 1.6;
}

/* 3-Step Process Row */
.auth-steps-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 10px 0;
}

.auth-step-box {
  background: rgba(15, 23, 42, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 14px;
  transition: var(--transition);
}

.auth-step-box:hover {
  border-color: var(--primary);
  transform: translateY(-2px);
}

.auth-step-num {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--primary);
  color: #fff;
  font-weight: 800;
  font-size: 0.78rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 8px;
}

.auth-step-title {
  font-size: 0.88rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 4px;
}

.auth-step-desc {
  font-size: 0.75rem;
  color: var(--text-dim);
  line-height: 1.3;
}

/* 4 Feature Props Grid */
.auth-props-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.auth-prop-item {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.auth-prop-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  color: var(--accent-cyan);
  flex-shrink: 0;
}

.auth-prop-title {
  font-size: 0.88rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 2px;
}

.auth-prop-desc {
  font-size: 0.78rem;
  color: var(--text-dim);
  line-height: 1.4;
}

/* Right Auth Form Card (Matching Image Style) */
.auth-form-card {
  background: #ffffff;
  color: #0f172a;
  border-radius: 20px;
  padding: 36px 30px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
}

.auth-form-card .form-label {
  color: #0f172a;
  font-weight: 700;
  font-size: 0.88rem;
}

.auth-form-card .form-control {
  background: #ffffff;
  border: 1px solid #cbd5e1;
  color: #0f172a;
  border-radius: 12px;
  padding: 12px 14px;
  font-size: 0.95rem;
}

.auth-form-card .form-control:focus {
  border-color: #000;
  box-shadow: 0 0 0 3px rgba(0,0,0,0.1);
}

.auth-dark-btn {
  background: #0f172a;
  color: #ffffff;
  border: none;
  padding: 14px;
  border-radius: 12px;
  font-weight: 800;
  font-size: 0.95rem;
  width: 100%;
  cursor: pointer;
  transition: all 0.2s ease;
}

.auth-dark-btn:hover {
  background: #000000;
  transform: translateY(-1px);
}

.cloudflare-box {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 10px 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

@media (max-width: 900px) {
  .auth-split-container {
    grid-template-columns: 1fr;
  }
  /* Mobilde giris/kayit formu en uste gelir; tanitim metni asagida kalir.
     (Tek sutuna dusunce form sayfanin dibine kayiyordu.) */
  .auth-split-container > div:last-child { order: -1; }
  .auth-info-side { padding-top: 10px; }
}

/* ========================================================================== */
/* ADMIN CONTROL CENTER                                                       */
/* ========================================================================== */
#view-admin {
  --admin-surface: #0d1424;
  --admin-surface-soft: #121b2f;
  --admin-line: rgba(148, 163, 184, 0.13);
  --admin-muted: #8b9bb5;
}

#view-admin .app-layout {
  align-items: flex-start;
  background:
    radial-gradient(circle at 90% 0%, rgba(124, 58, 237, 0.09), transparent 30%),
    #080d18;
  min-height: calc(100vh - 73px);
}

.admin-sidebar {
  width: 252px;
  min-width: 252px;
  height: calc(100vh - 73px);
  position: sticky;
  top: 73px;
  padding: 18px 14px;
  overflow-y: auto;
  background: rgba(10, 16, 29, 0.97);
  border-right: 1px solid var(--admin-line);
  gap: 0;
}

.admin-sidebar-brand {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 58px;
  margin-bottom: 18px;
  padding: 9px 10px 15px;
  border-bottom: 1px solid var(--admin-line);
}

.admin-sidebar-brand strong,
.admin-sidebar-brand small { display: block; }
.admin-sidebar-brand strong { color: #f8fafc; font-size: .93rem; }
.admin-sidebar-brand small { color: var(--admin-muted); font-size: .69rem; margin-top: 3px; }

.admin-brand-mark {
  display: grid;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  place-items: center;
  color: #fff;
  border-radius: 11px;
  background: linear-gradient(145deg, #7c3aed, #4f46e5);
  box-shadow: 0 8px 22px rgba(99, 102, 241, .28);
}

.admin-nav-groups { display: flex; flex-direction: column; }

.admin-nav-label {
  margin: 17px 11px 6px;
  color: #5f708c;
  font-size: .64rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}

#view-admin .sidebar-item {
  width: 100%;
  min-height: 39px;
  display: grid;
  grid-template-columns: 20px 1fr auto;
  align-items: center;
  gap: 9px;
  margin: 1px 0;
  padding: 9px 11px;
  color: #93a4bd;
  font-family: inherit;
  font-size: .82rem;
  text-align: left;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  box-shadow: none;
}

#view-admin .sidebar-item i { width: 18px; color: #667791; text-align: center; }
#view-admin .sidebar-item:hover { color: #e2e8f0; background: rgba(148, 163, 184, .06); }
#view-admin .sidebar-item.active {
  color: #fff;
  border-color: rgba(139, 92, 246, .2);
  border-left: 1px solid rgba(139, 92, 246, .2);
  background: linear-gradient(90deg, rgba(124, 58, 237, .2), rgba(79, 70, 229, .07));
}
#view-admin .sidebar-item.active i { color: #a78bfa; }
#view-admin .sidebar-item.danger { color: #b98289; }
#view-admin .sidebar-item.danger i { color: #9f5963; }
#view-admin .sidebar-item.danger.active { color: #fecaca; border-color: rgba(239, 68, 68, .2); background: rgba(127, 29, 29, .2); }

/* Site Ayarları alt kategorileri: ana ogenin altinda girintili kucuk butonlar.
   Varsayilan kapali; ana butona basinca .open ile acilir (akordeon). */
#view-admin .admin-subnav {
  display: none;
  margin: 2px 0 4px;
  padding-left: 17px;
  border-left: 1px solid rgba(148, 163, 184, .14);
  margin-left: 20px;
}
#view-admin .admin-subnav.open { display: block; }
#view-admin .settings-caret {
  justify-self: end;
  font-size: .6rem !important;
  width: auto !important;
  transition: transform .2s ease;
}
#view-admin .sidebar-item.submenu-open .settings-caret { transform: rotate(180deg); }
#view-admin .sidebar-subitem {
  width: 100%;
  min-height: 31px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 9px;
  color: #7d8ea8;
  font-family: inherit;
  font-size: .76rem;
  text-align: left;
  border: 0;
  border-radius: 7px;
  background: transparent;
  cursor: pointer;
}
#view-admin .sidebar-subitem i { width: 15px; color: #5f708c; text-align: center; font-size: .72rem; }
#view-admin .sidebar-subitem:hover { color: #e2e8f0; background: rgba(148, 163, 184, .06); }
#view-admin .sidebar-subitem.active { color: #fff; background: rgba(124, 58, 237, .16); }
#view-admin .sidebar-subitem.active i { color: #a78bfa; }

/* Ayarlar sekmesi ust bolum cubugu (mobilde kenar cubugu kapali oldugu icin sart) */
.settings-subtabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 22px;
}
.settings-subtab {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 14px;
  color: var(--text-muted);
  font-family: inherit;
  font-size: .8rem;
  font-weight: 600;
  border: 1px solid var(--border-glass);
  border-radius: 20px;
  background: var(--bg-glass);
  cursor: pointer;
}
.settings-subtab:hover { color: #fff; border-color: rgba(139, 92, 246, .35); }
.settings-subtab.active {
  color: #fff;
  border-color: rgba(139, 92, 246, .5);
  background: linear-gradient(90deg, rgba(124, 58, 237, .3), rgba(79, 70, 229, .15));
}

#view-admin .sidebar-item em {
  min-width: 19px;
  min-height: 19px;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  color: #fff;
  font-size: .66rem;
  font-style: normal;
  font-weight: 800;
  border-radius: 999px;
  background: #dc2626;
}
#view-admin .sidebar-item em:not(:empty) { display: inline-flex; }

.admin-sidebar-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 22px 9px 2px;
  padding-top: 14px;
  color: #64748b;
  font-size: .69rem;
  border-top: 1px solid var(--admin-line);
}
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: #10b981; box-shadow: 0 0 0 4px rgba(16,185,129,.1); }
.admin-mobile-nav { display: none; }

.admin-main-content {
  max-width: 1480px;
  padding: 34px 38px 70px;
}

#view-admin .admin-main-content > div > h2,
#view-admin .admin-main-content .flex-between h2 {
  color: #f8fafc;
  font-size: 1.42rem !important;
  letter-spacing: -.025em;
}

#view-admin .glass-card {
  border-color: var(--admin-line);
  background: linear-gradient(145deg, rgba(18, 27, 47, .92), rgba(12, 19, 34, .92));
  box-shadow: 0 12px 28px rgba(0, 0, 0, .16);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

#view-admin .glass-card:hover { transform: none; box-shadow: 0 14px 32px rgba(0,0,0,.2); }

#view-admin .stats-grid { gap: 14px; }
#view-admin .stat-card { min-height: 112px; padding: 20px; }
#view-admin .stat-icon { width: 42px; height: 42px; border-radius: 12px; font-size: 1rem; }
#view-admin .stat-val { font-size: 1.48rem; }
#view-admin .stat-lbl { margin-top: 3px; color: var(--admin-muted); font-size: .73rem; }

#view-admin .table-responsive {
  border: 1px solid rgba(148, 163, 184, .09);
  border-radius: 11px;
  background: rgba(7, 12, 22, .35);
}
#view-admin .custom-table { border-spacing: 0; }
#view-admin .custom-table th {
  position: static;
  padding: 11px 13px;
  color: #71829d;
  font-size: .66rem;
  letter-spacing: .08em;
  background: #0d1525;
  border-bottom: 1px solid var(--admin-line);
}

.table-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding-top: 16px;
  color: var(--text-muted);
  font-size: .82rem;
}

.pagination-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.pagination-actions .btn:disabled {
  cursor: not-allowed;
  opacity: .42;
}

body.admin-view-active {
  background-image: linear-gradient(180deg, #070b13, #0a1020);
}

body.admin-view-active .navbar {
  background: #080d17;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* Navbar yalnizca admin gorunumunde koyu zemine doner; neo-brutalist beyaz
   navbar icin yazilan #090909 on plan renkleri orada siyah-uzerine-siyah kalip
   yalnizca hover'daki sari zeminle gorunur oluyordu. */
body.admin-view-active .navbar .nav-link { color: #e2e8f0; }
body.admin-view-active .navbar .nav-link:hover,
body.admin-view-active .navbar .nav-link.active { color: #090909; background: #ffde17; }
body.admin-view-active .brand-logo,
body.admin-view-active .brand-wordmark { color: #fff; }
body.admin-view-active .navbar .user-badge > span,
body.admin-view-active .navbar .user-badge > span[style] { color: #e2e8f0 !important; }

@media (max-width: 600px) {
  .table-pagination {
    align-items: stretch;
    flex-direction: column;
  }

  .pagination-actions { justify-content: space-between; }
}
#view-admin .custom-table td {
  padding: 12px 13px;
  color: #c8d3e3;
  font-size: .79rem;
  background: transparent;
  border-bottom: 1px solid rgba(148, 163, 184, .07);
}
#view-admin .custom-table tr:last-child td { border-bottom: 0; }
#view-admin .custom-table tr:hover td { background: rgba(124, 58, 237, .045); }
#view-admin .custom-table tr td:first-child,
#view-admin .custom-table tr td:last-child { border-radius: 0; }

#view-admin .form-control {
  min-height: 39px;
  border-color: rgba(148, 163, 184, .16);
  background: rgba(5, 10, 19, .56);
}
#view-admin .btn { border-radius: 9px; box-shadow: none; }
#view-admin .btn-sm { padding: 7px 10px; font-size: .73rem; }

@media (max-width: 1100px) {
  .admin-main-content { padding: 28px 24px 60px; }
  .admin-sidebar { width: 224px; min-width: 224px; }
}

@media (max-width: 900px) {
  #view-admin .app-layout { display: block; }
  .admin-sidebar {
    position: static;
    width: 100%;
    min-width: 0;
    height: auto;
    padding: 13px 16px;
    border-right: 0;
    border-bottom: 1px solid var(--admin-line);
  }
  .admin-sidebar-brand { min-height: 46px; margin-bottom: 11px; padding: 4px 2px 10px; }
  .admin-mobile-nav { display: block; }
  .admin-nav-groups, .admin-sidebar-footer { display: none; }
  .admin-main-content { padding: 22px 15px 50px; }
  #view-admin .flex-between { align-items: flex-start; gap: 12px; flex-wrap: wrap; }
  #view-admin .stats-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   TOAST BİLDİRİMLERİ (tarayıcı alert() kutularının yerine)
   Yalnızca transform/opacity animasyonlanır; backdrop-filter kullanılmaz.
   ========================================================================== */
#toast-container {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 3000;
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: min(400px, calc(100vw - 40px));
  pointer-events: none;
}

.toast {
  --toast-accent: var(--primary);
  pointer-events: auto;
  display: flex;
  align-items: flex-start;
  gap: 13px;
  padding: 14px 16px;
  border-radius: 14px;
  background: #131c33;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-left: 4px solid var(--toast-accent);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.42);
  color: var(--text-main);
  font-size: 0.9rem;
  line-height: 1.45;
  opacity: 0;
  transform: translate3d(120%, 0, 0);
  animation: toastIn 0.34s cubic-bezier(0.21, 1.02, 0.73, 1) forwards;
  overflow: hidden;
}

.toast.toast-hiding {
  animation: toastOut 0.26s cubic-bezier(0.4, 0, 1, 1) forwards;
}

@keyframes toastIn {
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes toastOut {
  to { opacity: 0; transform: translate3d(120%, 0, 0); }
}

.toast-icon {
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.85rem;
  background: color-mix(in srgb, var(--toast-accent) 20%, transparent);
  color: var(--toast-accent);
}

.toast-body {
  flex: 1;
  min-width: 0;
  word-break: break-word;
  /* Mesajlardaki satır sonları korunur. */
  white-space: pre-wrap;
}

.toast-title {
  font-weight: 700;
  font-size: 0.83rem;
  color: var(--toast-accent);
  margin-bottom: 2px;
  letter-spacing: 0.2px;
}

.toast-close {
  flex-shrink: 0;
  background: none;
  border: none;
  color: var(--text-dim);
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
  padding: 2px 4px;
  border-radius: 6px;
  transition: color 0.2s ease;
}
.toast-close:hover { color: var(--text-main); }

/* Kalan süreyi gösteren ince şerit */
.toast-progress {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 2px;
  width: 100%;
  background: var(--toast-accent);
  opacity: 0.5;
  transform-origin: left center;
  animation: toastProgress linear forwards;
}

@keyframes toastProgress {
  from { transform: scaleX(1); }
  to { transform: scaleX(0); }
}

.toast-success { --toast-accent: #10b981; }
.toast-error   { --toast-accent: #ef4444; }
.toast-warning { --toast-accent: #f59e0b; }
.toast-info    { --toast-accent: #38bdf8; }

@media (max-width: 600px) {
  #toast-container {
    top: 12px;
    right: 12px;
    left: 12px;
    width: auto;
  }
}

/* Hareket azaltma tercihi olan kullanıcılarda kaydırma animasyonu yapılmaz. */
@media (prefers-reduced-motion: reduce) {
  .toast { animation: none; opacity: 1; transform: none; }
  .toast.toast-hiding { animation: none; opacity: 0; }
  .toast-progress { animation: none; }
}

/* ==========================================================================
   ONAY / GİRDİ DİYALOGLARI (confirm() ve prompt() yerine)
   ========================================================================== */
.dialog-backdrop {
  position: fixed;
  inset: 0;
  z-index: 3500;
  background: rgba(3, 6, 14, 0.78);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  animation: dialogFadeIn 0.18s ease forwards;
}

.dialog-backdrop.dialog-closing {
  animation: dialogFadeOut 0.16s ease forwards;
}

@keyframes dialogFadeIn { to { opacity: 1; } }
@keyframes dialogFadeOut { to { opacity: 0; } }

.dialog-card {
  width: 100%;
  max-width: 440px;
  background: #121a2e;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 18px;
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.5);
  padding: 26px 26px 22px;
  transform: translate3d(0, 12px, 0) scale(0.97);
  opacity: 0;
  animation: dialogPopIn 0.22s cubic-bezier(0.21, 1.02, 0.73, 1) 0.02s forwards;
}

@keyframes dialogPopIn {
  to { transform: translate3d(0, 0, 0) scale(1); opacity: 1; }
}

.dialog-icon {
  width: 46px;
  height: 46px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  margin-bottom: 15px;
  background: rgba(139, 92, 246, 0.15);
  color: var(--primary);
}
.dialog-danger .dialog-icon { background: rgba(239, 68, 68, 0.15); color: var(--danger); }

.dialog-title {
  font-size: 1.16rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 8px;
}

.dialog-message {
  font-size: 0.92rem;
  color: var(--text-muted);
  line-height: 1.55;
  /* Mesajlardaki satır sonları korunur. */
  white-space: pre-wrap;
  word-break: break-word;
}

.dialog-input {
  width: 100%;
  margin-top: 16px;
  padding: 11px 14px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--border-glass);
  color: var(--text-main);
  font-size: 0.94rem;
  outline: none;
  transition: border-color 0.2s ease;
}
.dialog-input:focus { border-color: var(--primary); }
.dialog-input::placeholder { color: var(--text-dim); }

.dialog-error {
  margin-top: 8px;
  font-size: 0.82rem;
  color: var(--danger);
  min-height: 1em;
}

.dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 22px;
}

.dialog-actions .btn { padding: 10px 20px; font-size: 0.9rem; }

.dialog-confirm-danger {
  background: linear-gradient(135deg, #ef4444, #b91c1c);
  color: #fff;
  box-shadow: none;
}
.dialog-confirm-danger:hover {
  transform: translateY(-1px);
  background: linear-gradient(135deg, #dc2626, #991b1b);
}

@media (max-width: 600px) {
  .dialog-card { padding: 22px 18px 18px; }
  .dialog-actions { flex-direction: column-reverse; }
  .dialog-actions .btn { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .dialog-backdrop, .dialog-card { animation: none; opacity: 1; transform: none; }
  .dialog-backdrop.dialog-closing { opacity: 0; }
}

/* ==========================================================================
   SMMJET — NEO BRUTALIST LANDING EXPERIENCE
   Ana sayfa yeni kimliği; panel ekranlarının mevcut koyu işlevsel yapısı korunur.
   ========================================================================== */

#announcement-bar {
  min-height: 34px;
  padding: 7px 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  background: #ffde17;
  border-bottom: 2px solid #090909;
  color: #090909;
  font-family: 'IBM Plex Mono', monospace;
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-align: center;
}

.announcement-star { font-size: 1rem; }

.navbar {
  top: 0;
  min-height: 76px;
  padding: 12px clamp(18px, 4vw, 64px);
  background: #fff;
  border-bottom: 3px solid #090909;
  color: #090909;
  box-shadow: 0 5px 0 #090909;
}

.brand-logo { cursor: pointer; color: #090909; }

.brand-wordmark {
  display: inline-block;
  color: #090909;
  font-family: 'Archivo Black', sans-serif;
  font-size: clamp(1.45rem, 2.1vw, 2rem);
  font-style: italic;
  letter-spacing: -.09em;
  line-height: 1;
}

.brand-wordmark span { color: #ed2d2d; }

.navbar .nav-links { gap: clamp(4px, 1vw, 18px); }
.navbar .nav-link {
  padding: 7px 8px;
  border-radius: 0;
  color: #090909;
  font-family: 'IBM Plex Mono', monospace;
  font-size: .74rem;
  font-weight: 700;
  text-transform: uppercase;
}
.navbar .nav-link:hover,
.navbar .nav-link.active { color: #090909; background: #ffde17; box-shadow: 3px 3px 0 #090909; }

.navbar .form-control {
  width: auto;
  min-width: 72px;
  padding: 7px 9px;
  border: 2px solid #090909;
  border-radius: 0;
  background: #fff;
  color: #090909;
  font-weight: 800;
}

.navbar .theme-selector { display: none; }
.navbar .nav-actions { display: flex; align-items: center; gap: 12px; min-width: 0; }

/* Hamburger yalnizca .nav-links satir icine sigmadigi genisliklerde acilir. */
.nav-toggle { display: none; }

.navbar .user-badge {
  gap: 8px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.navbar .user-badge > span,
.navbar .user-badge > span[style] { color: #090909 !important; }
.navbar .balance-pill { border: 2px solid #090909; border-radius: 0; background: #ffde17; color: #090909; }
.navbar .btn { min-height: 38px; padding: 8px 13px; border: 2px solid #090909; border-radius: 0; box-shadow: 4px 4px 0 #090909; }
.navbar .btn-primary { background: #ed2d2d; color: #fff; }
.navbar .btn-outline { background: #fff; color: #090909; }
.navbar .btn:hover { transform: translate(2px, 2px); box-shadow: 2px 2px 0 #090909; }

.neo-landing {
  --neo-ink: #090909;
  --neo-blue: #21a9f6;
  --neo-cobalt: #1769e8;
  --neo-red: #ed2d2d;
  --neo-yellow: #ffde17;
  --neo-white: #fffef8;
  overflow: hidden;
  background: var(--neo-blue);
  color: var(--neo-ink);
}

.neo-landing button,
.neo-landing a { color: inherit; }

.neo-hero {
  position: relative;
  width: min(1440px, 100%);
  min-height: 650px;
  margin: 0 auto;
  padding: clamp(64px, 8vw, 112px) clamp(24px, 5vw, 76px) 70px;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(360px, .8fr);
  gap: clamp(46px, 7vw, 110px);
  align-items: center;
  background-image: linear-gradient(rgba(9,9,9,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(9,9,9,.055) 1px, transparent 1px);
  background-size: 32px 32px;
}

.neo-hero::before {
  content: '';
  position: absolute;
  width: 132px;
  height: 132px;
  right: -52px;
  top: 110px;
  background: radial-gradient(circle, #090909 2px, transparent 3px);
  background-size: 14px 14px;
}

.neo-hero-copy { position: relative; z-index: 1; }
.neo-kicker,
.neo-label {
  font-family: 'IBM Plex Mono', monospace;
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .08em;
}
.neo-kicker { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
.neo-kicker span { padding: 5px 7px; border: 2px solid #090909; background: #ffde17; box-shadow: 3px 3px 0 #090909; }

.neo-landing .hero-title {
  max-width: 790px;
  margin: 0;
  color: #090909;
  font-family: 'Archivo Black', sans-serif;
  font-size: clamp(4rem, 7.6vw, 7.7rem);
  line-height: .86;
  letter-spacing: -.075em;
  text-align: left;
  text-transform: uppercase;
}
.neo-landing .hero-title span {
  display: inline-block;
  margin: 10px 0 8px -4px;
  padding: 3px 20px 10px;
  background: var(--neo-red);
  border: 3px solid #090909;
  color: #fff;
  box-shadow: 9px 9px 0 #090909;
  transform: rotate(-2deg);
}
.neo-landing .hero-subtitle {
  max-width: 650px;
  margin: 32px 0 26px;
  color: #090909;
  font-size: clamp(1rem, 1.6vw, 1.3rem);
  font-weight: 600;
  line-height: 1.5;
  text-align: left;
}
.neo-hero-actions { display: flex; align-items: center; gap: 24px; }
.neo-hero-actions .btn-primary {
  padding: 15px 22px;
  border: 3px solid #090909;
  border-radius: 0;
  background: #090909;
  color: #fff;
  box-shadow: 7px 7px 0 var(--neo-yellow);
  font-weight: 900;
  text-transform: uppercase;
}
.neo-hero-actions .btn-primary:hover { background: #090909; box-shadow: 3px 3px 0 var(--neo-yellow); transform: translate(4px,4px); }
.neo-text-link { border: 0; border-bottom: 3px solid #090909; background: transparent; color: #090909; font-weight: 900; cursor: pointer; }
.neo-proof { margin-top: 34px; display: flex; align-items: center; flex-wrap: wrap; gap: 7px; font-size: .82rem; font-weight: 600; }
.neo-avatars { display: flex; margin-right: 7px; }
.neo-avatars b { width: 30px; height: 30px; margin-left: -7px; display: grid; place-items: center; border: 2px solid #090909; border-radius: 50%; background: #fff; font-size: .75rem; }
.neo-avatars b:nth-child(2) { background: #ffde17; }.neo-avatars b:nth-child(3) { background: #ed2d2d; color:#fff; }.neo-avatars b:nth-child(4) { background: #1769e8; color:#fff; }
.neo-scribble { position: absolute; right: 3%; bottom: 1%; font-family: 'IBM Plex Mono', monospace; font-size: .78rem; font-weight: 800; transform: rotate(-7deg); }

.order-machine { position: relative; width: min(100%, 480px); justify-self: end; }
.machine-cap { position: relative; z-index: 2; min-height: 68px; padding: 16px 20px; display: flex; justify-content: space-between; align-items: center; border: 3px solid #090909; background: #090909; color: #fff; font-family:'Archivo Black',sans-serif; font-size:1.25rem; }
.machine-cap::after { content:''; position:absolute; top:-3px; right:-3px; width:35px; height:35px; background:#ffde17; border-left:3px solid #090909; border-bottom:3px solid #090909; clip-path:polygon(100% 0,100% 100%,0 0); }
.machine-cap small { display:flex; align-items:center; gap:7px; margin-right:24px; font:700 .65rem 'IBM Plex Mono',monospace; }
.machine-cap small i { width:9px; height:9px; border-radius:50%; background:#35d65b; }
.machine-body { position:relative; z-index:2; padding:24px; border:3px solid #090909; border-top:0; background:#fff; }
.machine-body label { display:block; margin:12px 0 6px; font:700 .66rem 'IBM Plex Mono',monospace; }
.machine-field,.machine-counter { min-height:48px; display:flex; align-items:center; border:2px solid #090909; background:#fff; }
.machine-field { gap:10px; padding:0 13px; font-weight:700; }
.machine-field span { flex:1; }.machine-field .fa-instagram { color:#ed2d2d; font-size:1.2rem; }
/* Sipariş makinesindeki gerçek form kontrolleri, kutu tasarımına gömülü görünür. */
.machine-field select {
  flex:1; min-width:0; appearance:none; -webkit-appearance:none;
  border:0; background:transparent; cursor:pointer;
  font:inherit; font-weight:700; color:#090909;
  padding:0; outline:none; text-overflow:ellipsis;
}
.machine-field select:focus-visible { outline:2px solid #1769e8; outline-offset:2px; }
.machine-counter input {
  flex:1; min-width:0; border:0; background:transparent; text-align:center;
  font:900 1.15rem 'Archivo Black',sans-serif; color:#090909; outline:none;
  -moz-appearance:textfield;
}
.machine-counter input::-webkit-outer-spin-button,
.machine-counter input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.machine-counter input:focus-visible { outline:2px solid #1769e8; outline-offset:-2px; }
.machine-limits { margin-top:8px; min-height:16px; font:600 .7rem 'IBM Plex Mono',monospace; color:#4b5563; }
.machine-limits.is-invalid { color:#ed2d2d; font-weight:700; }
.machine-counter { justify-content:space-between; }.machine-counter button { align-self:stretch; width:48px; border:0; background:#ffde17; font-size:1.4rem; font-weight:900; cursor:pointer; }.machine-counter button:first-child { border-right:2px solid #090909; }.machine-counter button:last-child { border-left:2px solid #090909; }
.machine-total { margin:24px 0 14px; display:flex; justify-content:space-between; align-items:end; }.machine-total small { font:700 .66rem 'IBM Plex Mono',monospace; }.machine-total strong { color:#ed2d2d; font:900 2.15rem 'Archivo Black',sans-serif; }
.machine-submit { width:100%; min-height:54px; display:flex; justify-content:space-between; align-items:center; padding:0 18px; border:3px solid #090909; background:#ed2d2d; color:#fff; box-shadow:6px 6px 0 #090909; font-weight:900; cursor:pointer; }
.machine-submit:hover { transform:translate(3px,3px); box-shadow:3px 3px 0 #090909; }
.machine-shadow { position:absolute; z-index:1; inset:16px -16px -16px 16px; border:3px solid #090909; background:#ffde17; }

.neo-landing .platforms-bar-container { margin:0; padding:0; border-block:3px solid #090909; border-radius:0; background:#ffde17; overflow:hidden; }
.neo-landing .platforms-scroll-track { gap:0; animation-duration:34s; }
.neo-landing .platform-badge-item { flex:none; min-height:70px; padding:0 30px; border:0; border-right:3px solid #090909; border-radius:0; background:transparent; color:#090909; font:900 clamp(1rem,1.6vw,1.45rem) 'Archivo Black',sans-serif; text-transform:uppercase; }
.neo-landing .platform-badge-item i { font-size:1.25em; }

.neo-shell { padding:86px clamp(18px,5vw,74px) 100px; background:#fffef8; }
.neo-shell > * { width:min(1300px,100%); margin-inline:auto; }
.neo-section-heading { margin-bottom:34px; }.neo-section-heading h2 { margin-top:8px; font:900 clamp(2.7rem,5vw,5.1rem)/.9 'Archivo Black',sans-serif; letter-spacing:-.055em; text-transform:uppercase; }
.neo-heading-split { display:flex; justify-content:space-between; align-items:end; gap:40px; }.neo-heading-split p { max-width:470px; padding:18px; border:2px solid #090909; background:#ffde17; box-shadow:6px 6px 0 #090909; font-weight:700; }

.neo-landing .metrics-banner-card { margin-bottom:82px; padding:0; display:grid; grid-template-columns:repeat(5,1fr); border:3px solid #090909; border-radius:0; background:#fff; box-shadow:9px 9px 0 #090909; overflow:visible; }
.neo-landing .metric-item { min-height:125px; padding:20px 16px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:8px; border-right:2px solid #090909; }
.neo-landing .metric-item:last-child { border:0; }.neo-landing .metric-icon-box { width:auto; height:auto; padding:0; border:0; background:transparent; color:#ed2d2d; font-size:1.35rem; }.neo-landing .metric-value { color:#090909; font:900 clamp(1.2rem,2vw,1.85rem) 'Archivo Black',sans-serif; }.neo-landing .metric-label { color:#090909; font:700 .67rem 'IBM Plex Mono',monospace; text-transform:uppercase; }

/* Sutunlar dengelendi: en uzun kelimeler (YAYINLA / VIDEONU / ARACLAR) en dar
   sutunlara denk geldigi icin yazilar tasiyordu. */
.neo-service-mosaic { margin-bottom:100px; display:grid; grid-template-columns:1.1fr .85fr 1.05fr .85fr; grid-template-rows:380px; border:3px solid #090909; box-shadow:10px 10px 0 #090909; }
/* container-type: baslik boyutu kartin kendi genisligine gore olceklenir,
   boylece dar kartta yazi kendiliginden kuculur ve tasma olmaz. */
.mosaic-card { position:relative; container-type:inline-size; padding:24px; display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between; border:0; border-right:3px solid #090909; color:#090909; text-align:left; cursor:pointer; overflow:hidden; }
.mosaic-card:last-child { border:0; }.mosaic-card > span { position:absolute; top:14px; right:14px; padding:3px 7px; border:2px solid currentColor; font:800 .72rem 'IBM Plex Mono',monospace; }.mosaic-card > i { margin-top:5px; font-size:3rem; }.mosaic-card strong { max-width:100%; font:900 clamp(1.3rem,16cqw,3.2rem)/.9 'Archivo Black',sans-serif; letter-spacing:-.06em; overflow-wrap:break-word; }.mosaic-card small { font:700 .7rem 'IBM Plex Mono',monospace; }.mosaic-card:hover strong { transform:translateX(5px); }.mosaic-card strong { transition:transform .2s ease; }
.mosaic-instagram { background:#1769e8;color:#fff; }.mosaic-tiktok { background:#ed2d2d;color:#fff; }.mosaic-youtube { background:#fff; }.mosaic-youtube > i { color:#ed2d2d; }.mosaic-more { background:#ffde17; }

/* scroll-margin-top: karttan gelen kaydirmada baslik yapiskan navbarin altinda kalmasin. */
.neo-popular { position:relative; margin-bottom:100px; display:grid; grid-template-columns:minmax(230px,.38fr) minmax(0,1fr); gap:38px; align-items:start; scroll-margin-top:96px; }
/* Sol sutun her iki satira birden yayilir: aksi halde yan panel 1. satiri
   uzatir ve sagdaki tablo asagi kayar. */
.neo-popular .neo-section-heading { position:sticky; top:120px; grid-column:1; grid-row:1 / span 2; container-type:inline-size; min-width:0; }
/* Baslik boyutu sol sutunun genisligine gore olceklenir; "YÜKSELİYOR?" gibi
   uzun kelimeler ekran genisligine bagli olsaydi tasip listenin ustune binerdi. */
/* Boyut, "YÜKSELİYOR?" tek satirda kalacak sekilde sinirlandi; daha sikisik
   harf araligi sayesinde yazi 13cqw'ye gore buyuk gorunur. overflow-wrap
   son care agi olarak durur (tasma tabloya binmesin diye). */
.neo-popular .neo-section-heading h2 { font-size:clamp(1.9rem,13.8cqw,5.1rem); letter-spacing:-.075em; overflow-wrap:break-word; }
.neo-popular .platform-tabs { grid-row:1; }
.neo-popular .table-responsive { grid-row:2; }

/* Sol sutundaki canli katalog ozeti */
.neo-aside { margin-top:26px; border:3px solid #090909; background:#fffef8; box-shadow:6px 6px 0 #090909; }
.neo-aside-row { display:flex; justify-content:space-between; align-items:baseline; gap:10px; padding:11px 14px; border-bottom:2px solid #090909; }
.neo-aside-row span { font:700 .62rem 'IBM Plex Mono',monospace; color:#4b5563; letter-spacing:.04em; }
.neo-aside-row strong { font:900 1.05rem 'Archivo Black',sans-serif; color:#090909; text-align:right; overflow-wrap:anywhere; }
.neo-aside-note { padding:11px 14px; border-bottom:2px solid #090909; font:600 .68rem/1.45 'IBM Plex Mono',monospace; color:#4b5563; }
.neo-aside-cta {
  width:100%; min-height:46px; display:flex; justify-content:space-between; align-items:center;
  padding:0 14px; border:0; background:#ffde17; color:#090909; cursor:pointer;
  font:900 .78rem 'Archivo Black',sans-serif; letter-spacing:.02em;
}
.neo-aside-cta:hover { background:#ed2d2d; color:#fff; }
.neo-popular .platform-tabs { grid-column:2; display:flex; gap:7px; overflow-x:auto; padding-bottom:12px; }
.neo-popular .tab-btn { flex:none; padding:8px 12px; border:2px solid #090909; border-radius:0; background:#fff; color:#090909; font:700 .68rem 'IBM Plex Mono',monospace; box-shadow:3px 3px 0 #090909; }
.neo-popular .tab-btn.active,.neo-popular .tab-btn:hover { background:#ffde17; color:#090909; }
.neo-popular .table-responsive { grid-column:2; overflow:visible; }
.neo-popular .custom-table { border-collapse:collapse; background:transparent; }
.neo-popular .custom-table thead { display:none; }
.neo-popular .custom-table tr { border-top:2px solid #090909; border-bottom:2px solid #090909; }
.neo-popular .custom-table td { padding:18px 12px; border:0; color:#090909; background:#fffef8; }
.neo-popular .custom-table td:first-child { width:75px; color:#1769e8; font:900 1.5rem 'Archivo Black',sans-serif; }
.neo-popular .custom-table .cell-service-title { font-weight:900; }.neo-popular .custom-table .btn { padding:9px 12px; border:2px solid #090909; border-radius:0; background:#ed2d2d; box-shadow:3px 3px 0 #090909; color:#fff; }
.neo-popular .badge { border:2px solid #090909; border-radius:0; color:#090909; background:#ffde17; }

.neo-how { margin-bottom:90px; padding:36px; border:3px solid #090909; background:#21a9f6; box-shadow:10px 10px 0 #090909; }
.neo-steps { margin-top:28px; display:grid; grid-template-columns:repeat(3,1fr); }.neo-steps > div { position:relative; min-height:220px; padding:24px; display:flex; flex-direction:column; align-items:flex-start; border:2px solid #090909; background:#fff; }.neo-steps > div:nth-child(2) { transform:translateY(16px); background:#ffde17; }.neo-steps > div:nth-child(3) { transform:translateY(32px); background:#ed2d2d; color:#fff; }.neo-steps b { position:absolute; top:12px; right:14px; font:900 1.5rem 'Archivo Black',sans-serif; }.neo-steps i { margin:5px 0 44px; font-size:2.3rem; }.neo-steps strong { font:900 1.25rem 'Archivo Black',sans-serif; text-transform:uppercase; }.neo-steps p { margin-top:7px; font-size:.85rem; font-weight:600; }

.neo-trust { margin-bottom:100px; display:grid; grid-template-columns:repeat(3,1fr); border:3px solid #090909; box-shadow:9px 9px 0 #090909; }.neo-trust > div { min-height:155px; padding:26px; display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; column-gap:18px; align-content:center; border-right:3px solid #090909; }.neo-trust > div:last-child { border:0; }.neo-trust i { grid-row:1/3; align-self:center; color:#1769e8; font-size:2.3rem; }.neo-trust strong { font:900 1.15rem 'Archivo Black',sans-serif; }.neo-trust small { font-weight:600; }

.neo-featured { margin-bottom:90px; }.neo-featured .featured-cards-grid { display:block; overflow:hidden; }.neo-featured .featured-cards-track { gap:16px; }.neo-featured .featured-card-box { min-height:260px; padding:22px; justify-content:space-between; border:3px solid #090909; border-radius:0; background:#fff; color:#090909; box-shadow:7px 7px 0 #090909; }.neo-featured .featured-card-box:nth-child(4n+1) { background:#1769e8;color:#fff; }.neo-featured .featured-card-box:nth-child(4n+2) { background:#ffde17; }.neo-featured .featured-card-box:nth-child(4n+3) { background:#ed2d2d;color:#fff; }.neo-featured .featured-card-title,.neo-featured .featured-card-highlight { color:inherit; font-family:'Archivo Black',sans-serif; }.neo-featured .featured-card-sub { color:inherit; }.neo-featured .btn-magenta { border:2px solid #090909; border-radius:0; background:#090909; color:#fff; box-shadow:4px 4px 0 #fff; }

.neo-cta { padding:clamp(30px,5vw,70px); display:flex; justify-content:space-between; align-items:center; gap:40px; border:3px solid #090909; background:#1769e8; color:#fff; box-shadow:12px 12px 0 #090909; }.neo-cta span { font:700 .75rem 'IBM Plex Mono',monospace; }.neo-cta h2 { margin-top:10px; font:900 clamp(3rem,6vw,6rem)/.88 'Archivo Black',sans-serif; letter-spacing:-.06em; }.neo-cta .btn { flex:none; padding:17px 22px; border:3px solid #090909; border-radius:0; background:#ffde17; color:#090909; box-shadow:7px 7px 0 #090909; font-weight:900; }.neo-cta .btn:hover { transform:translate(4px,4px); box-shadow:3px 3px 0 #090909; }

/* Footer tum gorunumlerin altinda ortaktir (main disinda durur). */
.neo-footer { position:relative; z-index:1; padding:52px clamp(24px,5vw,74px) 30px; display:grid; grid-template-columns:1fr 1fr 1.4fr; gap:30px; align-items:start; border-top:3px solid #090909; background:#090909; color:#fff; }.neo-footer .brand-wordmark { color:#fff; }.neo-footer p { color:#d4d4d4; font-size:.85rem; }.neo-footer > div:nth-of-type(2) { display:flex; flex-wrap:wrap; gap:20px; justify-content:flex-end; }.neo-footer a { color:#fff; font:700 .75rem 'IBM Plex Mono',monospace; cursor:pointer; }.neo-footer a:hover { color:#ffde17; }.neo-footer small { grid-column:1/-1; padding-top:25px; border-top:1px solid #444; color:#888; }

@media (max-width: 1100px) {
  /* Menu satir icine sigmaz; hamburger ile acilan tam genislikte panele tasinir.
     .navbar sticky oldugundan mutlak konumlu panel icin kapsayici blok olur. */
  .nav-toggle {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    min-height: 38px;
    padding: 0;
    border: 2px solid #090909;
    border-radius: 0;
    background: #ffde17;
    color: #090909;
    box-shadow: 4px 4px 0 #090909;
    font-size: 1.05rem;
    cursor: pointer;
  }
  .nav-toggle:hover { transform: translate(2px, 2px); box-shadow: 2px 2px 0 #090909; }
  .nav-toggle[aria-expanded="true"] { background: #ed2d2d; color: #fff; }

  .navbar .nav-links {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 120;
    margin-top: 5px; /* navbar'in 0 5px 0 golgesinin altina oturur */
    padding: 14px clamp(14px, 4vw, 64px) 18px;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    max-height: calc(100vh - 150px);
    overflow-y: auto;
    background: #fffef8;
    border-bottom: 3px solid #090909;
    box-shadow: 0 5px 0 #090909;
  }
  .navbar.nav-open .nav-links { display: flex; }
  /* Panel admin gorunumunde de acik zeminlidir; rengi burada sabitlemek
     admin'in acik metin rengini gecersiz kilar. */
  .navbar .nav-links .nav-link {
    padding: 12px 14px;
    border: 2px solid #090909;
    background: #fff;
    color: #090909;
    font-size: .8rem;
  }
  .navbar .nav-links .nav-link:hover,
  .navbar .nav-links .nav-link.active { color: #090909; background: #ffde17; box-shadow: 4px 4px 0 #090909; }

  .neo-hero { grid-template-columns:1fr 400px; gap:35px; }
  .neo-service-mosaic { grid-template-columns:1fr 1fr; grid-template-rows:320px 270px; }
  .mosaic-card:nth-child(2) { border-right:0; }.mosaic-card:nth-child(-n+2) { border-bottom:3px solid #090909; }
  .neo-landing .metrics-banner-card { grid-template-columns:repeat(3,1fr); }.neo-landing .metric-item:nth-child(3) { border-right:0; }.neo-landing .metric-item:nth-child(-n+3) { border-bottom:2px solid #090909; }
}

@media (max-width: 820px) {
  #announcement-bar { font-size:.63rem; }.announcement-star { display:none; }
  .navbar { min-height:66px; padding:10px 14px; }.navbar .language-selector { display:none; }.navbar .user-badge .btn { padding:7px 9px; font-size:.7rem; }.navbar .user-badge .btn-outline { display:none; }
  /* Tek sutuna dusen hero: hicbir parca 100vw'yi asmamali. Ust bolumdeki
     baslik, rozet ve nokta deseni ile sipariş makinesinin ofsetli sari golgesi
     dar ekranda saga tasip .neo-landing'in overflow:hidden'i tarafindan
     kirpiliyordu. */
  .neo-hero { min-height:0; padding:62px 20px 70px; grid-template-columns:minmax(0,1fr); }
  .neo-hero::before { display:none; }
  .neo-hero-copy { min-width:0; }
  .neo-landing .hero-title { max-width:100%; font-size:clamp(2.6rem,13.5vw,6rem); overflow-wrap:anywhere; }
  .neo-landing .hero-title span { max-width:100%; margin-left:0; padding:3px 14px 8px; box-shadow:6px 6px 0 #090909; }
  .neo-landing .hero-subtitle { max-width:100%; }
  .neo-hero-actions { flex-wrap:wrap; }
  .neo-scribble { display:none; }

  /* Golge bloğu 12px saga tasar; makine o kadar daraltilir ki ikisi birlikte
     sutunun icinde kalsin. */
  .order-machine { justify-self:stretch; width:calc(100% - 12px); max-width:calc(100% - 12px); min-width:0; }
  .machine-shadow { inset:12px -12px -12px 12px; }
  .machine-cap { min-height:60px; padding:14px 16px; font-size:1.05rem; }
  .machine-cap > span { min-width:0; overflow-wrap:anywhere; }
  .machine-total { gap:12px; }
  .machine-total small { min-width:0; }
  .machine-total strong { min-width:0; font-size:clamp(1.4rem,7vw,2.15rem); overflow-wrap:anywhere; text-align:right; }
  .machine-submit { gap:10px; padding:0 14px; }
  .machine-submit,
  .machine-field,
  .machine-counter { max-width:100%; }
  .neo-heading-split { align-items:start; flex-direction:column; }.neo-heading-split p { max-width:none; }
  .neo-landing .metrics-banner-card { grid-template-columns:1fr 1fr; }.neo-landing .metric-item { border-right:2px solid #090909!important; border-bottom:2px solid #090909; }.neo-landing .metric-item:nth-child(even) { border-right:0!important; }.neo-landing .metric-item:last-child { grid-column:1/-1; border-bottom:0; border-right:0!important; }
  .neo-service-mosaic { grid-template-columns:1fr; grid-template-rows:repeat(4,260px); }.mosaic-card { border-right:0; border-bottom:3px solid #090909!important; }.mosaic-card:last-child { border-bottom:0!important; }
  /* Tek sutuna dusunce satir atamalari sifirlanir; aksi halde baslik 2 satira
     yayilip sekmelerle ayni hucreye denk gelir ve ust uste biner. */
  .neo-popular { grid-template-columns:1fr; }.neo-popular .neo-section-heading { position:static; grid-column:1; grid-row:auto; }.neo-popular .platform-tabs,.neo-popular .table-responsive { grid-column:1; grid-row:auto; }.neo-popular .table-responsive { overflow-x:auto; }.neo-popular .custom-table { min-width:760px; }
  .neo-steps { grid-template-columns:1fr; gap:12px; }.neo-steps > div:nth-child(2),.neo-steps > div:nth-child(3) { transform:none; }
  .neo-trust { grid-template-columns:1fr; }.neo-trust > div { border-right:0; border-bottom:3px solid #090909; }.neo-trust > div:last-child { border-bottom:0; }
  .neo-cta { align-items:flex-start; flex-direction:column; }.neo-cta .btn { white-space:normal; }
  .neo-footer { grid-template-columns:1fr; }.neo-footer > div:nth-of-type(2) { justify-content:flex-start; }.neo-footer small { grid-column:1; }
}

@media (max-width: 480px) {
  .brand-wordmark { font-size:1.35rem; }.navbar .user-badge .btn { min-height:34px; box-shadow:3px 3px 0 #090909; }.neo-hero-actions { align-items:flex-start; flex-direction:column; }.neo-proof { line-height:1.35; }.machine-body { padding:17px; }.neo-shell { padding-inline:14px; }.neo-how { padding:16px; }.neo-landing .metrics-banner-card { grid-template-columns:1fr; }.neo-landing .metric-item,.neo-landing .metric-item:nth-child(even) { border-right:0!important; }.neo-landing .metric-item:last-child { grid-column:auto; }.neo-cta { box-shadow:7px 7px 0 #090909; }
}

/* ========================================================================== */
/* SMMJET — NEO BRUTALIST APPLICATION INTERFACE                              */
/* Landing sayfasinin karakterini katalog, panel, blog ve yonetime tasir.     */
/* ========================================================================== */

body.neo-app-active {
  background: #21a9f6;
  background-image: none;
  color: #090909;
}

body.neo-app-active #app-viewport {
  min-height: calc(100vh - 74px);
  border-top: 3px solid #090909;
  background:
    linear-gradient(90deg, rgba(9,9,9,.055) 1px, transparent 1px),
    linear-gradient(rgba(9,9,9,.055) 1px, transparent 1px),
    #fffef8;
  background-size: 32px 32px;
}

body.neo-app-active .app-view:not(#view-landing):not(#view-admin) {
  min-height: calc(100vh - 74px);
  padding-bottom: 84px;
}

body.neo-app-active .app-view:not(#view-landing):not(#view-admin) .main-content {
  max-width: 1380px !important;
  padding: clamp(34px, 5vw, 72px) clamp(18px, 4vw, 52px) 80px;
}

body.neo-app-active .app-view:not(#view-landing):not(#view-admin) .main-content::before {
  display: inline-block;
  margin-bottom: 14px;
  padding: 6px 10px;
  border: 2px solid #090909;
  background: #ffde17;
  box-shadow: 3px 3px 0 #090909;
  font: 800 .68rem 'IBM Plex Mono', monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
}

#view-new-order .main-content::before { content: '01 / SİPARİŞ MAKİNESİ'; }
#view-services .main-content::before { content: '02 / CANLI KATALOG'; }
#view-orders .main-content::before { content: '03 / HAREKETLER'; }
#view-add-funds .main-content::before { content: '04 / CÜZDAN'; }
#view-tickets .main-content::before { content: '05 / DESTEK MERKEZİ'; }
#view-api-docs .main-content::before { content: '06 / GELİŞTİRİCİ ALANI'; }
#view-blog .main-content::before { content: '07 / SMM LAB'; }
#view-blog-detail .main-content::before { content: '07 / SMM LAB / YAZI'; }

body.neo-app-active .app-view:not(#view-landing):not(#view-admin) h1 {
  max-width: 920px;
  margin-bottom: 30px !important;
  color: #090909 !important;
  font: 900 clamp(2.25rem, 5vw, 4.9rem)/.94 'Archivo Black', sans-serif !important;
  letter-spacing: -.055em;
  text-transform: uppercase;
}

body.neo-app-active .app-view:not(#view-landing):not(#view-admin) h2,
body.neo-app-active .app-view:not(#view-landing):not(#view-admin) h3,
body.neo-app-active .app-view:not(#view-landing):not(#view-admin) h4 {
  color: #090909 !important;
  font-family: 'Archivo Black', sans-serif;
}

body.neo-app-active .app-view:not(#view-landing):not(#view-admin) p,
body.neo-app-active .app-view:not(#view-landing):not(#view-admin) .form-label {
  color: #222 !important;
}

body.neo-app-active .glass-card,
body.neo-app-active .modal-body.glass-card {
  padding: clamp(20px, 2.5vw, 30px);
  border: 3px solid #090909 !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: #090909;
  box-shadow: 9px 9px 0 #090909 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.neo-app-active .glass-card::before { display: none; }
body.neo-app-active .glass-card:hover { transform: none; }

body.neo-app-active .form-label {
  margin-bottom: 7px;
  color: #090909 !important;
  font: 800 .72rem 'IBM Plex Mono', monospace;
  letter-spacing: .04em;
  text-transform: uppercase;
}

body.neo-app-active .form-control {
  min-height: 48px;
  padding: 11px 13px;
  border: 2px solid #090909 !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: #090909 !important;
  box-shadow: none !important;
  font-weight: 650;
}

body.neo-app-active .form-control::placeholder { color: #777; }
body.neo-app-active .form-control:focus {
  outline: 0;
  background: #fff8b8 !important;
  box-shadow: 4px 4px 0 #090909 !important;
}

body.neo-app-active .btn {
  min-height: 42px;
  border: 2px solid #090909 !important;
  border-radius: 0 !important;
  background: #fff;
  color: #090909 !important;
  box-shadow: 4px 4px 0 #090909 !important;
  font-family: 'IBM Plex Mono', monospace;
  font-weight: 900;
  text-transform: uppercase;
}

body.neo-app-active .btn:hover {
  transform: translate(2px, 2px) !important;
  box-shadow: 2px 2px 0 #090909 !important;
}

body.neo-app-active .btn-primary { background: #ed2d2d !important; color: #fff !important; }
body.neo-app-active .btn-cyan { background: #1769e8 !important; color: #fff !important; }
body.neo-app-active .btn-outline { background: #ffde17 !important; color: #090909 !important; }
body.neo-app-active .btn:disabled { opacity: .42; filter: grayscale(1); }

body.neo-app-active .table-responsive {
  max-height: 660px;
  border: 2px solid #090909;
  border-radius: 0;
  background: #fff;
}

body.neo-app-active .table-responsive::-webkit-scrollbar-track { background: #fff; border-radius: 0; }
body.neo-app-active .table-responsive::-webkit-scrollbar-thumb { background: #ed2d2d; border: 2px solid #090909; border-radius: 0; }
body.neo-app-active .custom-table { border-collapse: collapse; border-spacing: 0; }
body.neo-app-active .custom-table th {
  padding: 15px 16px;
  border-right: 2px solid #090909;
  border-bottom: 3px solid #090909;
  background: #ffde17;
  color: #090909;
  box-shadow: none;
  font: 900 .72rem 'IBM Plex Mono', monospace;
}
body.neo-app-active .custom-table th:last-child { border-right: 0; }
body.neo-app-active .custom-table td {
  padding: 15px 16px;
  border-right: 1px solid #090909;
  border-bottom: 1px solid #090909;
  border-radius: 0 !important;
  background: #fff;
  color: #090909;
}
body.neo-app-active .custom-table td:last-child { border-right: 0; }
body.neo-app-active .custom-table tr:hover td { background: #dff4ff; }
body.neo-app-active .custom-table tbody tr:last-child td { border-bottom: 0; }

body.neo-app-active .badge {
  border: 2px solid #090909 !important;
  border-radius: 0;
  background: #ffde17;
  color: #090909;
  box-shadow: 2px 2px 0 #090909;
  font-family: 'IBM Plex Mono', monospace;
}
body.neo-app-active .badge-completed { background: #9af0b4; }
body.neo-app-active .badge-processing { background: #9edcff; }
body.neo-app-active .badge-pending { background: #ffde17; }
body.neo-app-active .badge-canceled { background: #ff9b9b; }

body.neo-app-active .table-pagination {
  color: #090909;
  font-family: 'IBM Plex Mono', monospace;
  font-weight: 700;
}

/* Hizmet kataloğu */
#view-services .flex-between.mb-20 {
  align-items: flex-end;
  gap: 28px;
  margin-bottom: 32px;
}
#view-services .flex-between.mb-20 > div:last-child {
  width: min(100%, 720px) !important;
  padding: 16px;
  border: 3px solid #090909;
  background: #21a9f6;
  box-shadow: 7px 7px 0 #090909;
}
#view-services .platform-tabs {
  gap: 8px;
  margin-bottom: 26px;
  padding: 0 0 7px;
  overflow-x: auto;
}
#view-services .tab-btn {
  flex: none;
  min-height: 44px;
  padding: 9px 15px;
  border: 2px solid #090909;
  border-radius: 0;
  background: #fff;
  color: #090909;
  box-shadow: 4px 4px 0 #090909;
  font: 800 .72rem 'IBM Plex Mono', monospace;
}
#view-services .tab-btn:hover,
#view-services .tab-btn.active { background: #ffde17; color: #090909; transform: translate(2px,2px); box-shadow: 2px 2px 0 #090909; }
#view-services > .main-content > .glass-card { padding: 0; }
#view-services .table-pagination { padding: 18px; border-top: 3px solid #090909; background: #fff; }
#view-services .cell-service-title { font-weight: 850; }

/* Filtre satiri: arama kutusu kalan alani doldurur, dar ekranda satir kirilir.
   Onceden sabit genislikli select'ler alani yiyip aramayi kirpiyordu. */
#view-services .flex-between.mb-20 > div:last-child { flex-wrap: wrap; }
#view-services #services-country-select { flex: 0 1 150px; width: auto !important; min-width: 130px; }
#view-services #services-subcategory-select { flex: 1 1 185px; width: auto !important; min-width: 155px; }
#view-services #services-search-input { flex: 2 1 200px; min-width: 165px; }

/* Islem sutunundaki buton, kalin cerceve + 4px ofset golge yuzunden 120px'e
   sigmiyordu. Sutun 178px'e cikarildi; buton da sikismaya karsi korunuyor. */
#view-services #full-services-table td:last-child { padding-right: 14px; }
#view-services #full-services-table td:last-child .btn { flex-shrink: 0; white-space: nowrap; }
#view-services .custom-table td:nth-child(3) { color: #ed2d2d; font-weight: 900; }

/* Sipariş ve müşteri panelleri */
#view-new-order .main-content > div[style*="grid-template-columns"] { align-items: start; gap: 28px !important; }
#view-new-order #order-form > .glass-card { background: #ffde17 !important; box-shadow: 5px 5px 0 #090909 !important; }
#view-new-order #service-info-box,
#view-new-order #order-form > div[style*="rgba(255,255,255"] {
  border: 2px solid #090909 !important;
  border-radius: 0 !important;
  background: #dff4ff !important;
  color: #090909 !important;
}
#view-new-order #service-info-box * { color: #090909 !important; }
#view-new-order #service-rate { color: #ed2d2d !important; font-weight: 900; }
#view-new-order .main-content > div > div:last-child > .glass-card:nth-child(1) { background: #1769e8 !important; color: #fff; }
#view-new-order .main-content > div > div:last-child > .glass-card:nth-child(1) * { color: #fff !important; }
#view-new-order .main-content > div > div:last-child > .glass-card:nth-child(2) { background: #ffde17 !important; }

#view-orders > .main-content > .glass-card,
#view-tickets .main-content > .glass-card:last-child { padding: 0; }

#view-add-funds .main-content > div[style*="grid-template-columns"] > .glass-card:first-child { background: #ffde17 !important; }
#view-add-funds .main-content > div[style*="grid-template-columns"] > .glass-card:last-child { background: #21a9f6 !important; }
#view-add-funds .main-content > .glass-card:nth-of-type(1) { background: #fff !important; }
#view-add-funds .main-content > .glass-card:last-child { background: #9af0b4 !important; }
#view-add-funds .glass-card div[style*="background: rgba(7"] { border: 2px solid #090909; border-radius: 0 !important; background: #fff !important; }

#view-tickets .main-content > .glass-card:first-of-type {
  border-color: #090909 !important;
  background: #1769e8 !important;
  color: #fff;
}
#view-tickets .main-content > .glass-card:first-of-type h3,
#view-tickets .main-content > .glass-card:first-of-type p { color: #fff !important; }
#view-tickets #tickets-telegram-link { background: #ffde17 !important; color: #090909 !important; }

/* API ve blog */
#view-api-docs .main-content > .glass-card:first-of-type { background: #21a9f6 !important; }
#view-api-docs pre,
#view-api-docs .glass-card div[style*="font-family: monospace"] {
  border: 3px solid #090909 !important;
  border-radius: 0 !important;
  background: #090909 !important;
  color: #f2f2f2 !important;
  box-shadow: 5px 5px 0 #ffde17;
  font-family: 'IBM Plex Mono', monospace !important;
  line-height: 1.65;
}
#view-api-docs pre { margin-bottom: 28px !important; }

#view-blog .text-center { text-align: left; }
#view-blog .text-center p { max-width: 700px !important; margin: 0 !important; font-weight: 650; }
#view-blog .blog-cards-grid { gap: 28px; }
#view-blog .blog-card {
  border: 3px solid #090909;
  border-radius: 0;
  background: #fff;
  color: #090909;
  box-shadow: 8px 8px 0 #090909;
}
#view-blog .blog-card:nth-child(3n+1) { background: #ffde17; }
#view-blog .blog-card:nth-child(3n+2) { background: #21a9f6; }
#view-blog .blog-card:nth-child(3n+3) { background: #fff; }
#view-blog .blog-card:hover { transform: translate(4px,4px); box-shadow: 4px 4px 0 #090909; }
#view-blog .blog-card-img { border-bottom: 3px solid #090909; filter: saturate(.8) contrast(1.08); }
#view-blog .blog-card h3,
#view-blog .blog-card p,
#view-blog .blog-card div { color: #090909 !important; }

#view-blog-detail article.glass-card { padding: clamp(22px,4vw,48px) !important; }
#view-blog-detail #blog-detail-title { font-size: clamp(2rem,5vw,4rem) !important; }
#view-blog-detail #blog-detail-img { border: 3px solid #090909; border-radius: 0 !important; box-shadow: 7px 7px 0 #090909; }
#view-blog-detail #blog-detail-content,
#view-blog-detail #blog-detail-content p,
#view-blog-detail #blog-detail-content h2,
#view-blog-detail #blog-detail-content h3 { color: #090909 !important; }
#view-blog-detail #blog-detail-content blockquote { border: 3px solid #090909; border-left-width: 10px; border-radius: 0; background: #ffde17; color: #090909; }
#view-blog-detail #blog-detail-content th { border: 2px solid #090909; background: #21a9f6; color: #090909; }
#view-blog-detail #blog-detail-content td { border: 2px solid #090909; }

/* Giriş / kayıt */
#view-auth {
  min-height: calc(100vh - 74px);
  padding: clamp(34px,6vw,78px) 18px;
  background: #21a9f6;
}
#view-auth .auth-split-container { gap: clamp(30px,5vw,72px); max-width: 1260px; }
#view-auth .auth-pill-badge { border: 2px solid #090909; border-radius: 0; background: #ffde17; color: #090909; box-shadow: 4px 4px 0 #090909; font-family: 'IBM Plex Mono', monospace; }
#view-auth .auth-headline { color: #090909; font: 900 clamp(3rem,6vw,6.2rem)/.88 'Archivo Black', sans-serif; letter-spacing: -.06em; text-transform: uppercase; }
#view-auth .auth-paragraph { color: #090909; font-weight: 650; }
#view-auth .auth-steps-row { gap: 0; }
#view-auth .auth-step-box { border: 2px solid #090909; border-radius: 0; background: #fff; color: #090909; }
#view-auth .auth-step-box:nth-child(2) { background: #ffde17; transform: translateY(12px); }
#view-auth .auth-step-box:nth-child(3) { background: #ed2d2d; color: #fff; transform: translateY(24px); }
#view-auth .auth-step-num { border: 2px solid #090909; border-radius: 0; background: #090909; }
#view-auth .auth-step-title,
#view-auth .auth-step-desc { color: inherit; }
#view-auth .auth-prop-icon { border: 2px solid #090909; border-radius: 0; background: #fff; color: #1769e8; box-shadow: 3px 3px 0 #090909; }
#view-auth .auth-prop-title,
#view-auth .auth-prop-desc { color: #090909; }
#view-auth .auth-form-card { border: 3px solid #090909; border-radius: 0; box-shadow: 12px 12px 0 #090909; }
#view-auth .auth-dark-btn { border: 3px solid #090909; border-radius: 0; background: #ed2d2d; box-shadow: 5px 5px 0 #090909; }
#view-auth .cloudflare-box { border: 2px solid #090909; border-radius: 0; }

/* Modal ve etkileşim katmanı */
body.neo-app-active .modal-backdrop { background: rgba(9,9,9,.78); }
body.neo-app-active .modal-body,
body.neo-app-active .language-editor-card {
  border: 3px solid #090909 !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: #090909 !important;
  box-shadow: 10px 10px 0 #ffde17 !important;
}
body.neo-app-active .modal-body h2,
body.neo-app-active .modal-body h3,
body.neo-app-active .modal-body p { color: #090909 !important; }

/* Yönetim merkezi */
body.neo-app-active.admin-view-active,
body.admin-view-active { background: #21a9f6; background-image: none; }
#view-admin { --admin-surface:#fff; --admin-surface-soft:#fffef8; --admin-line:#090909; --admin-muted:#444; }
#view-admin .app-layout { align-items: flex-start; background: #fffef8; }
#view-admin .admin-sidebar {
  border-right: 3px solid #090909;
  background: #090909;
}
#view-admin .admin-sidebar-brand { border-bottom: 2px solid #444; }
#view-admin .admin-brand-mark { border: 2px solid #fff; border-radius: 0; background: #ed2d2d; box-shadow: 4px 4px 0 #ffde17; }
#view-admin .admin-nav-label { color: #888; font-family: 'IBM Plex Mono', monospace; }
#view-admin .sidebar-item { border: 2px solid transparent; border-radius: 0; color: #ddd; }
#view-admin .sidebar-item:hover { border-color: #fff; background: #222; color: #fff; }
#view-admin .sidebar-item.active { border: 2px solid #090909; background: #ffde17; color: #090909; box-shadow: 4px 4px 0 #ed2d2d; }
#view-admin .sidebar-item.active i { color: #090909; }
#view-admin .admin-main-content { max-width: 1500px; padding: clamp(28px,4vw,54px) clamp(18px,3vw,42px) 80px; }
#view-admin .admin-main-content::before {
  content: 'SMMJET / CONTROL ROOM';
  display: inline-block;
  margin-bottom: 18px;
  padding: 6px 10px;
  border: 2px solid #090909;
  background: #21a9f6;
  box-shadow: 3px 3px 0 #090909;
  font: 800 .68rem 'IBM Plex Mono', monospace;
}
#view-admin .admin-main-content > div > h2,
#view-admin .admin-main-content .flex-between h2 {
  color: #090909 !important;
  font: 900 clamp(1.8rem,3vw,3.2rem)/1 'Archivo Black', sans-serif !important;
  text-transform: uppercase;
}
#view-admin .glass-card { border-color: #090909 !important; background: #fff !important; color: #090909; }
/* Kartlar beyaz zemine dondugu icin satir ici "color: #fff" kalan basliklar
   gorunmez oluyordu; yalnizca beyaz yazilanlar siyaha cevrilir, renkli
   basliklar (mavi/turuncu ikonlu) oldugu gibi kalir. */
#view-admin .glass-card h3[style*="color: #fff"],
#view-admin .glass-card h3[style*="color:#fff"],
#view-admin .glass-card h4[style*="color: #fff"],
#view-admin .glass-card h4[style*="color:#fff"] { color: #090909 !important; }
/* Kart ici aciklama metinleri koyu temanin soluk grisiyle kalmisti;
   beyaz kartta okunakli koyu griye cekilir. */
#view-admin .glass-card p[style*="text-muted"] { color: #4b5563 !important; }
#view-admin .stats-grid { gap: 20px; }
#view-admin .stat-card:nth-child(3n+1) { background: #ffde17 !important; }
#view-admin .stat-card:nth-child(3n+2) { background: #21a9f6 !important; }
#view-admin .stat-card:nth-child(3n+3) { background: #ed2d2d !important; color: #fff; }
#view-admin .stat-card:nth-child(3n+3) .stat-val,
#view-admin .stat-card:nth-child(3n+3) .stat-lbl { color: #fff !important; }
#view-admin .stat-icon { border: 2px solid #090909; border-radius: 0; background: #fff; color: #090909; box-shadow: 3px 3px 0 #090909; }
#view-admin .stat-val { color: #090909; font-family: 'Archivo Black', sans-serif; }
#view-admin .stat-lbl { color: #090909; font-family: 'IBM Plex Mono', monospace; font-weight: 700; }
#view-admin .table-responsive { border: 2px solid #090909; border-radius: 0; background: #fff; }
#view-admin .custom-table th { color: #090909; background: #ffde17; border-color: #090909; }
#view-admin .custom-table td { color: #090909; background: #fff; border-color: #090909; }
#view-admin .custom-table tr:hover td { background: #dff4ff; }
#view-admin .form-control { border-color: #090909; background: #fff; color: #090909; }
#view-admin .form-label,
#view-admin .admin-help { color: #333; }
#view-admin .btn { border-radius: 0; }
#view-admin .language-editor-card { border: 2px solid #090909; border-radius: 0; background: #fff8b8; }

@media (max-width: 980px) {
  #view-services .flex-between.mb-20 { align-items: stretch; flex-direction: column; }
  #view-services .flex-between.mb-20 > div:last-child { width: 100% !important; flex-wrap: wrap; }
  #view-services .flex-between.mb-20 > div:last-child > * { width: calc(50% - 5px) !important; flex: 1 1 260px; }
  #view-new-order .main-content > div[style*="grid-template-columns"],
  #view-add-funds .main-content > div[style*="grid-template-columns"],
  #view-add-funds form div[style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  #view-admin .admin-sidebar { border-right: 0; border-bottom: 3px solid #090909; }
}

@media (max-width: 640px) {
  body.neo-app-active .app-view:not(#view-landing):not(#view-admin) .main-content { padding: 30px 13px 58px; }
  body.neo-app-active .app-view:not(#view-landing):not(#view-admin) h1 { font-size: clamp(2rem,11vw,3rem) !important; }
  body.neo-app-active .glass-card { padding: 17px; box-shadow: 6px 6px 0 #090909 !important; }
  body.neo-app-active .flex-between { align-items: flex-start; gap: 14px; flex-direction: column; }
  #view-services .flex-between.mb-20 > div:last-child { padding: 12px; }
  #view-services .flex-between.mb-20 > div:last-child > * { width: 100% !important; }
  #view-auth .auth-steps-row { grid-template-columns: 1fr; gap: 10px; }
  #view-auth .auth-step-box:nth-child(2),
  #view-auth .auth-step-box:nth-child(3) { transform: none; }
  #view-auth .auth-props-grid { grid-template-columns: 1fr; }
  #view-blog-detail #blog-detail-img { height: 230px !important; }
  #view-admin .admin-main-content { padding: 24px 13px 58px; }
}

/* ==========================================================================
   KAMPANYA POPUP'I, SOSYAL KANIT ŞERİDİ VE ŞABLON SEÇİCİ
   ========================================================================== */

/* --- Popup temel yerleşimi --- */
.promo-overlay {
  position: fixed;
  inset: 0;
  z-index: 900;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(5, 8, 16, .72);
  animation: promoFade .25s ease;
}
@keyframes promoFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes promoPop { from { transform: scale(.92); opacity: 0; } to { transform: scale(1); opacity: 1; } }

.promo-box {
  position: relative;
  width: min(430px, 94vw);
  padding: 34px 28px 28px;
  border-radius: 18px;
  text-align: center;
  animation: promoPop .3s cubic-bezier(.34, 1.4, .64, 1);
}
.promo-close {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: rgba(0, 0, 0, .25);
  color: inherit;
  font-size: 1rem;
  cursor: pointer;
}
.promo-badge {
  display: inline-block;
  margin-bottom: 14px;
  padding: 7px 16px;
  border-radius: 30px;
  font-size: 1.5rem;
  font-weight: 900;
  letter-spacing: .02em;
}
.promo-title { margin-bottom: 8px; font-size: 1.45rem; font-weight: 800; line-height: 1.25; }
.promo-sub { margin-bottom: 18px; font-size: .95rem; opacity: .85; }
.promo-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  justify-content: center;
  padding: 14px 20px;
  border: 0;
  border-radius: 12px;
  font-size: 1rem;
  font-weight: 800;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease;
}
.promo-cta:hover { transform: translateY(-2px); }
.promo-countdown {
  margin: 4px 0 16px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 1.7rem;
  font-weight: 700;
  letter-spacing: .06em;
}

/* --- Şablonlar --- */
.promo-box.tpl-flash { background: #ffde17; color: #090909; border: 4px solid #090909; border-radius: 0; box-shadow: 10px 10px 0 #090909; }
.promo-box.tpl-flash .promo-badge { background: #ed2d2d; color: #fff; border: 3px solid #090909; border-radius: 0; transform: rotate(-3deg); }
.promo-box.tpl-flash .promo-cta { background: #090909; color: #fff; border-radius: 0; box-shadow: 5px 5px 0 #ed2d2d; }

.promo-box.tpl-gift { background: linear-gradient(150deg, #4c1d95, #7c3aed); color: #fff; box-shadow: 0 20px 60px rgba(124, 58, 237, .45); }
.promo-box.tpl-gift .promo-badge { background: rgba(255, 255, 255, .16); }
.promo-box.tpl-gift .promo-cta { background: #fbbf24; color: #1f2937; }

.promo-box.tpl-countdown { background: #0b1120; color: #f8fafc; border: 1px solid rgba(248, 113, 113, .4); box-shadow: 0 20px 60px rgba(239, 68, 68, .25); }
.promo-box.tpl-countdown .promo-badge { background: rgba(239, 68, 68, .18); color: #f87171; }
.promo-box.tpl-countdown .promo-countdown { color: #f87171; }
.promo-box.tpl-countdown .promo-cta { background: #ef4444; color: #fff; }

.promo-box.tpl-neon { background: #030712; color: #e2e8f0; border: 1px solid rgba(6, 182, 212, .5); box-shadow: 0 0 45px rgba(6, 182, 212, .35), inset 0 0 25px rgba(6, 182, 212, .08); }
.promo-box.tpl-neon .promo-badge { color: #22d3ee; background: rgba(6, 182, 212, .12); text-shadow: 0 0 18px rgba(34, 211, 238, .8); }
.promo-box.tpl-neon .promo-cta { background: linear-gradient(90deg, #06b6d4, #8b5cf6); color: #fff; }

.promo-box.tpl-minimal { background: #fffef8; color: #111827; border: 1px solid #e5e7eb; box-shadow: 0 24px 70px rgba(0, 0, 0, .35); }
.promo-box.tpl-minimal .promo-badge { background: #111827; color: #fff; }
.promo-box.tpl-minimal .promo-cta { background: #111827; color: #fff; }

.promo-box.tpl-rocket { background: linear-gradient(150deg, #1769e8, #21a9f6); color: #fff; box-shadow: 0 20px 60px rgba(23, 105, 232, .45); }
.promo-box.tpl-rocket .promo-badge { background: #ffde17; color: #090909; }
.promo-box.tpl-rocket .promo-cta { background: #090909; color: #fff; }

/* --- Admin şablon seçici --- */
.popup-template-picker {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 10px;
}
.tpl-option { display: block; cursor: pointer; text-align: center; }
.tpl-option input { position: absolute; opacity: 0; }
.tpl-option .tpl-preview {
  display: grid;
  place-items: center;
  min-height: 54px;
  margin-bottom: 5px;
  border: 2px solid transparent;
  border-radius: 10px;
  font-weight: 900;
  font-size: .85rem;
}
.tpl-option small { color: var(--text-muted); font-size: .7rem; }
.tpl-option input:checked + .tpl-preview { border-color: var(--accent-cyan); box-shadow: 0 0 0 2px rgba(6, 182, 212, .35); }
.tpl-preview.tpl-flash { background: #ffde17; color: #090909; }
.tpl-preview.tpl-gift { background: linear-gradient(150deg, #4c1d95, #7c3aed); color: #fff; }
.tpl-preview.tpl-countdown { background: #0b1120; color: #f87171; border: 1px solid rgba(248,113,113,.4) !important; }
.tpl-preview.tpl-neon { background: #030712; color: #22d3ee; border: 1px solid rgba(6,182,212,.5) !important; }
.tpl-preview.tpl-minimal { background: #fffef8; color: #111827; border: 1px solid #d1d5db !important; }
.tpl-preview.tpl-rocket { background: linear-gradient(150deg, #1769e8, #21a9f6); color: #fff; }

/* --- Sosyal kanıt şeridi --- */
#social-proof-ticker {
  position: fixed;
  left: 16px;
  bottom: 16px;
  z-index: 850;
  max-width: min(330px, calc(100vw - 100px));
}
.proof-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border: 2px solid #090909;
  background: #fffef8;
  color: #090909;
  box-shadow: 5px 5px 0 #090909;
  font-size: .82rem;
  animation: proofSlide .4s ease;
}
@keyframes proofSlide { from { transform: translateY(18px); opacity: 0; } to { transform: none; opacity: 1; } }
.proof-card i.proof-icon { flex: none; font-size: 1.15rem; color: #ed2d2d; }
.proof-card strong { display: block; font-size: .8rem; }
.proof-card small { color: #4b5563; font-size: .7rem; }
.proof-close { flex: none; margin-left: auto; border: 0; background: transparent; color: #6b7280; font-size: .85rem; cursor: pointer; }

/* --- İndirim fiyat gösterimi --- */
.price-strike { color: var(--text-dim); text-decoration: line-through; font-size: .82em; margin-right: 6px; }
.discount-chip {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 8px;
  border-radius: 12px;
  background: rgba(239, 68, 68, .14);
  color: #ef4444;
  font-size: .68rem;
  font-weight: 800;
}
.neo-landing .discount-chip { border-radius: 0; border: 2px solid #090909; background: #ed2d2d; color: #fff; }

/* --- Bakiye bonus bandı --- */
.bonus-banner {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
  padding: 16px 18px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(16, 185, 129, .35);
  background: linear-gradient(90deg, rgba(16, 185, 129, .14), rgba(6, 182, 212, .1));
}
.bonus-banner i { font-size: 1.5rem; color: var(--success); }
.bonus-banner strong { color: var(--success); }

@media (max-width: 640px) {
  #social-proof-ticker { left: 10px; bottom: 76px; }
  .promo-box { padding: 26px 18px 22px; }
}

/* ==========================================================================
   BAKİYE YÜKLEME EKRANI (yöntem kartları + tutar + adımlar)
   ========================================================================== */

.deposit-step {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 4px 0 14px;
  font-size: .95rem;
  font-weight: 700;
  color: var(--text-main);
}
.deposit-step span {
  flex: none;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--primary), var(--accent-cyan));
  color: #fff;
  font-size: .8rem;
  font-weight: 800;
}
.deposit-step:not(:first-child) { margin-top: 24px; }

.pay-tiles {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.pay-tile {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 16px 15px;
  text-align: left;
  color: var(--text-muted);
  border: 2px solid var(--border-glass);
  border-radius: var(--radius-md);
  background: var(--bg-glass);
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}
.pay-tile:hover { transform: translateY(-2px); border-color: rgba(139, 92, 246, .4); }
.pay-tile i { font-size: 1.5rem; margin-bottom: 6px; color: var(--accent-cyan); }
.pay-tile strong { color: var(--text-main); font-size: .95rem; }
.pay-tile small { font-size: .74rem; }
.pay-tile.active {
  border-color: var(--primary);
  background: rgba(139, 92, 246, .12);
  box-shadow: 0 0 0 3px rgba(139, 92, 246, .18);
}
.pay-tile.active i { color: var(--primary); }

.amount-row { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.amount-input-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 180px;
  padding: 4px 16px;
  border: 2px solid var(--border-glass);
  border-radius: var(--radius-md);
  background: rgba(7, 10, 18, .5);
}
.amount-input-wrap:focus-within { border-color: var(--primary); }
.amount-input-wrap span { color: var(--text-muted); font-size: 1.3rem; font-weight: 700; }
.amount-input-wrap input {
  width: 130px;
  padding: 10px 0;
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 1.5rem;
  font-weight: 800;
  outline: none;
  -moz-appearance: textfield;
}
.amount-input-wrap input::-webkit-outer-spin-button,
.amount-input-wrap input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.amount-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.amount-chips button {
  padding: 9px 16px;
  border: 1px solid var(--border-glass);
  border-radius: 22px;
  background: var(--bg-glass);
  color: var(--text-muted);
  font-weight: 700;
  font-size: .85rem;
  cursor: pointer;
  transition: all .18s ease;
}
.amount-chips button:hover,
.amount-chips button.active { color: #fff; border-color: var(--primary); background: rgba(139, 92, 246, .18); }

.deposit-note { margin-top: 10px; font-size: .78rem; color: var(--text-dim); }

/* Kripto odeme bekleme kutusu */
.crypto-wait {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 16px;
  padding: 14px 16px;
  border: 1px solid rgba(245, 158, 11, .4);
  border-radius: var(--radius-md);
  background: rgba(245, 158, 11, .08);
  font-size: .88rem;
}
.crypto-wait i { font-size: 1.3rem; color: var(--warning); }
.crypto-wait.success { border-color: rgba(16, 185, 129, .45); background: rgba(16, 185, 129, .1); }
.crypto-wait.success i { color: var(--success); }

@media (max-width: 700px) {
  .pay-tiles { grid-template-columns: 1fr; }
  .amount-row { align-items: stretch; flex-direction: column; }
  #view-add-funds div[style*="grid-template-columns: 1fr 1fr 1fr"] { grid-template-columns: 1fr !important; }
}

/* --- Banka hesabi (IBAN) kartlari --- */
.bank-account-card {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
  padding: 13px 15px;
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-md);
  background: rgba(7, 10, 18, .45);
}
.bank-account-card i.bank-ico { font-size: 1.25rem; color: var(--accent-cyan); }
.bank-account-card .bank-info { flex: 1; min-width: 200px; }
.bank-account-card .bank-info strong { display: block; font-size: .9rem; }
.bank-account-card .bank-info small { color: var(--text-muted); font-size: .76rem; }
.bank-account-card .bank-iban {
  font-family: 'IBM Plex Mono', monospace;
  font-size: .84rem;
  font-weight: 700;
  letter-spacing: .02em;
  word-break: break-all;
}

/* ==========================================================================
   NEO (AÇIK) TEMA UYUMU — bakiye yukleme bileşenleri
   Site gorunumlerinde glass-card beyaz zemine doner; koyu tema degiskenleriyle
   yazilan kartlar/adimlar beyaz-ustune-beyaz kaliyordu.
   ========================================================================== */
body.neo-app-active .deposit-step { color: #090909; }
body.neo-app-active .deposit-step span { border: 2px solid #090909; border-radius: 0; background: #ffde17; color: #090909; }

body.neo-app-active .pay-tile {
  border: 2px solid #090909;
  border-radius: 0;
  background: #fff;
  color: #4b5563;
  box-shadow: 4px 4px 0 #090909;
}
body.neo-app-active .pay-tile:hover { transform: translate(2px, 2px); box-shadow: 2px 2px 0 #090909; }
body.neo-app-active .pay-tile i { color: #1769e8; }
body.neo-app-active .pay-tile strong { color: #090909; }
body.neo-app-active .pay-tile.active { border-color: #090909; background: #ffde17; box-shadow: 4px 4px 0 #090909; }
body.neo-app-active .pay-tile.active i { color: #ed2d2d; }

body.neo-app-active .amount-input-wrap { border: 2px solid #090909; border-radius: 0; background: #fff; }
body.neo-app-active .amount-input-wrap span { color: #090909; }
body.neo-app-active .amount-input-wrap input { color: #090909; }
body.neo-app-active .amount-chips button { border: 2px solid #090909; border-radius: 0; background: #fff; color: #090909; }
body.neo-app-active .amount-chips button:hover,
body.neo-app-active .amount-chips button.active { border-color: #090909; background: #ffde17; color: #090909; }
body.neo-app-active .deposit-note { color: #4b5563; }

body.neo-app-active .crypto-wait { border: 2px solid #090909; border-radius: 0; background: #fff8e1; color: #090909; }
body.neo-app-active .crypto-wait.success { background: #e9fbef; }
body.neo-app-active .crypto-wait small { color: #4b5563; }

body.neo-app-active .bank-account-card { border: 2px solid #090909; border-radius: 0; background: #fff; }
body.neo-app-active .bank-account-card .bank-info small { color: #4b5563; }
body.neo-app-active .bank-account-card .bank-iban { color: #090909; }

/* Tutar alt limit canli uyarisi */
.deposit-amount-warning {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  padding: 10px 13px;
  border: 1px solid rgba(239, 68, 68, .4);
  border-radius: var(--radius-sm);
  background: rgba(239, 68, 68, .1);
  color: #f87171;
  font-size: .83rem;
}
.deposit-amount-warning i { flex: none; }
body.neo-app-active .deposit-amount-warning {
  border: 2px solid #090909;
  border-radius: 0;
  background: #ffe4e4;
  color: #b91c1c;
}

/* --- Kripto coin secici --- */
.coin-chips { display: flex; flex-wrap: wrap; gap: 9px; }
.coin-chip {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 118px;
  padding: 10px 13px;
  border: 2px solid var(--border-glass);
  border-radius: var(--radius-md);
  background: var(--bg-glass);
  color: var(--text-muted);
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease;
}
.coin-chip:hover { border-color: rgba(139, 92, 246, .4); }
.coin-chip strong { color: var(--text-main); font-size: .9rem; }
.coin-chip small { font-size: .68rem; }
.coin-chip em {
  position: absolute;
  top: -9px;
  right: 8px;
  padding: 2px 7px;
  border-radius: 9px;
  background: var(--success);
  color: #04110b;
  font-size: .58rem;
  font-style: normal;
  font-weight: 800;
  letter-spacing: .04em;
}
.coin-chip.active { border-color: var(--primary); background: rgba(139, 92, 246, .14); box-shadow: 0 0 0 3px rgba(139, 92, 246, .16); }

/* --- Site ici kripto odeme paneli --- */
.crypto-pay-panel {
  margin-top: 18px;
  padding: 18px;
  border: 1px solid rgba(245, 158, 11, .35);
  border-radius: var(--radius-md);
  background: rgba(245, 158, 11, .06);
}
.crypto-pay-head { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 16px; font-size: .95rem; }
.crypto-pay-head i { flex: none; margin-top: 3px; font-size: 1.4rem; color: var(--warning); }
.crypto-pay-head small { color: var(--text-muted); }
.crypto-pay-grid { display: grid; grid-template-columns: 240px 1fr; gap: 18px; align-items: start; }
.crypto-qr { width: 240px; max-width: 100%; border-radius: 10px; border: 6px solid #fff; background: #fff; }
.crypto-pay-fields label { display: block; margin: 2px 0 6px; font-size: .72rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--text-dim); }
.crypto-net { margin-left: 6px; padding: 2px 8px; border-radius: 10px; background: rgba(6, 182, 212, .15); color: var(--accent-cyan); font-size: .66rem; }
.crypto-copy-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  padding: 10px 12px;
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-sm);
  background: rgba(7, 10, 18, .5);
}
.crypto-copy-row b { font-size: 1.05rem; }
.crypto-copy-row.crypto-addr span {
  flex: 1;
  font-family: 'IBM Plex Mono', monospace;
  font-size: .8rem;
  word-break: break-all;
}
.crypto-copy-row button { flex: none; margin-left: auto; }
.crypto-status-line { display: flex; align-items: center; gap: 9px; margin: 4px 0 10px; font-size: .85rem; color: var(--warning); }
.crypto-warn-note { display: block; font-size: .74rem; color: var(--text-dim); line-height: 1.45; }

@media (max-width: 640px) {
  .crypto-pay-grid { grid-template-columns: 1fr; }
  .crypto-qr { margin-inline: auto; }
}

/* --- Neo (acik) tema uyumu --- */
body.neo-app-active .coin-chip { border: 2px solid #090909; border-radius: 0; background: #fff; color: #4b5563; box-shadow: 3px 3px 0 #090909; }
body.neo-app-active .coin-chip:hover { transform: translate(1px, 1px); box-shadow: 2px 2px 0 #090909; }
body.neo-app-active .coin-chip strong { color: #090909; }
body.neo-app-active .coin-chip.active { background: #ffde17; box-shadow: 3px 3px 0 #090909; }
body.neo-app-active .coin-chip em { border: 2px solid #090909; border-radius: 0; background: #35d65b; color: #090909; }

body.neo-app-active .crypto-pay-panel { border: 2px solid #090909; border-radius: 0; background: #fff8e1; }
body.neo-app-active .crypto-pay-head { color: #090909; }
body.neo-app-active .crypto-pay-head small { color: #4b5563; }
body.neo-app-active .crypto-pay-fields label { color: #4b5563; }
body.neo-app-active .crypto-net { border: 1px solid #090909; border-radius: 0; background: #d6f1ff; color: #090909; }
body.neo-app-active .crypto-copy-row { border: 2px solid #090909; border-radius: 0; background: #fff; color: #090909; }
body.neo-app-active .crypto-status-line { color: #92400e; }
body.neo-app-active .crypto-warn-note { color: #4b5563; }
body.neo-app-active .crypto-qr { border-color: #090909; border-width: 3px; border-style: solid; border-radius: 0; }

/* --- Yasal sayfalar --- */
.legal-page h1 { font-size: 1.7rem; margin-bottom: 20px; }
.legal-page .legal-updated { margin-bottom: 18px; font-size: .78rem; color: var(--text-dim); }
.legal-page h3 { margin: 20px 0 8px; font-size: 1.02rem; color: var(--text-main); }
.legal-page h3:first-of-type { margin-top: 0; }
.legal-page p { margin-bottom: 10px; font-size: .92rem; line-height: 1.65; color: var(--text-muted); }
.legal-page a { text-decoration: underline; }
body.neo-app-active .legal-page h3 { color: #090909; }
body.neo-app-active .legal-page p { color: #374151; }

/* --- Dil bloklari: yasal sayfalar gibi uzun icerikler icin --- */
.lang-en { display: none; }
body.locale-en .lang-en { display: block; }
body.locale-en .lang-tr { display: none; }

/* --- "Açılışa Özel" popup şablonu --- */
.promo-box.tpl-opening {
  background:
    radial-gradient(circle at 12% 18%, rgba(255, 222, 23, .28) 0 6px, transparent 7px),
    radial-gradient(circle at 88% 26%, rgba(237, 45, 45, .3) 0 5px, transparent 6px),
    radial-gradient(circle at 22% 82%, rgba(33, 169, 246, .3) 0 5px, transparent 6px),
    radial-gradient(circle at 78% 76%, rgba(53, 214, 91, .28) 0 6px, transparent 7px),
    radial-gradient(circle at 55% 12%, rgba(255, 255, 255, .18) 0 4px, transparent 5px),
    linear-gradient(155deg, #1a1040, #3b1367 55%, #6d1a4e);
  color: #fff;
  border: 1px solid rgba(255, 222, 23, .5);
  box-shadow: 0 20px 70px rgba(109, 26, 78, .55);
  overflow: hidden;
}
.promo-box.tpl-opening .promo-badge {
  background: linear-gradient(90deg, #ffde17, #ffb020);
  color: #090909;
  box-shadow: 0 6px 22px rgba(255, 222, 23, .45);
}
.promo-box.tpl-opening .promo-cta { background: linear-gradient(90deg, #ffde17, #ffb020); color: #090909; }
.promo-ribbon {
  margin: -8px auto 16px;
  padding: 7px 18px;
  display: inline-block;
  border-radius: 20px;
  background: rgba(255, 222, 23, .16);
  border: 1px dashed rgba(255, 222, 23, .65);
  color: #ffde17;
  font-family: 'IBM Plex Mono', monospace;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .12em;
  animation: ribbonGlow 1.6s ease-in-out infinite alternate;
}
@keyframes ribbonGlow {
  from { box-shadow: 0 0 6px rgba(255, 222, 23, .25); }
  to { box-shadow: 0 0 22px rgba(255, 222, 23, .6); }
}

/* Admin şablon seçici önizlemesi */
.tpl-preview.tpl-opening { background: linear-gradient(155deg, #1a1040, #6d1a4e); color: #ffde17; }

/* --- Duyuru bandı "Açılışa Özel" kutlama modu --- */
#announcement-bar.announcement-launch {
  position: relative;
  background: linear-gradient(90deg, #ffde17, #ff9b3d, #ed2d2d, #ff9b3d, #ffde17);
  background-size: 220% 100%;
  animation: launchSlide 5s linear infinite;
  font-size: .84rem;
}
#announcement-bar.announcement-launch::before,
#announcement-bar.announcement-launch::after {
  content: '🎉';
  font-size: 1rem;
  animation: launchBounce 1.1s ease-in-out infinite alternate;
}
@keyframes launchSlide {
  from { background-position: 0% 0; }
  to { background-position: 220% 0; }
}
@keyframes launchBounce {
  from { transform: translateY(0) rotate(-8deg); }
  to { transform: translateY(-3px) rotate(8deg); }
}
@media (prefers-reduced-motion: reduce) {
  #announcement-bar.announcement-launch,
  #announcement-bar.announcement-launch::before,
  #announcement-bar.announcement-launch::after,
  .promo-ribbon { animation: none; }
}