/**
 * CtrlShift — Liquid Glass Scrollbar Tasarım Sistemi
 * (assets/css/custom-scrollbar.css)
 *
 * - Yalnızca ziyaretçi ön yüzünde (front-end) çalışır; wp-admin arayüzünü etkilemez.
 * - Tarayıcının doğal (native) kaydırma mekanizmasını kullanır; sahte DOM katmanı veya JS döngüsü içermez.
 * - Chromium (Chrome, Edge, Brave, Opera) ve masaüstü WebKit için ::-webkit-scrollbar ile
 *   yarı saydam koyu cam (Liquid Glass) oluk ve mavi / buz mavisi / hafif mor geçişli,
 *   ince cam kenarlı, ışık yansımalı tutamaç uygular.
 * - Firefox için @supports (-moz-appearance: none) kapsamında scrollbar-width ve scrollbar-color
 *   desteği sağlar (böylece Chromium 121+ sürümlerinde ::-webkit-scrollbar граdiyanlarını ezmez).
 * - Mobil/dokunmatik cihazlarda ince boyut ve işletim sisteminin doğal kaydırma davranışını korur.
 * - prefers-reduced-motion: reduce erişilebilirlik tercihine saygı gösterir.
 *
 * @package CtrlShift
 * @since 1.2.0
 */

/* ==========================================================================
   1. LIQUID GLASS SCROLLBAR CSS DEĞİŞKENLERİ
   ========================================================================== */
:root {
  /* Boyutlandırma */
  --nt-sb-size: 11px;
  --nt-sb-size-compact: 6px;
  --nt-sb-radius: 9999px;

  /* Yarı saydam koyu cam (Liquid Glass) arka plan oluğu */
  --nt-sb-track-bg: linear-gradient(
    180deg,
    rgba(15, 23, 42, 0.84) 0%,
    rgba(30, 41, 59, 0.78) 50%,
    rgba(15, 23, 42, 0.86) 100%
  );
  --nt-sb-track-border: rgba(148, 163, 184, 0.16);
  --nt-sb-track-inset: inset 0 0 6px rgba(2, 6, 23, 0.45);

  /* Normal durum: Mavi (#2563EB), Buz Mavisi (#38BDF8) ve Hafif Mor (#818CF8) geçişli cam tutamaç */
  --nt-sb-thumb-bg: linear-gradient(
    180deg,
    rgba(56, 189, 248, 0.86) 0%,
    rgba(37, 99, 235, 0.84) 50%,
    rgba(129, 140, 248, 0.86) 100%
  );
  --nt-sb-thumb-border: rgba(15, 23, 42, 0.45);
  --nt-sb-thumb-reflection:
    inset 0 1px 1px rgba(255, 255, 255, 0.38),
    inset 0 -1px 1px rgba(15, 23, 42, 0.35),
    inset 0 0 0 1px rgba(186, 230, 253, 0.32);

  /* Hover durumu: Fareyle üzerine gelindiğinde artan parlaklık ve cam yansıması */
  --nt-sb-thumb-hover-bg: linear-gradient(
    180deg,
    rgba(125, 211, 252, 0.96) 0%,
    rgba(59, 130, 246, 0.94) 50%,
    rgba(165, 180, 252, 0.96) 100%
  );
  --nt-sb-thumb-hover-reflection:
    inset 0 1px 2px rgba(255, 255, 255, 0.55),
    inset 0 -1px 1px rgba(15, 23, 42, 0.28),
    inset 0 0 0 1px rgba(224, 242, 254, 0.52);

  /* Active durumu: Basılı tutulduğunda / sürüklendiğinde daha belirgin ve doygun tutamaç */
  --nt-sb-thumb-active-bg: linear-gradient(
    180deg,
    rgba(56, 189, 248, 1) 0%,
    rgba(29, 78, 216, 0.98) 50%,
    rgba(99, 102, 241, 1) 100%
  );
  --nt-sb-thumb-active-reflection:
    inset 0 1px 2px rgba(255, 255, 255, 0.65),
    inset 0 0 0 1px rgba(240, 249, 255, 0.72);

  /* Firefox fallback renkleri */
  --nt-sb-ff-thumb: #38BDF8;
  --nt-sb-ff-track: #0F172A;
}

[data-theme="dark"] {
  --nt-sb-track-bg: linear-gradient(
    180deg,
    rgba(9, 13, 22, 0.92) 0%,
    rgba(15, 23, 42, 0.88) 50%,
    rgba(9, 13, 22, 0.94) 100%
  );
  --nt-sb-track-border: rgba(148, 163, 184, 0.12);
  --nt-sb-thumb-border: rgba(9, 13, 22, 0.55);
  --nt-sb-ff-thumb: #60A5FA;
  --nt-sb-ff-track: #090D16;
}

/* ==========================================================================
   2. FIREFOX UYUMLULUĞU (Standart scrollbar-width & scrollbar-color)
   Not: Chromium 121+ tarayıcılarda scrollbar-color tanımlandığında ::-webkit-scrollbar
   devre dışı kaldığı için Firefox'a özel @supports (-moz-appearance: none) kullanılır.
   ========================================================================== */
@supports (-moz-appearance: none) {
  html,
  body:not(.wp-admin),
  body:not(.wp-admin) .nt-offcanvas-drawer,
  body:not(.wp-admin) .nt-category-bar-inner,
  body:not(.wp-admin) .nt-entry-content pre,
  body:not(.wp-admin) .nt-entry-content .wp-block-table {
    scrollbar-width: thin;
    scrollbar-color: var(--nt-sb-ff-thumb) var(--nt-sb-ff-track);
  }
}

/* ==========================================================================
   3. CHROMIUM & WEBKİT LIQUID GLASS SCROLLBAR (ANA SAYFA VE TÜM ŞABLONLAR)
   ========================================================================== */
html::-webkit-scrollbar,
body:not(.wp-admin)::-webkit-scrollbar {
  width: var(--nt-sb-size);
  height: var(--nt-sb-size);
}

html::-webkit-scrollbar-track,
body:not(.wp-admin)::-webkit-scrollbar-track {
  background: var(--nt-sb-track-bg);
  border-left: 1px solid var(--nt-sb-track-border);
  box-shadow: var(--nt-sb-track-inset);
}

html::-webkit-scrollbar-thumb,
body:not(.wp-admin)::-webkit-scrollbar-thumb {
  background: var(--nt-sb-thumb-bg);
  border-radius: var(--nt-sb-radius);
  border: 2px solid var(--nt-sb-thumb-border);
  background-clip: padding-box;
  box-shadow: var(--nt-sb-thumb-reflection);
  min-height: 44px;
  transition: background 0.2s ease, box-shadow 0.2s ease;
}

html::-webkit-scrollbar-thumb:hover,
body:not(.wp-admin)::-webkit-scrollbar-thumb:hover {
  background: var(--nt-sb-thumb-hover-bg);
  border: 2px solid var(--nt-sb-thumb-border);
  background-clip: padding-box;
  box-shadow: var(--nt-sb-thumb-hover-reflection);
}

html::-webkit-scrollbar-thumb:active,
body:not(.wp-admin)::-webkit-scrollbar-thumb:active {
  background: var(--nt-sb-thumb-active-bg);
  border: 1.5px solid var(--nt-sb-thumb-border);
  background-clip: padding-box;
  box-shadow: var(--nt-sb-thumb-active-reflection);
}

html::-webkit-scrollbar-corner,
body:not(.wp-admin)::-webkit-scrollbar-corner {
  background: rgba(15, 23, 42, 0.9);
}

/* ==========================================================================
   4. TEMA İÇİ ALT KAYDIRMA ALANLARI (Off-Canvas Menü, Kod Blokları, Tablolar)
   ========================================================================== */
body:not(.wp-admin) .nt-offcanvas-drawer::-webkit-scrollbar,
body:not(.wp-admin) .nt-entry-content pre::-webkit-scrollbar,
body:not(.wp-admin) .nt-entry-content .wp-block-table::-webkit-scrollbar,
body:not(.wp-admin) .nt-table-scroll::-webkit-scrollbar {
  width: var(--nt-sb-size-compact);
  height: var(--nt-sb-size-compact);
}

body:not(.wp-admin) .nt-offcanvas-drawer::-webkit-scrollbar-track,
body:not(.wp-admin) .nt-entry-content pre::-webkit-scrollbar-track,
body:not(.wp-admin) .nt-entry-content .wp-block-table::-webkit-scrollbar-track,
body:not(.wp-admin) .nt-table-scroll::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.65);
  border-radius: var(--nt-sb-radius);
}

body:not(.wp-admin) .nt-offcanvas-drawer::-webkit-scrollbar-thumb,
body:not(.wp-admin) .nt-entry-content pre::-webkit-scrollbar-thumb,
body:not(.wp-admin) .nt-entry-content .wp-block-table::-webkit-scrollbar-thumb,
body:not(.wp-admin) .nt-table-scroll::-webkit-scrollbar-thumb {
  background: var(--nt-sb-thumb-bg);
  border-radius: var(--nt-sb-radius);
  box-shadow: var(--nt-sb-thumb-reflection);
}

body:not(.wp-admin) .nt-offcanvas-drawer::-webkit-scrollbar-thumb:hover,
body:not(.wp-admin) .nt-entry-content pre::-webkit-scrollbar-thumb:hover,
body:not(.wp-admin) .nt-entry-content .wp-block-table::-webkit-scrollbar-thumb:hover,
body:not(.wp-admin) .nt-table-scroll::-webkit-scrollbar-thumb:hover {
  background: var(--nt-sb-thumb-hover-bg);
  box-shadow: var(--nt-sb-thumb-hover-reflection);
}

body:not(.wp-admin) .nt-offcanvas-drawer::-webkit-scrollbar-thumb:active,
body:not(.wp-admin) .nt-entry-content pre::-webkit-scrollbar-thumb:active,
body:not(.wp-admin) .nt-entry-content .wp-block-table::-webkit-scrollbar-thumb:active,
body:not(.wp-admin) .nt-table-scroll::-webkit-scrollbar-thumb:active {
  background: var(--nt-sb-thumb-active-bg);
  box-shadow: var(--nt-sb-thumb-active-reflection);
}

/* ==========================================================================
   5. MOBİL & TABLET UYUMLULUĞU (Daha İnce Tasarım, Yatay Taşma Önleme)
   ========================================================================== */
@media (max-width: 768px) {
  :root {
    --nt-sb-size: 6px;
    --nt-sb-size-compact: 4px;
  }

  html::-webkit-scrollbar-thumb,
  body:not(.wp-admin)::-webkit-scrollbar-thumb {
    border-width: 1px;
  }
}

/* ==========================================================================
   6. ERİŞİLEBİLİRLİK: HAREKET AZALTMA TERCİHİ (prefers-reduced-motion: reduce)
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto !important;
  }

  html::-webkit-scrollbar-thumb,
  body:not(.wp-admin)::-webkit-scrollbar-thumb,
  body:not(.wp-admin) .nt-offcanvas-drawer::-webkit-scrollbar-thumb,
  body:not(.wp-admin) .nt-entry-content pre::-webkit-scrollbar-thumb {
    transition: none !important;
  }
}
