/* ==========================================================================
   NUMONAY — Sade Kurumsal Tema (açık, minimalist)
   styles.css'den SONRA yüklenir. Yapıyı/işlevi değiştirmez, yalnızca görünümü
   sadeleştirir: tek vurgu rengi, ince çizgiler, hafif gölgeler, dengeli boşluk.
   ========================================================================== */

:root{
  --bg:      #faf5eb;
  --bg2:     #f2e9d6;
  --card:    #fffdf8;
  --card2:   #f7efe0;
  --border:  #e5dac3;
  --border2: #d4c4a8;
  --text:    #1e162b;
  --sub:     #4d4160;
  --muted:   #76688a;
  --blue:    #f97316;
  --purple:  #7c3aed;
  --grad:    linear-gradient(135deg,#f97316,#7c3aed);
  --ok:      #059669;
  --err:     #dc2626;
  --r:       10px;
  --r-lg:    14px;
  --sh:      0 1px 3px rgba(30,22,43,.06);
  --sh-md:   0 4px 14px rgba(124,58,237,.10);
  --sh-lg:   0 16px 40px rgba(30,22,43,.16);
}

html{color-scheme:light}
body{
  background:var(--bg) !important;
  background-image:none !important;
  color:var(--text);
  font-size:15px;
  -webkit-font-smoothing:antialiased;
}
::selection{background:#bfdbfe;color:#0f172a}
::-webkit-scrollbar-thumb{background:#cbd5e1}

/* ---------- Üst bilgi şeridi ---------- */
#liveStockBar{
  background:#0f172a !important;
  border-bottom:0 !important;
  color:#cbd5e1 !important;
  font-weight:500 !important;
}
#liveStockBar > span[style*="opacity"]{display:none}
#liveStockBar span[style*="10b981"]{color:#34d399 !important}
#liveStockBar span[style*="width:7px"]{box-shadow:none !important}

/* ---------- Menü ---------- */
.nav{
  background:rgba(255,255,255,.92);
  border-bottom:1px solid var(--border);
  animation:none;
}
.nav-inner{height:64px}
.logo-num{color:var(--text);font-weight:800;letter-spacing:-.6px}
.logo-onay{color:var(--blue);font-weight:800;letter-spacing:-.6px}
.logo-tag{display:none}
.nav-links a{color:var(--sub);font-weight:500;border-radius:8px}
.nav-links a:hover{background:var(--bg2);color:var(--text)}
.balance-chip{
  background:var(--bg2);color:var(--text);
  border:1px solid var(--border);border-radius:8px;font-weight:600;
}
.burger{color:var(--text)}

/* ---------- Butonlar ---------- */
.btn{border-radius:8px;font-weight:600;background:var(--bg2);color:var(--text);border:1px solid var(--border)}
.btn:hover{transform:none;background:#e8edf4}
.btn-primary{
  background:var(--blue);color:#fff;border:1px solid var(--blue);box-shadow:none;
}
.btn-primary:hover{background:#1d4ed8;border-color:#1d4ed8;box-shadow:none}
.btn-ghost{background:transparent;border:1px solid var(--border2);color:var(--text)}
.btn-ghost:hover{background:var(--bg2);border-color:var(--border2);color:var(--text)}
.btn-danger{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca}
.btn-danger:hover{background:#fee2e2}
.btn-cancel-passive{
  background:#fff7ed !important;
  color:#c2410c !important;
  border:2.5px solid #f97316 !important;
  font-weight:800 !important;
  opacity:1 !important;
  box-shadow:0 3px 10px rgba(249,115,22,.22) !important;
}
.btn-cancel-passive:hover{background:#ffedd5 !important;border-color:#ea580c !important;color:#9a3412 !important}
.btn-cancel-active{background:linear-gradient(135deg,#ef4444,#dc2626) !important;border:2px solid #b91c1c !important;box-shadow:0 4px 12px rgba(220,38,38,.3) !important;color:#fff !important;font-weight:800 !important}

/* ---------- Sol panel: servis listesi ---------- */
.side{background:var(--card);border:1px solid var(--border);box-shadow:var(--sh)}
.side-head{border-bottom:1px solid var(--border)}
.side-head h2{font-size:15px;font-weight:700}
.back{background:var(--bg2);border:1px solid var(--border2);color:var(--text);font-weight:600}
.back:hover{background:#e8edf4;border-color:var(--border2);color:var(--text)}
.search{background:var(--card);border:1px solid var(--border2);color:var(--text)}
.search::placeholder{color:#94a3b8}
.search:focus{background:var(--card);border-color:var(--blue);box-shadow:0 0 0 3px rgba(37,99,235,.12)}
.item{border-radius:8px}
.item:hover{background:var(--bg2);border-color:transparent}
.item .ic{background:var(--bg2);border:1px solid var(--border)}
.item .pr{color:var(--text)}
.item .nm small{color:var(--muted)}
.empty{color:var(--muted)}

.filter-pill{background:var(--card);border:1px solid var(--border2);color:var(--sub)}
.filter-pill:hover{color:var(--text);border-color:var(--muted)}
.filter-pill.active{background:var(--text);color:#fff;border-color:var(--text)}

.success-pill{background:#ecfdf5;color:#047857;border:1px solid #a7f3d0}
.success-pill.success-top{background:#d1fae5;color:#065f46;border:1px solid #6ee7b7;box-shadow:none}
.success-dot-mini{background:#10b981}
.stock-dot-live{box-shadow:none}
.svc-badge.pop{background:#fffbeb;color:#b45309;border:1px solid #fde68a}
.svc-badge.fast{background:#eff6ff;color:#1d4ed8;border:1px solid #bfdbfe}

.item-featured-tr{
  background:#fef2f2 !important;border:1px solid #fecaca !important;
  box-shadow:none !important;transform:none !important;
}
.item-featured-tr:hover{background:#fee2e2 !important;border-color:#fca5a5 !important;box-shadow:none !important}
.badge-featured-tr{background:#dc2626;box-shadow:none}

/* ---------- Ana içerik ---------- */
.content{gap:20px}
.hero{
  background:var(--card);border:1px solid var(--border);box-shadow:var(--sh);
  padding:40px;
}
.hero::before{display:none}
.hero-badge{
  background:var(--bg2);border:1px solid var(--border);color:var(--sub);
  font-weight:600;letter-spacing:.2px;
}
.hero-badge::before{background:var(--ok);box-shadow:none}
.hero h1{font-weight:800;letter-spacing:-1px;color:var(--text)}
.hero h1 span{color:var(--blue) !important}
.hero p{color:var(--sub)}
.hero-bullets{color:var(--text);font-weight:500}
.hero-bullets span span{color:var(--ok) !important}

.quick-svc-card{background:var(--card);border:1px solid var(--border);box-shadow:none}
.quick-svc-card:hover{
  background:var(--card2);border-color:var(--border2);transform:none;box-shadow:var(--sh-md);
}
.quick-svc-icon{background:var(--bg2);border:1px solid var(--border)}

.stats-strip{gap:12px}
.stat-box{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--sh)}
.stat-box b{color:var(--text);font-weight:800}
.stat-box span{color:var(--text)}
.stat-box small{color:var(--muted)}

.block{box-shadow:var(--sh);padding:32px}
.block-head h2{font-weight:700;letter-spacing:-.4px}
.block-head .icon{
  background:var(--bg2);border:1px solid var(--border);color:var(--blue);
}
.block-head .icon svg,.feat-item-icon svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

.step-card{background:var(--card2);border:1px solid var(--border)}
.step-card:hover{border-color:var(--border2);transform:none}
.step-badge{background:var(--text);color:#fff}
.step-card h3{color:var(--text)}
.step-card p{color:var(--sub)}

.feat-item{background:var(--card2);border:1px solid var(--border)}
.feat-item:hover{border-color:var(--border2);transform:none}
.feat-item-icon{background:var(--card);border:1px solid var(--border);color:var(--blue)}
.feat-item-body h4{color:var(--text)}
.feat-item-body p{color:var(--sub)}

details{background:var(--card);border:1px solid var(--border)}
details[open]{border-color:var(--border2);background:var(--card2)}
summary::after{color:var(--muted)}
details p{color:var(--sub)}
details p strong[style]{color:#b91c1c !important}

/* ---------- Siparişler ---------- */
.order{
  background:var(--card) !important;border:1px solid var(--border) !important;
  box-shadow:var(--sh) !important;
}
.order .top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:10px;
  font-size:12.5px;
  font-weight:700;
  color:var(--text);
}
.order .timer,
.my-order-ttl-timer{
  display:inline-flex !important;
  align-items:center;
  gap:4px;
  background:#f3e8ff !important;
  border:2px solid #7c3aed !important;
  color:#5b21b6 !important;
  font-family:'Courier New',Courier,monospace !important;
  font-size:13px !important;
  font-weight:900 !important;
  padding:4px 11px !important;
  border-radius:99px !important;
  box-shadow:0 2px 8px rgba(124,58,237,.20) !important;
  letter-spacing:.4px;
  line-height:1.2;
}
.order::before{background:var(--blue)}
.order .num{color:var(--text) !important;background:var(--bg2) !important;border:1px solid var(--border) !important;border-style:solid !important}
.order .num:hover{color:var(--blue) !important}
.code{
  color:#047857 !important;background:#ecfdf5 !important;border:1px solid #a7f3d0 !important;
}
.code:hover{background:#d1fae5 !important}
.spinner{border-color:var(--border2);border-top-color:var(--blue)}
#ordersWrap span[style*="fca5a5"]{color:#b91c1c !important;background:#fef2f2 !important;border-color:#fecaca !important}

.alt-item-card{background:var(--card);border:1px solid var(--border)}
.alt-item-card:hover{border-color:var(--border2);transform:none}
.alt-featured-card{background:#fff7ed;border:1px solid #fed7aa}
.alt-featured-btn{background:var(--blue) !important;box-shadow:none !important;border-radius:8px !important}
.alt-featured-btn:hover{background:#1d4ed8 !important;box-shadow:none !important;transform:none !important}
.alt-featured-price{color:var(--text)}
.alt-choose-btn{border:1px solid var(--blue) !important;background:#eff6ff !important;color:var(--blue) !important}
.alt-choose-btn:hover{background:var(--blue) !important;color:#fff !important;box-shadow:none !important;transform:none !important}

/* ---------- Modal ---------- */
.modal{background:rgba(15,23,42,.5);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.modal-box{
  background:var(--card);border:1px solid var(--border);box-shadow:var(--sh-lg);
}
.x{color:var(--muted)}
.x:hover{color:var(--text)}
.tabs{background:var(--bg2);border:1px solid var(--border)}
.tabs button{color:var(--muted)}
.tabs button.on{background:var(--card);color:var(--text);box-shadow:0 1px 2px rgba(15,23,42,.1)}
.err{color:#b91c1c}
.modal-logo .logo-num{color:var(--text)}
.modal-logo .logo-onay{color:var(--blue)}
#accBalance{color:var(--blue) !important}
#ticketChatClosedNotice{background:#fef2f2 !important;border-color:#fecaca !important;color:#b91c1c !important}
#topupModal span[style*="10b981"]{color:var(--ok) !important}

/* ---------- Bakiye yükleme ---------- */
.topup-switcher{background:var(--bg2);border:1px solid var(--border)}
.topup-tab-btn{color:var(--sub)}
.topup-tab-btn:hover{color:var(--text);background:rgba(15,23,42,.04)}
.topup-tab-btn.active{background:var(--card);color:var(--text);border-color:var(--border2);box-shadow:0 1px 2px rgba(15,23,42,.08)}
.topup-tab-btn.tab-fast.active{background:var(--card);color:var(--text);border-color:var(--border2);box-shadow:0 1px 2px rgba(15,23,42,.08)}
.card-preset-btn{background:var(--card);border:1px solid var(--border2);color:var(--text)}
.card-preset-btn:hover{border-color:var(--blue);background:#eff6ff;transform:none}
.card-preset-btn.active-preset{border-color:var(--blue);background:#eff6ff;box-shadow:0 0 0 2px rgba(37,99,235,.15)}
.card-preset-btn .badge-bonus{background:var(--ok);box-shadow:none}

/* ---------- Bonus, bildirim, toast, WhatsApp ---------- */
.bonus-banner{
  background:#fffbeb;border:1px solid #fde68a;color:#92400e;animation:none;
}
.bonus-banner b,.bonus-banner span{color:#b45309}
.bonus-banner:hover{border-color:#fbbf24;transform:none}
.purchase-notif{background:var(--card);border:1px solid var(--border);box-shadow:var(--sh-md)}
.pn-av,.rv-av{background:var(--blue)}
.toast{background:#0f172a;color:#fff;border:0;box-shadow:var(--sh-md)}
.wa-float{box-shadow:0 4px 14px rgba(37,211,102,.35)}
.wa-float::before{display:none}
.wa-tip{background:var(--card);color:var(--text);border:1px solid var(--border)}
.rv-card,.feed-item{background:var(--card);border:1px solid var(--border)}
.feed-time{color:#047857;background:#ecfdf5;border-color:#a7f3d0}
.stock-chip{background:#ecfdf5;border-color:#a7f3d0;color:#047857}

/* ---------- Alt bilgi ---------- */
.footer{background:var(--card);border-top:1px solid var(--border);padding:36px 0}
.footer-links a{color:var(--sub)}
.footer-links a:hover{color:var(--blue)}
.footer-trust-badges{border-color:var(--border) !important}
.footer-trust-badges > div{
  background:var(--card2) !important;border:1px solid var(--border) !important;
  color:var(--sub) !important;border-radius:8px !important;
}
.footer-trust-badges > div *{color:inherit !important}

/* ---------- Açılış ekranı (sade) ---------- */
.site-preloader{background:#fff}
.preloader-glow{display:none}
.pl-num{color:var(--text)}
.pl-onay{color:var(--blue)}
.preloader-bar{background:var(--border)}
.preloader-bar-fill{background:var(--blue)}
.preloader-text{color:var(--muted)}

/* ---------- Hareketleri azalt ---------- */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}

/* ==========================================================================
   TABLET
   ========================================================================== */
@media(max-width:1000px){
  .hero{padding:28px 22px}
  .block{padding:24px 20px}
}

/* ==========================================================================
   MOBİL
   ========================================================================== */
@media(max-width:768px){
  .nav-inner{height:56px}
  .hero{padding:22px 16px}
  .hero h1{letter-spacing:-.5px}
  .block{padding:18px 14px}

  .nav-links{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;border-top:1px solid var(--border)}
  .nav-links a{background:var(--card);border:1px solid var(--border);box-shadow:none;color:var(--text);font-weight:600}
  .nav-links a:hover,.nav-links a:active{background:var(--bg2);border-color:var(--border2)}

  .modal:not([hidden]){background:rgba(15,23,42,.5) !important}
  .modal-box{
    background:var(--card) !important;border:1px solid var(--border) !important;
    box-shadow:var(--sh-lg) !important;
  }

  body.user-logged-in .mobile-app-dock{
    background:rgba(255,255,255,.96);
    border-top:1px solid var(--border);
    box-shadow:0 -2px 12px rgba(15,23,42,.06);
  }
  .dock-tab{color:var(--muted)}
  .dock-tab.active,.dock-tab.active .dock-label{color:var(--blue)}
  .dock-topup-btn{background:var(--blue);border:3px solid #fff;box-shadow:0 4px 12px rgba(37,99,235,.35)}
  .dock-badge{box-shadow:none}

  .my-num-card{background:var(--card);border:1px solid var(--border)}
  .my-num-card.is-waiting{background:#f8fafc;border-color:#bfdbfe}
  .my-num-card.is-done{background:#f8fafc;border-color:#a7f3d0}
  .my-num-body{background:var(--card2);border:1px solid var(--border)}
  .my-num-digits{color:var(--text)}
  .my-num-copy-badge{background:#eff6ff;color:var(--blue)}
  .my-num-waiting{color:#b45309}
  .my-num-code-display{background:#ecfdf5;border:1px solid #a7f3d0}
  .code-label,.code-copy-hint{color:#047857}
  .code-val{color:#047857}
  .my-num-status[style]{filter:none}
  .order .num{background:var(--bg2) !important}
}

/* ==========================================================================
   v2 — MODERN TEKNOLOJİ GÖRÜNÜMÜ + HIZ + UYGULAMA HİSSİ
   ========================================================================== */
:root{
  --accent:  #f97316;
  --accent2: #7c3aed;
  --ink:     #1e162b;
  --r:       12px;
  --r-lg:    18px;
}
html{-webkit-text-size-adjust:100%;overscroll-behavior-y:none}
body{
  letter-spacing:-.005em;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
button,.btn,.item,.quick-svc-card,.filter-pill,.dock-tab{touch-action:manipulation;-webkit-tap-highlight-color:transparent}

/* Performans: ekran dışı bölümler görünene kadar çizilmez */
.block,.footer{content-visibility:auto;contain-intrinsic-size:auto 520px}
.nav{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(255,255,255,.97)}
.modal{backdrop-filter:none;-webkit-backdrop-filter:none}
.preloader-bar-fill{animation-duration:.3s}

/* ---------- Logo ---------- */
.logo-num{color:var(--ink)}
.logo-onay{
  background:linear-gradient(90deg,var(--accent),var(--accent2));
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.modal-logo .logo-onay,.footer .logo-onay{
  background:linear-gradient(90deg,var(--accent),var(--accent2));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.pl-onay{
  background:linear-gradient(90deg,var(--accent),var(--accent2));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}

/* ---------- Butonlar ---------- */
.btn{transition:background .15s,transform .1s,box-shadow .15s,border-color .15s}
.btn:active{transform:scale(.97)}
.btn-primary{
  background:linear-gradient(135deg,var(--accent),#0ea5e9);
  border:0;color:#fff;
  box-shadow:0 4px 14px -4px rgba(37,99,235,.5);
}
.btn-primary:hover{background:linear-gradient(135deg,#1d4ed8,#0284c7);box-shadow:0 6px 18px -4px rgba(37,99,235,.55)}

/* ---------- HERO: koyu teknoloji paneli ---------- */
.hero{
  background:
    radial-gradient(600px 280px at 88% -10%,rgba(6,182,212,.28),transparent 70%),
    radial-gradient(520px 260px at -5% 110%,rgba(37,99,235,.35),transparent 70%),
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px) 0 0/28px 28px,
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px) 0 0/28px 28px,
    var(--ink);
  border:1px solid #16213a;
  color:#e2e8f0;
  box-shadow:0 10px 30px -12px rgba(11,18,32,.45);
}
.hero-badge{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);color:#cbd5e1}
.hero-badge::before{background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.2)}
.hero h1{color:#fff;font-weight:800;letter-spacing:-1.2px}
.hero h1 span{
  background:linear-gradient(90deg,#60a5fa,#22d3ee);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  color:transparent !important;
}
.hero p{color:#94a3b8}
.hero-bullets{color:#e2e8f0}
.hero-bullets span span{color:#22d3ee !important}
.hero [style*="uppercase"]{color:#94a3b8 !important}
.hero .quick-svc-card{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);
}
.hero .quick-svc-card:hover{
  background:rgba(255,255,255,.1);border-color:rgba(96,165,250,.6);box-shadow:none;transform:translateY(-1px);
}
.hero .quick-svc-card:active{transform:scale(.98)}
.hero .quick-svc-icon{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12)}
.hero .quick-svc-title{color:#fff}
.hero .quick-svc-desc{color:#94a3b8}

/* ---------- Rakamlar ---------- */
.stat-box{transition:border-color .15s,box-shadow .15s}
.stat-box:hover{border-color:#bfdbfe;box-shadow:var(--sh-md)}
.stat-box b{
  background:linear-gradient(90deg,var(--accent),var(--accent2));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}

/* ---------- Servis listesi ---------- */
.side{border-radius:var(--r-lg)}
.item{transition:background .12s}
.item:active{background:#e8efff}
.filter-pill.active{background:linear-gradient(135deg,var(--accent),#0ea5e9);border-color:transparent;color:#fff}
.step-badge{background:linear-gradient(135deg,var(--accent),#0ea5e9)}
.block-head .icon,.feat-item-icon{background:#eff6ff;border-color:#dbeafe}

/* ==========================================================================
   MOBİL: UYGULAMA GİBİ
   ========================================================================== */
.dock-icon svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;display:block}

@media(max-width:768px){
  html,body{background:var(--bg)}
  body{font-size:14.5px;-webkit-user-select:none;user-select:none}
  input,textarea,.order .num,.code,.my-num-digits,.code-val,#userApiKeyInput,#topupIbanInput{-webkit-user-select:text;user-select:text}

  /* Üst bilgi şeridi: tek satır, kompakt */
  #liveStockBar{padding:5px 10px !important;font-size:11px !important}
  #liveStockBar > span:nth-child(n+3){display:none !important}

  /* Uygulama başlığı */
  .nav{box-shadow:0 1px 0 var(--border);padding-top:env(safe-area-inset-top,0)}
  .nav-inner{height:54px}
  .logo-num,.logo-onay{font-size:20px}
  #guestBox .btn{padding:7px 13px;font-size:12.5px;border-radius:9px}
  #topupBtn{padding:7px 11px;font-size:12px;border-radius:9px}
  .balance-chip{border-radius:9px;padding:6px 10px;font-size:12px}

  .layout{padding-top:12px;padding-bottom:24px;gap:14px}
  .side{padding:14px 12px;border-radius:16px}
  .list{max-height:56vh;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  .item{padding:10px 8px;border-radius:12px}
  .item .ic{width:38px;height:38px;border-radius:11px}
  .item .nm{font-size:14px}

  .hero{padding:22px 16px;border-radius:18px}
  .hero h1{font-size:25px;line-height:1.15}
  .hero p{font-size:13.5px}
  .quick-svc-grid{gap:8px}
  .quick-svc-card{padding:12px;border-radius:14px}
  .stats-strip{gap:8px}
  .stat-box{padding:14px;border-radius:14px}
  .stat-box b{font-size:22px}
  .block{padding:18px 14px;border-radius:16px;box-shadow:none}
  details{border-radius:12px}
  summary{padding:14px 14px;font-size:13.5px}

  /* Modal: uygulama penceresi */
  .modal:not([hidden]){background:rgba(11,18,32,.6) !important;padding:14px !important}
  .modal-box{border-radius:22px !important;box-shadow:0 24px 60px rgba(11,18,32,.35) !important}
  .modal-box::before{display:none !important}
  .search,.btn-block{min-height:46px}
  .modal .search{font-size:16px !important}   /* iOS yakınlaştırmayı engeller */

  /* Alt çubuk (yalnızca giriş yapmış kullanıcıda) */
  body.user-logged-in .mobile-app-dock{
    height:calc(64px + env(safe-area-inset-bottom,0px));
    padding:0 6px env(safe-area-inset-bottom,0px);
    background:rgba(255,255,255,.98);
    border-top:1px solid var(--border);
    box-shadow:0 -4px 18px rgba(11,18,32,.06);
  }
  body.user-logged-in{padding-bottom:calc(76px + env(safe-area-inset-bottom,0px)) !important}
  .dock-tab{gap:3px;padding:8px 0 6px;color:#94a3b8;transition:color .15s}
  .dock-tab .dock-label{font-size:10.5px;font-weight:600}
  .dock-tab.active{color:var(--accent)}
  .dock-tab.active .dock-label{color:var(--accent)}
  .dock-tab:not(.dock-tab-primary).active::before{
    content:'';position:absolute;top:0;left:30%;right:30%;height:3px;border-radius:0 0 4px 4px;
    background:linear-gradient(90deg,var(--accent),var(--accent2));
  }
  .dock-tab-primary{top:-14px}
  .dock-topup-btn{
    width:52px;height:52px;border:4px solid #fff;
    background:linear-gradient(135deg,var(--accent),#0ea5e9);
    box-shadow:0 8px 18px -4px rgba(37,99,235,.55);
  }
  .dock-topup-btn .dock-icon svg{stroke:#fff;stroke-width:2.4;width:24px;height:24px}
  .dock-tab-primary .dock-label{color:var(--accent);margin-top:0}
  .dock-badge{top:5px;right:22%;background:#ef4444}

  /* Üstte kalan yüzen öğeler alt çubuğun üzerine çıksın */
  body.user-logged-in .wa-float{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  body.user-logged-in .toast{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  body.user-logged-in .purchase-notif{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
}

/* ==========================================================================
   v3 — GİRİŞ ANİMASYONU, MİSAFİR ÇUBUĞU, DEĞERLENDİRMELER, DURUM
   ========================================================================== */

/* ---------- Giriş animasyonu: yağan telefon numaraları + SMS kodu (Hızlandırılmış & Mobil Kusursuz) ---------- */
.site-preloader{
  position:fixed !important;
  top:0 !important;left:0 !important;right:0 !important;bottom:0 !important;
  width:100% !important;height:100% !important;
  background:#0b1220 !important;
  overflow:hidden !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:16px !important;
  box-sizing:border-box !important;
  transition:opacity 0.22s ease-out, transform 0.22s ease-out !important;
}
.site-preloader.fade-out{
  opacity:0 !important;
  transform:scale(1.02) !important;
  pointer-events:none !important;
}
@media (prefers-reduced-motion:reduce){.site-preloader{display:none !important}}

.intro-rain{
  position:absolute;inset:0;width:100%;height:100%;overflow:hidden;pointer-events:none;
  -webkit-mask-image:radial-gradient(ellipse at center,transparent 12%,#000 72%);
          mask-image:radial-gradient(ellipse at center,transparent 12%,#000 72%);
}
.intro-col{
  position:absolute;top:0;display:flex;flex-direction:column;gap:10px;
  font:600 12px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  color:rgba(251,146,60,.36);white-space:nowrap;
  animation:introFall linear infinite;will-change:transform;
}
.intro-col b{font-weight:600}
.intro-col b:nth-child(5n+2){color:rgba(192,132,252,.78)}
.intro-col b:nth-child(9n+4){color:rgba(255,255,255,.65)}
@keyframes introFall{from{transform:translate3d(0,-50%,0)}to{transform:translate3d(0,0,0)}}

.intro-center{
  position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:16px;
  width:min(340px, calc(100vw - 32px));
  box-sizing:border-box;
  padding:26px 22px;border-radius:24px;
  background:rgba(15,20,36,.92);
  border:1.5px solid rgba(192,132,252,.35);
  box-shadow:0 16px 50px rgba(0,0,0,.75);
}
.site-preloader .intro-logo{
  font-size:42px;font-weight:800;letter-spacing:-1.2px;line-height:1;
  opacity:0;transform:translateY(6px) scale(.96);
  animation:introPop .2s .02s cubic-bezier(.2,.9,.3,1.15) forwards;
}
.site-preloader .pl-num{color:#fff}
.site-preloader .pl-onay{
  background:linear-gradient(90deg,#fb923c,#c084fc);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.intro-sms{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;opacity:0;animation:introFade .14s .06s forwards}
.intro-sms-label{font-size:10.5px;font-weight:700;letter-spacing:2.2px;color:#cbd5e1}
.intro-code{display:flex;justify-content:center;gap:7px;width:100%}
.intro-code i{
  font-style:normal;
  width:clamp(30px, 11vw, 37px);
  height:clamp(38px, 13vw, 46px);
  display:grid;place-items:center;border-radius:10px;
  background:rgba(255,255,255,.08);border:1px solid rgba(251,146,60,.45);color:#fff;
  font:700 clamp(19px, 5.5vw, 24px) ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  opacity:0;transform:translateY(6px) scale(.9);animation:introDigit .11s ease-out forwards;
}
.intro-code i:nth-child(1){animation-delay:.08s}
.intro-code i:nth-child(2){animation-delay:.12s}
.intro-code i:nth-child(3){animation-delay:.16s}
.intro-code i:nth-child(4){animation-delay:.20s}
.intro-code i:nth-child(5){animation-delay:.24s}
.intro-code i:nth-child(6){animation-delay:.28s}
.intro-status{position:relative;height:20px;width:100%;font-size:13px;font-weight:700;text-align:center}
.intro-wait,.intro-done{position:absolute;left:0;right:0;top:0;white-space:nowrap}
.intro-wait{color:#cbd5e1;animation:introFadeOut .12s .33s forwards}
.intro-done{color:#34d399;opacity:0;animation:introFade .14s .35s forwards}

@keyframes introPop{to{opacity:1;transform:none}}
@keyframes introFade{to{opacity:1}}
@keyframes introFadeOut{to{opacity:0}}
@keyframes introDigit{to{opacity:1;transform:none}}
@media(max-width:480px){
  .intro-center{padding:22px 16px;gap:14px}
  .site-preloader .intro-logo{font-size:36px}
  .intro-code{gap:5px}
  .intro-col{font-size:11px;gap:8px}
}

/* Sayfa içi geçiş animasyonlarını da hızlandır */
.anim{transition:opacity .22s ease,transform .22s ease !important}
.anim-child > *{transition:opacity .2s ease,transform .2s ease !important}
.anim-child.visible > *:nth-child(1){transition-delay:.02s !important}
.anim-child.visible > *:nth-child(2){transition-delay:.05s !important}
.anim-child.visible > *:nth-child(3){transition-delay:.08s !important}
.anim-child.visible > *:nth-child(4){transition-delay:.11s !important}
.anim-child.visible > *:nth-child(5){transition-delay:.14s !important}
.anim-child.visible > *:nth-child(6){transition-delay:.17s !important}

/* ---------- Canlı durum uyarı rengi ---------- */
#liveStockBar #sysStatus.sys-warn{color:#fbbf24 !important}

/* ---------- Başarı oranı çubuğu ---------- */
.rate-bar{display:block;height:3px;max-width:130px;margin-top:6px;border-radius:3px;background:var(--border);overflow:hidden}
.rate-bar i{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#10b981,#22d3ee)}
.rate-bar.mid i{background:linear-gradient(90deg,#f59e0b,#84cc16)}
.rate-bar.lo i{background:#f59e0b}

/* ---------- Müşteri değerlendirmeleri ---------- */
.block-head .reviews-summary{margin-left:auto;font-size:13px;color:var(--sub);white-space:nowrap}
.block-head .reviews-summary b{color:var(--text);font-size:15px}
.reviews-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.rv-card2{background:var(--card2);border:1px solid var(--border);border-radius:var(--r);padding:16px}
.rv-top2{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.rv-av2{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:14px;color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent2));flex-shrink:0}
.rv-name2{font-weight:700;font-size:13px;color:var(--text)}
.rv-stars2{color:#f59e0b;font-size:12px;letter-spacing:1px}
.rv-card2 p{color:var(--sub);font-size:13px;line-height:1.6;word-break:break-word}

.star-input{display:flex;justify-content:center;gap:6px}
.star-input button{border:0;background:none;font-size:34px;line-height:1;color:#cbd5e1;cursor:pointer;padding:2px 4px;transition:color .1s,transform .1s}
.star-input button.on{color:#f59e0b}
.star-input button:active{transform:scale(.88)}

/* ---------- Misafir çağrı çubuğu (yalnızca mobil, giriş yoksa) ---------- */
.guest-cta{display:none}
@media(max-width:768px){
  body.auth-ready:not(.user-logged-in) .guest-cta{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:9000;align-items:center;gap:8px;
    padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));
    background:rgba(255,255,255,.98);border-top:1px solid var(--border);
    box-shadow:0 -4px 18px rgba(11,18,32,.08);
  }
  .guest-cta-text{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
  .guest-cta-text b{font-size:14px;color:var(--text)}
  .guest-cta-text span{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .guest-cta .btn{padding:10px 14px;font-size:13px;border-radius:10px;min-height:42px}
  body.auth-ready:not(.user-logged-in){padding-bottom:calc(76px + env(safe-area-inset-bottom,0px))}
  body.auth-ready:not(.user-logged-in) .wa-float,
  body.auth-ready:not(.user-logged-in) .toast,
  body.auth-ready:not(.user-logged-in) .purchase-notif{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
}

/* ---------- Admin paneli: açık temaya uyum ---------- */
:root{--line:var(--border);--line2:var(--border2)}
.profit-val.c-green{color:#059669}
.profit-val.c-blue{color:#2563eb}
.profit-val.c-amber{color:#b45309}


/* ==========================================================================
   v3.3 — Çerez Bildirimi, Vaka Çalışmaları, Sticky CTA, Breadcrumbs
   ========================================================================== */

/* Breadcrumb / Sayfa İşaret Yolu */
.breadcrumb-trail {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--muted);
  margin-bottom: 20px;
}
.breadcrumb-trail a {
  color: var(--blue);
  text-decoration: none;
  font-weight: 500;
}
.breadcrumb-trail a:hover {
  text-decoration: underline;
}

/* Vaka Çalışmaları (Kullanım Senaryoları) */
.case-studies-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
  margin-top: 14px;
}
.case-card {
  background: var(--card2);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
}
.case-card:hover {
  transform: translateY(-2px);
  border-color: var(--blue);
  box-shadow: var(--sh-md);
}
.case-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  background: rgba(37, 99, 235, 0.08);
  border: 1px solid rgba(37, 99, 235, 0.2);
  border-radius: 6px;
  font-size: 11.5px;
  font-weight: 700;
  color: var(--blue);
  align-self: flex-start;
}
.case-card h3 {
  font-size: 15px;
  font-weight: 800;
  color: var(--text);
  margin: 0;
  line-height: 1.35;
}
.case-card p {
  font-size: 13px;
  color: var(--sub);
  line-height: 1.6;
  margin: 0;
}
.case-benefit {
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px dashed var(--border);
  font-size: 12px;
  font-weight: 700;
  color: var(--ok);
  display: flex;
  align-items: center;
  gap: 6px;
}

/* Çerez Bildirimi (KVKK & Cookie Consent Banner) */
.cookie-banner {
  position: fixed;
  bottom: 20px;
  left: 20px;
  right: 20px;
  max-width: 520px;
  margin: 0 auto;
  z-index: 9999999;
  background: rgba(255, 255, 255, 0.98);
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 16px 20px;
  box-shadow: 0 16px 36px rgba(11, 18, 32, 0.16);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  display: flex;
  flex-direction: column;
  gap: 12px;
  animation: cookieSlideUp 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes cookieSlideUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
.cookie-banner p {
  font-size: 12.5px;
  color: var(--sub);
  line-height: 1.55;
  margin: 0;
}
.cookie-banner a {
  color: var(--blue);
  text-decoration: underline;
}
.cookie-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: flex-end;
}
.cookie-btn-accept {
  padding: 8px 18px;
  background: var(--blue);
  color: #fff;
  border: none;
  border-radius: 99px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.15s;
}
.cookie-btn-accept:hover {
  filter: brightness(1.1);
  transform: scale(1.02);
}
.cookie-btn-decline {
  padding: 8px 14px;
  background: transparent;
  color: var(--muted);
  border: 1px solid var(--border);
  border-radius: 99px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.cookie-btn-decline:hover {
  color: var(--text);
  border-color: var(--border2);
}

/* Sticky Telefon / Canlı İşlem CTA Butonu */
.sticky-phone-cta {
  position: fixed;
  bottom: 84px;
  right: 20px;
  z-index: 8500;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  background: linear-gradient(135deg, #2563eb, #0ea5e9);
  color: #fff;
  border-radius: 99px;
  font-size: 13.5px;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 8px 24px rgba(37, 99, 235, 0.35);
  transition: transform 0.2s, box-shadow 0.2s;
}
.sticky-phone-cta:hover {
  transform: translateY(-2px) scale(1.03);
  box-shadow: 0 12px 28px rgba(37, 99, 235, 0.45);
}
.sticky-phone-cta svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
}
@media (max-width: 768px) {
  body.user-logged-in .sticky-phone-cta {
    bottom: calc(76px + env(safe-area-inset-bottom, 12px));
  }
  body:not(.user-logged-in) .sticky-phone-cta {
    bottom: calc(72px + env(safe-area-inset-bottom, 12px));
  }
  .cookie-banner {
    bottom: calc(76px + env(safe-area-inset-bottom, 12px));
    left: 12px;
    right: 12px;
    padding: 14px 16px;
  }
}


/* ---------- Dönen Kum Saati Animasyonu (Al Tuşunda Bekleme Göstergesi) ---------- */
@keyframes spinHourglass {
  0% { transform: rotate(0deg); }
  45% { transform: rotate(180deg); }
  55% { transform: rotate(180deg); }
  100% { transform: rotate(360deg); }
}
.spin-hourglass {
  display: inline-block;
  animation: spinHourglass 1.1s infinite ease-in-out;
  transform-origin: center center;
  font-size: 13.5px;
  line-height: 1;
}
.buying-active {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  opacity: 0.9 !important;
  cursor: wait !important;
  min-width: 80px !important;
  pointer-events: none !important;
}


/* ==========================================================================
   v3.8 — Mobil alt çubuk düzeni + SEO bilgi bloğu
   ========================================================================== */
@media (max-width: 768px) {
  /* Sticky telefon butonu alt çubuk ve WhatsApp butonuyla çakışıyordu: mobilde gizle */
  .sticky-phone-cta { display: none !important; }

  /* Misafir giriş / kayıt çubuğu: butonlar tek satırda, taşmadan */
  body.auth-ready:not(.user-logged-in) .guest-cta {
    gap: 8px;
    min-height: 62px;
  }
  .guest-cta .btn { white-space: nowrap; flex-shrink: 0; }
  .guest-cta-text { overflow: hidden; }

  /* WhatsApp butonu alt çubuğun hemen üstünde, sağ kenarda */
  body.auth-ready:not(.user-logged-in) .wa-float,
  body.user-logged-in .wa-float {
    right: 12px;
    width: 48px;
    height: 48px;
  }

  /* Çerez bildirimi: kompakt, alt çubuğu kapatmaz */
  .cookie-banner {
    padding: 10px 12px;
    gap: 8px;
    border-radius: 14px;
    bottom: calc(80px + env(safe-area-inset-bottom, 0px));
  }
  .cookie-banner p { font-size: 11px; line-height: 1.4; }
  .cookie-actions { gap: 8px; }
  .cookie-btn-accept, .cookie-btn-decline { padding: 7px 12px; font-size: 12px; }
}

/* SEO bilgi bloğu */
.seo-info h3 { font-size: 15px; font-weight: 800; margin: 14px 0 6px; color: var(--text); }
.seo-info p, .seo-info li { font-size: 13.5px; line-height: 1.7; color: var(--sub); }
.seo-info ul { padding-left: 20px; margin: 8px 0 12px; }
.seo-info a { color: var(--blue); text-decoration: underline; }

/* ==========================================================================
   v3.9 — HAFİF KREM ARKA PLAN + TURUNCU & MOR BUTONLAR + CHATBOT + GOOGLE ÇEREZ
   ========================================================================== */
html, body {
  background-color: #faf5eb !important;
  color: #1e162b;
}
.nav {
  background: rgba(250, 245, 235, 0.96) !important;
  border-bottom: 1px solid #e5dac3 !important;
}
.footer {
  background: #f4ecdc !important;
  border-top: 1px solid #e5dac3 !important;
}
.side, .block, .stat-box, .modal-box, .legal-card, .faq-box, .landing-feat-card, .landing-steps {
  background: #fffdf8 !important;
  border-color: #e5dac3 !important;
}

/* Servis ve Ülke Kutusu — Yuvarlak, Kenarlıklı ve Tatlı Görünüm */
.side {
  border-radius: 26px !important;
  border: 2px solid #dfd1b5 !important;
  padding: 18px 14px !important;
  box-shadow: 0 10px 28px rgba(124, 58, 237, 0.08) !important;
}
.side .search {
  border-radius: 16px !important;
  border: 1.5px solid #d4c4a8 !important;
  background: #faf5eb !important;
  padding: 11px 14px !important;
}
.side .search:focus {
  border-color: #7c3aed !important;
  background: #fffdf8 !important;
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.14) !important;
}
.list {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding: 4px 2px !important;
}
.item {
  border-radius: 18px !important;
  border: 1.5px solid #e4d7be !important;
  background: #faf5eb !important;
  padding: 10px 13px !important;
  box-shadow: 0 2px 6px rgba(30, 22, 43, 0.04) !important;
  transition: all 0.16s ease !important;
}
.item:hover, .item:active {
  background: #fff7ed !important;
  border-color: #f97316 !important;
  transform: translateY(-1px);
  box-shadow: 0 5px 14px rgba(249, 115, 22, 0.14) !important;
}
.item .ic {
  border-radius: 14px !important;
  background: #fffdf8 !important;
  border: 1.5px solid #e5dac3 !important;
  width: 40px !important;
  height: 40px !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04) !important;
}
.item-featured-tr {
  background: linear-gradient(135deg, #fff7ed 0%, #f3e8ff 100%) !important;
  border: 2px solid #f97316 !important;
  border-radius: 18px !important;
  box-shadow: 0 5px 16px rgba(249, 115, 22, 0.18) !important;
}

/* Turuncu ve Mor Ağırlıklı Butonlar */
.btn, button.btn, a.btn {
  background: linear-gradient(135deg, #7c3aed, #6d28d9);
  color: #ffffff !important;
  border: 1px solid #6d28d9;
  font-weight: 700;
  box-shadow: 0 3px 10px rgba(124, 58, 237, 0.22);
}
.btn:hover, button.btn:hover, a.btn:hover {
  background: linear-gradient(135deg, #6d28d9, #5b21b6);
  border-color: #5b21b6;
  color: #ffffff !important;
}
.btn-primary, button.btn-primary, a.btn-primary, .btn-landing-primary, .alt-featured-btn {
  background: linear-gradient(135deg, #f97316 0%, #ea580c 55%, #7c3aed 100%) !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 5px 16px -3px rgba(249, 115, 22, 0.45) !important;
}
.btn-primary:hover, button.btn-primary:hover, a.btn-primary:hover, .btn-landing-primary:hover, .alt-featured-btn:hover {
  background: linear-gradient(135deg, #ea580c 0%, #c2410c 50%, #6d28d9 100%) !important;
  box-shadow: 0 8px 20px -3px rgba(124, 58, 237, 0.5) !important;
}
.btn-ghost, .btn-secondary, .btn-landing-secondary, .back {
  background: linear-gradient(135deg, #7c3aed, #6d28d9) !important;
  color: #ffffff !important;
  border: 1px solid #6d28d9 !important;
}
.btn-ghost:hover, .btn-secondary:hover, .btn-landing-secondary:hover, .back:hover {
  background: linear-gradient(135deg, #f97316, #ea580c) !important;
  border-color: #ea580c !important;
  color: #ffffff !important;
}
.filter-pill {
  background: #f5ecda !important;
  border: 1px solid #d4c4a8 !important;
  color: #4d4160 !important;
  font-weight: 600;
}
.filter-pill.active, .filter-pill:hover {
  background: linear-gradient(135deg, #f97316, #7c3aed) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}
.step-badge, .dock-topup-btn {
  background: linear-gradient(135deg, #f97316, #7c3aed) !important;
  color: #ffffff !important;
}
.topup-tab-btn.active, .topup-tab-btn.tab-fast.active {
  background: linear-gradient(135deg, #f97316, #7c3aed) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}
.card-preset-btn.active-preset, .card-preset-btn:hover {
  border-color: #f97316 !important;
  background: #fff7ed !important;
  color: #ea580c !important;
}
.hero {
  background:
    radial-gradient(600px 280px at 88% -10%, rgba(249, 115, 22, 0.32), transparent 70%),
    radial-gradient(520px 260px at -5% 110%, rgba(124, 58, 237, 0.38), transparent 70%),
    #231934 !important;
  border: 1px solid #3b2a54 !important;
}
.hero h1 span {
  background: linear-gradient(90deg, #fb923c, #c084fc) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
.sticky-phone-cta {
  display: none !important; /* Sağ altta Chatbot yer aldığı için çakışmayı önler */
}

/* ---------- Google Reklam Çerez Onay Bannerı ---------- */
.cookie-banner {
  background: #fffdf8 !important;
  border: 2px solid #7c3aed !important;
  box-shadow: 0 20px 45px rgba(30, 22, 43, 0.24) !important;
}
.cookie-btn-accept {
  background: linear-gradient(135deg, #f97316, #ea580c) !important;
  color: #ffffff !important;
  padding: 9px 20px !important;
  font-weight: 800 !important;
  box-shadow: 0 4px 12px rgba(249, 115, 22, 0.35) !important;
}
.cookie-btn-decline {
  background: linear-gradient(135deg, #7c3aed, #6d28d9) !important;
  color: #ffffff !important;
  border: none !important;
  padding: 9px 16px !important;
  font-weight: 700 !important;
}

/* ---------- Sağ Alt Soru-Cevap Chatbot Widget ---------- */
.num-chatbot-fab {
  position: fixed;
  right: 18px;
  bottom: 20px;
  z-index: 9998;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 12px 18px;
  border-radius: 99px;
  border: none;
  cursor: pointer;
  background: linear-gradient(135deg, #f97316 0%, #7c3aed 100%);
  color: #ffffff;
  font-family: inherit;
  font-size: 14px;
  font-weight: 800;
  box-shadow: 0 10px 28px rgba(124, 58, 237, 0.42);
  transition: transform 0.2s, box-shadow 0.2s;
}
.num-chatbot-fab:hover {
  transform: translateY(-2px) scale(1.02);
  box-shadow: 0 14px 32px rgba(249, 115, 22, 0.5);
}
.num-chatbot-fab-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #4ade80;
  box-shadow: 0 0 0 3px rgba(74, 222, 128, 0.28);
}
.num-chatbot-panel {
  position: fixed;
  right: 18px;
  bottom: 78px;
  width: 360px;
  max-width: calc(100vw - 24px);
  height: 490px;
  max-height: calc(100vh - 120px);
  z-index: 9999;
  background: #fffdf8;
  border: 2px solid #7c3aed;
  border-radius: 20px;
  box-shadow: 0 22px 50px rgba(30, 22, 43, 0.28);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  animation: cookieSlideUp 0.25s ease-out forwards;
}
.num-chatbot-panel[hidden] {
  display: none !important;
}
.num-cb-head {
  background: linear-gradient(135deg, #f97316 0%, #7c3aed 100%);
  color: #ffffff;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.num-cb-title {
  display: flex;
  align-items: center;
  gap: 10px;
}
.num-cb-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  display: grid;
  place-items: center;
  font-size: 19px;
}
.num-cb-close {
  background: rgba(255, 255, 255, 0.2);
  border: none;
  color: #ffffff;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  font-size: 18px;
  font-weight: 800;
  cursor: pointer;
}
.num-cb-messages {
  flex: 1;
  padding: 14px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: #faf5eb;
}
.num-cb-msg {
  max-width: 86%;
  padding: 10px 13px;
  border-radius: 14px;
  font-size: 13px;
  line-height: 1.5;
  word-break: break-word;
}
.num-cb-msg.bot {
  align-self: flex-start;
  background: #fffdf8;
  border: 1px solid #e5dac3;
  color: #1e162b;
  border-bottom-left-radius: 4px;
}
.num-cb-msg.user {
  align-self: flex-end;
  background: linear-gradient(135deg, #f97316, #7c3aed);
  color: #ffffff;
  font-weight: 600;
  border-bottom-right-radius: 4px;
}
.num-cb-chips {
  display: flex;
  gap: 6px;
  padding: 8px 10px;
  background: #f5ecda;
  border-top: 1px solid #e5dac3;
  overflow-x: auto;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.num-cb-chip {
  background: #fffdf8;
  border: 1.5px solid #7c3aed;
  color: #5b21b6;
  padding: 6px 11px;
  border-radius: 99px;
  font-size: 11.5px;
  font-weight: 800;
  cursor: pointer;
  flex-shrink: 0;
  transition: all 0.15s;
}
.num-cb-chip:hover, .num-cb-chip:active {
  background: linear-gradient(135deg, #f97316, #7c3aed);
  color: #ffffff;
  border-color: transparent;
}
.num-cb-action-btn {
  display: inline-block;
  margin-top: 8px;
  padding: 6px 12px;
  border-radius: 99px;
  background: linear-gradient(135deg, #f97316, #7c3aed);
  color: #ffffff !important;
  font-size: 11.5px;
  font-weight: 800;
  text-decoration: none;
  border: none;
  cursor: pointer;
}
.num-cb-form {
  display: flex;
  gap: 8px;
  padding: 10px 12px;
  background: #fffdf8;
  border-top: 1px solid #e5dac3;
}
.num-cb-input {
  flex: 1;
  border: 1px solid #d4c4a8;
  background: #faf5eb;
  color: #1e162b;
  border-radius: 10px;
  padding: 9px 12px;
  font-size: 13px;
  outline: none;
}
.num-cb-input:focus {
  border-color: #7c3aed;
}
.num-cb-send {
  background: linear-gradient(135deg, #f97316, #ea580c);
  color: #ffffff;
  border: none;
  border-radius: 10px;
  padding: 0 15px;
  font-weight: 800;
  font-size: 13px;
  cursor: pointer;
}
@media (max-width: 768px) {
  .num-chatbot-fab {
    right: 12px;
    bottom: calc(78px + env(safe-area-inset-bottom, 0px));
    padding: 10px 14px;
    font-size: 13px;
  }
  .num-chatbot-panel {
    right: 12px;
    left: 12px;
    width: auto;
    bottom: calc(132px + env(safe-area-inset-bottom, 0px));
    height: 420px;
  }
}

/* ==========================================================================
   ANASAYFA GÖRÜNÜR İSTATİSTİK KARTI (36.502 / 66,358 / 180 — SABİT & SADE)
   ========================================================================== */
.top-stats-popup-bar {
  background: linear-gradient(135deg, #fffdf8 0%, #f7efe0 100%);
  border: 2px solid #e4d4b8;
  border-radius: 22px;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  box-shadow: 0 8px 24px rgba(124, 58, 237, 0.08), 0 2px 6px rgba(249, 115, 22, 0.06);
  position: relative;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
}
.top-stats-popup-bar::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 6px;
  background: linear-gradient(180deg, #f97316 0%, #7c3aed 100%);
}
.tsp-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  flex: 1;
}
.tsp-item {
  display: flex;
  align-items: center;
  gap: 11px;
  background: #fffdf8;
  border: 1.5px solid #e5dac3;
  border-radius: 16px;
  padding: 9px 14px;
}
.tsp-icon {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(249, 115, 22, 0.14), rgba(124, 58, 237, 0.14));
  display: grid;
  place-items: center;
  font-size: 19px;
  flex-shrink: 0;
}
.tsp-info {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
}
.tsp-num {
  font-size: 18px;
  font-weight: 900;
  background: linear-gradient(90deg, #ea580c, #7c3aed);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -0.3px;
}
.tsp-label {
  font-size: 12px;
  font-weight: 700;
  color: #4d4160;
}

@media (max-width: 768px) {
  .top-stats-popup-bar {
    padding: 10px 10px;
    border-radius: 18px;
  }
  .tsp-grid {
    gap: 7px;
  }
  .tsp-item {
    flex-direction: column;
    text-align: center;
    padding: 8px 6px;
    gap: 4px;
    border-radius: 13px;
  }
  .tsp-icon {
    width: 30px;
    height: 30px;
    font-size: 15px;
    border-radius: 9px;
  }
  .tsp-num {
    font-size: 15px;
  }
  .tsp-label {
    font-size: 10.5px;
  }
}

/* ==========================================================================
   SİPARİŞ GERİ SAYIM SAYAÇLARI (2 DK İPTAL BUTONU & 20 DK SÜRE SAYACI)
   ========================================================================== */
button.btn-cancel-passive,
.btn.btn-cancel-passive,
.btn-cancel-passive,
button.btn-cancel-passive *,
.btn-cancel-passive * {
  background: #ffedd5 !important;
  color: #9a3412 !important;
  -webkit-text-fill-color: #9a3412 !important;
  border: 2.5px solid #f97316 !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  opacity: 1 !important;
  box-shadow: 0 3px 10px rgba(249, 115, 22, 0.22) !important;
}
button.btn-cancel-passive *,
.btn-cancel-passive * {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
button.btn-cancel-passive:hover,
.btn.btn-cancel-passive:hover {
  background: #fed7aa !important;
  color: #7c2d12 !important;
  -webkit-text-fill-color: #7c2d12 !important;
  border-color: #ea580c !important;
}
button.btn-cancel-active,
.btn.btn-cancel-active,
.btn-cancel-active {
  background: linear-gradient(135deg, #ef4444, #dc2626) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 2px solid #991b1b !important;
  font-weight: 800 !important;
  box-shadow: 0 4px 12px rgba(220, 38, 38, 0.35) !important;
}
.order .timer,
.my-order-ttl-timer {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  background: #f3e8ff !important;
  border: 2px solid #7c3aed !important;
  color: #4c1d95 !important;
  -webkit-text-fill-color: #4c1d95 !important;
  font-family: 'Courier New', Courier, monospace !important;
  font-size: 13.5px !important;
  font-weight: 900 !important;
  padding: 4px 11px !important;
  border-radius: 99px !important;
  box-shadow: 0 2px 8px rgba(124, 58, 237, 0.22) !important;
}