/* ════════════════════════════════════════════════════════════════════════
   AYARLAR
   ════════════════════════════════════════════════════════════════════════ */
.ayarlar-layout { max-width: 640px; margin: 0 auto; padding: 88px 18px 60px; }
.ayarlar-baslik { display: flex; align-items: center; gap: 9px; font-family: 'Orbitron', monospace;
    color: #eaf0ff; font-size: 1.3rem; margin-bottom: 22px; }

.ayar-grup { background: linear-gradient(180deg, rgba(16,24,46,.9), rgba(9,14,28,.95));
    border: 1px solid #223457; border-radius: 14px; padding: 6px 16px 16px; margin-bottom: 16px; }
.ayar-grup-baslik { font-family: 'Orbitron', monospace; font-size: .64rem; letter-spacing: 2px; color: #6c79a8;
    text-transform: uppercase; padding: 14px 0 10px; border-bottom: 1px solid #1a2747; margin-bottom: 6px; }

.ayar-satir { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 0; cursor: pointer; }
.ayar-bilgi { display: flex; flex-direction: column; gap: 2px; }
.ayar-ad { color: #eef; font-weight: 700; font-size: .95rem; }
.ayar-aciklama { color: #8794ba; font-size: .76rem; }

/* Switch */
.ayar-switch { position: relative; width: 46px; height: 26px; flex: 0 0 46px; }
.ayar-switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.ayar-kaydir { position: absolute; inset: 0; background: #1a2440; border: 1px solid #1e3a4a; border-radius: 999px; transition: .2s; }
.ayar-kaydir::before { content: ''; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%;
    background: #8794ba; transition: .2s; }
.ayar-switch input:checked + .ayar-kaydir { background: linear-gradient(135deg, #4ce0a0, #2f9e6a); border-color: #4ce0a0; }
.ayar-switch input:checked + .ayar-kaydir::before { transform: translateX(20px); background: #04140c; }

.ayar-test { margin-top: 6px; background: #1a2545; border: 1px solid #1e3a4a; color: #cdd6f5; border-radius: 9px;
    padding: 9px 16px; cursor: pointer; font-family: inherit; font-weight: 700; font-size: .82rem; }
.ayar-test:hover { background: #243156; }
.ayar-not { color: #9fd7b8; font-size: .8rem; margin-top: 10px; min-height: 1em; }

@media (max-width: 640px) { body.ayarlar-page { overflow: auto; } }