/* ==========================================================================
   BİLEŞEN — DURUM EKRANLARI
   Boş · sonuç yok · hata · yükleniyor · kapalı · iskelet
   Mutlu yol tek yol değildir; her durumun kendi tasarımı vardır.
   ========================================================================== */

.mu-durum {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--sp-3);
  padding: clamp(40px, 8vw, 76px) var(--sp-5);
  border: 1px dashed var(--cizgi);
  border-radius: var(--r-md);
  background: var(--yuzey);
}
.mu-durum__gorsel {
  width: 78px; height: 78px;
  display: grid; place-items: center;
  border-radius: var(--r-pill);
  background: var(--kirmizi-sis);
  color: var(--kirmizi-500);
  margin-bottom: var(--sp-2);
  position: relative;
}
.mu-durum__gorsel::after {
  content: "";
  position: absolute;
  inset: -9px;
  border: 1px dashed rgba(225, 6, 0, 0.3);
  border-radius: var(--r-pill);
}
.mu-durum__gorsel .mu-ikon { width: 32px; height: 32px; }
.mu-durum__baslik { font-size: var(--fs-h3); color: var(--metin); }
.mu-durum__mesaj { font-size: var(--fs-sm); color: var(--metin-2); max-width: 46ch; line-height: 1.65; }
.mu-durum .mu-btn { margin-top: var(--sp-3); }
.mu-durum .mu-bag { margin-top: 2px; }

.mu-durum--hata .mu-durum__gorsel { background: var(--hata-sis); color: var(--hata-400); }
.mu-durum--hata .mu-durum__gorsel::after { border-color: rgba(220, 38, 38, 0.3); }
.mu-durum--kapali .mu-durum__gorsel { background: var(--altin-sis); color: var(--altin-400); }
.mu-durum--kapali .mu-durum__gorsel::after { border-color: rgba(255, 193, 7, 0.3); }
.mu-durum--sonucYok .mu-durum__gorsel { background: var(--yuzey); color: var(--metin-3); border: 1px solid var(--cizgi); }


/* Satır içi (küçük) durum */
.mu-durum--sik { padding: var(--sp-6) var(--sp-4); }
.mu-durum--sik .mu-durum__gorsel { width: 54px; height: 54px; }
.mu-durum--sik .mu-durum__gorsel .mu-ikon { width: 22px; height: 22px; }
.mu-durum--sik .mu-durum__baslik { font-size: var(--fs-h4); }

/* ------------------------------------------------------------- iskeletler */
.mu-isk-kart {
  border: 1px solid var(--cizgi);
  border-radius: var(--r-md);
  overflow: hidden;
  background: var(--yuzey);
}
.mu-isk-kart__gorsel { width: 100%; aspect-ratio: 4 / 3; border-radius: 0; }
.mu-isk-kart__govde { padding: var(--sp-4); display: grid; gap: 9px; }

.mu-isk-satir {
  display: flex; align-items: center; gap: var(--sp-4);
  padding: var(--sp-4);
  border: 1px solid var(--cizgi);
  border-radius: var(--r-md);
  background: var(--yuzey);
}
.mu-isk-satir + .mu-isk-satir { margin-top: 10px; }

/* ------------------------------------------------------ yükleniyor işareti */
.mu-yukleniyor {
  display: flex; flex-direction: column; align-items: center; gap: var(--sp-4);
  padding: clamp(40px, 7vw, 72px) var(--sp-5);
  color: var(--metin-2);
  font-size: var(--fs-sm);
}
.mu-firildak {
  width: 36px; height: 36px;
  border: 2.5px solid var(--cizgi);
  border-top-color: var(--kirmizi-500);
  border-radius: 50%;
  animation: mu-don 720ms linear infinite;
}
.mu-firildak--sm { width: 20px; height: 20px; border-width: 2px; }

/* Üç noktalı bekleme (ateş kıvılcımı) */
.mu-nokta { display: inline-flex; gap: 5px; align-items: center; }
.mu-nokta span {
  width: 6px; height: 6px;
  background: var(--kirmizi-500);
  transform: rotate(45deg);
  animation: mu-nabiz 1.05s infinite ease-in-out;
}
.mu-nokta span:nth-child(2) { animation-delay: 0.14s; }
.mu-nokta span:nth-child(3) { animation-delay: 0.28s; }
@keyframes mu-nabiz {
  0%, 80%, 100% { opacity: 0.28; transform: rotate(45deg) scale(0.8); }
  40% { opacity: 1; transform: rotate(45deg) scale(1.15); }
}

/* ---------------------------------------------------- restoran kapalı bandı */
.mu-kapali-bant {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 14px var(--oluk);
  background: var(--altin-sis);
  border-bottom: 1px solid rgba(255, 193, 7, 0.3);
  color: var(--altin-400);
  font-size: var(--fs-sm);
  font-weight: 700;
}
.mu-kapali-bant .mu-ikon { width: 18px; height: 18px; flex: none; }
.mu-kapali-bant span { font-weight: 500; color: var(--metin-2); }

/* --------------------------------------------------------- satış dışı etiketi */
.mu-tukendi-yazi {
  font-family: var(--font-metin);
  font-size: var(--fs-micro);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--hata-400);
}

/* Giris gerekiyor -- ARIZA DEGIL (Sprint 34). Kirmizi hata sisi yerine
   markanin lacivert yuzeyi: kullaniciya bir sey bozuldugu degil, bir adim
   kaldigi soyleniyor. */
.mu-durum--girisGerek .mu-durum__gorsel { background: var(--lacivert-sis); color: var(--lacivert-700); }
.mu-durum--girisGerek .mu-durum__gorsel::after { border-color: rgba(20, 33, 61, 0.24); }