/* 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:12px;z-index:20;margin:0}
  .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}
/* İl seçimi + yanındaki serbest yazı (semt/ilçe) tek çift olarak durur */
.df-cift{display:flex;gap:6px;flex:2 1 300px;min-width:0}
.df-cift select,.df-cift input{flex:1 1 0;min-width:0;width:auto}
@media(max-width:520px){.df-cift{flex-basis:100%}}