/*
 * Site içi arama katmanı (theme/partials/arama.php + theme/assets/js/arama.js). Başlangıç: dev/arama-taslak/ara.css.
 * Renkler main.css :root değişkenlerinden: --color-primary #bd1520, --color-dark #5c5d61, --color-light #ececec.
 * Katman z-index 1030: teklif listesi paneli/toast/uçan görsel (1040-1060) ve SweetAlert üstte kalır. <dialog> kullanılmaz.
 * Kırılmalar: ≥1200 üç sütun · 768–1199 iki sütun (kampanya/içerik ortanın altında) · ≤767 tam ekran tek sütun.
 */

.ara, .ara *, .ara *::before, .ara *::after { box-sizing: border-box; }
.ara [hidden] { display: none !important; }

html.ara-kilit { overflow: hidden; }
html.ara-kilit body { padding-right: var(--ara-kaydirma, 0px); }

.ara {
    --ara-metin: #151517;
    --ara-ikincil: var(--color-dark, #5c5d61);
    --ara-cizgi: #e6e6e8;
    --ara-cizgi-koyu: #cfcfd3;
    --ara-etkin: #f3f3f4;
    --ara-kmp: #fbf1f2;
    --ara-kmp-cizgi: rgba(189, 21, 32, .12);
    --ara-golge: 0 24px 60px rgba(0, 0, 0, .16), 0 2px 8px rgba(0, 0, 0, .06);
    position: fixed;
    inset: 0;
    z-index: 1030;
    font-family: Montserrat, sans-serif;
    color: var(--ara-metin);
    text-align: left;
}

:where(.ara) a { color: inherit; text-decoration: none; }
:where(.ara) button { font-family: inherit; }
:where(.ara) img { max-width: none; }
.ara :focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }

.ara-perde {
    position: absolute;
    inset: 0;
    background: rgba(22, 22, 24, .5);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}

.ara-panel {
    position: relative;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 48px);
    background: #fff;
    box-shadow: var(--ara-golge);
    animation: ara-in .18s cubic-bezier(.2, .7, .2, 1);
}

@keyframes ara-in {
    from { opacity: 0; transform: translateY(-8px); }
    to { opacity: 1; transform: none; }
}

@keyframes ara-in-mobil {
    from { opacity: 0; }
    to { opacity: 1; }
}

.ara-kap {
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 12px;
}

/* ---------- Üst satır: logo · kutu · kapat ---------- */
.ara-ust { position: relative; flex: 0 0 auto; border-bottom: 1px solid var(--ara-cizgi); }

.ara-ust .ara-kap {
    display: grid;
    grid-template-columns: 248px minmax(0, 1fr) auto;
    column-gap: 40px;
    align-items: center;
    height: 112px;
}

.ara-logo img { display: block; width: 164px; height: 80px; object-fit: contain; }

.ara-form {
    position: relative;
    display: flex;
    align-items: center;
    height: 58px;
    margin: 0;
    border: 1px solid var(--ara-cizgi-koyu);
    border-radius: 6px;
    background: #fff;
    transition: border-color .15s, box-shadow .15s;
}

.ara-form:focus-within {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(189, 21, 32, .12);
}

.ara-gonder {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 56px;
    height: 100%;
    padding: 0;
    border: 0;
    border-radius: 6px 0 0 6px;
    background: none;
    color: var(--ara-metin);
    cursor: pointer;
}

.ara-gonder svg { width: 22px; height: 22px; }
.ara .ara-gonder:focus-visible { outline-offset: -4px; }

.ara .ara-kutu {
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    outline: 0;
    background: transparent;
    box-shadow: none;
    color: var(--ara-metin);
    font: 500 19px/1.2 Montserrat, sans-serif;
    -webkit-appearance: none;
    appearance: none;
}

.ara .ara-kutu::placeholder { color: #6b6c70; font-weight: 400; opacity: 1; }
.ara .ara-kutu::-webkit-search-cancel-button,
.ara .ara-kutu::-webkit-search-decoration { display: none; -webkit-appearance: none; }

.ara-form__sag {
    display: flex;
    align-items: center;
    gap: 6px;
    padding-right: 10px;
}

.ara-temizle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 0 10px;
    border: 0;
    border-radius: 4px;
    background: none;
    color: var(--ara-ikincil);
    font: 600 13px/1 Montserrat, sans-serif;
    cursor: pointer;
}

.ara-temizle svg { width: 14px; height: 14px; }

.ara-kapat {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: 44px;
    padding: 0 6px 0 12px;
    border: 0;
    border-radius: 6px;
    background: none;
    color: var(--ara-metin);
    font: 600 14px/1 Montserrat, sans-serif;
    cursor: pointer;
}

.ara-kapat svg { width: 20px; height: 20px; }
.ara-kapat__mobil { display: none; }

.ara-kbd {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 22px;
    padding: 0 6px;
    border: 1px solid #d5d5d9;
    border-bottom-width: 2px;
    border-radius: 4px;
    background: #fff;
    color: var(--ara-ikincil);
    font: 600 11px/1 Montserrat, sans-serif;
    font-variant-numeric: tabular-nums;
}

/* 250 ms'yi aşan istekte kutunun altında 2 px belirsiz ilerleme çizgisi */
.ara-cubuk {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity .15s;
}

.ara-cubuk::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: -40%;
    width: 40%;
    background: var(--color-primary);
}

.ara.is-yukleniyor .ara-cubuk { opacity: 1; }
.ara.is-yukleniyor .ara-cubuk::before { animation: ara-cubuk 1.1s cubic-bezier(.4, 0, .6, 1) infinite; }

@keyframes ara-cubuk {
    from { left: -40%; }
    to { left: 100%; }
}

/* ---------- Bant: yazım düzeltmesi / hata (listbox dışında) ---------- */
.ara-bant {
    flex: 0 0 auto;
    border-bottom: 1px solid var(--ara-cizgi);
    background: #fafafa;
}

.ara-bant .ara-kap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 12px;
    row-gap: 4px;
    min-height: 44px;
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 300px;
    color: var(--ara-ikincil);
    font: 500 14px/1.4 Montserrat, sans-serif;
}

.ara-bant strong { color: var(--ara-metin); font-weight: 700; }

.ara-bant__eylem {
    padding: 0;
    border: 0;
    background: none;
    color: var(--ara-metin);
    font: 600 14px/1.4 Montserrat, sans-serif;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}

.ara-bant--hata { background: #fdf3f3; }
.ara-bant--hata .ara-kap { color: var(--ara-metin); }

/* ---------- Gövde ---------- */
.ara-govde {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    overscroll-behavior: contain;
    outline: 0;
}

.ara .ara-govde:focus-visible { outline: 2px solid var(--color-primary); outline-offset: -3px; }
.ara-govde__ic { position: relative; }

.ara-izgara {
    display: grid;
    grid-template-columns: 248px minmax(0, 1fr) 332px;
    column-gap: 40px;
    align-items: start;
    padding-top: 26px;
    padding-bottom: 26px;
}

.ara-izgara--ikili { grid-template-columns: 248px minmax(0, 1fr); }
.ara-izgara--tek { display: block; }
/* Sol sütunda öneri/kategori yoksa boş sütun ayrılmaz */
.ara-izgara--solsuz { grid-template-columns: minmax(0, 1fr) 332px; }
.ara-izgara--yalniz { grid-template-columns: minmax(0, 1fr); }

.ara-sol { min-width: 0; padding-right: 20px; border-right: 1px solid var(--ara-cizgi); }
.ara-orta, .ara-sag { min-width: 0; }
.ara-bolum + .ara-bolum { margin-top: 26px; }

/* Listbox dışındaki denetimler (son arama "×" düğmeleri, "Teklif listesine ekle"): yer tutucunun üstüne JS ile konumlanır */
.ara-yuzenler { position: absolute; top: 0; left: 0; width: 100%; height: 0; }
.ara-yuzen { position: absolute; z-index: 2; }

.ara-etiket {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 10px;
    color: var(--ara-ikincil);
    font: 700 11.5px/1.2 Montserrat, sans-serif;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ara-etiket__ek {
    color: var(--ara-ikincil);
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    font-size: 12.5px;
    font-variant-numeric: tabular-nums;
}

.ara-not { margin: -2px 0 12px; color: var(--ara-ikincil); font: 500 13px/1.4 Montserrat, sans-serif; }
.ara-not strong { color: var(--ara-metin); font-weight: 700; }

.ara-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 6px;
    margin: -4px -6px;
    border-radius: 6px;
    color: var(--ara-metin);
    font: 600 13.5px/1.2 Montserrat, sans-serif;
    letter-spacing: 0;
    text-transform: none;
    white-space: nowrap;
}

.ara-link svg { width: 16px; height: 16px; transition: transform .15s; }

/* Seçenek ortak: etkin (klavye/fare) durumu. Yalnızca renk değil, klavyede outline da var (yüksek kontrast modu). */
.ara-secenek {
    position: relative;
    border-radius: 6px;
    color: var(--ara-metin);
    outline: 2px solid transparent;
    outline-offset: -2px;
    cursor: pointer;
}

.ara .ara-secenek:focus-visible { outline-color: var(--ara-metin); outline-offset: -2px; }
.ara-secenek.is-etkin { background-color: var(--ara-etkin); }
.ara.is-klavye .ara-secenek.is-etkin { outline-color: var(--ara-metin); }
.ara-link.is-etkin { color: var(--color-primary); }
.ara-link.is-etkin svg { transform: translateX(2px); }

.ara-vurgu { font-weight: 700; color: #000; }

/* ---------- Sol: kategori satırları (açılış kökleri + yazarken kategoriler) ---------- */
.ara-kok {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 16px;
    column-gap: 12px;
    align-items: center;
    padding: 7px 8px;
}

.ara-kok + .ara-kok { margin-top: 2px; }

.ara-karo {
    position: relative;
    display: block;
    width: 48px;
    height: 48px;
    overflow: hidden;
    border-radius: 6px;
    background: var(--zemin, #ececec);
}

.ara-karo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.ara-karo--urun { background: #fff; border: 1px solid #eeeeef; }
.ara-karo--urun img { object-fit: contain; object-position: center; }

.ara-karo__kmp {
    position: absolute;
    top: 3px;
    right: 3px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 17px;
    height: 17px;
    border: 1.5px solid #fff;
    border-radius: 50%;
    background: var(--color-primary);
    color: #fff;
    font: 700 9px/1 Montserrat, sans-serif;
}

.ara-kok__ad { display: block; font: 600 14.5px/1.25 Montserrat, sans-serif; overflow-wrap: break-word; }
.ara-kok__n { display: block; margin-top: 3px; color: var(--ara-ikincil); font: 500 12.5px/1.2 Montserrat, sans-serif; }
.ara-kok__ok { display: block; width: 16px; height: 16px; color: var(--ara-ikincil); opacity: 0; transition: opacity .12s; }
.ara-kok__ok svg { display: block; width: 16px; height: 16px; }
.ara-kok.is-secili { background: var(--ara-etkin); }
.ara-kok.is-secili .ara-kok__ok,
.ara-kok.is-etkin .ara-kok__ok { opacity: 1; }
.ara-kok.is-secili .ara-kok__ad { color: #000; }

.ara-sol__alt {
    margin-top: 18px;
    padding: 14px 8px 0;
    border-top: 1px solid var(--ara-cizgi);
}

/* ---------- Çipler: son / önerilen aramalar, son baktıklarınız ---------- */
.ara-cipler {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.ara-cipsatir { display: grid; grid-template-columns: 104px minmax(0, 1fr); column-gap: 8px; align-items: start; }
.ara-cipsatir + .ara-cipsatir { margin-top: 10px; }
.is-genis-baslik .ara-cipsatir { grid-template-columns: 132px minmax(0, 1fr); }

.ara-cipler__baslik {
    display: block;
    margin: 0;
    color: var(--ara-ikincil);
    font: 600 13px/34px Montserrat, sans-serif;
    white-space: nowrap;
}

.ara-cip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    max-width: 100%;
    height: 34px;
    padding: 0 14px;
    border: 1px solid #dcdce0;
    border-radius: 999px;
    background: #fff;
    color: var(--ara-metin);
    font: 500 13.5px/1 Montserrat, sans-serif;
    white-space: nowrap;
}

.ara-cip > span { overflow: hidden; text-overflow: ellipsis; }
.ara-cip svg { flex: 0 0 15px; width: 15px; height: 15px; color: var(--ara-ikincil); }
.ara-cip.is-etkin { border-color: var(--ara-metin); background: #fff; }

/* Son arama çipi: metin bağlantısı + ayrı "×" düğmesi (ikisi de listbox dışında, Tab ile) */
.ara-cip--son { gap: 0; padding: 0 4px 0 0; }
.ara-cip--son .ara-cip__metin { display: inline-flex; align-items: center; gap: 8px; height: 100%; padding: 0 6px 0 14px; border-radius: 999px 0 0 999px; }
.ara-cip--son .ara-cip__metin span { overflow: hidden; text-overflow: ellipsis; }

.ara-cip__sil {
    display: inline-flex;
    flex: 0 0 26px;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: none;
    color: var(--ara-ikincil);
    cursor: pointer;
}

.ara-cip__sil svg { width: 12px; height: 12px; }
/* Masaüstü son aramalar: metin listbox seçeneği, "×" yüzen düğme (yer tutucu çipin içinde) */
.ara-cip--son:has(.ara-secenek.is-etkin) { border-color: var(--ara-metin); }
.ara-cip--son .ara-cip__metin.ara-secenek { outline-offset: -1px; }
.ara-cip__sil-yer, .ara-temizle-yer { display: inline-block; flex: 0 0 auto; }
.ara-gt-kisa { display: none; }

.ara-temizle-link {
    padding: 0 4px;
    border: 0;
    background: none;
    color: var(--ara-ikincil);
    font: 600 12.5px/34px Montserrat, sans-serif;
    text-decoration: underline;
    text-underline-offset: 3px;
    white-space: nowrap;
    cursor: pointer;
}

/* Son baktıklarınız: küçük görselli çip */
.ara-cip--urun { gap: 8px; padding: 0 14px 0 4px; }
.ara-cip--urun .ara-cip__gorsel { position: relative; flex: 0 0 26px; width: 26px; height: 26px; overflow: hidden; border-radius: 50%; background: #fff; border: 1px solid #eeeeef; }
.ara-cip--urun .ara-cip__gorsel img { display: block; width: 100%; height: 100%; object-fit: contain; }

.ara-son-yer { display: block; }
.ara-son-yer + .ara-cipsatir { margin-top: 10px; }

/* ---------- Orta: seçili kategori önizlemesi (açılış) ---------- */
.ara-onizleme {
    margin-top: 22px;
    padding: 20px 22px 22px;
    border-radius: 6px;
    background-color: var(--zemin, #f4f4f4);
    background-image: linear-gradient(rgba(255, 255, 255, .5), rgba(255, 255, 255, .5));
}

.ara-onizleme:first-child { margin-top: 0; }

.ara-onizleme__ust {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
}

.ara-onizleme__baslik { display: block; margin: 0; font: 700 21px/1.2 Montserrat, sans-serif; color: #000; }
.ara-onizleme__meta { display: block; margin: 4px 0 0; color: var(--ara-ikincil); font: 500 13px/1.3 Montserrat, sans-serif; }
.ara-onizleme__meta em,
.ara-enyi__meta em { font-style: normal; color: var(--color-primary); font-weight: 600; }

.ara-altkat {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.ara-altcip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    max-width: 100%;
    height: 32px;
    padding: 0 11px;
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 6px;
    background: #fff;
    color: var(--ara-metin);
    font: 500 13px/1 Montserrat, sans-serif;
    white-space: nowrap;
}

.ara-altcip > span:first-child { overflow: hidden; text-overflow: ellipsis; }
.ara-altcip.is-etkin { border-color: var(--ara-metin); background: #fff; }
.ara-altcip__n { color: var(--ara-ikincil); font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
.ara-altcip--fazla { color: var(--ara-ikincil); font-weight: 600; }

.ara-kartlar {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}

.ara-kart {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 8px 8px 12px;
    border-radius: 6px;
    background: #fff;
    color: var(--ara-metin);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
    transition: box-shadow .15s, transform .15s;
}

.ara-kart.is-etkin { background: #fff; box-shadow: 0 10px 24px rgba(0, 0, 0, .10); transform: translateY(-1px); }
.ara-kart__gorsel { position: relative; display: block; aspect-ratio: 1 / 1; margin-bottom: 10px; overflow: hidden; border-radius: 4px; }
.ara-kart__gorsel img { display: block; width: 100%; height: 100%; object-fit: contain; }
.ara-izgara--ikili .ara-onizleme .ara-kart__gorsel { aspect-ratio: 4 / 3; }
.ara-kart__ad { display: block; padding: 0 4px; font: 600 14.5px/1.25 Montserrat, sans-serif; overflow-wrap: break-word; }
.ara-kart__yol { display: block; padding: 0 4px; margin-top: 3px; color: var(--ara-ikincil); font: 500 12px/1.3 Montserrat, sans-serif; }
.ara-kart__fiyat { display: block; padding: 0 4px; margin-top: 6px; }

/* Görsel yoksa nötr yer tutucu (teklif-listesi.css .tl-yer ile aynı); başka ürünün fotoğrafı asla kullanılmaz */
.ara .ara-yer {
    background: #f1f1f2 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a1a2a6' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='4.5' width='17' height='15' rx='1.5'/%3E%3Ccircle cx='9' cy='10' r='1.6'/%3E%3Cpath d='m20.5 16-4.8-4.8L7 19.5'/%3E%3C/svg%3E") center / 40% no-repeat;
}

.ara .ara-yer img { visibility: hidden; }
.ara-karo.ara-yer { background-color: var(--zemin, #f1f1f2); }

/* Küçük görsel rozeti (fyt-rozet'in küçük hali) */
.ara-rozet {
    position: absolute;
    top: 6px;
    left: 6px;
    z-index: 2;
    padding: 4px 7px;
    border-radius: 5px;
    background: var(--color-primary);
    color: #fff;
    font: 700 12px/1 Montserrat, sans-serif;
    font-variant-numeric: tabular-nums;
}

/* ---------- Fiyat satırı (metinler sunucudan: fiyatGoster, fiyatOranMetni, fiyatTarihAraligi) ---------- */
.ara-fiyat {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    column-gap: 8px;
    row-gap: 2px;
    font-variant-numeric: tabular-nums;
}

.ara-fiyat__eski { color: var(--ara-ikincil); font: 500 12.5px/1.2 Montserrat, sans-serif; }
.ara-fiyat__eski s { text-decoration-thickness: 1px; }
.ara-fiyat__yeni { color: #000; font: 700 14.5px/1.2 Montserrat, sans-serif; white-space: nowrap; }
.ara-fiyat__yeni--indirim { color: var(--color-primary); }
.ara-fiyat__yeni small { color: var(--ara-ikincil); font-size: 11px; font-weight: 600; }

.ara-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: 5px;
    color: var(--ara-ikincil);
    font: 500 12px/1.2 Montserrat, sans-serif;
}

.ara-meta__tarih { white-space: nowrap; }
.ara-enyi__meta2 { margin-top: 8px; font-size: 12.5px; }
.ara-enyi__takim { color: var(--ara-metin); font-weight: 600; }

.ara-oran {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 6px;
    border-radius: 4px;
    background: var(--color-primary);
    color: #fff;
    font: 700 11.5px/1 Montserrat, sans-serif;
}

.ara-sonuc-etiket {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 7px;
    border: 1px solid var(--color-primary);
    border-radius: 999px;
    background: #fff;
    color: var(--color-primary);
    font: 600 11.5px/1 Montserrat, sans-serif;
}

/* ---------- Sağ: kampanya kutusu ---------- */
.ara-kmp {
    padding: 16px 16px 12px;
    border-radius: 6px;
    background: var(--ara-kmp);
}

.ara-kmp__ust {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
}

.ara-kmp__ikon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 22px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--color-primary);
    color: #fff;
    font: 700 12px/1 Montserrat, sans-serif;
}

.ara-kmp__baslik { display: block; flex: 1 1 auto; min-width: 0; margin: 0; font: 700 15px/1.25 Montserrat, sans-serif; color: #000; }
.ara-kmp__alt { display: block; color: var(--ara-ikincil); font: 500 12px/1.3 Montserrat, sans-serif; }
.ara-kmp__sayi { color: var(--ara-ikincil); font: 600 12.5px/1 Montserrat, sans-serif; white-space: nowrap; }

.ara-kmp .ara-satir { border-top: 1px solid var(--ara-kmp-cizgi); border-radius: 0; }
.ara-kmp .ara-satir:first-of-type { border-top: 0; }
.ara-kmp .ara-satir.is-etkin { background: rgba(255, 255, 255, .7); border-radius: 6px; }
.ara-kmp__son { margin-top: 8px; padding: 8px 8px 2px; border-top: 1px solid var(--ara-kmp-cizgi); }
.ara-kmp__son .ara-link { white-space: normal; }
.ara-kmp__son .ara-link svg { flex: 0 0 16px; }
.ara-kmp__bos { margin: 4px 0 6px; color: var(--ara-ikincil); font: 500 13px/1.4 Montserrat, sans-serif; }

/* ---------- Ürün / içerik satırı ---------- */
.ara-satir {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    column-gap: 14px;
    align-items: center;
    padding: 9px 8px;
}

.ara-satir__gorsel {
    position: relative;
    display: block;
    width: 64px;
    height: 64px;
    overflow: hidden;
    border: 1px solid #eeeeef;
    border-radius: 6px;
    background: #fff;
}

.ara-satir__gorsel img { display: block; width: 100%; height: 100%; object-fit: contain; }
.ara-satir__govde { display: block; min-width: 0; }
.ara-satir__ad { display: block; overflow: hidden; font: 500 15px/1.25 Montserrat, sans-serif; white-space: nowrap; text-overflow: ellipsis; }
.ara-satir__yol { display: block; margin-top: 3px; overflow: hidden; color: var(--ara-ikincil); font: 500 12.5px/1.3 Montserrat, sans-serif; white-space: nowrap; text-overflow: ellipsis; }
.ara-satir__yol .ara-vurgu { color: var(--ara-metin); }
.ara-satir .ara-fiyat { margin-top: 5px; }
.ara-satir__neden { display: block; margin-top: 4px; overflow: hidden; color: var(--ara-ikincil); font: 500 12px/1.3 Montserrat, sans-serif; white-space: nowrap; text-overflow: ellipsis; }
.ara-satir__neden .ara-vurgu { color: var(--ara-metin); }

.ara-urunler {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 16px;
    row-gap: 2px;
}

/* İçerik satırı (blog / proje / sayfa) */
.ara-satir--icerik { grid-template-columns: 72px minmax(0, 1fr); }
.ara-satir--icerik .ara-satir__gorsel { width: 72px; height: 54px; }
.ara-satir--icerik .ara-satir__gorsel img { object-fit: cover; }
.ara-satir--icerik .ara-satir__ad { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 14px; font-weight: 600; }
.ara-tur { color: var(--ara-ikincil); font-weight: 700; }

/* Sayfa kısayolu / katalog (ikonlu) */
.ara-satir--sayfa { grid-template-columns: 40px minmax(0, 1fr); }
.ara-sayfa-ikon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 6px;
    background: var(--color-light, #ececec);
    color: var(--ara-metin);
}
.ara-sayfa-ikon svg { width: 20px; height: 20px; }

/* ---------- Sorgu önerileri (tamamlama) ---------- */
.ara-oneri {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr) 24px;
    column-gap: 12px;
    align-items: center;
    padding: 9px 4px 9px 10px;
    font: 400 15px/1.3 Montserrat, sans-serif;
}

.ara-oneri .ara-vurgu { font-weight: 700; color: #000; }
.ara-oneri svg { width: 17px; height: 17px; color: var(--ara-ikincil); }
.ara-oneri__doldur { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 4px; opacity: 0; }
.ara-oneri__doldur svg { width: 15px; height: 15px; }
.ara-oneri.is-etkin .ara-oneri__doldur { opacity: 1; }

/* ---------- En iyi eşleşme ---------- */
.ara-enyi {
    display: grid;
    grid-template-columns: 136px minmax(0, 1fr);
    column-gap: 22px;
    align-items: center;
    padding: 16px;
    border-radius: 6px;
    background-color: var(--zemin, #f4f4f4);
    background-image: linear-gradient(rgba(255, 255, 255, .5), rgba(255, 255, 255, .5));
}

.ara-enyi__gorsel {
    position: relative;
    display: block;
    width: 136px;
    height: 136px;
    overflow: hidden;
    border-radius: 6px;
    background: var(--zemin, #ececec);
}

.ara-enyi__gorsel img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 25%; }
.ara-enyi__govde { display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.ara-enyi__tur { display: block; margin-bottom: 4px; color: var(--ara-ikincil); font: 700 11px/1.2 Montserrat, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.ara-enyi__ad { display: block; align-self: flex-start; max-width: 100%; margin: 0 -6px; padding: 2px 6px; font: 600 23px/1.2 Montserrat, sans-serif; color: #000; }
.ara-enyi__meta { display: block; margin: 5px 0 0; color: var(--ara-ikincil); font: 500 13px/1.3 Montserrat, sans-serif; }
.ara-enyi .ara-altkat { margin-top: 12px; }

.ara-enyi--urun {
    grid-template-columns: 200px minmax(0, 1fr);
    align-items: stretch;
    padding: 16px;
    background: #fff;
    border: 1px solid var(--ara-cizgi);
}

.ara-enyi--urun.is-etkin { border-color: var(--ara-metin); box-shadow: 0 0 0 1px var(--ara-metin); background: #fff; }
.ara.is-klavye .ara-enyi--urun.is-etkin { outline-color: transparent; }
.ara-enyi--urun .ara-enyi__gorsel { width: 200px; height: 200px; background: #fff; }
.ara-enyi--urun .ara-enyi__gorsel img { object-fit: contain; object-position: center; }
.ara-enyi--urun .fyt-rozet { top: 6px; left: 6px; }
.ara-enyi--urun .ara-enyi__ad { margin: 0; padding: 0; font-size: 28px; font-weight: 700; }
.ara-enyi__yol { display: block; margin-top: 4px; color: var(--ara-ikincil); font: 500 13px/1.3 Montserrat, sans-serif; }
.ara-enyi__fiyat { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 10px; margin-top: 12px; font-variant-numeric: tabular-nums; }
.ara-enyi__fiyat .fyt-eski { font-size: 15px; }
.ara-enyi__fiyat .fyt-guncel { font-size: 22px; }
.ara-enyi__kampanya { display: block; margin-top: 6px; color: var(--ara-ikincil); font: 500 12.5px/1.4 Montserrat, sans-serif; }
.ara-enyi__kampanya strong { color: var(--ara-metin); font-weight: 700; }

.ara-eylemler { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 14px; }
.ara-eylem-yer { display: inline-block; height: 42px; }

.ara-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 42px;
    padding: 0 16px;
    border: 1px solid var(--ara-metin);
    border-radius: 6px;
    background: #fff;
    color: var(--ara-metin);
    font: 600 14px/1 Montserrat, sans-serif;
    white-space: nowrap;
    cursor: pointer;
}

.ara-btn svg { flex: 0 0 16px; width: 16px; height: 16px; }
.ara-btn--birincil { border-color: var(--color-primary); background: var(--color-primary); color: #fff; }
.ara-btn--birincil.is-listede { border-color: var(--ara-metin); background: #fff; color: var(--ara-metin); }
.ara .ara-btn--birincil:focus-visible { outline-color: var(--ara-metin); }

/* ---------- Boş sonuç ---------- */
.ara-bos__baslik { display: block; margin: 0; font: 700 22px/1.25 Montserrat, sans-serif; color: #000; overflow-wrap: anywhere; }
.ara-bos__metin { display: block; margin: 8px 0 0; color: var(--ara-ikincil); font: 500 14.5px/1.5 Montserrat, sans-serif; max-width: 560px; }
.ara-bos .ara-cipsatir { margin-top: 18px; grid-template-columns: auto minmax(0, 1fr); column-gap: 14px; }

.ara-teklif {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    column-gap: 18px;
    margin-top: 24px;
    padding: 20px 22px;
    border: 1px solid var(--ara-cizgi);
    border-radius: 6px;
    background: #fafafa;
}

.ara-teklif__ikon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid var(--ara-cizgi);
    color: var(--color-primary);
}

.ara-teklif__ikon svg { width: 26px; height: 26px; }
.ara-teklif__baslik { display: block; margin: 0; font: 700 17px/1.3 Montserrat, sans-serif; color: #000; }
.ara-teklif__metin { display: block; margin: 6px 0 0; color: var(--ara-ikincil); font: 500 14px/1.5 Montserrat, sans-serif; }
.ara-teklif__not { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; margin-top: 10px; padding: 6px 10px; border-radius: 4px; background: #fff; border: 1px dashed #d5d5d9; color: var(--ara-metin); font: 500 13px/1.3 Montserrat, sans-serif; }
.ara-teklif__not svg { flex: 0 0 16px; width: 16px; height: 16px; color: var(--ara-ikincil); }
.ara-teklif__not strong { overflow-wrap: anywhere; }
.ara-btn.ara-secenek.is-etkin { background: #a3111b; border-color: #a3111b; }
.ara-tel { display: inline-flex; align-items: center; gap: 8px; padding: 8px 10px; color: var(--ara-metin); font: 600 14px/1 Montserrat, sans-serif; white-space: nowrap; }
.ara-tel svg { width: 16px; height: 16px; color: var(--ara-ikincil); }

/* ---------- İskelet (açılış verisi gelene kadar; animasyonsuz) ---------- */
.ara-iskelet { display: block; border-radius: 6px; background: #f1f1f2; }
.ara-iskelet-kok { display: grid; grid-template-columns: 48px minmax(0, 1fr); column-gap: 12px; align-items: center; padding: 7px 8px; }
.ara-iskelet-kok + .ara-iskelet-kok { margin-top: 2px; }
.ara-iskelet-kok .ara-iskelet:first-child { height: 48px; }
.ara-iskelet-kok .ara-iskelet + .ara-iskelet { height: 14px; width: 70%; }

/* ---------- Alt çubuk ---------- */
.ara-alt {
    flex: 0 0 auto;
    border-top: 1px solid var(--ara-cizgi);
    background: #fafafa;
}

.ara-alt .ara-kap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    height: 58px;
}

.ara-tumu {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    height: 40px;
    padding: 0 14px 0 12px;
    margin-left: -12px;
    border-radius: 6px;
    color: var(--ara-metin);
    font: 500 14.5px/1.2 Montserrat, sans-serif;
    outline: 2px solid transparent;
    outline-offset: -2px;
}

.ara-tumu > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ara-tumu strong { font-weight: 700; }
.ara-tumu svg { flex: 0 0 18px; width: 18px; height: 18px; color: var(--color-primary); }
.ara-tumu.is-etkin { background: var(--ara-etkin); }
.ara.is-klavye .ara-tumu.is-etkin { outline-color: var(--ara-metin); }
.ara-tumu__ek { color: var(--ara-ikincil); font-weight: 500; }

.ara-ipuclari {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 16px;
    color: var(--ara-ikincil);
    font: 500 12.5px/1 Montserrat, sans-serif;
}

.ara-ipuclari span { display: inline-flex; align-items: center; gap: 6px; }

/* ---------- Header tetikleyicileri ---------- */
.ara-tetik {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    width: 292px;
    height: 40px;
    padding: 0 8px 0 12px;
    border: 1px solid #d5d5d9;
    border-radius: 6px;
    background: #fff;
    color: var(--color-dark);
    font: 500 14px/1 Montserrat, sans-serif;
    text-align: left;
    text-decoration: none;
    cursor: text;
    transition: border-color .2s, box-shadow .2s;
}

.ara-tetik:hover { border-color: var(--color-dark); color: var(--color-dark); }
.ara-tetik:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.ara-tetik svg { flex: 0 0 18px; width: 18px; height: 18px; color: #000; }
.ara-tetik__metin { flex: 1 1 auto; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ara-tetik .ara-kbd { height: 22px; white-space: nowrap; }

.ara-tetik--mobil {
    display: none;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    justify-content: center;
    background: none;
    cursor: pointer;
}

.ara-tetik--mobil svg { flex-basis: 26px; width: 26px; height: 26px; stroke-width: 2.2; }

/* ---------- Fare: yalnız gerçek hover cihazlarında ---------- */
@media (hover: hover) {
    .ara-temizle:hover,
    .ara-kapat:hover { background: var(--ara-etkin); color: var(--ara-metin); }
    .ara-link:hover { color: var(--color-primary); }
    .ara-link:hover svg { transform: translateX(2px); }
    .ara-cip:hover, .ara-altcip:hover { border-color: var(--ara-metin); }
    .ara-cip__sil:hover { background: var(--ara-etkin); color: var(--ara-metin); }
    .ara-cip--son .ara-cip__metin:hover { color: #000; }
    .ara-btn:hover { border-color: var(--color-primary); color: var(--color-primary); }
    .ara-btn--birincil:hover { background: #a3111b; border-color: #a3111b; color: #fff; }
    .ara-tumu:hover { background: var(--ara-etkin); }
    .ara-oneri__doldur:hover { background: #e6e6e8; }
    .ara-bant__eylem:hover { color: var(--color-primary); }
}

/* ---------- 992–1399: içerik sitenin .container genişliğiyle hizalı (açılınca logo yerinde kalır) ---------- */
@media (min-width: 1200px) and (max-width: 1399px) {
    .ara-kap { max-width: 1140px; }
    /* Sol sütun 232 px (bant hizası 232 + 24 = 256 aynı kalır) */
    .ara-ust .ara-kap { grid-template-columns: 232px minmax(0, 1fr) auto; column-gap: 24px; }
    .ara-izgara { grid-template-columns: 232px minmax(0, 1fr) 288px; column-gap: 24px; }
    .ara-izgara--ikili { grid-template-columns: 232px minmax(0, 1fr); }
    .ara-izgara--solsuz { grid-template-columns: minmax(0, 1fr) 288px; }
    .ara-bant .ara-kap { padding-left: 256px; }
    .ara-kartlar { gap: 10px; }
    .ara-enyi { grid-template-columns: 104px minmax(0, 1fr); }
    .ara-enyi__gorsel { width: 104px; height: 104px; }
    .ara-enyi--urun { grid-template-columns: 160px minmax(0, 1fr); }
    .ara-enyi--urun .ara-enyi__gorsel { width: 160px; height: 160px; }
    /* Dar sağ sütunda uzun yol ("Masa Ayakları › Tekli Ayaklar") kesilmez, iki satıra kadar kırılır */
    .ara-sag .ara-satir__yol { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .ara-kap { max-width: 960px; }
}

/* 992–1399: dar sol sütunda "↖ kutuya yaz" yalnız etkin satırda metnin üstünde, kök satırında ok sütunu yok */
@media (min-width: 992px) and (max-width: 1399px) {
    .ara-sol { padding-right: 14px; }
    .ara-kok { grid-template-columns: 48px minmax(0, 1fr); column-gap: 10px; padding: 7px 6px; }
    .ara-kok__ok { display: none; }
    .ara-kok__ad { font-size: 14px; }
    .ara-oneri { grid-template-columns: 18px minmax(0, 1fr); column-gap: 9px; padding: 9px 6px 9px 8px; font-size: 14.5px; }
    .ara-oneri__doldur { position: absolute; top: 50%; right: 3px; margin-top: -12px; background: var(--ara-etkin); }
    .ara-gt-uzun { display: none; }
    .ara-gt-kisa { display: inline; }
}

/* ---------- 768–1199: iki sütun; kampanya ve içerik ortanın altında ---------- */
@media (max-width: 1199px) {
    .ara-tetik { width: 40px; padding: 0; justify-content: center; cursor: pointer; }
    .ara-tetik .ara-kbd { display: none; }
    .ara-tetik .ara-tetik__metin { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }

    /* Sol sütun 236 px (bant hizası 236 + 24 = 260 aynı kalır) */
    .ara-ust .ara-kap { grid-template-columns: 236px minmax(0, 1fr) auto; column-gap: 24px; }
    .ara-izgara { grid-template-columns: 236px minmax(0, 1fr); column-gap: 24px; row-gap: 26px; }
    .ara-izgara > .ara-sol { grid-row: 1 / span 2; }
    .ara-izgara > .ara-sag { grid-column: 2; }
    .ara-izgara--solsuz, .ara-izgara--yalniz { grid-template-columns: minmax(0, 1fr); }
    .ara-izgara--solsuz > .ara-sag { grid-column: 1; }
    .ara-bant .ara-kap { padding-left: 260px; }
    .ara-kartlar { gap: 10px; }
    .ara-kart__ad { font-size: 14px; }
    .ara-enyi--urun { grid-template-columns: 160px minmax(0, 1fr); }
    .ara-enyi--urun .ara-enyi__gorsel { width: 160px; height: 160px; }
}

@media (max-width: 991px) {
    .ara-tetik--mobil { display: inline-flex; margin-left: auto; color: #000; }
    .header_sm .ara-tetik--mobil + .menuButton { margin-left: 14px; }
    .ara-logo { display: none; }
    .ara-ust .ara-kap { grid-template-columns: minmax(0, 1fr) auto; column-gap: 16px; height: 88px; }
    .ara-izgara { grid-template-columns: 232px minmax(0, 1fr); column-gap: 24px; }
    .ara-kok { grid-template-columns: 48px minmax(0, 1fr); }
    .ara-kok__ok { display: none; }
    .ara-sol { padding-right: 16px; }
    .ara-bant .ara-kap { padding-left: 12px; }
    .ara-urunler { grid-template-columns: 1fr; }
    .ara-ipuclari { display: none; }
}

/* ---------- ≤767: tam ekran ---------- */
@media (max-width: 767px) {
    .ara-panel {
        position: fixed;
        inset: 0;
        max-height: none;
        height: 100vh;
        height: 100dvh;
        box-shadow: none;
        animation-name: ara-in-mobil;
    }

    .ara-perde { display: none; }
    .ara-kap { padding: 0 16px; }
    .ara-ust .ara-kap { grid-template-columns: minmax(0, 1fr) auto; column-gap: 8px; height: 68px; }
    .ara-form { height: 46px; }
    .ara-gonder { flex-basis: 44px; }
    .ara-gonder svg { width: 20px; height: 20px; }
    .ara .ara-kutu { font-size: 16px; }
    .ara-kapat { padding: 0 4px; color: var(--color-primary); font-size: 15px; }
    .ara-kapat .ara-kbd, .ara-kapat svg, .ara-kapat__metin { display: none; }
    .ara-kapat__mobil { display: inline; }
    .ara-temizle span { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
    .ara-temizle { width: 44px; height: 44px; padding: 0; justify-content: center; }
    .ara-temizle svg { width: 18px; height: 18px; }
    .ara-form__sag { padding-right: 1px; }
    .ara-bant .ara-kap { padding-left: 16px; font-size: 13.5px; }

    .ara-izgara, .ara-izgara--ikili { display: block; padding-top: 16px; padding-bottom: 96px; }
    .ara-izgara--acilis { padding-bottom: 32px; }
    .ara-sol { padding-right: 0; border-right: 0; }
    .ara-bolum + .ara-bolum,
    .ara-son-yer + .ara-bolum { margin-top: 22px; }

    .ara-etiket .ara-link { font-size: 13.5px; }
    .ara-etiket .ara-temizle-link { line-height: 1.2; }
    .ara-cipler--kay { flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px; padding: 0 16px 2px; scrollbar-width: none; }
    .ara-cipler--kay::-webkit-scrollbar { display: none; }
    .ara-cip { height: 38px; }
    .ara-cip--son .ara-cip__metin { padding-left: 12px; }
    .ara-cip__sil { width: 32px; height: 32px; flex-basis: 32px; }
    .ara-cip__sil::after { content: ""; position: absolute; inset: -6px; }
    .ara-cip--son { position: relative; }
    .ara-cip__sil { position: relative; }
    .ara-etiket .ara-temizle-link, .ara-etiket .ara-link, .ara-bant__eylem, .ara-enyi__ad.ara-secenek { position: relative; }
    .ara-etiket .ara-temizle-link::after, .ara-etiket .ara-link::after, .ara-bant__eylem::after { content: ""; position: absolute; left: -6px; right: -6px; top: 50%; height: 44px; margin-top: -22px; }
    .ara-enyi__ad.ara-secenek { margin-top: -8px; margin-bottom: -8px; padding-top: 10px; padding-bottom: 10px; }

    .ara-mkarolar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .ara-mkaro {
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        height: 124px;
        padding: 12px;
        overflow: hidden;
        border-radius: 6px;
        background: var(--zemin, #ececec);
        color: #000;
    }
    .ara-mkaro img { position: absolute; right: -8px; top: -2px; width: 58%; height: 118%; object-fit: cover; object-position: center 20%; }
    .ara-mkaro::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--zemin, #ececec) 38%, rgba(255, 255, 255, 0) 72%); }
    .ara-mkaro > * { z-index: 1; }
    .ara-mkaro b { position: relative; max-width: 66%; font: 700 14.5px/1.2 Montserrat, sans-serif; }
    .ara-mkaro small { position: relative; margin-top: 4px; color: rgba(0, 0, 0, .72); font: 600 12px/1.2 Montserrat, sans-serif; }
    .ara-mkaro .fl-kampanyali { position: absolute; z-index: 2; top: 8px; left: 8px; padding: 3px 8px; font-size: 11px; }
    .ara-mkaro.is-etkin { box-shadow: inset 0 0 0 2px var(--ara-metin); }

    .ara-raf { display: flex; gap: 10px; overflow-x: auto; margin: 0 -16px; padding: 0 16px 4px; scroll-snap-type: x mandatory; scroll-padding-inline: 16px; scrollbar-width: none; }
    .ara-raf::-webkit-scrollbar { display: none; }
    .ara-rafkart { flex: 0 0 150px; scroll-snap-align: start; padding: 8px 8px 12px; border-radius: 6px; background: #fff; border: 1px solid var(--ara-cizgi); color: var(--ara-metin); }
    .ara-rafkart .ara-kart__gorsel { margin-bottom: 8px; }
    .ara-rafkart .ara-kart__ad { font-size: 14px; }
    .ara-rafkart.is-etkin { border-color: var(--ara-metin); background: #fff; }

    .ara-urunler { grid-template-columns: 1fr; }
    .ara-satir { grid-template-columns: 56px minmax(0, 1fr); min-height: 56px; padding: 8px 4px; }
    .ara-satir__gorsel { width: 56px; height: 56px; }
    .ara-satir--sayfa { grid-template-columns: 40px minmax(0, 1fr); }
    .ara-satir--icerik { grid-template-columns: 72px minmax(0, 1fr); }
    .ara-satir--icerik .ara-satir__gorsel { width: 72px; height: 54px; }
    .ara-oneri { padding: 11px 4px; font-size: 16px; }
    .ara-oneri__doldur { opacity: 1; width: 36px; height: 36px; margin: -6px 0; }
    .ara-oneri { grid-template-columns: 18px minmax(0, 1fr) 36px; }

    .ara-enyi { grid-template-columns: 88px minmax(0, 1fr); column-gap: 14px; padding: 12px; }
    .ara-enyi__gorsel { width: 88px; height: 88px; }
    .ara-enyi__ad { font-size: 19px; }
    .ara-enyi--urun { grid-template-columns: 96px minmax(0, 1fr); padding: 12px; align-items: start; }
    .ara-enyi--urun .ara-eylemler > .ara-btn { display: none; }
    .ara-enyi--urun .ara-eylemler { margin-top: 10px; }
    .ara-enyi--urun .ara-enyi__gorsel { width: 96px; height: 96px; }
    .ara-enyi--urun .ara-enyi__ad { font-size: 20px; }
    .ara-enyi__fiyat { margin-top: 6px; }
    .ara-enyi__fiyat .fyt-guncel { font-size: 18px; }
    .ara-enyi--urun .ara-eylemler { grid-column: 1 / -1; }
    .ara-kartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ara-teklif { grid-template-columns: 1fr; row-gap: 12px; padding: 16px; }
    .ara-bos__baslik { font-size: 19px; }

    .ara-alt { position: fixed; left: 0; right: 0; bottom: var(--ara-klavye, 0px); padding: 10px 0 calc(10px + env(safe-area-inset-bottom, 0px)); background: #fff; border-top: 1px solid var(--ara-cizgi); }
    .ara-alt .ara-kap { height: auto; }
    .ara-tumu { justify-content: center; width: 100%; height: 50px; margin: 0; border-radius: 6px; background: var(--ara-metin); color: #fff; font-size: 15px; }
    .ara-tumu svg { color: #fff; }
    .ara-tumu__ek { color: rgba(255, 255, 255, .75); }
    .ara-tumu.is-etkin { background: #000; }
    .ara.is-klavye .ara-tumu.is-etkin { outline-color: var(--color-primary); }
    .ara-alt--gizli { display: none; }

    /* Arama açıkken görsel rekabet: teklif listesi kartı ve ürün detayının sabit alt barı gizlenir */
    html.ara-kilit .tl-kart,
    html.ara-kilit [data-rol="mbar"] { visibility: hidden; }
}

@media (prefers-reduced-motion: reduce) {
    .ara-panel { animation-name: ara-in-mobil !important; animation-duration: .01s !important; }
    .ara-kart, .ara-link svg, .ara-form { transition: none !important; }
    .ara-kart.is-etkin { transform: none; }
    .ara.is-yukleniyor .ara-cubuk::before { animation: none; left: 0; width: 100%; opacity: .6; }
}