/* ================= SİTE MESAJLARI (2026-10-23) =================
   Ticimax sitesinden gelen müşteri mesajları gelen kutusu. İki sütun (liste · ayrıntı) TEK EKRAN: sütunlar kendi içinde kayar, sayfa kaymaz.
   Mobil (≤ 860 px) tek sütun: liste → mesaja dokununca ayrıntı (← Liste). Renkler yalnız tema belirteçleri (açık / koyu / Nova); sabit renk yok.
   Ortak desen: --elev/--radius/--ease sözlüğü, themes.css .mobil-sekme / .mobil-suzgec / .mobil-arac. */
.sm-sayfa{padding:14px 18px 18px; min-width:0;}
.sm-grid{display:grid; grid-template-columns:minmax(300px,380px) minmax(0,1fr); gap:14px; height:calc(100vh - 118px); min-height:460px; min-width:0;}
.sm-liste, .sm-detay{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg, 14px); box-shadow:var(--elev-1, none); display:flex; flex-direction:column; min-height:0; min-width:0; overflow:hidden;}

/* ---- liste ---- */
.sm-liste-bas{padding:10px 12px; border-bottom:1px solid var(--line); display:flex; flex-direction:column; gap:8px;}
.sm-sekmeler{display:flex; gap:6px; flex-wrap:wrap;}
.sm-sekme{font:inherit; font-size:12px; font-weight:600; padding:4px 10px; border-radius:999px; border:1px solid var(--line); background:transparent; color:var(--ink-muted); cursor:pointer; transition:border-color .12s var(--ease, ease), color .12s var(--ease, ease);}
.sm-sekme b{color:var(--ink); font-variant-numeric:tabular-nums; margin-left:4px;}
.sm-sekme:hover{border-color:var(--accent); color:var(--ink);}
.sm-sekme.aktif{background:color-mix(in srgb, var(--accent) 14%, transparent); border-color:var(--accent); color:var(--ink);}
.sm-sekme.uyari b{color:var(--critical);}
.sm-filtre{display:grid; grid-template-columns:1fr 1fr; gap:6px;}
.sm-filtre select, .sm-filtre input, .sm-ata-sec, .sm-durum-sec{padding:7px 9px; border:1px solid var(--line); border-radius:9px; background:var(--surface-2, transparent); color:var(--ink); font:inherit; font-size:12.5px; min-width:0; max-width:100%;}
.sm-filtre input{grid-column:1 / -1;}
.sm-benim{display:inline-flex; align-items:center; gap:6px; font-size:12.5px; color:var(--ink-muted); padding:0 4px;}
.sm-liste-govde{overflow:auto; flex:1; min-height:0;}
.sm-satir{display:flex; gap:10px; width:100%; text-align:left; padding:10px 12px; border:0; border-bottom:1px solid var(--line-soft, var(--line)); background:transparent; color:var(--ink); font:inherit; cursor:pointer; min-width:0; transition:background .12s var(--ease, ease);}
.sm-satir:hover{background:color-mix(in srgb, var(--accent) 7%, transparent);}
.sm-satir.aktif{background:color-mix(in srgb, var(--accent) 13%, transparent);}
.sm-satir:focus-visible{outline:2px solid var(--accent); outline-offset:-2px;}
.sm-avatar{width:34px; height:34px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:14px; color:var(--accent-contrast); background:var(--accent);}
.sm-satir-ic{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px;}
.sm-satir-ust{display:flex; justify-content:space-between; gap:8px; align-items:baseline; min-width:0;}
.sm-satir-ad{font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0;}
.sm-satir.yeni .sm-satir-ad{font-weight:800;}
.sm-satir-zaman{font-size:10.5px; color:var(--ink-muted); white-space:nowrap; flex:none;}
.sm-satir.yeni .sm-satir-zaman{color:var(--accent); font-weight:700;}
.sm-satir-ozet{font-size:12px; color:var(--ink-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.sm-satir.yeni .sm-satir-ozet{color:var(--ink);}
.sm-satir-alt{display:flex; gap:4px; flex-wrap:wrap; align-items:center; min-height:4px;}
.sm-nokta{width:8px; height:8px; border-radius:50%; background:var(--accent); flex:none;}
.sm-mini{font-size:10px; font-weight:700; padding:1px 7px; border-radius:999px; background:color-mix(in srgb, var(--ink-muted) 15%, transparent); color:var(--ink-muted); white-space:nowrap;}
.sm-mini.mus{background:color-mix(in srgb, var(--good) 16%, transparent); color:var(--good);}
.sm-mini.atanan{background:color-mix(in srgb, var(--accent) 15%, transparent); color:var(--accent);}
.sm-mini.durum-yanitlandi{background:color-mix(in srgb, var(--good) 16%, transparent); color:var(--good);}
.sm-mini.durum-kapandi{background:color-mix(in srgb, var(--ink-muted) 22%, transparent);}
.sm-mini.durum-yeni{background:color-mix(in srgb, var(--accent) 18%, transparent); color:var(--accent);}
.sm-bos{padding:36px 18px; text-align:center; color:var(--ink-muted); font-size:13px; line-height:1.55;}
.sm-sayfalama{display:flex; justify-content:space-between; align-items:center; gap:8px; padding:8px 12px; border-top:1px solid var(--line); font-size:12px; color:var(--ink-muted);}
.sm-sayfalama .btn{padding:4px 10px; font-size:12px;}

/* ---- ayrıntı ---- */
.sm-detay-ic{display:flex; flex-direction:column; flex:1; min-height:0; min-width:0;}
.sm-detay-bas{display:flex; justify-content:space-between; gap:10px; padding:11px 14px; border-bottom:1px solid var(--line); flex-wrap:wrap; align-items:center;}
.sm-baslik{display:flex; gap:10px; align-items:center; min-width:0;}
.sm-ad{font-weight:800; font-size:15px; overflow-wrap:anywhere;}
.sm-ust-chip{display:flex; gap:5px; flex-wrap:wrap; margin-top:3px;}
.sm-bas-islem{display:flex; gap:8px; align-items:center; flex-wrap:wrap;}
.sm-geri{display:none;}
.sm-detay-govde{flex:1; min-height:0; overflow:auto; padding:12px 14px; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:12px; align-content:start;}
.sm-sol, .sm-sag{display:flex; flex-direction:column; gap:10px; min-width:0;}
.sm-mesaj-kutusu{border:1px solid var(--line); border-radius:12px; background:color-mix(in srgb, var(--accent) 4%, var(--surface)); padding:12px 14px; min-width:0;}
.sm-mesaj{font-size:14px; line-height:1.6; white-space:pre-wrap; overflow-wrap:anywhere; max-height:30vh; overflow:auto;}
.sm-alt-bilgi{display:flex; flex-wrap:wrap; gap:4px 12px; margin-top:10px; padding-top:8px; border-top:1px dashed var(--line); font-size:11px; color:var(--ink-muted);}
.sm-kutu{border:1px solid var(--line); border-radius:12px; padding:10px 12px; min-width:0;}
.sm-kutu-bas{font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-muted); margin-bottom:6px; display:flex; justify-content:space-between; align-items:center; gap:8px;}
.sm-kutu-bas small{font-weight:600; text-transform:none; letter-spacing:0;}
.sm-alt-bas{font-size:10.5px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-muted); margin:10px 0 4px;}
.sm-kv{display:flex; justify-content:space-between; gap:10px; font-size:12.5px; padding:3px 0; min-width:0;}
.sm-kv > span:first-child{color:var(--ink-muted); flex:none;}
.sm-kv > span:last-child{text-align:right; overflow-wrap:anywhere; min-width:0;}
.sm-sessiz{font-size:12px; color:var(--ink-muted); line-height:1.5;}
.sm-ipucu{margin-top:4px;}
.sm-uyari{color:var(--critical); font-weight:700; font-size:12px;}
.sm-sip{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:2px 10px; align-items:baseline; padding:6px 0; border-bottom:1px dashed var(--line-soft, var(--line)); font-size:12.5px; min-width:0;}
.sm-sip-no{display:inline-flex; align-items:center; gap:2px; min-width:0; white-space:nowrap;}
.sm-sip:last-child{border-bottom:0;}
.sm-sip-durum{color:var(--ink-muted); font-size:11.5px; overflow-wrap:anywhere; min-width:0; display:inline-flex; flex-wrap:wrap; gap:0 4px; align-items:center;}
.sm-sip-tutar{text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap;}
.sm-sip-ek{text-align:right; font-size:11.5px;}
.sm-sayfa .link{color:var(--accent); cursor:pointer; text-decoration:underline dotted; text-underline-offset:3px;}
.sm-not{font-size:12.5px; padding:7px 9px; border-radius:9px; background:color-mix(in srgb, var(--warn) 10%, transparent); margin-bottom:6px; white-space:pre-wrap; overflow-wrap:anywhere;}
.sm-not-kim{font-size:10.5px; color:var(--ink-muted); margin-top:2px;}
.sm-not-form{display:flex; gap:6px; margin-top:6px;}
.sm-not-form input{flex:1; min-width:0; padding:7px 9px; border:1px solid var(--line); border-radius:9px; background:var(--surface-2, transparent); color:var(--ink); font:inherit; font-size:12.5px;}
.sm-eylemler{display:flex; flex-wrap:wrap; gap:8px; padding:10px 14px; border-top:1px solid var(--line); background:var(--surface);}
.sm-eylemler .btn{padding:7px 12px; font-size:12.5px; text-decoration:none;}
.sm-eylemler .sm-bosluk{flex:1;}

/* ---- pencereler ---- */
.sm-pencere{max-width:min(560px, 96vw);}
.sm-pencere textarea, .sm-pencere input[type=number]{width:100%; box-sizing:border-box; padding:9px 11px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2, transparent); color:var(--ink); font:inherit; font-size:13px;}
.sm-pencere textarea{min-height:110px; resize:vertical;}
.sm-sablonlar{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:8px;}
.sm-sablonlar .btn{padding:4px 10px; font-size:12px;}
.sm-alan{display:flex; flex-direction:column; gap:5px; margin-bottom:12px;}
.sm-alan label{font-size:12px; color:var(--ink-muted);}
.sm-sayac{font-size:11.5px; color:var(--ink-muted); text-align:right;}
.sm-durum-metni{min-height:1.2em; font-size:12px; color:var(--ink-muted);}
.sm-durum-metni.hata{color:var(--critical);}

/* ---- ekran boyutları ---- */
@media (max-width:1180px){
  .sm-detay-govde{grid-template-columns:minmax(0,1fr);}
}
@media (max-width:860px){
  .sm-sayfa{padding:10px 8px 16px;}
  .sm-grid{grid-template-columns:minmax(0,1fr); height:auto; min-height:0;}
  .sm-detay{display:none;}
  .sm-grid.detay-acik .sm-liste{display:none;}
  .sm-grid.detay-acik .sm-detay{display:flex; min-height:calc(100vh - 150px);}
  .sm-liste-govde{max-height:none; overflow:visible;}
  .sm-geri{display:inline-flex;}
  .sm-eylemler{position:sticky; bottom:0;}
}
@media (max-width:640px){
  .sm-sayfa{padding:8px 6px 14px;}
  .sm-filtre select, .sm-filtre input{min-height:40px; font-size:16px;}
  .sm-detay-govde{padding:10px;}
  .sm-mesaj{max-height:none;}
  .sm-not-form input{font-size:16px; min-height:40px;}
  .sm-pencere textarea, .sm-pencere input[type=number]{font-size:16px;}
}