/* ---------- Neumorphism teması — özel görsel ayarları ----------
   Bu dosya body.theme-neumorphism class'ı aktifken devreye girer.
   Border'lar görünmezleştirilir, derinlik tamamen ışık+gölge kombinasyonuyla
   sağlanır. Aktif state'ler "basılmış" (inset), pasifler "şişkin" (outset). */

body.theme-neumorphism {
  --neu-out: 6px 6px 14px #c8cad1, -6px -6px 14px #ffffff;
  --neu-out-sm: 3px 3px 6px #c8cad1, -3px -3px 6px #ffffff;
  --neu-out-xs: 2px 2px 4px #c8cad1, -2px -2px 4px #ffffff;
  --neu-in: inset 5px 5px 10px #c8cad1, inset -5px -5px 10px #ffffff;
  --neu-in-sm: inset 3px 3px 6px #c8cad1, inset -3px -3px 6px #ffffff;
  --neu-in-xs: inset 1.5px 1.5px 3px #c8cad1, inset -1.5px -1.5px 3px #ffffff;
}

/* ====== Genel: tüm kart border'ları görünmez ====== */
body.theme-neumorphism .desktop-section,
body.theme-neumorphism .desktop-main,
body.theme-neumorphism .grid-wrap,
body.theme-neumorphism .instructions,
body.theme-neumorphism .home-card,
body.theme-neumorphism .puzzle-tile,
body.theme-neumorphism .home-card-preview,
body.theme-neumorphism .desktop-puzzle-item-mini {
  border-color: transparent;
}

/* Çift shadow yerine sadece neumorphic shadow */
body.theme-neumorphism .desktop-section,
body.theme-neumorphism .desktop-main,
body.theme-neumorphism .grid-wrap,
body.theme-neumorphism .instructions,
body.theme-neumorphism .home-card,
body.theme-neumorphism .puzzle-tile {
  box-shadow: var(--neu-out);
}

/* ====== HEADER ====== */
body.theme-neumorphism .desktop-header {
  border-bottom: none;
  background: var(--app-bg);
  box-shadow: none;
}

body.theme-neumorphism .desktop-logo-tag {
  background: var(--app-bg);
  box-shadow: var(--neu-in-xs);
}

/* Logo glyph (desktop) — siyah kare yerine accent renkli yumuşak şişkin kare */
body.theme-neumorphism .desktop-logo-glyph {
  background: var(--app-bg);
  color: var(--accent);
  box-shadow: var(--neu-out-sm);
  border-radius: 12px;
}

/* Topbar glyph (mobil) — aynı şekilde neumorphism uyumlu */
body.theme-neumorphism .topbar-glyph {
  background: var(--app-bg);
  color: var(--accent);
  box-shadow: var(--neu-out-xs);
  border-radius: 8px;
}

/* Nav: container basılmış görünür, aktif item şişkin */
body.theme-neumorphism .desktop-nav {
  border-color: transparent;
  background: var(--app-bg);
  box-shadow: var(--neu-in-sm);
}

body.theme-neumorphism .desktop-nav-item {
  color: var(--ink-2);
}

body.theme-neumorphism .desktop-nav-item:hover {
  color: var(--ink);
}

body.theme-neumorphism .desktop-nav-item.is-active {
  background: var(--app-bg);
  color: var(--ink);
  box-shadow: var(--neu-out-sm);
  font-weight: 600;
}

/* Header sağ tarafındaki butonlar */
body.theme-neumorphism .desktop-icon-btn,
body.theme-neumorphism .desktop-theme-pill {
  border-color: transparent;
  background: var(--app-bg);
  box-shadow: var(--neu-out-sm);
  transition: box-shadow .18s ease, transform .18s ease;
}

body.theme-neumorphism .desktop-icon-btn:hover {
  box-shadow: var(--neu-in-sm);
  transform: none;
}

body.theme-neumorphism .desktop-theme-pill:hover {
  background: var(--app-bg);
  box-shadow: var(--neu-in-sm);
}

/* ====== SIDEBAR — Bulmaca listesi ====== */
body.theme-neumorphism .desktop-section-count,
body.theme-neumorphism .desktop-puzzle-item-difficulty {
  background: var(--app-bg);
  box-shadow: var(--neu-in-xs);
  color: var(--ink-2);
}

body.theme-neumorphism .desktop-puzzle-item:hover {
  background: transparent;
  box-shadow: var(--neu-out-xs);
}

body.theme-neumorphism .desktop-puzzle-item.is-active {
  background: var(--app-bg);
  border-color: transparent;
  box-shadow: var(--neu-in-sm);
}

body.theme-neumorphism .desktop-puzzle-item-mini {
  background: var(--app-bg);
  box-shadow: var(--neu-in-xs);
}

/* ====== RAIL — Sağ panel ====== */
/* Legend icon'lar: küçük (18px) olduğu için inset gölgeden ziyade dolu renk + güçlü
   neumorphic kontur. App-bg'den belirgin biçimde daha koyu bir dolgu kullanıyoruz. */
body.theme-neumorphism .legend-icon {
  background: linear-gradient(145deg, #d1d3da, #c0c2c9);
  border: 1px solid #b4b6bd;
  box-shadow:
    inset 1px 1px 2px rgba(255, 255, 255, 0.6),
    inset -1px -1px 1px rgba(0, 0, 0, 0.08),
    1px 1px 2px rgba(160, 165, 180, 0.4);
  flex-shrink: 0;
}

body.theme-neumorphism .legend-any {
  background: var(--app-bg);
  border: 1.5px dashed var(--ink-2);
  box-shadow: inset 1.5px 1.5px 3px #c8cad1, inset -1px -1px 2px #ffffff;
  flex-shrink: 0;
}

body.theme-neumorphism .desktop-theme-rail-card {
  border-color: transparent;
  border-radius: 14px;
  padding: 6px;
  transition: transform .15s ease;
}

body.theme-neumorphism .desktop-theme-rail-card:hover {
  transform: translateY(-2px);
}

body.theme-neumorphism .desktop-theme-rail-preview {
  border-color: transparent;
  box-shadow: var(--neu-out-sm);
  transition: box-shadow .18s ease;
}

body.theme-neumorphism .desktop-theme-rail-card.is-active {
  border-color: transparent;
}

body.theme-neumorphism .desktop-theme-rail-card.is-active .desktop-theme-rail-preview {
  box-shadow: var(--neu-in-sm), 0 0 0 2px var(--accent);
}

body.theme-neumorphism .desktop-tip-card {
  background: var(--app-bg);
}

/* ====== MAIN — Oyun ekranı içeriği ====== */
body.theme-neumorphism .meta-row {
  border-bottom: none;
}

body.theme-neumorphism .reset-btn {
  background: var(--app-bg);
  border-color: transparent;
  box-shadow: var(--neu-out-sm);
  color: var(--ink);
  transition: box-shadow .15s ease;
}

body.theme-neumorphism .reset-btn:hover:not(:disabled) {
  box-shadow: var(--neu-in-sm);
}

body.theme-neumorphism .reset-btn:disabled {
  box-shadow: var(--neu-in-xs);
  opacity: 0.5;
}

body.theme-neumorphism .ctrl-btn {
  background: var(--app-bg);
  border-color: transparent;
  box-shadow: var(--neu-out);
  transition: box-shadow .18s ease, transform .15s ease;
}

body.theme-neumorphism .ctrl-btn:hover:not(:disabled) {
  box-shadow: var(--neu-in-sm);
  transform: none;
}

body.theme-neumorphism .ctrl-btn:active:not(:disabled) {
  box-shadow: var(--neu-in);
}

body.theme-neumorphism .ctrl-btn:disabled {
  box-shadow: var(--neu-in-xs);
  opacity: 0.5;
}

/* Topbar (mobil için icon-btn) */
body.theme-neumorphism .icon-btn:hover {
  background: var(--app-bg);
  box-shadow: var(--neu-in-xs);
}

/* Difficulty pill */
body.theme-neumorphism .difficulty {
  background: var(--app-bg);
  box-shadow: var(--neu-in-xs);
}

/* Timer */
body.theme-neumorphism .timer {
  background: var(--app-bg);
  padding: 6px 14px;
  border-radius: 999px;
  box-shadow: var(--neu-in-xs);
}

/* ====== Seed'ler — şişkin renkli düğmeler ====== */
body.theme-neumorphism .seed {
  box-shadow:
    4px 4px 10px rgba(160, 165, 180, 0.45),
    -2px -2px 6px rgba(255, 255, 255, 0.85),
    inset -1px -1px 2px rgba(0, 0, 0, 0.08),
    inset 1px 1px 2px rgba(255, 255, 255, 0.25);
}

body.theme-neumorphism .seed-floating::before {
  opacity: 0.25;
}

/* ====== Region (yerleştirilmiş bölge) — yumuşak iç gölge ====== */
body.theme-neumorphism .region {
  border-width: 2px;
  border-style: solid;
  box-shadow: inset 2px 2px 4px rgba(255, 255, 255, 0.4);
}

/* ====== HOME ====== */
body.theme-neumorphism .home-card {
  border-color: transparent;
}

body.theme-neumorphism .home-card-preview {
  background: var(--app-bg);
  border-color: transparent;
  box-shadow: var(--neu-in-sm);
}

body.theme-neumorphism .puzzle-tile {
  border-color: transparent;
}

body.theme-neumorphism .puzzle-tile:hover {
  transform: translateY(-2px);
  box-shadow: 8px 8px 16px #c8cad1, -8px -8px 16px #ffffff;
}

body.theme-neumorphism .puzzle-tile-preview {
  background: var(--app-bg);
  border-color: transparent;
  box-shadow: var(--neu-in-xs);
}

body.theme-neumorphism .puzzle-tile-difficulty {
  background: var(--app-bg);
  box-shadow: var(--neu-in-xs);
}

/* DM grid (sidebar mini) — neumorphism'de daha belirgin hücreler */
body.theme-neumorphism .dm-cell,
body.theme-neumorphism .ptm-cell {
  border-color: rgba(160, 165, 180, 0.35) !important;
}

body.theme-neumorphism .dm-grid,
body.theme-neumorphism .ptm-grid {
  background: transparent;
}

/* ====== AYARLAR PANELİ ====== */
body.theme-neumorphism .settings-sheet {
  box-shadow: var(--neu-out);
}

body.theme-neumorphism .settings-header {
  border-bottom: none;
}

body.theme-neumorphism .settings-categories {
  padding-bottom: 12px;
}

body.theme-neumorphism .settings-category-pill {
  border-color: transparent;
  background: var(--app-bg);
  box-shadow: var(--neu-out-xs);
}

body.theme-neumorphism .settings-category-pill:hover {
  background: var(--app-bg);
  box-shadow: var(--neu-in-xs);
}

body.theme-neumorphism .settings-category-pill.is-active {
  background: var(--app-bg);
  color: var(--accent);
  border-color: transparent;
  box-shadow: var(--neu-in-sm);
  font-weight: 600;
}

body.theme-neumorphism .theme-preview-card {
  border-color: transparent;
  border-radius: 18px;
}

body.theme-neumorphism .theme-preview-card:hover {
  transform: translateY(-2px);
}

body.theme-neumorphism .theme-preview-card-active {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

/* Önizleme kartı içindeki frame */
body.theme-neumorphism .theme-preview-frame {
  border-color: transparent;
  box-shadow: var(--neu-out-sm);
}

body.theme-neumorphism .theme-preview-card-active .theme-preview-frame {
  box-shadow: var(--neu-in-sm);
}

/* ====== FOOTER ====== */
body.theme-neumorphism .desktop-footer {
  border-top: none;
  box-shadow: none;
}

body.theme-neumorphism .desktop-footer kbd {
  background: var(--app-bg);
  border: none;
  box-shadow: var(--neu-out-xs);
}

/* ====== Diğer küçük dokunuşlar ====== */
body.theme-neumorphism .grid-cell {
  /* Hücre çizgileri belirgin ama yumuşak */
  border-color: rgba(160, 165, 180, 0.55) !important;
}

body.theme-neumorphism .home-section-title {
  letter-spacing: 0.08em;
  font-weight: 700;
}

/* Error toast neumorphic */
body.theme-neumorphism .error-toast {
  background: var(--app-bg);
  border-color: transparent;
  box-shadow: var(--neu-out);
}