/* ═══════════════════════════════════════════════════════════════════════════
 * NF — İL SEÇİCİ (yazarken açılan liste)
 * `NF.ilSecici.bagla(input)` bu yapıyı kurar. ⛔ SABİT RENK YOK — token.
 * ⚠ Açılan liste zemini `var(--surface-3)` (popover token'ı): karanlık modda
 *   koyu, açıkta beyaz. Zemini `#fff` sabitleyip yazıyı token'a bırakmak
 *   karanlık modda beyaz-üstüne-beyaz üretirdi (12 Ağu dersi).
 * ═══════════════════════════════════════════════════════════════════════════ */

.nfil-wrap { position: relative; }

.nfil-list {
    display: none;
    position: absolute; top: calc(100% + 4px); left: 0; right: 0;
    z-index: 60; max-height: 246px; overflow-y: auto;
    background: var(--surface-3, var(--surface));
    border: 1.5px solid var(--border-strong);
    border-radius: 10px;
    box-shadow: 0 10px 28px var(--shadow-lg, rgba(10, 17, 40, 0.15));
    padding: 4px;
}
.nfil-list.open { display: block; }

.nfil-opt {
    padding: 9px 11px; border-radius: 7px; cursor: pointer;
    font-size: 0.87rem; color: var(--ink-900); line-height: 1.2;
}
.nfil-opt:hover, .nfil-opt.on { background: var(--surface-2, var(--ink-100)); }

@media (max-width: 640px) {
    .nfil-opt { padding: 12px 12px; font-size: 0.95rem; }   /* dokunma hedefi */
}