/* Sitene Ekle sayfasi. Solda arac listesi, sagda kod ve canli onizleme. */

.gm-secim { display: flex; flex-direction: column; }
.gm-liste {
  flex: 1 1 auto; overflow-y: auto; max-height: 560px;
  margin: 0 -4px; padding: 0 4px;
}
.gm-grup { margin-bottom: 12px; }
.gm-grup[hidden] { display: none; }
.gm-grup-ad {
  display: block; margin: 0 0 5px 2px;
  font-family: var(--yt-metin); font-size: .64rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .07em; color: var(--ucuz-sonuk2);
}
.gm-grup-ad i { color: var(--ucuz-gold); }

.gm-oge {
  display: flex; align-items: center; gap: 8px; width: 100%;
  padding: 7px 10px; margin-bottom: 3px;
  border: 1px solid transparent; border-radius: var(--r-sm);
  background: rgba(255,255,255,.03); color: var(--ucuz-metin2);
  font-size: .82rem; text-align: left; cursor: pointer;
  transition: background .12s, border-color .12s, color .12s;
}
.gm-oge[hidden] { display: none; }
.gm-oge i { flex: 0 0 auto; color: var(--ucuz-sonuk2); font-size: .9rem; }
.gm-oge span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gm-oge:hover { background: rgba(242,179,61,.09); color: var(--ucuz-metin); }
.gm-oge.is-on {
  background: rgba(242,179,61,.14); border-color: var(--ucuz-gold);
  color: var(--ucuz-metin); font-weight: 600;
}
.gm-oge.is-on i { color: var(--ucuz-gold); }
.gm-bos { padding: 10px 2px; font-size: .82rem; color: var(--ucuz-sonuk2); }

/* ---- Kod kutusu ---- */
.gm-kod-sar { position: relative; }
.gm-kod {
  margin: 0; padding: 14px 96px 14px 14px;
  border: 1px solid var(--ucuz-border); border-radius: var(--r-sm);
  background: #0b0e15; color: #cbd5e1;
  font-family: var(--yt-kod, ui-monospace, Consolas, monospace);
  font-size: .76rem; line-height: 1.65;
  white-space: pre-wrap; word-break: break-word; overflow-x: auto;
}
.gm-kopya { position: absolute; top: 9px; right: 9px; }
.gm-kod-not { margin: 8px 0 0; font-size: .78rem; color: var(--ucuz-sonuk2); }

/* ---- Ayarlar ---- */
.gm-ayarlar {
  display: grid; gap: 14px; margin-top: 16px; padding-top: 14px;
  border-top: 1px solid var(--ucuz-border);
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.gm-alan { display: flex; flex-direction: column; gap: 4px; margin: 0; }
.gm-etiket {
  font-family: var(--yt-metin); font-size: .66rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em; color: var(--ucuz-sonuk2);
}
.gm-ipucu { font-size: .72rem; line-height: 1.5; color: var(--ucuz-sonuk3); }
.gm-zemin-satir { display: flex; gap: 6px; }
.gm-zemin-satir .form-control-color { flex: 0 0 46px; padding: 3px; }
.gm-onay { flex-direction: row; align-items: flex-start; gap: 9px; }
.gm-onay .form-check-input { margin-top: 2px; flex: 0 0 auto; }
.gm-onay > span { display: flex; flex-direction: column; gap: 3px; }

/* ---- Onizleme ---- */
.gm-sahne {
  border: 1px solid var(--ucuz-border); border-radius: var(--r-sm);
  background: #0b0e15; overflow: hidden;
}
.gm-sahne iframe {
  display: block; width: 100%; height: 720px; border: 0;
  color-scheme: normal;
}

@media (max-width: 991.98px) {
  .gm-liste { max-height: 300px; }
  .gm-kod { padding-right: 14px; padding-top: 46px; }
  .gm-kopya { top: 8px; right: 8px; }
}