/* ============================================
   POZ ARAYÜZÜ · ÜÇ SAYFANIN ORTAK İLKELLERİ
   ============================================

   `kesif.html` · `pozlar.html` · `mahal-listesi.html`

   Bu kurallar iki ayrı sayfada birbirinden habersiz kopyalanmıştı ve
   zamanla AYRIŞMIŞLARDI: aynı `.sepet-sil` bir sayfada 26px, diğerinde
   24px; `.sablon-tablo th` 11px ile 10px. Keşif sayfası ikisini birden
   yükleyince sonuncusu kazanıyor ve düğmeler sessizce küçülüyordu.
   Tek kopyaya alındı (4 Eylül 2026); ölçüler keşif sayfasının sürümüdür.

   Yükleme sırası: bu dosya ÖNCE, sayfaya özgü dosya sonra.
   ============================================ */

.analiz-sarmal { overflow-x: auto; }

/* Arac cubugunda ETIKET + KUTU ciftini tek ogede tutar. Oncesi kardes
   ogelerdi; cubuk sardiginda etiket sag ucta kalip kutu alt satira
   dusuyordu. Olculdu: bu hata monokrom gecisinden ONCE de vardi
   (HEAD surumunde etiket 401px, kutu 441px). */
.cubuk-alan {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
  }

/* Bos durum bir CUMLEDIR, okunur. Mono ile yazilinca hem yorucu hem
   "sistem ciktisi" gibi duruyordu; govde fontuna alindi. */
.durum-kutusu {
    text-align: center;
    padding: var(--space-12) var(--space-4);
    color: var(--ink-muted);
    font-family: var(--font-body);
    font-size: var(--text-sm);
    line-height: 1.6;
    max-width: 62ch;
    margin: 0 auto;
  }

.hata-kutusu {
    padding: var(--space-6);
    background: var(--durum-hata-bg-guclu);
    border-left: 3px solid var(--durum-hata);
    margin-bottom: var(--space-4);
    font-size: var(--text-sm);
  }

.sepet-btn {
    padding: var(--space-2) var(--space-4);
    background: none;
    color: var(--ink-muted);
    border: 1px solid var(--line);
    border-radius: var(--radius-pill);
    font-family: var(--font-body);
    font-size: var(--text-sm);
    text-transform: none;
    letter-spacing: normal;
    cursor: pointer;
  }

.sepet-btn:hover { background: var(--surface); color: var(--ink); }

.sepet-btn.birincil { background: var(--ink); color: var(--bg); border-color: var(--ink); }

/* Hover once siyah->yesil idi; yesil kalkinca HICBIR SEY YAPMAZ olurdu. */
.sepet-btn.birincil:hover { background: var(--ink-hover); border-color: var(--ink-hover); color: var(--bg-elevated); }

.sepet-btn.tehlike:hover { color: var(--durum-hata); border-color: var(--durum-hata); background: none; }

.sepet-kod { font-family: var(--font-mono); color: var(--accent); white-space: nowrap; }

.sablon-tablo {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-xs);
    margin-top: var(--space-3);
  }

.sablon-tablo th {
    font-family: var(--font-mono);
    font-weight: 500;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ink-subtle);
    text-align: left;
    padding: var(--space-2) var(--space-3) var(--space-2) 0;
    border-bottom: 1px solid var(--line);
    white-space: nowrap;
  }

.sablon-tablo td {
    padding: var(--space-2) var(--space-3) var(--space-2) 0;
    border-bottom: 1px solid var(--line);
    vertical-align: top;
    line-height: 1.45;
  }

.sablon-tablo .sag { text-align: right; font-family: var(--font-mono); white-space: nowrap; }

.sablon-pasif { opacity: 0.45; }

.sablon-sabit {
    font-family: var(--font-mono);
    font-size: 10px;
    color: var(--durum-uyari-metin);
    background: var(--durum-uyari-bg);
    padding: 1px 5px;
    white-space: nowrap;
  }

.sablon-toplam {
    text-align: right;
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    margin-top: var(--space-3);
  }

.poz-dialog {
    border: 1px solid var(--ink);
    border-radius: var(--radius-kart);
    padding: 0;
    color: var(--ink);
    max-width: min(980px, 94vw);
    width: 100%;
    /* width:100% verilince tarayıcının kendi ortalaması düşüyor */
    margin: auto;
    background: var(--cam-zemin);
    -webkit-backdrop-filter: var(--cam-bulanik);
    backdrop-filter: var(--cam-bulanik);
    border-color: var(--cam-kenar);
    box-shadow: var(--golge), var(--cam-ic-isik);
  }

.poz-dialog::backdrop { background: rgba(26, 26, 26, 0.45); }

.poz-dialog-ic { padding: var(--space-6); }

.poz-dialog-baslik {
    font-family: var(--font-display);
    font-size: var(--text-xl);
    font-weight: var(--w-baslik);
    margin: 0 0 var(--space-2);
  }

.poz-dialog-altbaslik {
    font-family: var(--font-body);
    font-size: var(--text-xs);
    color: var(--accent);
    margin: 0 0 var(--space-4);
  }

.poz-dialog-govde { max-height: 66vh; overflow-y: auto; }

.poz-dialog-alt {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-2);
    margin-top: var(--space-6);
    padding-top: var(--space-4);
    border-top: 1px solid var(--line);
  }

.sablon-alan {
    display: block;
    margin-bottom: var(--space-4);
    font-family: var(--font-body);
    font-size: var(--text-sm);
    text-transform: none;
    letter-spacing: normal;
    color: var(--ink);
  }

.sablon-alan > span {
    display: block;
    font-family: var(--font-body);
    font-size: var(--text-xs);
    text-transform: none;
    letter-spacing: normal;
    color: var(--ink-subtle);
    margin-bottom: 4px;
  }

.sablon-alan small {
    display: block;
    margin-top: 4px;
    font-size: 11px;
    line-height: 1.55;
    color: var(--ink-subtle);
    max-width: 72ch;
  }

.sablon-ikili { display: flex; gap: var(--space-4); flex-wrap: wrap; }

.sablon-ikili .sablon-alan { flex: 1 1 260px; }

.cakisma-seridi {
    position: sticky;
    top: 0;
    z-index: 30;
    padding: var(--space-3) var(--space-4);
    background: var(--durum-hata-bg-guclu);
    border-left: 3px solid var(--durum-hata);
    font-size: var(--text-xs);
    line-height: 1.6;
    margin-bottom: var(--space-4);
  }

.cakisma-seridi[hidden] { display: none; }

.metin-btn {
    background: none;
    border: none;
    padding: 0;
    font-family: var(--font-body);
    font-size: 11px;
    letter-spacing: normal;
    text-transform: none;
    color: var(--accent);
    cursor: pointer;
    text-decoration: underline;
  }

.metin-btn:hover { background: none; color: var(--ink); }

.sepet-sil {
    width: 26px;
    height: 26px;
    padding: 0;
    background: none;
    border: 1px solid transparent;
    border-radius: var(--radius-pill);
    color: var(--ink-subtle);
    font-size: 16px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    cursor: pointer;
  }

.sepet-sil:hover { background: none; color: var(--durum-hata); border-color: var(--durum-hata); }