/* =========================================================================
   kuyruk.css — İNTERNETSİZ KAYIT bileşenleri (bkz. js/kuyruk-ui.js)
   Yalnız tasarım tokenları kullanılır (TASARIM.md §2).
   ========================================================================= */

/* Üst çubuk bağlantı / kuyruk düğmesi */
.ag-btn { position: relative; color: var(--metin-3); }
.ag-btn[hidden] { display: none; }              /* bağlantı varken ve kuyruk boşken görünmez */
.ag-btn .ag-simge { display: grid; place-items: center; }
.ag-btn .ag-simge svg { width: 1.375rem; height: 1.375rem; }
.ag-btn.ag-yok { color: var(--kirmizi); }
.ag-btn.ag-bekliyor { color: var(--turuncu); }
.ag-btn.ag-hata { color: var(--kirmizi); }
.ag-rozet {
  position: absolute; top: .2rem; right: .1rem; min-width: 1.125rem; height: 1.125rem; padding: 0 .3rem;
  background: var(--turuncu); color: var(--yuzey); border-radius: 999px;
  font-size: .6875rem; font-weight: 600; line-height: 1.125rem; text-align: center;
  border: 2px solid var(--yuzey);
}
.ag-rozet.hata { background: var(--kirmizi); color: var(--kirmizi-u); }
.ag-rozet[hidden] { display: none; }

/* Panel */
.kq-ust { display: flex; align-items: center; gap: .625rem; flex-wrap: wrap; margin-bottom: .5rem; }
.kq-ust-yazi { font-size: .875rem; color: var(--metin-2); flex: 1 1 12rem; }
.kq-liste {
  list-style: none; margin: 0 0 1rem; padding: 0; overflow: hidden;
  background: var(--yuzey); border: var(--kenar) solid var(--cizgi); border-radius: var(--r-l);
}
.kq-satir { padding: .75rem 1rem; border-bottom: var(--kenar) solid var(--cizgi); }
.kq-satir:last-child { border-bottom: 0; }
.kq-satir.kq-hata-kalici { box-shadow: inset 3px 0 0 var(--kirmizi); }
.kq-ozet { font-weight: 500; font-size: .9375rem; overflow-wrap: anywhere; }
.kq-alt { display: flex; align-items: center; gap: .5rem; flex-wrap: nowrap; margin-top: .25rem; font-size: .8125rem; color: var(--metin-2); }
.kq-hata { margin-top: .375rem; font-size: .8125rem; color: var(--kirmizi); font-weight: 500; }
.kq-not { margin-top: .375rem; font-size: .8125rem; color: var(--metin-2); }
.kq-makbuz { margin-top: .375rem; font-size: .8125rem; color: var(--metin-2); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.kq-eylem { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .5rem; }
.kq-bos { text-align: center; color: var(--metin-2); padding: 1rem .5rem; }

/* Listedeki "bekliyor" satırı (kuyrukSatirHtml), eski kart (kuyrukKartHtml) ve satır rozeti */
.kq-satir-liste { cursor: pointer; }
.kq-kart { border-style: dashed; }
.kq-kart-not { margin-top: .375rem; font-size: .75rem; color: var(--metin-2); }
.kq-rozet { margin-left: .375rem; vertical-align: middle; }

/* Taslak şeridi (form üstünde) */
.taslak-serit {
  display: flex; align-items: center; gap: .5rem; flex-wrap: nowrap;
  background: var(--yuzey-2); color: var(--metin); border: var(--kenar) solid var(--cizgi-guclu);
  border-radius: var(--r-m); padding: .5rem .75rem; margin-bottom: .875rem; font-size: .875rem; font-weight: 500;
}
.taslak-serit span { flex: 1 1 0; min-width: 0; line-height: 1.3; }
.taslak-serit .btn { flex: 0 0 auto; white-space: nowrap; }
.taslak-serit small { font-weight: 400; color: var(--metin-2); }

/* Çevrimdışı şeridi çok uzun metinde iki satıra insin */
.cevrimdisi-serit { line-height: 1.3; padding-inline: .75rem; }

.kq-makbuz b { font-weight: 600; }