/* Nakliyat Defteri — yumuşak, yuvarlak kart düzeni */
.df-sayfa{max-width:none;margin:0;padding:20px 0 110px;display:grid;grid-template-columns:340px minmax(0,1fr);gap:24px;align-items:start;--df-r:6px;--df-golge:0 1px 2px rgba(19,35,58,.05),0 8px 24px -14px rgba(19,35,58,.22)}
.df-kart{background:var(--panel);border:1px solid var(--line);border-radius:6px;box-shadow:var(--df-golge);padding:20px 22px;margin:0 0 14px}

/* Üst kart */
.df-ust{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.df-ust h1{font:800 24px/1.15 "Bricolage Grotesque",sans-serif;margin:0 0 4px}
.df-ust p{margin:0;font-size:15px;color:var(--soft);max-width:38ch}
.df-sayac{text-align:right;display:flex;align-items:center;gap:10px}
.df-sayac b{font:800 44px/1 "Bricolage Grotesque",sans-serif;letter-spacing:-.02em}
.df-sayac span{display:block;text-align:left;font-size:14px;line-height:1.25;font-weight:600}
.df-sayac small{display:block;color:var(--soft);font-weight:400;font-size:13px}
.df-ara{margin-top:16px;position:relative}
.df-ara input{width:100%;padding:12px 16px 12px 42px;border-radius:6px;border:1px solid var(--line);background:var(--panel-2)}
.df-ara svg{position:absolute;left:15px;top:50%;transform:translateY(-50%);color:var(--soft)}

/* Şehir çipleri */
.df-iller{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 14px;margin:0 -2px;scrollbar-width:none}
.df-iller::-webkit-scrollbar{display:none}
.df-iller a{flex:none;text-decoration:none;color:var(--ink);font-size:14px;padding:6px 14px;border:1px solid var(--line);border-radius:6px;background:var(--panel)}
.df-iller a:hover{border-color:var(--soft)}
.df-iller a.on{background:var(--or-soft);border-color:var(--or);color:var(--or);font-weight:700}

/* Yazma kutusu */
.df-yaz{padding:16px 18px 14px}
.df-tur-sec{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.df-tur-sec label{cursor:pointer}
.df-tur-sec input{position:absolute;opacity:0;pointer-events:none}
.df-tur-sec span{display:inline-block;padding:6px 14px;border-radius:6px;border:1px solid var(--line);font-size:14px;font-weight:600;color:var(--soft)}
.df-tur-sec input:checked+span{background:var(--ink);border-color:var(--ink);color:var(--panel)}
.df-tur-sec input:focus-visible+span{outline:2px solid var(--or);outline-offset:2px}
.df-yaz textarea{border:0;background:transparent;padding:4px 0;min-height:76px;resize:vertical;font-size:17px;line-height:1.45}
.df-yaz textarea:focus{outline:0}
.df-alanlar{display:flex;gap:8px;flex-wrap:wrap;padding-top:10px;border-top:1px solid var(--line)}
.df-alanlar select,.df-alanlar input{width:auto;flex:1 1 130px;border-radius:6px;padding:8px 14px;font-size:14px;background:var(--panel-2)}
.df-yaz-alt{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}
.df-yaz-alt .small{font-size:13px}
.df-yaz-alt .btn.go{border-radius:6px;padding:10px 26px;font-weight:700}
.df-cta{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.df-cta b{font-size:16px}
.df-cta p{margin:3px 0 0}
.df-cta .btn{border-radius:6px}

/* Sekmeler: küçük ekranda altta sabit */
.df-sekme{display:flex;gap:6px;padding:6px;background:var(--panel);border:1px solid var(--line);border-radius:6px;box-shadow:var(--df-golge);margin:0 0 16px}
.df-sekme a{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;text-decoration:none;color:var(--ink);font-weight:600;font-size:14.5px;padding:9px 10px;border-radius:6px;white-space:nowrap}
.df-sekme a svg{flex:none;opacity:.75}
.df-sekme a small{color:var(--soft);font-weight:600;font-size:13px}
.df-sekme a:hover{background:var(--panel-2)}
.df-sekme a.on{background:var(--or-soft);color:var(--or)}
.df-sekme a.on small{color:inherit}
@media(max-width:720px){
  .df-sekme{position:fixed;left:12px;right:12px;bottom:calc(76px + env(safe-area-inset-bottom));z-index:70;margin:0}   /* mobil alt çubuğun (z-index 80) hemen üstünde */
  .df-sekme a{flex-direction:column;gap:2px;font-size:12.5px;padding:7px 4px;border-radius:6px}
  .df-sekme a small{font-size:12px}
  .df-sekme{border-radius:6px}
  .df-sayac b{font-size:36px}
  .df-kart{padding:16px}
}

/* Gönderi kartı */
.df-k{background:var(--panel);border:1px solid var(--line);border-radius:6px;box-shadow:var(--df-golge);padding:16px 18px;margin:0 0 12px;border-left:4px solid var(--tur,var(--line))}
.df-k.df-bos_arac{--tur:#17794A}.df-k.df-yuk_is{--tur:#E85A12}.df-k.df-asansor{--tur:#3B6FD4}
.df-k:target{outline:2px solid var(--or);outline-offset:2px}
.df-pasif{opacity:.55}
.df-bas{display:flex;align-items:center;gap:12px}
.df-av{flex:none;width:42px;height:42px;border-radius:6px;background:var(--panel-2);border:1px solid var(--line);display:grid;place-items:center;overflow:hidden;font-weight:800;font-size:14px;color:var(--soft);text-decoration:none}
.df-av img{width:100%;height:100%;object-fit:cover}
.df-kim{min-width:0;flex:1}
.df-kim>a{text-decoration:none}
.df-kim b{font-size:15.5px}
.df-tik{display:inline-grid;place-items:center;width:16px;height:16px;margin-left:5px;border-radius:6px;background:var(--gr);color:#fff;font-size:10px;vertical-align:1px}
.df-alt{font-size:13px;color:var(--soft);margin-top:1px}
.df-yonet{display:flex;gap:6px}
.df-yonet form{margin:0}
.df-etiket{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:14px 0 6px}
.df-tur{font-size:13px;font-weight:700;color:var(--tur);background:color-mix(in srgb,var(--tur) 12%,transparent);padding:3px 11px;border-radius:6px}
.df-rota{font:800 19px/1.2 "Bricolage Grotesque",sans-serif}
.df-cip{font-size:13px;color:var(--soft);padding:2px 10px;border:1px solid var(--line);border-radius:6px}
.df-metin{margin:6px 0 14px;font-size:16.5px;line-height:1.5;white-space:pre-line;overflow-wrap:anywhere}
.df-tus{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.df-tus .btn{border-radius:6px}
.df-num-sonuc{display:flex;gap:8px;flex-wrap:wrap}
.df-num-sonuc[hidden]{display:none}
.df-sayi{margin-left:auto;font-size:13.5px;color:var(--soft)}
.df-yanitlar{max-height:340px;overflow-y:auto;overscroll-behavior:contain;list-style:none;margin:14px 0 0;padding:12px 14px;background:var(--panel-2);border-radius:6px;display:grid;gap:10px;font-size:15px}
.df-yanitlar li{display:flex;gap:6px;flex-wrap:wrap;align-items:baseline}
.df-yanitlar a{text-decoration:none}
.df-yanitlar time{margin-left:auto;font-size:12.5px;color:var(--soft)}
.df-sil{border:0;background:none;color:var(--soft);cursor:pointer;font-size:18px;line-height:1;padding:0 4px}
.df-sil:hover{color:#B3261E}
.df-yanit-form{display:flex;gap:8px;margin-top:12px}
.df-yanit-form input{flex:1;border-radius:6px;padding:9px 16px;font-size:15px}
.df-yanit-form .btn{border-radius:6px}

/* Alt bilgi */
.df-nasil{margin-top:18px;font-size:14.5px;color:var(--soft)}
.df-nasil summary{cursor:pointer;font-weight:700;color:var(--ink);padding:6px 0}
.df-nasil ul{list-style:none;padding:0;margin:8px 0;display:grid;gap:8px}
.df-nasil li b{color:var(--ink)}
.df-bos{text-align:center;padding:34px 20px;color:var(--soft)}
@media(prefers-reduced-motion:no-preference){.df-sekme a,.df-iller a{transition:background .15s,border-color .15s}}

/* Firma profilinde gönderi listesi */
.dp-liste{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.dp-ic{display:grid;gap:4px;padding:12px 14px;border:1px solid var(--line);border-radius:6px;text-decoration:none;color:var(--ink);background:var(--panel)}
.dp-ic:hover{border-color:var(--soft)}
.dp-ic strong{font:800 16px/1.2 "Bricolage Grotesque",sans-serif}
.dp-ic .df-tur{justify-self:start}
.dp-ic{column-gap:10px}
.dp-ic>a.dp-baglanti{display:contents}
.dp-ic .dp-ust{grid-column:1/-1;grid-row:1}
.dp-ic .dp-metin{grid-column:1;grid-row:2;margin:2px 0 0}
.dp-ic:not(:has(.df-islem)) .dp-metin{grid-column:1/-1}
.dp-ic .df-islem{grid-column:2;grid-row:2;align-self:stretch;justify-self:end;margin-top:2px}
.dp-ic .df-islem>summary{box-sizing:border-box;height:100%;display:flex;align-items:center}
.dp-ust{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dp-zaman{margin-left:auto;white-space:nowrap}
.dp-metin{margin:6px 0 4px;padding:10px 14px;font-size:14.5px;color:var(--ink);border-radius:6px;border:1px solid color-mix(in srgb,var(--tur,var(--line)) 22%,transparent);border-left:3px solid var(--tur,var(--line));background:linear-gradient(135deg,color-mix(in srgb,var(--tur,var(--line)) 11%,var(--panel,#fff)),color-mix(in srgb,var(--tur,var(--line)) 4%,var(--panel,#fff)))}

/* Müşteri talebi kartı */
.df-k.df-talep{--tur:#7A5AF8;background:var(--panel)}
.df-talep .df-tur{--tur:#7A5AF8}
.df-nedir{display:flex;flex-wrap:wrap;gap:6px 16px;margin:2px 0 12px;font-size:14.5px;color:var(--soft)}
.df-nedir span{display:inline-flex;align-items:center;gap:6px}
.df-nedir svg{flex:none;opacity:.7}
.df-teklif{display:flex;gap:8px;margin-top:4px}
.df-teklif .df-para{position:relative;flex:1}
.df-teklif input{width:100%;border-radius:6px;padding:10px 46px 10px 16px;font-size:15.5px}
.df-teklif .df-para i{position:absolute;right:16px;top:50%;transform:translateY(-50%);font-style:normal;color:var(--soft)}
.df-teklif .btn{border-radius:6px;padding:10px 22px}
.df-teklif-not{margin-top:8px;font-size:13.5px;color:var(--soft)}
.df-hata{color:#B3261E;font-size:13.5px;margin:6px 2px 0}
.df-sag{margin-left:auto;font-size:13px;color:var(--soft)}

/* Tek gönderi sayfası */
.df-yol{font-size:13.5px;color:var(--soft);margin:0 0 12px;display:flex;flex-wrap:wrap;gap:4px 8px}
.df-yol a{color:inherit}
.df-uyari{background:var(--or-soft);color:var(--ink);border-radius:6px;padding:12px 16px;margin:0 0 14px;font-size:15px}
.df-benzer{margin-top:24px}
.df-benzer h2{font:800 18px/1.2 "Bricolage Grotesque",sans-serif;margin:0 0 10px}
.df-k h1{font:800 22px/1.2 "Bricolage Grotesque",sans-serif;margin:0}

@media(max-width:720px){.df-sekme{overflow-x:auto;scrollbar-width:none}.df-sekme::-webkit-scrollbar{display:none}.df-sekme a{flex:1 0 auto;padding:7px 10px}}

/* İki kolon: sol = başlık/şehirler/çağrı, sağ = akış */
.df-yan{position:sticky;top:16px;min-width:0}
.df-ana{min-width:0}
.df-yan .df-ust{flex-direction:column;align-items:flex-start}
.df-yan .df-ust p{max-width:none}
/* Geniş ekranda sol panel genişler, açıklama tek satıra sığar */
@media(min-width:1280px){.df-sayfa{grid-template-columns:540px minmax(0,1fr)}.df-yan .df-ust p{white-space:nowrap}}
.df-yan .df-iller{flex-wrap:wrap;overflow:visible;margin:0;padding:0 0 14px}
.df-yan .df-cta{flex-direction:column;align-items:flex-start}
@media(max-width:960px){
  .df-sayfa{grid-template-columns:1fr}
  .df-yan{position:static}
  .df-ana{max-width:none}
  .df-yan .df-ust{flex-direction:row;align-items:center}
  .df-yan .df-iller{flex-wrap:nowrap;overflow-x:auto}
  .df-yan .df-cta{flex-direction:row;align-items:center}
}

/* Firma gönderisi başlığı: ad solda, üyelik · il · zaman aynı satırda sağa dayalı */
.df-k .df-kim{display:flex;align-items:center;flex-wrap:wrap;gap:2px 8px}
.df-k .df-kim .df-alt{margin:0 0 0 auto;display:flex;align-items:center;gap:6px;white-space:nowrap}
.df-k .df-av{width:36px;height:36px}

/* Anlık sohbet: yeni yanıt kısa süre vurgulanır */
@keyframes df-yeni{from{background:var(--or-soft)}to{background:transparent}}
.df-yanitlar li.df-yeni{animation:df-yeni 1.6s ease-out;border-radius:6px}

/* Özel yazışmalar: sahip için firma listesi */
.df-konusmalar{margin-top:14px;background:var(--panel-2);border-radius:6px;padding:12px 14px}
.df-kon-bas{font-weight:700;font-size:15px;margin-bottom:8px}
.df-kon-bas small{font-weight:400;color:var(--soft)}
.df-kon-liste{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.df-kon-liste a{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;padding:9px 12px;border-radius:6px;background:var(--panel,#fff);text-decoration:none;color:inherit;border:1px solid transparent}
.df-kon-liste a:hover,.df-kon-liste a.acik{border-color:currentColor}
.df-kon-liste a.acik{font-weight:600}
.df-kon-son{flex:1;min-width:120px;color:var(--soft);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.df-kon-liste time{font-size:12.5px;color:var(--soft)}
.df-kon-liste em{font-style:normal;font-size:12px;min-width:20px;text-align:center;padding:1px 7px;border-radius:6px;background:var(--panel-2)}
.df-gizli-not{margin:8px 4px 0;font-size:13px;color:var(--soft)}

/* Panel: ilanın altında açılan yazışmalar */
.dp-ic .df-pn-yan{grid-column:1/-1;margin-top:4px}
.df-pn-yan>summary{display:inline-block;cursor:pointer;list-style:none}
.df-pn-yan>summary::-webkit-details-marker{display:none}
.df-pn-yan[open]>summary{opacity:.75}
.df-pn-ic{display:grid;gap:14px;margin-top:12px}
.df-pn-kon{background:var(--panel-2);border-radius:6px;padding:12px 14px}
.df-pn-kon .df-yanitlar{margin-top:8px;padding:0;background:none;max-height:260px}
.df-pn-bas{margin-bottom:2px}
.df-pn-form{display:flex;gap:8px;margin-top:10px}
.df-pn-form input{flex:1;border-radius:6px;padding:9px 16px;font-size:15px}
.df-pn-form .btn{border-radius:6px}

/* Numara başlıkta, firma adı ile üyelik rozeti arasında açık görünür */
.df-k .df-kim.df-tel-var .df-alt{margin-left:0}
.df-tel{margin-left:auto;display:flex;align-items:center;gap:6px 10px;flex-wrap:wrap}
.df-tel-no{font-weight:700;font-size:15px;text-decoration:none;color:var(--gr,#17794A);white-space:nowrap}
.df-tel-wa{font-size:12.5px;font-weight:700;text-decoration:none;color:#fff;background:#25D366;padding:3px 10px;border-radius:6px}

/* Popup (dialog): yazışmalar ve düzenle */
.df-dlg{border:1px solid var(--line);border-radius:6px;padding:18px 20px;width:min(640px,94vw);max-height:88vh;overflow:auto;background:var(--panel,#fff);color:var(--ink);box-shadow:0 20px 60px rgba(0,0,0,.25)}
.df-dlg::backdrop{background:rgba(19,35,58,.55)}
.df-dlg-bas{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px}
.df-kon-sekme{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.df-kon-sekme button{border:1px solid var(--line);background:var(--panel-2);border-radius:6px;padding:7px 12px;font:inherit;font-size:14px;cursor:pointer;color:inherit}
.df-kon-sekme button.acik{border-color:var(--or);background:var(--or-soft)}
.df-kon-sekme em{font-style:normal;font-size:12px;color:var(--soft);margin-left:4px}
.df-dlg .df-yanitlar{max-height:46vh}
button.df-sayi{border:0;background:none;cursor:pointer;font:inherit;font-size:13.5px;color:var(--soft);text-decoration:underline;padding:0}
.df-sil{font-size:13px;text-decoration:underline}

/* Gönderi metni: ilan türünün rengiyle hafif tonlu kutu */
.df-metin{margin:10px 0 14px;padding:12px 16px;border-radius:6px;border:1px solid color-mix(in srgb,var(--tur,var(--line)) 22%,transparent);border-left:3px solid var(--tur,var(--line));background:linear-gradient(135deg,color-mix(in srgb,var(--tur,var(--line)) 11%,var(--panel,#fff)),color-mix(in srgb,var(--tur,var(--line)) 4%,var(--panel,#fff)))}

/* İşlemler açılır menüsü */
.df-islem{position:relative}
.df-islem>summary{cursor:pointer;list-style:none;user-select:none}
.df-islem>summary::-webkit-details-marker{display:none}
.df-islem-menu{position:absolute;right:0;top:calc(100% + 4px);z-index:20;min-width:150px;display:grid;background:var(--panel,#fff);border:1px solid var(--line);border-radius:6px;box-shadow:0 10px 30px rgba(0,0,0,.18);padding:4px}
.df-islem-menu form{margin:0}
.df-islem-menu a,.df-islem-menu button{display:block;box-sizing:border-box;text-decoration:none;width:100%;text-align:left;border:0;background:none;font:inherit;font-size:14.5px;font-weight:600;padding:9px 12px;border-radius:6px;cursor:pointer;color:var(--ink)}
.df-islem-menu a:hover,.df-islem-menu button:hover{background:var(--panel-2)}
.df-islem-menu .df-islem-sil{color:#B3261E}

/* Gönderi metni kutusunda sağda "Sorun bildir" */
.df-metin-satir{display:flex;align-items:center;gap:12px;flex-wrap:wrap;white-space:normal}
.df-metin-t{flex:1 1 220px;min-width:0;margin:0;white-space:pre-line;overflow-wrap:anywhere}
.df-sorun{flex:none;margin-left:auto;display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--panel,#fff);color:var(--soft);font:inherit;font-size:13px;font-weight:600;padding:5px 10px;border-radius:6px;cursor:pointer;white-space:nowrap}
.df-sorun:hover,.df-sorun:focus-visible{color:#B3261E;border-color:#B3261E}

/* Anlık sohbet: yeni gelen mesaj vurgusu */
article.df-yeni-mesaj button.df-sayi{color:var(--or);font-weight:700;animation:dfNabiz 1.4s ease-in-out infinite}
@keyframes dfNabiz{50%{opacity:.45}}

/* Popup'lar ekranın ortasında */
.df-dlg[open]{position:fixed;inset:0;margin:auto;height:fit-content;max-height:88vh}

/* WhatsApp tarzı sohbet balonları */
.df-yanitlar{gap:6px}
.df-yanitlar li{display:flex;flex-wrap:nowrap;align-items:flex-start;width:100%}
.df-yanitlar li.df-ben{justify-content:flex-end}
.df-yanitlar li.df-o{justify-content:flex-start}
.df-bal{display:flex;flex-direction:column;gap:2px;max-width:82%;min-width:120px;padding:7px 11px 5px;border-radius:12px;box-shadow:0 1px 1px rgba(11,22,36,.12);overflow-wrap:anywhere}
.df-ben .df-bal{background:#D9FDD3;border-bottom-right-radius:3px}
.df-o .df-bal{background:#fff;border-bottom-left-radius:3px}
.df-yazan{font-size:12.5px;font-weight:700;line-height:1.2}
.df-ben .df-yazan{color:#17794A}
.df-o .df-yazan a{color:#B4540A}
.df-sahip-etiket{font-style:normal;font-weight:600;font-size:11px;margin-left:6px;padding:1px 6px;border-radius:6px;background:var(--panel-2);color:var(--soft)}
.df-mt{font-size:15px;line-height:1.35;white-space:pre-wrap}
.df-alt{display:flex;justify-content:flex-end;align-items:center;gap:10px;font-size:11.5px;color:var(--soft)}
.df-alt time{margin:0;font-size:11.5px}
.df-alt .df-sil{font-size:11.5px;padding:0}
.df-yanitlar li.df-yeni .df-bal{animation:df-yeni 1.6s ease-out}
.df-ben .df-yazan a{color:#17794A}

/* Rota sayfası: sık sorulan sorular */
.df-sss h2{margin:0 0 8px;font-size:1.1rem}
.df-sss details{border-top:1px solid rgba(0,0,0,.08);padding:10px 0}
.df-sss details:first-of-type{border-top:0}
.df-sss summary{cursor:pointer;font-weight:600}
.df-sss details p{margin:8px 0 0}
/* Yönetici gönderisi: firma adı + telefon satırı */
.df-yonetim{border-top:1px dashed var(--line);margin-top:2px}
.df-yonetim input{flex:1;min-width:200px;padding:10px 12px;border:1px solid var(--line);border-radius:6px;background:var(--panel-2);color:var(--ink);font:inherit}
/* Nereden / Nereye: il listesinden seçilir ya da serbest yazılır (datalist) */
.df-alanlar input[data-yer]{flex:2 1 190px;min-width:0}

/* ---------- Defter: şehir ve güzergâh çipleri (hizalı, tek çizgide) ---------- */
.df-iller.df-satir{display:flex;align-items:center;gap:14px;overflow:visible;margin:0 0 10px;padding:10px 14px;background:var(--panel);border:1px solid var(--line);border-radius:6px}
.df-satir-ad{flex:none;min-width:84px;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--soft)}
.df-satir-ic{flex:1;min-width:0;display:flex;gap:8px;overflow-x:auto;padding:2px 0;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
.df-satir-ic::-webkit-scrollbar{display:none}
.df-iller.df-satir a{flex:none;display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 15px;border:1px solid var(--line);border-radius:6px;background:var(--bg,#fff);font-size:14px;font-weight:600;line-height:1;white-space:nowrap;transition:border-color .2s,color .2s,background .2s,transform .2s}
.df-iller.df-satir a:hover,.df-iller.df-satir a:focus-visible{border-color:var(--or);color:var(--or);transform:translateY(-1px)}
.df-iller.df-satir a.on{background:var(--or-soft);border-color:var(--or);color:var(--or)}
.df-iller.df-satir a small{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;border-radius:6px;background:var(--or-soft);color:var(--or);font-size:12px;font-weight:800}
@media (min-width:900px){
  .df-satir-ic{flex-wrap:wrap;overflow:visible;-webkit-mask-image:none;mask-image:none}
}
@media (max-width:640px){
  .df-iller.df-satir{flex-direction:column;align-items:stretch;gap:6px;padding:10px 12px}
  .df-satir-ad{min-width:0}
}
@media (prefers-reduced-motion:reduce){.df-iller.df-satir a{transition:none}.df-iller.df-satir a:hover{transform:none}}

/* Çip satırları: etiket üstte, çipler kartın tam genişliğini kullanır (dar ya da geniş sütunda aynı düzgün görünüm) */
.df-iller.df-satir{flex-direction:column;align-items:stretch;gap:8px;padding:12px 14px}
.df-satir-ad{min-width:0}
.df-satir-ic{flex:none;width:100%;flex-wrap:wrap;overflow:visible;-webkit-mask-image:none;mask-image:none}
.df-satir-rota .df-satir-ic{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}
.df-satir-rota a{justify-content:space-between;width:100%}
@media (max-width:640px){
  .df-satir-rota .df-satir-ic{grid-template-columns:1fr}
}


/* ==========================================================
   CİLA: yazma formu (yazılan alan belli), mobil sıra ve mobil kartlar
   ========================================================== */
.df-yaz{padding:18px 20px 16px;border-top:4px solid var(--or)}
.df-yaz-bas{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:0 0 12px}
.df-yaz-bas b{font:800 18px/1.2 "Bricolage Grotesque",sans-serif;letter-spacing:-.02em}
.df-yaz-bas span{font-size:13.5px;color:var(--soft)}
.df-yaz textarea{display:block;width:100%;min-height:112px;padding:14px 16px;border:2px solid var(--line);border-radius:14px;background:var(--panel-2);resize:vertical;font-size:17px;line-height:1.5;color:var(--ink);transition:border-color .15s,box-shadow .15s,background .15s}
.df-yaz textarea::placeholder{color:var(--soft);opacity:.75}
.df-yaz textarea:hover{border-color:color-mix(in srgb,var(--or) 45%,var(--line))}
.df-yaz textarea:focus{outline:0;border-color:var(--or);background:var(--panel);box-shadow:0 0 0 4px rgba(232,90,18,.15)}
.df-yaz .df-alanlar{margin-top:14px;padding-top:14px;border-top:1px dashed var(--line)}
.df-yaz .df-alanlar input,.df-yaz .df-alanlar select{border:1.5px solid var(--line);border-radius:10px;padding:10px 14px;background:var(--panel)}
.df-yaz .df-alanlar input:focus,.df-yaz .df-alanlar select:focus{outline:0;border-color:var(--or);box-shadow:0 0 0 3px rgba(232,90,18,.14)}
.df-yaz .df-tur-sec span{border-radius:999px;padding:7px 16px}
.df-yaz .df-yaz-alt .btn.go{border-radius:12px;padding:12px 30px;box-shadow:0 12px 22px -12px rgba(232,90,18,.9)}

/* Küçük ekran: yazma formu EN ÜSTTE, hemen altında gönderiler; süzgeç/bilgi kartları listenin altına iner */
@media(max-width:960px){
  .df-sayfa.df-formlu{display:flex;flex-direction:column;gap:0;padding-top:14px;align-items:stretch}
  .df-formlu .df-yan,.df-formlu .df-ana{display:contents}
  .df-formlu #dfYaz{order:1;margin-bottom:16px}
  .df-formlu #dfSonuc{order:2;min-width:0;margin-bottom:6px}
  .df-formlu .df-yan>*{order:3}
}

@media(max-width:720px){
  /* yazma formu */
  .df-yaz{padding:16px 14px 14px;border-radius:16px}
  .df-yaz textarea{font-size:16.5px;min-height:120px}
  .df-yaz .df-alanlar{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .df-yaz .df-alanlar input,.df-yaz .df-alanlar select{width:100%;min-width:0;flex:none;font-size:16px}
  .df-yaz .df-alanlar input[name=nereden_il],.df-yaz .df-alanlar input[name=nereye_il],.df-yaz .df-yonetim input{grid-column:1/-1}
  .df-yaz .df-alanlar.df-yonetim{grid-template-columns:1fr}
  .df-yaz .df-yaz-alt{flex-direction:column-reverse;align-items:stretch;gap:12px}
  .df-yaz .df-yaz-alt .btn.go{width:100%;padding:14px;font-size:16px}
  .df-yaz .df-yaz-alt .small{text-align:center}

  /* gönderi kartı */
  .df-k{padding:14px;border-radius:16px;border-left-width:5px}
  .df-k .df-bas{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:4px 12px}
  .df-k .df-av{width:46px;height:46px;border-radius:12px;grid-row:1/3}
  .df-k .df-kim{grid-column:2;display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
  .df-k .df-kim>a,.df-k .df-kim>b{font-size:16px;line-height:1.25;min-width:0;overflow-wrap:anywhere}
  .df-k .df-kim b{font-size:16px}
  .df-k .df-islem{grid-column:3;grid-row:1}
  .df-k .df-islem>summary{padding:7px 12px;font-size:13.5px;border-radius:10px}
  .df-k .df-kim .df-alt{flex:1 0 100%;margin:0;justify-content:flex-start;flex-wrap:wrap;white-space:normal;gap:4px 8px;font-size:12.5px}
  .df-k .df-kim .df-tel{flex:1 0 100%;margin:4px 0 0;display:grid;grid-template-columns:1fr;gap:8px}
  .df-k .df-tel-no{display:flex;align-items:center;justify-content:center;gap:6px;padding:10px 12px;border-radius:12px;background:#E2F3EA;border:1px solid #BFE3CE;color:#14633C;font-size:15.5px;text-align:center}
  .df-k .df-tel-wa{display:flex;align-items:center;justify-content:center;padding:10px 14px;border-radius:12px;font-size:14px}
  .df-k .df-etiket{gap:8px;margin:14px 0 8px}
  .df-k .df-etiket .df-tur{padding:5px 12px;border-radius:999px;font-size:12.5px}
  .df-k .df-etiket .df-rota,.df-k .df-etiket h1{flex:1 0 calc(100% - 100px);font:800 21px/1.2 "Bricolage Grotesque",sans-serif;letter-spacing:-.02em;min-width:0}
  .df-k .df-cip{padding:4px 11px;border-radius:999px}
  .df-k .df-metin{margin:10px 0 12px;padding:13px 14px;border-radius:12px;font-size:16px;line-height:1.55}
  .df-k .df-metin-satir{flex-direction:column;align-items:stretch;gap:10px}
  .df-k .df-metin-t{flex:none}
  .df-k .df-sorun{align-self:flex-end;margin-left:0;border-radius:999px;padding:6px 12px}
  .df-k .df-tus{gap:8px}
  .df-k .df-sayi{display:inline-flex;align-items:center;padding:9px 16px;border-radius:999px;background:var(--or-soft);border:1px solid #FBD0AE;color:var(--or);font-weight:800;font-size:14px;text-decoration:none}
  .df-k .df-yanit-form{display:flex;flex-direction:column;gap:10px;margin-top:12px}
  .df-k .df-yanit-form input{width:100%;box-sizing:border-box;padding:13px 14px;border:1.5px solid var(--line);border-radius:12px;background:var(--panel-2);font-size:16px}
  .df-k .df-yanit-form input:focus{outline:0;border-color:var(--or);box-shadow:0 0 0 3px rgba(232,90,18,.14);background:var(--panel)}
  .df-k .df-yanit-form .btn{width:100%;padding:13px;border-radius:12px;font-size:16px}
  .df-k .df-gizli-not{margin:10px 0 0;font-size:12.5px;line-height:1.45}
  .df-k:target{outline-offset:1px}
}
@media(prefers-color-scheme:dark){
  .df-yaz textarea{background:rgba(255,255,255,.05)}
  .df-k .df-tel-no{background:rgba(23,121,74,.2);border-color:rgba(79,203,140,.4);color:#8EE0B4}
}

/* ==========================================================
   MOBİL İNCE AYAR: tek satırlık üst bilgi, telefon + WhatsApp simgesi aynı satırda
   ========================================================== */
@media(max-width:720px){
  /* Üst bilgi bloğu: [ad … ✓] / [rozet · il · zaman] / [telefon + WhatsApp simgesi] */
  .df-k .df-kim{display:grid;grid-template-columns:minmax(0,max-content) auto 1fr;align-items:center;gap:4px 8px}
  .df-k .df-kim>a,.df-k .df-kim>b{grid-column:1;grid-row:1;min-width:0}
  .df-k .df-kim>a b,.df-k .df-kim>b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .df-k .df-tik{grid-column:2;grid-row:1;flex:none;margin:0}
  .df-k .df-kim .df-alt{grid-column:1/-1;grid-row:2;display:flex;flex-wrap:nowrap;white-space:nowrap;overflow:hidden;gap:5px;font-size:11.5px;margin:0}
  .df-k .df-kim .df-alt .uy-badge{flex:none;padding:2px 8px}
  .df-k .df-kim .df-alt a,.df-k .df-kim .df-alt time{min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:11.5px}
  .df-k .df-kim .df-tel{grid-column:1/-1;grid-row:3;display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:4px 0 0}
  /* İşlemler: yalnızca ⋯ düğmesi */
  .df-k .df-islem>summary{display:grid;place-items:center;width:38px;height:38px;padding:0;border-radius:50%;font-size:0;line-height:0}
  .df-k .df-islem>summary::before{content:"⋯";font-size:22px;line-height:1;color:var(--ink);font-weight:800;margin-top:-6px}
  /* Tür + rota (+ sığarsa tarih) tek satır; sığmayan etiketler alt satıra iner */
  .df-k .df-etiket{flex-wrap:wrap;align-items:center;gap:6px 8px}
  .df-k .df-etiket .df-tur{flex:none;padding:4px 10px;font-size:11.5px}
  .df-k .df-etiket .df-rota,.df-k .df-etiket h1.df-rota{flex:0 1 auto;min-width:0;max-width:100%;font-size:17.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .df-k .df-etiket .df-cip{flex:none;white-space:nowrap;padding:3px 10px;font-size:12px}
  /* Telefon dar, WhatsApp yalnızca simge ve hemen yanında */
  .df-k .df-tel-no{flex:0 1 auto;width:auto;padding:9px 14px;font-size:15px;white-space:nowrap}
  .df-k .df-tel-wa{order:2;flex:none;width:42px;height:42px;padding:0;border-radius:50%;font-size:0;line-height:0;color:transparent;
    background:#25D366 url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M12.04 2a9.9 9.9 0 0 0-8.5 14.96L2 22l5.2-1.5A9.9 9.9 0 1 0 12.04 2zm0 1.8a8.1 8.1 0 1 1-4.3 15l-.3-.2-3 .9.9-2.9-.2-.3a8.1 8.1 0 0 1 6.9-12.5zM8.9 7.4c-.2 0-.5.1-.7.3-.3.3-1 1-1 2.4s1 2.8 1.2 3c.1.2 2 3.1 4.9 4.3 2.4 1 2.9.8 3.4.7.5-.1 1.7-.7 1.9-1.4.2-.7.2-1.2.2-1.4l-.5-.3-1.8-.9c-.3-.1-.5-.1-.7.2l-.8 1c-.1.2-.3.2-.6.1-.3-.2-1.1-.4-2.1-1.3-.8-.7-1.3-1.5-1.4-1.8-.2-.3 0-.4.1-.6l.4-.5.3-.5c.1-.2 0-.4 0-.5l-.8-2c-.2-.5-.4-.5-.6-.5h-.5z'/></svg>") center/24px 24px no-repeat;
    box-shadow:0 8px 16px -10px rgba(37,211,102,.9)}
}

/* ---------- Yazışmalar penceresi: son yazan firma açık, diğerleri yandan açılır ---------- */
.df-kon-govde{position:relative;overflow:hidden;border-radius:12px}
.df-kon-ust{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px;padding:10px 12px;border:1px solid #FBD0AE;border-radius:12px;background:var(--or-soft)}
.df-kon-simdi{min-width:0;display:grid}
.df-kon-simdi small{font-size:11px;font-weight:800;letter-spacing:.03em;white-space:nowrap;text-transform:uppercase;color:var(--or)}
.df-kon-simdi b{font-size:16px;line-height:1.25;overflow-wrap:anywhere}
.df-kon-ac{flex:none;display:inline-flex;align-items:center;gap:6px;border-radius:999px;font-weight:800;white-space:nowrap}
.df-kon-ac[hidden]{display:none}
.df-kon-say{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--or);color:#fff;font-size:12px;font-weight:800}
.df-kon-yan{position:absolute;z-index:5;top:0;bottom:0;right:0;width:min(280px,82%);display:flex;flex-direction:column;gap:8px;padding:12px;border-left:1px solid var(--line);border-radius:12px 0 0 12px;background:var(--panel,#fff);
  box-shadow:-18px 0 36px -20px rgba(19,35,58,.5);transform:translateX(104%);visibility:hidden;transition:transform .25s ease,visibility .25s}
.df-kon-govde.yan-acik .df-kon-yan{transform:none;visibility:visible}
.df-kon-yan-bas{display:flex;align-items:center;justify-content:space-between;gap:8px}
.df-kon-yan-bas b{font-size:15px}
.df-kon-yan-bas .btn{width:34px;height:34px;padding:0;border-radius:50%;font-size:18px;line-height:1}
.df-kon-yan .df-kon-sekme{display:grid;gap:6px;margin:0;overflow-y:auto}
.df-kon-yan .df-kon-sekme button{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;text-align:left;padding:11px 12px;border-radius:10px}
.df-kon-yan .df-kon-sekme button b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14.5px}
.df-kon-yan .df-kon-sekme button em{flex:none;margin:0;min-width:22px;padding:1px 7px;border-radius:999px;background:var(--panel);border:1px solid var(--line);text-align:center}
.df-kon-yan .df-kon-sekme button.acik{border-color:var(--or);background:var(--or-soft)}
@media(prefers-reduced-motion:reduce){.df-kon-yan{transition:none}}

/* Yazılan rakamlar: altın sarısı vurgu */
mark.df-rk{background:linear-gradient(180deg,rgba(255,200,40,.0) 55%,rgba(255,200,40,.34) 55%);color:#9A6A00;font-weight:800;padding:0 2px;border-radius:3px;font-variant-numeric:tabular-nums}
@media (prefers-color-scheme:dark){mark.df-rk{background:none;color:#FFD25A;text-shadow:0 0 12px rgba(255,200,60,.35)}}

/* Giriş yapmamış ziyaretçi: numara yerine kilit bağlantısı */
.df-tel-kilit{display:inline-flex;align-items:center;gap:6px;margin-top:6px;padding:7px 12px;border:1px dashed var(--line);border-radius:999px;background:var(--panel-2);color:var(--soft);font-size:13px;font-weight:700;text-decoration:none}
.df-tel-kilit:hover{border-color:var(--or);color:var(--or)}
.df-kim .df-tel-kilit{flex-basis:100%;width:max-content;max-width:100%}
@media(max-width:720px){.df-k .df-kim .df-tel-kilit{grid-column:1/-1;grid-row:3;margin:4px 0 0;white-space:normal}}
/* Telefon yasağı penceresi */
.df-yasak-pen{border:0;border-radius:14px;padding:0;max-width:min(92vw,420px);box-shadow:0 20px 60px -10px rgba(0,0,0,.45);background:var(--panel,#fff);color:var(--ink,#111)}
.df-yasak-pen::backdrop{background:rgba(15,23,42,.55)}
.df-yasak-ic{padding:22px 22px 18px;text-align:center}
.df-yasak-ic .ik{display:grid;place-items:center;width:54px;height:54px;margin:0 auto 10px;border-radius:50%;background:#FDECEA;color:#B42318;font-size:28px}
.df-yasak-ic h3{margin:0 0 6px;font-size:19px}
.df-yasak-ic p{margin:0 0 16px;font-size:14.5px;line-height:1.5;color:var(--soft)}
.df-yasak-ic button{min-width:140px;padding:11px 18px;border:0;border-radius:10px;background:var(--or);color:#fff;font:inherit;font-weight:800;cursor:pointer}

/* "Numarayı görmek için firma girişi yap" hapı mobilde kartın dışına taşıyordu */
.df-k .df-kim>a.df-tel-kilit,.df-k .df-kim .df-tel-kilit{box-sizing:border-box;width:auto;max-width:100%;min-width:0;white-space:normal;overflow-wrap:anywhere;line-height:1.35;text-align:left;border-radius:14px;font-size:13px;font-weight:700;padding:8px 12px;flex:1 0 100%}
@media(max-width:720px){.df-k .df-kim>a.df-tel-kilit{font-size:13px;grid-column:1/-1}}
.df-k{min-width:0;max-width:100%}

/* Defter (mobil): altta sabit sekme çubuğu var; WhatsApp / yukarı çık düğmeleri onun üstüne alınır */
@media (max-width:720px){
  body:has(.df-sekme) .cd{bottom:calc(12px + 86px + 12px)}
}

/* Paylaşım sayısı: gün / hafta / ay / yıl ayrı kutularda, rakamlar vurgulu */
.df-donem{margin-top:14px}
.df-donem-ad{margin:0 0 8px;font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--soft);text-transform:uppercase}
.df-donem-izgara{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.df-d{padding:10px 6px 9px;text-align:center;border:1px solid var(--line);border-radius:10px;background:var(--panel-2,#f4f6f9)}
.df-d b{display:block;font:800 28px/1.05 "Bricolage Grotesque",sans-serif;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--ink)}
.df-d span{display:block;margin-top:4px;font-size:13px;font-weight:700;color:var(--ink)}
.df-d small{display:block;margin-top:1px;font-size:11px;color:var(--soft);white-space:nowrap}
.df-d.bugun{border-color:var(--or);background:var(--or-soft)}
.df-d.bugun b{color:var(--or)}
@media (max-width:380px){.df-d b{font-size:24px}.df-d small{font-size:10px}}