/* Geri bildirim (zarf) — üst şeritteki düğme + pencere. İnce, gölgesiz, köşe 4-8 px; açık/koyu tema. */

/* Zarf düğmesi: takvim çipinin yanında, onunla aynı yükseklik ve çerçeve */
.zarf-btn { flex: none; width: 34px; height: 33px; display: inline-grid; place-items: center; border-radius: 6px; border: 1px solid var(--cizgi); background: var(--yuzey-alt); color: var(--ana); font-size: 13.5px; transition: .2s var(--egri); }
.zarf-btn:hover, .zarf-btn:focus-visible { border-color: rgba(36, 55, 127, .35); }
:root[data-tema="koyu"] .zarf-btn { color: #9fb6ff; }
:root[data-tema="koyu"] .zarf-btn:hover { border-color: var(--cizgi-guclu); }
:root:not([data-tema="koyu"]) .zarf-btn { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .14); color: #fff; }
:root:not([data-tema="koyu"]) .zarf-btn:hover, :root:not([data-tema="koyu"]) .zarf-btn:focus-visible { border-color: rgba(255, 255, 255, .35); background: rgba(255, 255, 255, .12); }

/* Pencere */
.gb-dialog { width: min(520px, calc(100% - 32px)); padding: 20px 22px; border-radius: 8px; border: 1px solid var(--cizgi); box-shadow: none; font-weight: 300; }
.gb-dialog::backdrop { background: rgba(15, 23, 42, .4); }
.gb-ust { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.gb-ust h2 { font-size: 15px; font-weight: 400; }
.gb-kapat { width: 30px; height: 30px; border: 0; border-radius: 6px; background: none; color: var(--cok-soluk); display: grid; place-items: center; }
.gb-kapat:hover { background: var(--yuzey-alt); color: var(--metin); }
.gb-alt { margin: 2px 0 12px; font-size: 12px; color: var(--soluk); }
.gb-sekmeler { display: flex; gap: 18px; border-bottom: 1px solid var(--cizgi); margin-bottom: 14px; }
.gb-sekmeler button { position: relative; padding: 0 0 9px; border: 0; background: none; color: var(--soluk); font: inherit; font-size: 12.5px; font-weight: 400; display: inline-flex; align-items: center; gap: 6px; }
.gb-sekmeler button.aktif { color: var(--ana); }
.gb-sekmeler button.aktif::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--ana); border-radius: 2px; }
:root[data-tema="koyu"] .gb-sekmeler button.aktif { color: #9fb6ff; }
:root[data-tema="koyu"] .gb-sekmeler button.aktif::after { background: #9fb6ff; }
.gb-say { min-width: 18px; height: 16px; padding: 0 5px; border-radius: 4px; background: var(--yuzey-alt); color: var(--soluk); font-size: 11px; line-height: 16px; text-align: center; }

.gb-form { gap: 12px !important; }
.gb-etiket { font-size: 12.5px; color: var(--soluk); }
.gb-turler { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: -4px; }
.gb-turler button { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 8px 10px; border: 1px solid var(--cizgi); border-radius: 6px; background: var(--yuzey); color: var(--metin); font: inherit; font-size: 12.5px; font-weight: 300; text-align: left; transition: .15s var(--egri); }
.gb-turler button i { width: 14px; text-align: center; color: var(--soluk); font-size: 12px; }
.gb-turler button span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gb-turler button:hover { border-color: var(--cizgi-guclu); }
.gb-turler button.secili { border-color: var(--ana); background: color-mix(in srgb, var(--ana) 6%, var(--yuzey)); font-weight: 400; }
.gb-turler button.secili i { color: var(--ana); }
:root[data-tema="koyu"] .gb-turler button.secili { border-color: #9fb6ff; background: color-mix(in srgb, #9fb6ff 10%, var(--yuzey)); }
:root[data-tema="koyu"] .gb-turler button.secili i { color: #9fb6ff; }
.gb-puan { display: flex; align-items: center; gap: 2px; font-size: 12.5px; color: var(--soluk); }
.gb-puan[hidden] { display: none; }
.gb-puan span { margin-right: 6px; }
.gb-puan button { width: 26px; height: 26px; border: 0; background: none; color: var(--cok-soluk); font-size: 15px; padding: 0; }
.gb-puan button.dolu { color: #d9a21b; }
.gb-form textarea { min-height: 110px; font-size: 13px; line-height: 1.5; }
.gb-sayac { align-self: flex-end; margin-top: -2px; font-size: 11px; color: var(--cok-soluk); font-variant-numeric: tabular-nums; }
.gb-kvkk { display: flex; gap: 8px; align-items: flex-start; line-height: 1.5; }
.gb-kvkk i { margin-top: 3px; color: var(--ana); }
:root[data-tema="koyu"] .gb-kvkk i { color: #9fb6ff; }
.gb-form label.kutu { font-size: 12.5px; font-weight: 300 !important; color: var(--soluk); }
.gb-hata { font-size: 12.5px; color: var(--kirmizi); }
.gb-hata[hidden] { display: none; }
.gb-baglam { font-size: 11.5px; color: var(--cok-soluk); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.gb-gonder:disabled { opacity: .65; }

.gb-tesekkur { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 18px 4px 4px; text-align: center; }
.gb-tesekkur[hidden], .gb-liste[hidden], .gb-form[hidden] { display: none; }
.gb-tamam { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--yesil) 40%, transparent); color: var(--yesil); font-size: 17px; }
.gb-tesekkur b { font-size: 14.5px; font-weight: 400; }
.gb-tesekkur p { max-width: 340px; font-size: 12.5px; color: var(--soluk); line-height: 1.55; }
.gb-tesekkur .dialog-dugmeler { margin-top: 10px; justify-content: center; }

.gb-liste { display: flex; flex-direction: column; max-height: min(420px, 60dvh); overflow-y: auto; margin: -4px -4px 0; padding: 0 4px; }
.gb-bos { padding: 28px 8px; text-align: center; font-size: 12.5px; color: var(--soluk); }
.gb-oge { padding: 11px 0; border-bottom: 1px solid var(--cizgi); display: flex; flex-direction: column; gap: 4px; }
.gb-oge:last-child { border-bottom: 0; }
.gb-oge-ust { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.gb-tur { font-size: 12.5px; font-weight: 400; }
.gb-durum { font-size: 11px; padding: 1px 7px; border-radius: 4px; border: 1px solid var(--cizgi); color: var(--soluk); white-space: nowrap; }
.gb-durum.d-yeni { color: var(--ana); border-color: color-mix(in srgb, var(--ana) 30%, transparent); }
.gb-durum.d-inceleniyor { color: var(--turuncu); border-color: color-mix(in srgb, var(--turuncu) 35%, transparent); }
.gb-durum.d-cozuldu { color: var(--yesil); border-color: color-mix(in srgb, var(--yesil) 35%, transparent); }
:root[data-tema="koyu"] .gb-durum.d-yeni { color: #9fb6ff; border-color: color-mix(in srgb, #9fb6ff 35%, transparent); }
.gb-mesaj { font-size: 12.5px; color: var(--metin); white-space: pre-wrap; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.gb-oge small { font-size: 11px; color: var(--cok-soluk); }
.gb-cevap { margin-top: 4px; padding: 8px 10px; border-left: 2px solid var(--ana); background: var(--yuzey-alt); border-radius: 0 4px 4px 0; }
.gb-cevap b { display: block; font-size: 11.5px; font-weight: 400; color: var(--ana); margin-bottom: 2px; }
.gb-cevap p { font-size: 12.5px; white-space: pre-wrap; overflow-wrap: anywhere; }
:root[data-tema="koyu"] .gb-cevap { border-left-color: #9fb6ff; }
:root[data-tema="koyu"] .gb-cevap b { color: #9fb6ff; }

@media (max-width: 640px) {
  .gb-dialog { padding: 16px; }
  .gb-turler { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gb-baglam { display: none; }
  /* Pencere ekranı kaplayınca HUD alt çubuğun ORTASINA oturur (panel.js hudPenceredeYerlestir): düğmeler iki uca */
  .gb-form .dialog-dugmeler [data-kapat] { order: -1; }
  .gb-tesekkur .dialog-dugmeler { align-self: stretch; justify-content: space-between; }
  .zarf-btn { width: 33px; }
  /* Telefonda selamlama kendi satırında; altında tek satır: takvim · zarf (solda) | zil … DUR (sağda) */
  .ust-serit > .selamlama { flex-basis: 100%; }
}