/* KS Sıralama kısa kodu `[ks_sort]` + KS Ürün Sayısı etiketi `.ks-count` (v2.441.0, 15 Eyl 2026).
 * Yerleşim Elementor'da operatörün (kısa kod widget'ı / metin widget'ı); burada yalnız kutu.
 * Kapalı kutu = ÜRÜN FORMUNDAKİ dropdown'ların aynısı (ölçüldü: 0.9em/500, satır 1.68 → ~42px,
 * 1px #ccc, pill, 8/34/8/16, #212121). Ok işareti TEMANIN `select` kuralındaki SVG arka plan:
 * burada `background` KISAYOLU YAZILMAZ (görseli siler), yalnız background-color. Açılan liste
 * adet-dropdown.js'in `.ks-vm-adet-panel`i — `.ks-sort__wrap` host olur (position:relative),
 * panel `left:0;right:0` ile kutuyla aynı genişlikte açılır. Genişlik 240px (üründe 200;
 * "Fiyat: Düşükten Yükseğe" tek satır sığsın) — kısa kodda `width="…"` ile değişir. */
.ks-count[hidden] { display: none; }
.ks-sort { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; }
.ks-sort__label { cursor: pointer; margin: 0; }
.ks-sort__wrap { position: relative; display: inline-flex; align-items: center; width: 240px; max-width: 100%; }
.ks-sort__select { appearance: none; -webkit-appearance: none; width: 100%; max-width: 100%; font: inherit; font-size: 0.9em; font-weight: 500; line-height: 1.68; color: #212121; border: 1px solid #ccc; border-radius: 100px; background-color: #fff; padding: 8px 34px 8px 16px; cursor: pointer; min-height: 0; height: auto; margin: 0; box-shadow: none; }
.ks-sort__select:focus { outline: none; border-color: #bbb; }
/* Açılan panel ürün formundakiyle aynı ağırlıkta; seçenekler tek satır. */
.ks-sort .ks-vm-adet-panel { font-weight: 500; }
.ks-sort .ks-vm-adet-option { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* v2.447.0 (17 Eyl 2026) — TABLET/MOBİL SIRALAMA ÇEKMECESİ (ks-sort.js sdrawerOpen): `.reorder-draw` düğmesi
 * alttan, İÇERİĞİ KADAR yüksek bir panel açar (tam ekran değil; en fazla %80, gerekirse kayar). Seçenekler gizli
 * `[ks_sort]` select'inden; geçerli olan radyo işaretli (global secondary). */
.ks-sdrawer { position: fixed; inset: 0; z-index: 100000; }
.ks-sdrawer[hidden] { display: none; }
.ks-sdrawer__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.45); opacity: 0; transition: opacity .25s ease; touch-action: none; }
.ks-sdrawer__panel { position: absolute; left: 0; right: 0; bottom: 0; max-height: 80vh; display: flex; flex-direction: column; background: #fff; border-radius: 16px 16px 0 0; box-shadow: 0 -8px 24px rgba(0,0,0,.12); padding-bottom: env(safe-area-inset-bottom, 0px); transform: translateY(100%); transition: transform .3s ease; }
.ks-sdrawer.is-open .ks-sdrawer__backdrop { opacity: 1; }
.ks-sdrawer.is-open .ks-sdrawer__panel { transform: none; }
.ks-sdrawer__head { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid #e5e5e5; }
.ks-sdrawer__title { font-weight: 600; font-size: 1.05em; }
.ks-sdrawer__close { position: relative; width: 32px; height: 32px; padding: 0; margin: 0; border: 0; border-radius: 50%; background: #f2f2f2; cursor: pointer; }
.ks-sdrawer__close::before, .ks-sdrawer__close::after { content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 1.5px; background: #212121; transform: translate(-50%,-50%) rotate(45deg); }
.ks-sdrawer__close::after { transform: translate(-50%,-50%) rotate(-45deg); }
.ks-sdrawer__list { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 8px 0 12px; }
.ks-sdrawer__opt { display: flex; align-items: center; gap: 12px; width: 100%; margin: 0; padding: 13px 16px; border: 0; background: none; font: inherit; color: #212121; text-align: left; cursor: pointer; }
.ks-sdrawer__opt:hover { background: #f7f7f7; }
.ks-sdrawer__radio { flex: 0 0 auto; width: 18px; height: 18px; box-sizing: border-box; border: 1.5px solid #c9c9c9; border-radius: 50%; position: relative; }
.ks-sdrawer__opt.is-active { font-weight: 600; }
.ks-sdrawer__opt.is-active .ks-sdrawer__radio { border-color: var(--e-global-color-secondary, #F27A1A); }
.ks-sdrawer__opt.is-active .ks-sdrawer__radio::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: var(--e-global-color-secondary, #F27A1A); }
.ks-sdrawer__text { flex: 1 1 auto; min-width: 0; }
body.ks-sdrawer-lock { overflow: hidden; }
/* 17 Eyl: `.reorder-draw` düğme etiketi dar ekranda ikinci satıra DÜŞMEZ, "…" ile kırpılır (operatör).
 * Elementor düğmesi: a > .elementor-button-content-wrapper (flex) > icon + text; sarmalayıcı min-width:0
 * olmadan flex çocuğu kırpılmaz. Widget/bağlantı genişliği panelden (buradan dayatılmaz). */
.reorder-draw .elementor-button { max-width: 100%; }
.reorder-draw .elementor-button-content-wrapper { min-width: 0; max-width: 100%; flex-wrap: nowrap; }
.reorder-draw .elementor-button-icon { flex: 0 0 auto; }
.reorder-draw .elementor-button-text { flex: 0 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: .25em 0; margin: -.25em 0; } /* padding/margin çifti: overflow:hidden harf kuyruklarını (y, ş) kırpmasın, yükseklik değişmez */