/* =====================================================================
   e-sohbet-cihan | PC tema + Arkadaslik/Davet stilleri (Asama 1-2)
   ---------------------------------------------------------------------
   - Yerlesim ince ayarlari yalnizca @media (min-width:900px) icinde.
   - Yeni Arkadas/Davet panelinin stilleri t um ekranlarda calisir
     (index.html zaten PC icin; mobil index2.html etkilenmez).
   Mevcut olculer (sol panel 400px, ust menu 60px, alt bar 60px) KORUNUR.
   ===================================================================== */

/* --- G278: Arkadas Istekleri sekmesi (referans: sol panel 400px) --- */
.solPanel .menutablar .item#pcDavetBtn { position: relative; }
.solPanel .menutablar .item#pcDavetBtn.active > i { color: #2f8ded; }
.pc-davet-rozet {
  position: absolute; top: 2px; right: 0;
  min-width: 17px; height: 17px; line-height: 17px; padding: 0 4px;
  border-radius: 9px; background: #2f8ded; color: #fff;
  font-size: 11px; font-weight: 700; text-align: center;
}
.pc-dv-link {
  display: flex; width: 360px; height: 38px; margin: 15px 0;
  box-sizing: border-box; background: #fff;
  border: 1px solid #e2e2e2; border-radius: 6px; overflow: hidden;
}
.pc-dv-sekme {
  flex: 1 1 0; min-width: 0; display: flex; align-items: center; justify-content: center;
  font-size: 13.5px; color: #555; cursor: pointer; user-select: none;
  background: #fff; border-right: 1px solid #e2e2e2;
}
.pc-dv-sekme:last-child { border-right: none; }
.pc-dv-sekme.active { background: #f1f3f5; color: #2b2b2b; font-weight: 600; }
.pc-dv-satir { display: flex; align-items: flex-start; gap: 10px; padding: 10px 16px; border-bottom: 1px solid #f0f0f0; }
.pc-dv-avo { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex: 0 0 40px; background: #eee; }
.pc-dv-orta { flex: 1 1 auto; min-width: 0; }
.pc-dv-ad { display: block; font-size: 14px; font-weight: 600; color: #242424; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pc-dv-alt { display: block; font-size: 12.5px; color: #8a8a8a; margin-top: 2px; }
.pc-dv-aks { margin-top: 8px; display: flex; gap: 6px; }
.pc-dv-btn { display: inline-block; cursor: pointer; border-radius: 4px; padding: 6px 12px; font-size: 12.5px; font-weight: 600; color: #fff; user-select: none; }
.pc-dv-btn.iptal { background: #d93025; }
.pc-dv-btn.kabul { background: #21ba45; }
.pc-dv-btn.reddet { background: #9aa0a6; }
.pc-dv-btn:hover { opacity: .9; }
.pc-dv-btn.bekliyor { opacity: .55; pointer-events: none; }
.pc-dv-bos { padding: 16px; color: #9a9a9a; font-size: 13.5px; }
.pc-dv-gizli { display: none !important; }

/* --- G278: profil cekmecesindeki arkadaslik kumandi --- */
.pc-profil-yorumsatir { background: #fff !important; border-bottom: 1px solid #eee; }
.pc-profil-ark { float: right; cursor: pointer; color: #5f6368; font-size: 13px; user-select: none; }
.pc-profil-ark i { color: #d93025; margin-right: 4px; }
.pc-profil-ark:hover { color: #2f8ded; }
.pc-profil-ark.bekliyor { opacity: .55; pointer-events: none; }

/* --- G278: referans 1 ortali bilgi karti --- */
.pc-bilgi-band {
  position: fixed; top: 76px; left: 50%; transform: translateX(-50%);
  z-index: 999999; display: flex; align-items: center; gap: 10px;
  min-width: 320px; max-width: 520px; padding: 14px 16px;
  border-radius: 8px; background: #e8f2fd; border: 1px solid #cfe2f7;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .12); color: #2b2b2b; font-size: 14px;
}
.pc-bilgi-band > i { color: #2f8ded; font-size: 20px; }
.pc-bilgi-band .kapat { margin-left: auto; cursor: pointer; color: #7a8a9a; font-size: 18px; line-height: 1; }

/* --- Arkadaslar sekmesi listesi --- */
/* 900px altinda (tablet portre vb.) uclu sekme satiri panele sigsin.
   900+ icin asagidaki media kurallari referans olculerini (360/314/104) uygular. */
@media (max-width: 899px) {
  .kisiler_oda_site_link .ui.basic.buttons { display: flex; }
  .kisiler_oda_site_link .ui.basic.buttons > .button { flex: 1 1 0; width: auto !important; min-width: 0; }
}

/* --- Arkadaslar sekmesi listesi --- */
.pc-ark-ekle { display: flex; align-items: center; gap: 8px; padding: 10px 16px; }
.pc-ark-ekle input { flex: 1; padding: 7px 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 13px; }
/* --- Yeniden kullanilan temel dugme stilleri (Web Konsol da bunlari kullanic) --- */
.pc-davet-btn { cursor: pointer; border-radius: 4px; padding: 4px 10px; font-size: 12.5px; color: #fff; margin-left: 6px; user-select: none; }
.pc-davet-btn.kabul { background: #21ba45; }
.pc-davet-btn.reddet { background: #db2828; }
.pc-davet-btn.sil { background: #999; }
.pc-davet-btn:hover { opacity: .88; }
.pc-davet-bos { padding: 14px 16px; color: #999; }

/* --- G278 referans 4: Arkadaslar listesi --- */
.pc-not-band { display: block; margin: 12px 16px; padding: 12px 14px; border-radius: 6px; background: #e8f2fd; border: 1px solid #cfe2f7; color: #2b6cb0; font-size: 13.5px; font-weight: 600; cursor: pointer; text-align: center; }
.pc-not-band:hover { background: #dcebfb; }
.pc-ark-satir { display: flex; align-items: center; gap: 10px; padding: 10px 16px; border-bottom: 1px solid #f0f0f0; }
.pc-ark-avo { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex: 0 0 40px; background: #eee; }
.pc-ark-bilgi { flex: 1 1 auto; min-width: 0; }
.pc-ark-ad { display: block; font-size: 14px; font-weight: 600; color: #242424; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pc-ark-alt { display: block; font-size: 12.5px; color: #8a8a8a; margin-top: 2px; }
.pc-ark-on { color: #21ba45; font-weight: 600; margin-left: 6px; }
.pc-ark-cikar { flex: 0 0 auto; cursor: pointer; color: #9aa0a6; font-size: 16px; padding: 4px; }
.pc-ark-cikar:hover { color: #d93025; }
.pc-ark-baslik { padding: 14px 16px 6px; font-size: 12px; font-weight: 700; letter-spacing: .4px; color: #8a8a8a; border-bottom: 1px solid #f0f0f0; }
.pc-ark-bos { padding: 16px; color: #9a9a9a; font-size: 13.5px; }

/* --- G278 referans 5: "Notlariniz" penceresi --- */
.pc-not-modal { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, .45); z-index: 1000000; display: flex; align-items: center; justify-content: center; }
.pc-not-kutu { width: 420px; max-width: 92vw; max-height: 80vh; background: #fff; border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 12px 40px rgba(0, 0, 0, .25); }
.pc-not-baslik { display: flex; align-items: center; justify-content: space-between; padding: 13px 16px; background: #2f8ded; color: #fff; font-size: 15px; font-weight: 700; }
.pc-not-baslik .kapat { cursor: pointer; font-size: 18px; line-height: 1; color: #fff; opacity: .9; }
.pc-not-sekmeler { display: flex; border-bottom: 1px solid #e6e6e6; }
.pc-not-sekme { flex: 1 1 0; text-align: center; padding: 11px 8px; font-size: 13px; color: #666; cursor: pointer; background: #f7f8fa; }
.pc-not-sekme.active { background: #fff; color: #2f8ded; font-weight: 700; box-shadow: inset 0 -2px 0 #2f8ded; }
.pc-not-liste { overflow-y: auto; padding: 4px 0; }
.pc-not-satir { padding: 10px 16px; border-bottom: 1px solid #f2f2f2; }
.pc-not-kim { font-size: 13px; font-weight: 700; color: #242424; }
.pc-not-tarih { font-size: 11.5px; color: #9a9a9a; margin-left: 6px; font-weight: 400; }
.pc-not-metin { font-size: 13px; color: #444; margin-top: 4px; word-break: break-word; }
.pc-not-bos { padding: 30px 16px; text-align: center; color: #9a9a9a; font-size: 13.5px; }
.pc-not-bos i { display: block; font-size: 30px; color: #cfcfcf; margin-bottom: 8px; }

/* --- Web Konsol: Ekstra Urunler + Istatistikler (admin) --- */
.pc-konsol-baslik { padding: 12px 16px; font-weight: 600; border-bottom: 1px solid #eee; background: #f7f8fa; color: #333; }
.pc-konsol-baslik i.icon { color: #2f8ded; margin-right: 6px; }
.pc-konsol-bos { padding: 14px 16px; color: #999; }
.pc-ekstra-ust { padding: 12px 16px 0; color: #555; font-size: 14px; }
.pc-ekstra-kutu { margin: 12px 16px; border: 1px solid #e3e3e3; border-radius: 6px; padding: 14px 16px; background: #fdfdfd; }
.pc-ekstra-baslik { font-weight: 700; color: #222; margin-bottom: 8px; }
.pc-ekstra-liste { margin: 0; padding-left: 18px; color: #444; line-height: 1.55; }
.pc-ekstra-liste li { margin-bottom: 6px; }
.pc-ekstra-alt { padding: 0 16px 14px; }
.pc-ekstra-alt textarea { width: 100%; box-sizing: border-box; border: 1px solid #ddd; border-radius: 4px; padding: 8px; font-size: 12.5px; margin-bottom: 8px; }
.pc-davet-btn.duzenle { background: #888; }
.pc-ist-grid { display: flex; gap: 12px; padding: 16px; flex-wrap: wrap; }
.pc-ist-kart { flex: 1 1 140px; border: 1px solid #e3e3e3; border-radius: 6px; background: #fdfdfd; padding: 12px 14px; }
.pc-ist-etiket { color: #777; font-size: 12.5px; margin-bottom: 6px; }
.pc-ist-etiket i.icon { color: #f2b01e; }
.pc-ist-deger { font-size: 26px; font-weight: 700; color: #222; }

/* =====================================================================
   Yerlesim ince ayarlari (yalnizca masaustu)
   ===================================================================== */
@media (min-width: 900px) {

  /* Aktif sekme icin ortali mavi alt cizgi (~34px, referans) */
  .solPanel .menutablar .item.active {
    position: relative;
  }
  .solPanel .menutablar .item.active::after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    width: 34px;
    height: 3px;
    background: #2f8ded !important;
    border-radius: 2px;
  }

  /* Ust ikonlar sol panel genisligine sigar (~55px adim, referans) */
  .solPanel .menutablar .item {
    padding-left: 4px !important;
    padding-right: 4px !important;
    margin: 0 4px -2px !important;
  }

  /* Yeni ust ikonlarin (Arkadas Istekleri / Paylas) renk davranisi */
  .solPanel .menutablar .item#pcDavetBtn > i,
  .solPanel .menutablar .item#pcPaylasBtn > i {
    color: #8b8b8b;
    transition: color .15s ease;
  }
  .solPanel .menutablar .item#pcDavetBtn:hover > i,
  .solPanel .menutablar .item#pcPaylasBtn:hover > i {
    color: #2f8ded;
  }

  /* --- Oda / Site / Arkadaslar sekme cubugu (referans: beyaz, 3 esit
         ~104px hucre, ortali grup; kapsayici 360x38 / margin 15px 0) --- */
  .kisiler_oda_site_link {
    width: 360px;
    height: 38px;
    margin: 15px 0;
    text-align: center;
  }
  .kisiler_oda_site_link .ui.basic.buttons {
    display: inline-flex;
    width: auto;
    height: 38px;
    box-sizing: border-box;
    background: #fff;
    border: 1px solid #e2e2e2;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: none;
  }
  .kisiler_oda_site_link .ui.basic.buttons > .button {
    flex: 0 0 auto;
    width: 104px;
    min-width: 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    box-sizing: border-box;
    font-size: 14px;
    font-weight: 400;
    text-transform: none;
    color: #555 !important;
    background: #fff !important;
    border: 0;
    border-left: 1px solid #e8e8e8;
    border-radius: 0;
    box-shadow: none !important;
  }
  .kisiler_oda_site_link .ui.basic.buttons > .button:first-child {
    border-left: 0;
  }
  .kisiler_oda_site_link .ui.basic.buttons > .button:hover {
    background: #fafafa !important;
  }
  .kisiler_oda_site_link .ui.basic.buttons > .button.active {
    background: #efefef !important;
    color: #222 !important;
    font-weight: 600;
  }
  .kisiler_oda_site_link .ks_sayi {
    margin-left: 4px;
    color: #b3b1b1;
    font-weight: 400;
  }
}

/* ---- Faz2: Yasakli Kelimeler / Banka / Yedek / Reset panelleri ---- */
.pc-kelime-baslik { padding: 12px 16px 6px; font-weight: 600; color: #333; }
.pc-kelime-tablo { width: calc(100% - 32px); margin: 0 16px 12px; border-collapse: collapse; font-size: 13.5px; }
.pc-kelime-tablo th { text-align: left; color: #888; font-weight: 600; border-bottom: 1px solid #e3e3e3; padding: 7px 8px; }
.pc-kelime-tablo td { border-bottom: 1px solid #f0f0f0; padding: 7px 8px; color: #444; }
.pc-kelime-tablo .pc-kelime-ad { font-weight: 600; color: #2d3e50; }
.pc-kelime-form { border-top: 1px solid #eee; padding: 12px 16px 16px; }
.pc-kelime-form-baslik { font-weight: 600; color: #333; margin-bottom: 10px; }
.pc-kelime-form-etiket { color: #666; font-size: 13px; margin: 6px 0; }
.pc-kelime-form input[type=text], .pc-banka-alan textarea {
  display: block; width: 100%; box-sizing: border-box; border: 1px solid #d4d4d4; border-radius: 4px;
  padding: 8px 10px; font-size: 13.5px; margin-bottom: 10px; background: #fff; color: #333;
}
.pc-banka-sekme { padding: 12px 16px 0; border-bottom: 1px solid #eee; }
.pc-banka-sek { display: inline-block; padding: 8px 14px; font-size: 13.5px; color: #777; cursor: default; border-bottom: 2px solid transparent; }
.pc-banka-sek.aktif { color: #2d3e50; font-weight: 600; border-bottom-color: #2f8ded; }
.pc-banka-alan { padding: 10px 16px 0; }
.pc-reset-uyari { margin: 14px 16px; padding: 12px 14px; background: #fff6f6; border: 1px solid #f5c6c6; border-left: 4px solid #db2828; border-radius: 4px; color: #8b1f1f; font-size: 13.5px; line-height: 1.5; }

/* ---- Referans Yonetim Paneli izgarasi (mavi kutucuklar) ---- */
#adminustmenu ul {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px; padding: 12px; margin: 0 !important; list-style: none;
}
#adminustmenu li { margin: 0 !important; float: none !important; padding: 0 !important; background: none !important; }
#adminustmenu li a {
  display: flex !important; flex-direction: column; align-items: center; justify-content: center;
  min-height: 106px; box-sizing: border-box; padding: 12px 8px !important;
  background: #1274e6 !important; border: 1px solid #0e63c4 !important; border-radius: 10px !important;
  color: #fff !important; font-size: 14px !important; font-weight: 500; line-height: 1.35; text-align: center;
  text-decoration: none !important; transition: background .15s ease, transform .08s ease;
}
#adminustmenu li a:hover { background: #0d5fc4 !important; color: #fff !important; }
#adminustmenu li a:active { transform: scale(.98); }
#adminustmenu li a i.icon { color: #fff !important; font-size: 28px !important; margin: 0 0 10px 0 !important; width: auto !important; height: auto !important; }
#adminustmenu .pc-konsol-tile { display: none; }
#adminustmenu.konsol-acik .pc-konsol-tile { display: list-item; }
.pc-admin-dlg, .ui-dialog:has(.ui-dialog-content#adminsifat) { padding: 0 !important; background: #eef1f4 !important; border-radius: 6px !important; border: none !important; }
.pc-admin-dlg .ui-dialog-titlebar, .ui-dialog:has(.ui-dialog-content#adminsifat) > .ui-dialog-titlebar {
  background: #1274e6 !important; border: none !important; border-radius: 0 !important;
  padding: 9px 12px !important; display: flex; align-items: center; justify-content: space-between;
}
.pc-admin-dlg .ui-dialog-title, .ui-dialog:has(.ui-dialog-content#adminsifat) > .ui-dialog-titlebar .ui-dialog-title { float: none !important; margin: 0 !important; color: #fff !important; font-size: 15px !important; font-weight: 600; }
.pc-admin-dlg .ui-dialog-titlebar-close, .ui-dialog:has(.ui-dialog-content#adminsifat) > .ui-dialog-titlebar .ui-dialog-titlebar-close {
  position: static !important; float: none !important; margin: 0 !important;
  width: 26px; height: 26px; background: #fff !important; border: 1px solid #cfd8e3 !important; border-radius: 4px !important;
}
.pc-admin-dlg .ui-dialog-titlebar-close .ui-icon, .ui-dialog:has(.ui-dialog-content#adminsifat) > .ui-dialog-titlebar .ui-dialog-titlebar-close .ui-icon { display: none !important; }
.pc-admin-dlg .ui-dialog-titlebar-close::after, .ui-dialog:has(.ui-dialog-content#adminsifat) > .ui-dialog-titlebar .ui-dialog-titlebar-close::after { content: "\2715"; color: #222; font-size: 13px; line-height: 24px; display: block; text-align: center; }
.pc-admin-dlg .ui-dialog-titlebar-close:hover, .ui-dialog:has(.ui-dialog-content#adminsifat) > .ui-dialog-titlebar .ui-dialog-titlebar-close:hover { background: #f1f3f6 !important; }
.pc-admin-dlg .ui-dialog-content, .ui-dialog:has(.ui-dialog-content#adminsifat) > .ui-dialog-content { background: #eef1f4 !important; border: none !important; padding: 0 !important; }

/* ---- Faz3: referans kabugu (← baslik satiri) + alt izgaralar + yeni sayfa stilleri ---- */
#pcPanelHeader { display: none; align-items: center; gap: 10px; padding: 10px 14px; background: #fff; border-bottom: 1px solid #e3e6ea; }
.pc-modul-acik #pcPanelHeader { display: flex !important; }
.pc-modul-acik #adminustmenu { display: none !important; }
#pcPanelModulAd { font-weight: 700; color: #222; font-size: 15px; }
#pcGeriBtn { cursor: pointer; color: #222; font-size: 15px; line-height: 1; padding: 2px 4px; }
#pcGeriBtn:hover { color: #1274e6; }
.pc-altmenu { background: #f4f4ff; }
.pc-altmenu ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 12px; margin: 0 !important; list-style: none; }
.pc-altmenu li { margin: 0 !important; float: none !important; padding: 0 !important; background: none !important; list-style: none; }
.pc-altmenu li a {
  display: flex !important; flex-direction: column; align-items: center; justify-content: center;
  min-height: 106px; box-sizing: border-box; padding: 12px 8px !important;
  background: #0776ff !important; border: 1px solid #0668e0 !important; border-radius: 6px !important;
  color: #fff !important; font-size: 14px !important; line-height: 1.35; text-align: center;
  text-decoration: none !important; transition: background .15s ease, transform .08s ease;
}
.pc-altmenu li a:hover { background: #0a68e0 !important; color: #fff !important; }
.pc-altmenu li a:active { transform: scale(.98); }
.pc-altmenu li a i.icon { color: #fff !important; font-size: 28px !important; margin: 0 0 10px 0 !important; width: auto !important; height: auto !important; }
.pc-root-kart { margin: 14px 16px; padding: 14px 16px; background: #075fc0; color: #fff; border-radius: 8px; font-size: 13.5px; line-height: 1.55; }
.pc-root-hedef { margin-top: 8px; }
.pc-oyt-satir { display: flex; align-items: center; gap: 10px; padding: 10px 16px; border-bottom: 1px solid #eceff2; font-size: 13.5px; }
.pc-oyt-ad { font-weight: 600; color: #222; }
.pc-oyt-rutbe { color: #888; font-weight: 400; }
.pc-oyt-pill { padding: 2px 10px; border-radius: 999px; color: #fff; font-size: 12px; }
.pc-oyt-pill.acik { background: #28a745; }
.pc-oyt-pill.kapali { background: #9aa3ad; }
.pc-oyt-kendine { margin: 10px 16px; padding: 10px 12px; border: 1px solid #7fb2f0; border-radius: 6px; color: #0b57a4; font-style: italic; font-size: 13px; }
.pc-oyt-form { margin: 12px 16px; padding: 12px 14px; background: #f7f9fb; border: 1px solid #dfe5ea; border-radius: 6px; }
.pc-duyuru { margin: 14px 16px; background: #fdf9ef; border: 1px solid #e8e0c8; border-radius: 6px; padding: 12px 16px; }
.pc-duyuru-baslik { font-weight: 700; color: #1c6b1c; margin-bottom: 8px; font-size: 14px; }
.pc-duyuru-govde { font-size: 13.5px; line-height: 1.7; color: #333; }
.pc-bilgi-satir { display: flex; align-items: center; gap: 12px; padding: 11px 16px; border-bottom: 1px solid #eceff2; font-size: 13.5px; color: #333; }
.pc-bilgi-ikon { min-width: 26px; height: 26px; border-radius: 50%; background: #e3e8ee; color: #556677; display: inline-flex; align-items: center; justify-content: center; }
.pc-banka-alan input[type="text"], .pc-banka-alan input[type="password"] { width: 100%; box-sizing: border-box; padding: 9px 10px; border: 1px solid #cfd6dd; border-radius: 5px; font-size: 13.5px; }

/* ---- Faz4: referans liste modulleri (tablo, arama, modal, FAB, sayfalama) ---- */
.pc-ara { position: relative; margin: 12px 16px 6px; }
.pc-ara input { width: 100%; box-sizing: border-box; padding: 9px 34px 9px 12px; border: 1px solid #cfd6de; border-radius: 6px; background: #fff; font-size: 13.5px; color: #222; }
.pc-ara input:focus { outline: none; border-color: #1274e6; box-shadow: 0 0 0 2px rgba(18,116,230,.15); }
.pc-ara i.icon { position: absolute; right: 11px; top: 50%; transform: translateY(-50%); color: #8b97a5; margin: 0 !important; }
.pc-l-liste { padding: 4px 0 18px; }
table.pc-ltablo { width: calc(100% - 32px); margin: 6px 16px; border-collapse: separate; border-spacing: 0 8px; font-size: 13.5px; }
table.pc-ltablo thead th { text-align: left; color: #7c8794; font-weight: 600; font-size: 12px; padding: 0 12px 2px; }
table.pc-ltablo tbody tr { background: #fff; border-radius: 8px; box-shadow: 0 1px 3px rgba(16,24,40,.10); }
table.pc-ltablo tbody td { padding: 10px 12px; vertical-align: middle; color: #333; border-top: 1px solid #edf0f3; border-bottom: 1px solid #edf0f3; }
table.pc-ltablo tbody td:first-child { border-left: 1px solid #edf0f3; border-radius: 8px 0 0 8px; }
table.pc-ltablo tbody td:last-child { border-right: 1px solid #edf0f3; border-radius: 0 8px 8px 0; text-align: right; }
table.pc-ltablo-avatar tbody td { padding: 8px 12px; }
.pc-l-ad { font-weight: 700; color: #222; }
.pc-l-ust { color: #333; font-size: 13px; }
.pc-l-alt { color: #8b97a5; font-size: 12px; }
.pc-l-tarih { color: #8b97a5; font-size: 12.5px; }
.pc-l-aksiyon { white-space: nowrap; }
.pc-l-aksiyon span { margin-left: 6px; }
.pc-l-bilgi, .pc-l-ban, .pc-l-duzenle, .pc-l-sil {
  display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px;
  border-radius: 6px; background: #eef3fb; color: #1274e6; cursor: pointer; font-size: 13px;
}
/* Referans 26/28: detay dugmesi dolu amber daire, beyaz "i" */
.pc-l-bilgi { background: #fbbd08; color: #fff; border-radius: 50%; width: 20px; height: 20px; font-size: 12px; }
.pc-l-bilgi.mini { width: 18px; height: 18px; font-size: 11px; vertical-align: middle; }
.pc-l-ban { background: #fdecec; color: #d3383c; }
.pc-l-duzenle { background: #eaf7ef; color: #1c9c4d; }
.pc-l-sil { background: #fdecec; color: #d3383c; }
/* Referans 31/33: Uye/Yetkili/Oda listesinde duzenleme ikonu kutusuz, koyu gri kalem */
#pcUyeGovde .pc-l-duzenle, #pcYetkiliGovde .pc-l-duzenle, #pcOdaGovde .pc-l-duzenle { background: none; border-radius: 0; width: 34px; height: 30px; color: #525253; font-size: 21px; }
#pcUyeGovde .pc-l-duzenle:hover, #pcYetkiliGovde .pc-l-duzenle:hover, #pcOdaGovde .pc-l-duzenle:hover { filter: none; color: #2f2f30; }
.pc-l-bilgi:hover, .pc-l-ban:hover, .pc-l-duzenle:hover, .pc-l-sil:hover { filter: brightness(.94); }
.pc-l-cins { width: 34px; text-align: center; }
.pc-l-cins i.icon { margin: 0 !important; font-size: 15px; }
.pc-l-id { color: #8b97a5; font-size: 12px; }
.pc-l-ip { color: #5b6675; font-size: 12px; }
.pc-l-ip-koyu { color: #333; font-size: 12.5px; }
.pc-l-avatar { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; display: inline-block; vertical-align: middle; margin-right: 10px; background: #eef1f4; }
.pc-l-avatar-yok { display: inline-flex; align-items: center; justify-content: center; color: #98a3b0; }
#pcOdaGizle .pc-l-liste { position: relative; min-height: 300px; }
.pc-l-bilgi-kutusu { display: inline-block; vertical-align: middle; }
.pc-fab {
  position: absolute; right: 16px; bottom: 12px; width: 46px; height: 46px; border-radius: 50%;
  background: #1274e6; color: #fff; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 14px rgba(18,116,230,.45); cursor: pointer; z-index: 40;
}
.pc-fab i.icon { color: #fff !important; margin: 0 !important; font-size: 18px !important; }
.pc-fab:hover { background: #0d5fc4; }
.pc-modal-arka { position: fixed; inset: 0; background: rgba(15,23,38,.55); z-index: 9999998; }
.pc-modal-kutu {
  position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 9999999;
  width: min(440px, calc(100vw - 32px)); max-height: 82vh; overflow: auto;
  background: #fff; border-radius: 10px; box-shadow: 0 12px 40px rgba(16,24,40,.32);
}
.pc-modal-baslik { padding: 14px 16px; font-weight: 700; color: #222; background: #fff; border-bottom: 1px solid #e6e9ee; border-radius: 10px 10px 0 0; font-size: 15.5px; }
.pc-modal-govde { padding: 14px 16px; }
.pc-modal-alt { padding: 12px 16px; border-top: 1px solid #e6e9ee; background: #f7f8fa; text-align: right; border-radius: 0 0 10px 10px; }
.pc-btn {
  display: inline-block; margin-left: 8px; padding: 8px 16px; border-radius: 6px; cursor: pointer;
  background: #1274e6; color: #fff; font-size: 13px; font-weight: 600; user-select: none;
}
.pc-btn:hover { background: #0d5fc4; }
.pc-btn.yesil { background: #1c9c4d; }
.pc-btn.yesil:hover { background: #17843f; }
.pc-btn.kirmizi { background: #d3383c; }
.pc-btn.kirmizi:hover { background: #b32e32; }
.pc-sayfa { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 12px 16px 0; flex-wrap: wrap; }
.pc-sayfa-btn {
  min-width: 30px; height: 30px; padding: 0 8px; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid #cfd6de; border-radius: 6px; background: #fff; color: #333; font-size: 13px; cursor: pointer;
}
.pc-sayfa-btn:hover { border-color: #1274e6; color: #1274e6; }
.pc-sayfa-btn.aktif { background: #1274e6; border-color: #1274e6; color: #fff; }
.pc-sayfa-bilgi { margin-left: 8px; color: #8b97a5; font-size: 12.5px; }
.pc-detay { display: flex; flex-direction: column; }
.pc-detay-satir { display: flex; align-items: center; gap: 10px; font-size: 13.5px; color: #333; flex-wrap: wrap; padding: 8px 0; border-bottom: 1px solid #ededed; }
.pc-detay-satir i.icon { width: 22px; color: #666; margin: 0 !important; text-align: center; }
.pc-detay-satir .pc-btn { margin-left: auto; }
.pc-konum { display: flex; flex-direction: column; }
.pc-konum-satir { display: flex; align-items: baseline; gap: 8px; font-size: 13.5px; padding: 6px 0; }
.pc-konum-satir b { flex: 0 0 122px; width: 122px; color: #525253; }
.pc-konum-satir span { color: #6b7684; }
.pc-konum-satir b { color: #1274e6; min-width: 116px; }
.pc-rutbe-satir { display: flex; align-items: center; gap: 12px; margin: 0 16px 8px; padding: 10px 14px; background: #fff; border: 1px solid #edf0f3; border-radius: 8px; }
.pc-rutbe-ad { flex: 1; font-weight: 700; color: #222; font-size: 13.5px; }
.pc-rutbe-grafik { min-height: 20px; }
.pc-rutbe-satir .pc-l-duzenle { margin-left: auto; }
.pc-form { display: flex; flex-direction: column; gap: 6px; }
.pc-form label { font-size: 12.5px; color: #7c8794; font-weight: 600; margin-top: 4px; }
.pc-form input, .pc-ara input, .pc-modal-govde input[type=text], .pc-modal-govde input[type=number] {
  box-sizing: border-box; width: 100%; padding: 9px 11px; border: 1px solid #cfd6de; border-radius: 6px;
  background: #fff; font-size: 13.5px; color: #222;
}
.pc-modal-govde input[type=text]:focus, .pc-modal-govde input[type=number]:focus { outline: none; border-color: #1274e6; box-shadow: 0 0 0 2px rgba(18,116,230,.15); }
@media (max-width: 640px) {
  table.pc-ltablo { font-size: 12.5px; }
  table.pc-ltablo thead { display: none; }
  table.pc-ltablo, table.pc-ltablo tbody, table.pc-ltablo tr, table.pc-ltablo td { display: block; width: auto; }
  table.pc-ltablo tbody td { border: none; border-bottom: 1px solid #f2f5f8; }
  .pc-fab { right: 16px; bottom: 16px; }
}

/* ---- Faz4: İstatistikler (referans 95: 6 KPI + 2 panel) ---- */
.pc-ist-alt { margin-top: 4px; color: #7c8794; font-size: 12.5px; }
.pc-ist-alt i.icon { font-size: 11px; color: #1c9c4d; margin: 0 2px 0 0 !important; }
.pc-ist-alt b { color: #1274e6; font-weight: 600; }
.pc-ist-paneller { display: flex; gap: 12px; padding: 0 16px 18px; flex-wrap: wrap; }
.pc-ist-panel { flex: 1 1 260px; border: 1px solid #e3e6ea; border-radius: 6px; background: #fff; padding: 10px 14px 12px; }
.pc-ist-panel-baslik { font-size: 15px; font-weight: 700; color: #222; padding-bottom: 8px; margin-bottom: 6px; border-bottom: 1px solid #edf0f3; }
.pc-ist-panel-baslik span { color: #98a3b0; font-size: 12.5px; font-weight: 400; }
.pc-sir { display: flex; align-items: center; gap: 10px; padding: 5px 0; font-size: 13px; color: #333; }
.pc-sir-ad { flex: 0 0 34%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pc-sir-ad i.icon { margin: 0 2px 0 0 !important; font-size: 13px; }
.pc-sir-deger { flex: 0 0 62px; text-align: right; color: #5b6675; }
.pc-cubuk { position: relative; flex: 1 1 auto; height: 18px; background: #eef1f4; border-radius: 3px; overflow: hidden; }
.pc-cubuk-dolgu { position: absolute; left: 0; top: 0; bottom: 0; background: #1c9c4d; border-radius: 3px; }
.pc-cubuk-oran { position: relative; display: block; text-align: center; font-size: 11.5px; line-height: 18px; color: #222; }

/* --- Faz4 A2: Kelime/Rumuz formu modal, Banka yapili alanlar, Yedek listesi --- */
.pc-kelime-kutu { position: relative; min-height: 300px; }
.pc-kelime-tablo .pc-l-aksiyon { width: 44px; text-align: right; }
.pc-kelime-tablo .pc-l-sil i.icon { margin: 0 !important; font-size: 14px; }
.pc-modal-govde select, .pc-banka-alan select {
  width: 100%; box-sizing: border-box; padding: 9px 10px; border: 1px solid #cfd6dd;
  border-radius: 5px; font-size: 13.5px; color: #333; background: #fff;
}
.pc-banka-alt { padding: 16px; text-align: center; }
.pc-yedek-uyari {
  margin: 10px 16px 14px; padding: 14px 16px; background: #173042; color: #eaf1f7;
  border-radius: 4px; border-left: 4px solid #1274e6; font-size: 13.5px; line-height: 1.55;
}
.pc-yedek-satir {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 16px; border-bottom: 1px solid #f0f0f0; font-size: 13.5px; color: #444;
}
.pc-yedek-satir .pc-l-ust { color: #2d3e50; font-weight: 600; }
.pc-yedek-satir .pc-l-alt { color: #7b8794; font-size: 12.5px; }

/* --- Faz4 B1: Oda duzenleme (vendor akisini referans dizayniyla gosterir) --- */
.pc-btn.gri { background: #e4e7eb; color: #4a5560; }
.pc-btn.gri:hover { background: #d5dae0; }
.pc-oda-renk { width: 54px; height: 30px; padding: 2px; border: 1px solid #cfd6dd; border-radius: 5px; background: #fff; cursor: pointer; }
.pc-oda-dosya { display: none; }
.pc-oda-arka {
  margin-top: 4px; height: 150px; border-radius: 6px; background: #f2f4f6;
  display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.pc-oda-arka img { max-width: 100%; max-height: 150px; display: block; }
.pc-oda-arka i.icon { color: #c9d1d9 !important; font-size: 46px !important; margin: 0 !important; }
.pc-oda-arka-butonlar { margin-top: 10px; text-align: right; }
.pc-oda-arka-butonlar .pc-btn { margin-left: 8px; }

/* --- Faz5: Botlar (referans 69-78) --- */
#pcBotGizle .pc-l-liste { position: relative; min-height: 300px; }
.pc-bot-altsatir { display: flex; align-items: center; gap: 8px; margin-top: 2px; }
.pc-bot-altsatir .yildiz_stil { margin: 0 !important; }
.pc-bot-yz { color: #d3383c; font-size: 12px; font-weight: 600; }
.pc-bot-oda { color: #1274e6; font-size: 12.5px; }
.pc-bot-ust { text-align: center; padding: 18px 16px 8px; }
.pc-bot-avatar { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; background: #eef1f4; display: inline-block; }
.pc-bot-ust .pc-btn { display: inline-block; margin: 12px auto 0; }
.pc-bot-cizgi { border-top: 1px solid #e6e9ee; margin: 14px 16px 0; }
.pc-bot-etiket { font-weight: 700; color: #222; font-size: 13.5px; margin: 0 0 6px; }
.pc-btn.indigo { background: #4a55a2; }
.pc-btn.indigo:hover { background: #3d478a; }
/* Referans 36-38: giriş efekti / rumuz flashı yükleme butonları teal çizgide. */
.pc-btn.teal { background: #16a3a3; }
.pc-btn.teal:hover { background: #128a8a; }
/* Referans 36: dosya adi kutusu solda, teal yukele butonu saginda ayni satirda. */
.pc-flash-satir { display: flex; align-items: center; gap: 8px; }
.pc-flash-satir .pc-oku {
  flex: 1 1 auto; min-width: 0; box-sizing: border-box; padding: 9px 10px; background: #fff;
  border: 1px solid #cfd6dd; border-radius: 5px; font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pc-flash-satir .pc-btn { flex: 0 0 auto; margin-left: 0; }
/* Referans 36 + 50/39: flash satirlarinin altindaki kucuk mavi "+" / kirmizi "-" tuglari.
   Olcum: 40x29, bitisik; + = #2185d0, - = #db2828. */
.pc-uye-arti-eksi { display: flex; gap: 0; padding: 10px 16px 0; }
.pc-kare-btn {
  width: 40px; height: 29px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 5px; color: #fff; font-size: 17px; font-weight: 700; line-height: 1; cursor: pointer; user-select: none;
}
.pc-kare-btn.mavi { background: #2185d0; }
.pc-kare-btn.mavi:hover { background: #1b74bb; }
.pc-kare-btn.kirmizi { background: #db2828; }
.pc-kare-btn.kirmizi:hover { background: #c42222; }
/* Referans 43/54: alt buton cifti ortali; "Kişiyi sil" = #db2828, "Kaydet" = #3f51b5.
   Kapsam yalnizca bu form: .pc-banka-alt baska ekranlarda da kullaniliyor. */
#pcUyeDuzenleGovde .pc-banka-alt { display: flex; justify-content: center; gap: 10px; }
#pcUyeSil { background: #db2828; }
#pcUyeSil:hover { background: #c42222; }
#pcUyeKaydet { background: #3f51b5; }
#pcUyeKaydet:hover { background: #35479f; }
.pc-flash-onizleme { min-height: 62px; margin-bottom: 10px; text-align: center; background: #f4f6f8; border: 1px solid #e6e9ee; padding: 6px; }
.pc-flash-onizleme img { max-width: 100%; height: auto; }
/* G279-2: Rumuz flashi (flash nik) gorsel hattı canlıdan kaldırıldı; `.pc-rumuz-flash`
   kurali (sohbet mesaj satiri) silindi ve silik kaliyor. */
/* G279-3: Oda kisi listesi: rumuz flashi yuklu kisinin adinin yerini flash nik alir,
   kaldirilinca isim geri gelir. Ad metni liste aramasini bozmamak icin tasinir. */
.pc_flash_nick { display: inline-block; vertical-align: middle; height: 20px; width: auto; max-width: 140px; margin: 0; }
.pc_flash_ad_gizli { display: none; }
.pc-giris-efekt { display: block; margin: 2px 0 4px; }
/* Vendor ".message-text img { max-width:100%; height:auto }" kuralı efekti eziyor;
   mesaj satirinda efekt boyutu daha secici selector ile korunur. */
.message-text .pc-giris-efekt { max-width: 220px; max-height: 70px; height: auto; }
/* Kendi giriş efekti: referans bandı — animasyon sohbetin üstünde tam genişlik
   şerit olarak oynar, ortada kişinin kendi rütbe grafiği ve altında
   "Siteye Giriş Yaptı" yazar. Giriş ekranında değil, yalnız chat sayfasında açılır.
   Ölçüler referanstan: bant 150px, rütbe grafiği doğalinin ~1,23 kati, yazi 24px. */
#pcEfektBanner.pc-efekt-banner { position: fixed; height: 150px; max-height: 40vh; z-index: 9998; overflow: hidden; cursor: pointer; background: #000; animation: pcEfektGir .35s ease-out; }
#pcEfektBanner .pc-efekt-gif { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; }
#pcEfektBanner .pc-efekt-icerik { position: relative; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; }
#pcEfektBanner .pc-efekt-icerik .yildiz_stil { transform: scale(1.23); }
#pcEfektBanner .pc-efekt-yazi { font-size: 24px; font-weight: 700; color: #fff; text-shadow: 0 0 2px #8d0000, 1px 1px 0 #8d0000, -1px -1px 0 #8d0000, 1px -1px 0 #8d0000, -1px 1px 0 #8d0000; }
#pcEfektBanner .pc-efekt-rumuz { font-size: 22px; color: #fff; text-shadow: 1px 1px 0 #222; }
@keyframes pcEfektGir { from { opacity: 0; } to { opacity: 1; } }
/* System rütbesi tacı: referanstaki konumda, sağdaki simgelerin solunda tam renkli durur. */
.pc_rutbe_tac { float: right; width: 25px; height: 16px; margin: 1px 8px 0 0; }
.pc-seg { display: flex; justify-content: center; margin: 14px 0 4px; }
.pc-seg-btn { padding: 7px 18px; border: 1px solid #cfd6de; background: #fff; color: #333; font-size: 13px; cursor: pointer; }
.pc-seg-btn:first-child { border-radius: 5px 0 0 5px; }
.pc-seg-btn:last-child { border-radius: 0 5px 5px 0; border-left: 0; }
.pc-seg-btn.aktif { background: #e4e7eb; color: #222; font-weight: 600; }

/* --- Faz6: Uye/Yetkili duzenleme formu (referans 45-55) --- */
.pc-yetki-baslik { font-weight: 700; color: #222; font-size: 15px; padding: 14px 16px 2px; }
.pc-yetki-grup { padding: 0 16px 4px; }
.pc-yetki-satir { display: block; padding: 6px 0; color: #333; font-size: 14px; cursor: pointer; }
.pc-yetki-satir input[type="checkbox"] { width: 17px; height: 17px; margin: 0 12px 0 26px; vertical-align: -3px; accent-color: #2185d0; cursor: pointer; }
.pc-uclu { display: flex; gap: 10px; }
.pc-uclu select { flex: 1 1 0; width: auto; min-width: 0; }
.pc-oku { color: #333; font-size: 14px; }
.pc-oku-alan .pc-bot-etiket { color: #8a9099; font-weight: 400; }
.pc-koruma-not { color: #8a9099; font-size: 12.5px; line-height: 1.55; margin: 0 0 12px; }

/* --- Faz6: Durum Modlari listesi (referans 20-21) --- */
.pc-durum-not { padding: 12px 16px 10px; color: #8a9099; font-size: 13px; }
.pc-durum-not i.icon { margin: 0 2px !important; color: #8a9099 !important; }
.pc-durum-satir {
  display: flex; align-items: center; gap: 12px; padding: 13px 16px;
  border-bottom: 1px solid #edf0f3; background: #fff;
}
.pc-durum-ad { flex: 1; color: #333; font-size: 15px; }
.pc-durum-satir .pc-l-aksiyon { text-align: right; }
.pc-durum-satir .pc-l-duzenle, .pc-durum-satir .pc-l-sil { background: transparent; color: #4a5560; }
.pc-durum-satir .pc-l-duzenle:hover, .pc-durum-satir .pc-l-sil:hover { filter: none; color: #1274e6; }
.pc-durum-satir .pc-l-duzenle i.icon, .pc-durum-satir .pc-l-sil i.icon { margin: 0 !important; font-size: 16px; }

/* --- Faz6: Animasyon Listesi (referans 99) --- */
.pc-anim-not { padding: 12px 16px; background: #fff; color: #333; font-size: 14px; border-bottom: 1px solid #edf0f3; }
.pc-anim-izgara { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; padding: 12px 16px; background: #f7f8fa; }
.pc-anim-kart {
  position: relative; box-sizing: border-box; padding: 8px 8px 8px; background: #fff;
  border: 1px solid #e3e6ea; border-radius: 4px; text-align: center;
}
.pc-anim-no {
  position: absolute; top: -8px; right: -6px; width: 22px; height: 22px; line-height: 21px;
  background: #fff; border: 1px solid #cfd6dd; border-radius: 50%; color: #444; font-size: 11.5px;
}
.pc-anim-gorsel { display: flex; align-items: center; justify-content: center; height: 62px; overflow: hidden; }
.pc-anim-gorsel img { max-width: 100%; max-height: 62px; }
.pc-anim-yok { color: #a3aab3; font-size: 12px; }
.pc-anim-ad { color: #555; font-size: 12px; margin: 2px 0 7px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pc-anim-btn {
  display: block; padding: 7px 0; background: #00b5ad; border-radius: 4px;
  color: #fff; font-size: 13px; font-weight: 700; cursor: pointer;
}
.pc-anim-btn:hover { background: #009b94; }
@media (max-width: 760px) { .pc-anim-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* --- Faz6 Yetki Siparişleri (referans 104-105; renkler referans piksellerinden olculdu) --- */
.pc-sip-sekmeler { display: flex; margin: 14px 16px 0; border: 1px solid #dddddd; background: #ffffff; }
.pc-sip-sek { flex: 1 1 50%; text-align: center; padding: 12px 8px; font-size: 14px; color: #8a8a8a; cursor: pointer; }
.pc-sip-sek + .pc-sip-sek { border-left: 1px solid #dddddd; }
.pc-sip-sek.aktif { background: #f5f5f5; color: #333333; font-weight: 600; }
.pc-sip-bos { padding: 34px 10px; text-align: center; font-size: 14.5px; color: #333333; }
.pc-sip-kart { margin: 16px; border: 1px solid #e3e6ea; background: #ffffff; border-radius: 4px; overflow: hidden; }
.pc-sip-kart-bas { background: #005fbf; color: #ffffff; font-weight: 600; font-size: 14.5px; text-align: center; padding: 12px 10px; }
.pc-sip-kart-gov { padding: 16px 18px 18px; }
.pc-sip-aciklama { font-size: 14.5px; line-height: 1.9; color: #333333; margin-bottom: 10px; }
.pc-sip-liste { margin: 0 0 14px 18px; padding: 0; list-style: disc; }
.pc-sip-liste li { font-size: 14px; color: #444444; line-height: 1.9; }
.pc-sip-onayla { display: inline-block; background: #1274e6; color: #ffffff; font-size: 13.5px; padding: 9px 16px; border-radius: 4px; cursor: pointer; }
.pc-sip-onayla:hover { background: #0d63c6; }

/* --- Faz6 Rutbe Listesi: referans 57 duzeni (olculen renklerle) --- */
.pc-rutbe-satir { position: relative; display: block; margin: 0; gap: 0; border: 0; border-radius: 0; padding: 12px 56px 12px 16px; border-bottom: 1px solid #f0f0f2; background: #ffffff; }
.pc-rutbe-satir:nth-child(even) { background: #fafafb; }
.pc-rutbe-ad { font-size: 14.5px; color: #4a4a4a; }
.pc-rutbe-grafik { margin-top: 5px; }
.pc-rutbe-satir .pc-l-duzenle { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); color: #70b1e1; font-size: 19px; }
.pc-rutbe-satir .pc-l-duzenle:hover { color: #4a93cc; }

/* --- FAZ7 rutbe rozetleri 21-33 --- */
.yildizlar_21:before{content:"★★★★★★★★★★★★★★★★★★★★★"}
.yildizlar_22:before{content:"★★★★★★★★★★★★★★★★★★★★★★"}
.yildizlar_23:before{content:"★★★★★★★★★★★★★★★★★★★★★★★"}
.yildizlar_24:before{content:"★★★★★★★★★★★★★★★★★★★★★★★★"}
.yildizlar_25:before{content:"★★★★★★★★★★★★★★★★★★★★★★★★★"}
/* 27-30: sahibin verdiği rütbe kodları (yazı rozeti, rütbenin kendi rengini alır) */
.yildizlar_26:before,.yildizlar_31:before,.yildizlar_32:before,.yildizlar_33:before{content:""}
.yildizlar_26,.yildizlar_31,.yildizlar_32,.yildizlar_33{display:inline-block;background-repeat:no-repeat;background-position:left center;background-size:100% 100%;vertical-align:middle}
.yildizlar_26{width:292px;height:13px;background-image:url("../../resimler/rutbe/root.png?v=1")}
.yildizlar_27:before{content:"♔◎♔◎♔◎♔◎♔◎♔◎♔◎♔◎♔◎♔◎♔◎♔"}
.yildizlar_28:before{content:"♛☆🅚🅘🅝🅖🅜🅐🅢🅣🅔🅡☆♛"}
.yildizlar_29:before{content:"♔✪♔✪♔✪♔✪♔✪♔✪♔✪♔✪♔✪♔✪♔✪♔"}
.yildizlar_30:before{content:"♚♚♚♚♚♚♚♚♚♚♚♚♚♚♚♚♚♚♚♚♚♚"}
.yildizlar_31{width:167px;height:15px;background-image:url("../../resimler/rutbe/owner.png")}
.yildizlar_32{width:155px;height:14px;background-image:url("../../resimler/rutbe/system.png?v=2")}
.yildizlar_33{width:185px;height:17px;background-image:url("../../resimler/rutbe/network.png")}
.pc-rutbe-adimlar { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.pc-rutbe-adimlar .pc-btn { flex: 0 0 auto; padding: 6px 12px; }
.pc-rutbe-adimlar input { flex: 0 0 74px; width: 74px; text-align: center; }
.pc-rutbe-bos { flex: 1; margin: 0; text-align: right; }
.pc-rutbe-adimlar + .pc-rutbe-grafik { margin-top: 12px; min-height: 22px; }
/* --- Sistem Ayarlari (referans 16-18) --- */
.pc-sys-satir { display: flex; align-items: center; gap: 10px; padding: 9px 16px; cursor: pointer; }
.pc-sys-satir input[type="checkbox"] { width: 17px; height: 17px; flex: 0 0 auto; accent-color: #1a1a1a; cursor: pointer; }
.pc-sys-etiket { font-size: 14px; font-weight: 600; color: #333; }
.pc-sys-pill { border-radius: 11px; padding: 2px 11px; font-size: 12px; font-weight: 700; color: #fff; background: #b9aead; }
.pc-sys-pill.acik { background: #26a65b; }
.pc-sys-ayrac { border-top: 1px solid #e3e3e3; margin: 14px 40px; }
.pc-sys-blok { padding: 4px 16px 10px; }
.pc-sys-baslik { font-size: 13.5px; font-weight: 700; color: #333; margin: 6px 0 8px; }
.pc-sys-blok select, .pc-sys-blok input[type="number"] { width: 100%; box-sizing: border-box; border: 1px solid #dcdfe3; border-radius: 4px; padding: 10px 12px; font-size: 14px; color: #444; background: #fff; }
.pc-sys-kaydet { text-align: center; padding: 18px 0 24px; }
#pcSistemAyarKaydet { display: inline-block; background: #3f51b5; color: #fff; border-radius: 4px; padding: 11px 32px; font-size: 14px; font-weight: 700; cursor: pointer; }
#pcSistemAyarKaydet:hover { background: #3646a0; }
#pcGuvenlikKaydet { display: inline-block; background: #3f51b5; color: #fff; border-radius: 4px; padding: 11px 32px; font-size: 14px; font-weight: 700; cursor: pointer; }
#pcGuvenlikKaydet:hover { background: #3646a0; }
.pc-sys-pill.guv { background: #b9aead; }
.pc-sys-pill.guv.acik { background: #26a65b; }
.pc-ulke-kutu { max-height: 220px; overflow-y: auto; border: 1px solid #dcdfe3; border-radius: 6px; padding: 10px; background: #fafbfc; display: flex; flex-wrap: wrap; gap: 8px; }
.pc-ulke-chip { flex: 0 0 calc(33.333% - 6px); box-sizing: border-box; text-align: center; background: #e9ebee; color: #8a8f98; border-radius: 5px; padding: 9px 6px; font-size: 13px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; user-select: none; }
.pc-ulke-chip:hover { background: #dfe2e6; }
.pc-ulke-chip.secili { background: #3f51b5; color: #fff; }

/* --- Oda kişi listesi satır aralıkları (referans: ~90px pitch, 50px avatar, 16px isim) --- */
#kisiler_listesi_govde .chat_people { padding: 14px 12px 14px 0; border-bottom: 1px solid #f5f5f5; }
/* GOREV #108: .chat_img'in 1px kenarligi yuzunden icerik kutusu 48x48; img'yi 50x50 tutmak
   yukleneni dikey geriyordu (olcu: 48x50). Ayni kutuda kare + cover kirp. */
#kisiler_listesi_govde .chat_img { width: 50px; height: 50px; }
#kisiler_listesi_govde .chat_img img { width: 48px; height: 48px; object-fit: cover; border-radius: 50%; }
#kisiler_listesi_govde .chat_ib h5 { font-size: 16px; font-weight: 700; line-height: 18px; color: #333; }
#kisiler_listesi_govde .chat_ib p { margin: 6px 0 0; line-height: 16px; }
#kisiler_listesi_govde .chat_ib small { font-size: 12px; color: #9e9e9e; }

/* --- GOREV #107: Profil Cerceve (rosette) katmani. .cerKap yalniz cerceve secili
   avatarlarda kullanilir; cercevesiz kullanicilarin gorunumune dokunulmaz. --- */
.cerKap{position:relative;overflow:visible}
/* GOREV #474: cerceve avatarin arkasina cizilir; profil fotosu hicbir cerceve
   tarafindan kapatilmaz. Kutu (left/top/width/height) CSS'te sabit degil, sck.js
   avatar x ORAN kuralindan piksel olarak verir. */
.cerIc{border-radius:40%;position:relative;z-index:2}
.cerKatman{position:absolute;background-position:center center;background-repeat:no-repeat;background-size:100% 100%;pointer-events:none;z-index:1}
/* GOREV #476: satirin solundaki 16,6 px bosluga ragmen .chat_people'nin
   overflow:hidden'i cercevenin sol 13,2 px'ini kesiordu. flow-root yuzme
   tavanini (satir yuksekligini) oldugu gibi korur, kesmeyi kaldirir. */
#kisiler_listesi_govde .chat_people{overflow:visible;display:flow-root}
.cerIkonTuru{display:flex;flex-wrap:wrap;gap:6px;padding:8px 6px}
.cerceveTikla{width:56px;height:56px;border-radius:6px;cursor:pointer;background-size:contain!important;position:relative}
.cerceveTikla.cerceveYok{display:flex;align-items:center;justify-content:center;font-size:12px;color:#444}
.cerceveTikla.cerSecili{outline:2px solid #27ae60;outline-offset:1px}
.cerOnizlemeKut{display:flex;align-items:center;gap:10px;padding:8px 6px 4px}
.cerOnizlemeYazi{font-size:12px;color:#555}
.cerAcleme{font-size:12px;margin:7px;line-height:1.45}
/* --- Sistem mesajlarında mavi "E" avatarı kaldırılır; balon sola yaslanır --- */
.mesaj_oda .message-avatar { display: none !important; }
.mesaj_oda .message-text { margin-left: 0 !important; }

/* --- "Çatıdasınız" balonu: sohbet alanının üstünde ortalı banner --- */
#pcCatiOverlay { position: fixed; transform: translateX(-50%); z-index: 99999; text-align: center; width: max-content; max-width: 92vw; }
#pcCatiOverlay .mesaj_oda { position: static !important; margin: 0 auto !important; float: none !important; width: auto !important; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.28); border-radius: 10px; }
#pcCatiOverlay .mesaj_oda .message-text { white-space: nowrap; font-size: 14px; }

/* --- Admin Paneli ana ekranı: vendor tanıtım bloğu (Apk/✓ satırları) kutuların arkasında görünmesin --- */
#adminsifat:not(.pc-modul-acik) #adminanabolme { display: none !important; }

/* --- Rumuz Renk: özel isimli renklerin yıldızlarda gerçek çok renli gösterimi ---
   (vendor yildizrengi'yi style="color:#hex" olarak yazar; etki :before glifine uygulanır) */
.yildiz_stil[style*="#cc0000" i]:before, .stars20[style*="#cc0000" i]:before { background: repeating-linear-gradient(90deg, #e00000 0 11px, #111 11px 22px); -webkit-background-clip: text; background-clip: text; color: transparent !important; }
.yildiz_stil[style*="#ff4444" i]:before, .stars20[style*="#ff4444" i]:before { background: repeating-linear-gradient(90deg, #e60000 0 11px, #1e44ff 11px 22px); -webkit-background-clip: text; background-clip: text; color: transparent !important; }
.yildiz_stil[style*="#6ab04c" i]:before, .stars20[style*="#6ab04c" i]:before { background: repeating-linear-gradient(90deg, #1e9e3f 0 11px, #f4d01e 11px 22px); -webkit-background-clip: text; background-clip: text; color: transparent !important; }
.yildiz_stil[style*="#ff8c00" i]:before, .stars20[style*="#ff8c00" i]:before { background: repeating-linear-gradient(90deg, #ff0000 0 3.8px, #ff8c00 3.8px 7.6px, #ffe000 7.6px 11.4px, #27ae60 11.4px 15.2px, #1e90ff 15.2px 19px, #9b59b6 19px 22.8px); -webkit-background-clip: text; background-clip: text; color: transparent !important; }
.yildiz_stil[style*="#e8439f" i]:before, .stars20[style*="#e8439f" i]:before { background: repeating-linear-gradient(45deg, #e8439f 0 6px, #16a085 6px 12px, #f39c12 12px 18px, #2980b9 18px 24px); -webkit-background-clip: text; background-clip: text; color: transparent !important; }
.yildiz_stil[style*="#d6336c" i]:before, .stars20[style*="#d6336c" i]:before { background: repeating-linear-gradient(90deg, #d61f3c 0 11px, #9b59b6 11px 22px); -webkit-background-clip: text; background-clip: text; color: transparent !important; }
.yildiz_stil[style*="#8e44ad" i]:before, .stars20[style*="#8e44ad" i]:before { background: repeating-linear-gradient(45deg, #e74c3c 0 5px, #f39c12 5px 10px, #27ae60 10px 15px, #3498db 15px 20px, #9b59b6 20px 25px); -webkit-background-clip: text; background-clip: text; color: transparent !important; }
.yildiz_stil[style*="#a569bd" i]:before, .stars20[style*="#a569bd" i]:before { background: repeating-linear-gradient(90deg, #c39bd3 0 11px, #8b5a2b 11px 22px); -webkit-background-clip: text; background-clip: text; color: transparent !important; }

/* === Sohbet emoji panellerinde animasyon GIF seridi (gifff kaynagi, {ad} kurali) === */
.pcGifSerit { clear: both; overflow: hidden; margin: 4px 0 6px; padding-top: 4px; border-top: 1px solid #e8ebf0; }
.pcGifBaslik { color: #8a8f98; font-size: 11px; font-weight: 700; padding: 2px 4px; }
.pcGifIzgara { overflow: hidden; }
.pcGifIzgara img.animasyonListesiIMG { width: 22px; height: 22px; border-radius: 4px; object-fit: contain; background-color: #fff !important; }
#ozelikonlar img.animasyonListesiIMG { width: 22px; height: 22px; padding: 1px; margin: 3px; border-radius: 4px; object-fit: contain; background-color: #fff !important; }
.pcGifBos { color: #9aa0a8; font-size: 12px; padding: 6px 4px; }
/* Animasyon GIF'i mesaj alanini tasirmasin: panelle ayni kaynaktan gelen gorel olcekli. */
img[src^="resimler/sistem/animasyonlar/"], img[src^="/resimler/sistem/animasyonlar/"] { max-width: 120px; max-height: 120px; width: auto; height: auto; vertical-align: middle; }


/* --- G2: Animasyonlar sayfasi -> sohbet GIF seti yonetimi --- */
.pc-gifset-bolum { padding: 14px 16px 6px; font-size: 14px; font-weight: 700; color: #3b4450; background: #fff; border-top: 1px solid #dfe3e8; }
.pc-gifset-sekmeler { display: flex; align-items: center; gap: 8px; padding: 8px 16px; background: #fff; border-bottom: 1px solid #edf0f3; }
.pc-gifset-sek { padding: 5px 14px; border-radius: 14px; background: #eef1f5; color: #5a6472; font-size: 13px; cursor: pointer; }
.pc-gifset-sek.aktif { background: #0d5fc4; color: #fff; }
.pc-gifset-not { margin-left: auto; color: #98a0aa; font-size: 12px; }
.pc-gifset-ekle { display: flex; align-items: center; gap: 8px; padding: 8px 16px; background: #fafbfc; border-bottom: 1px solid #edf0f3; }
.pc-gifset-ekle input[type=text] { width: 170px; padding: 6px 8px; border: 1px solid #d7dde5; border-radius: 4px; font-size: 13px; }
.pc-gifset-ekle input[type=file] { font-size: 12px; color: #5a6472; }
.pc-gifset-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(124px, 1fr)); gap: 10px; padding: 12px 16px; background: #f7f8fa; }
.pc-gifset-kart { background: #fff; border: 1px solid #e8ebf0; border-radius: 6px; padding: 8px; text-align: center; overflow: hidden; min-width: 0; }
.pc-gifset-kart.pasif { background: #f4f5f7; }
.pc-gifset-gorsel { position: relative; height: 78px; display: flex; align-items: center; justify-content: center; overflow: hidden; border: 1px solid #eef0f3; border-radius: 4px; background: #fff; }
.pc-gifset-gorsel img { max-width: 100%; max-height: 78px; }
.pc-gifset-kart.pasif .pc-gifset-gorsel img { opacity: .6; }
.pc-gifset-etiket { position: absolute; top: 0; left: 0; right: 0; background: rgba(0, 0, 0, .55); color: #fff; font-size: 10px; letter-spacing: .5px; }
.pc-gifset-ad { font-size: 12px; color: #333; margin: 5px 0 0; word-break: break-all; }
.pc-gifset-boyut { font-size: 11px; color: #98a0aa; margin-bottom: 6px; }
.pc-gifset-tus, .pc-gifset-sil { display: inline-block; padding: 4px 8px; border-radius: 4px; font-size: 11px; cursor: pointer; color: #fff; background: #009b94; white-space: nowrap; margin: 2px 0; }
.pc-gifset-tus:hover { background: #00827c; }
.pc-gifset-sil { background: #d3383c; margin-left: 4px; }
.pc-gifset-sil:hover { background: #b32e32; }
/* GOREV #108: vendor .ozchat_img img{padding:5px;border-radius:100%} fotoyu daire yapiyordu;
   kisi listesiyle ayni kare/cover davranisina cekilir. */
.ozchat_img img { padding: 0; width: 38px; height: 38px; border-radius: 50%; object-fit: cover; }
/* GOREV #129-4: "Kendi ekran yazilarinizi sildiniz." PC'de mik seridi olmadigi
   icin mesaj alaninin icinde tam genislikte ortali satir olarak gosterilir. */
.pcEkranYaziBand { clear: both; width: 100%; text-align: center; font-size: 12px; line-height: 20px; color: #fff; background: rgba(0, 0, 0, .55); padding: 5px 10px; margin: 0 0 6px; border-radius: 3px; box-sizing: border-box; }
/* GOREV #157: giris kayitlari listesi (sonuc/cihaz/konum satirlari, filtre satiri),
   konum bilgileri sayfasi ve kisilerin gecmis modalinin kabuk stilleri. */
.pc-kayit-filtre { display: flex; align-items: center; gap: 10px; margin: 4px 16px 2px; }
.pc-kayit-filtre select { padding: 7px 8px; border: 1px solid #cfd6de; border-radius: 6px; background: #fff; font-size: 12.5px; color: #222; }
.pc-kayit-filtre select:focus { outline: none; border-color: #1274e6; }
.pc-kayit-canli { margin-left: auto; color: #1c9c4d; font-size: 12px; }
.pc-kayit-ok { color: #1c9c4d; }
.pc-kayit-red { color: #d3383c; }
.pc-l-etiket { display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 8px; background: #fff4d6; border: 1px solid #f0d9a6; color: #9a6b00; font-size: 11px; vertical-align: middle; }
.pc-kayit-kisi { display: flex; flex-direction: column; gap: 12px; }
.pc-kayit-kisi table.pc-ltablo { width: 100%; margin: 4px 0 0; }
.pc-kayit-kimlik { font-size: 13px; color: #333; }
.pc-kayit-bolum > b { display: block; color: #1274e6; font-size: 13px; margin-bottom: 2px; }
.pc-kayit-gun { display: inline-block; margin: 3px 6px 0 0; padding: 2px 8px; border-radius: 6px; background: #f2f5f9; color: #525253; font-size: 12px; }
.pc-kayit-gecmis { font-size: 12.5px; color: #333; padding: 3px 0; border-bottom: 1px solid #f0f2f5; }
.pc-kayit-gecmis span { color: #8b97a5; font-size: 12px; margin-left: 6px; }
.pc-konum-ozet { display: flex; flex-direction: column; gap: 14px; padding: 4px 0 12px; }
.pc-konum-ozet table.pc-ltablo { width: 100%; margin: 4px 0 0; }
/* Sohbet panelindeki giris bildirimindeki "(kayitlar)" baglantisi (§3). */
.pcGirisKayitLink { color: inherit; text-decoration: underline; cursor: pointer; font-weight: 600; }

/* --- G158: "siteye giris/cikis" + "mikrofonu alindi/biraktı" duyuru satirlari ---
   kenarda degil sohbet alaninin ortada gorunur. Sinif pc/js/sck.js ve
   mobil/js/sck.js sistembildirimi blogunda eklenir; normal mesajlar etkilenmez. */
.mesaj_oda.sistem-duyuru { align-self:center !important; -webkit-align-self:center !important; margin-left:auto !important; margin-right:auto !important; max-width:92% !important; }
.mesaj_oda.sistem-duyuru .message-text { text-align:center !important; margin-left:auto !important; margin-right:auto !important; border-radius:10px !important; }
.mesaj_oda.sistem-duyuru .message-text:before { display:none !important; }


/* --- G159: giris bildirimi satiri (referans: RUMUZ → siteye giriş yaptı - Ülke - Kim)
   Renkler referans gorselden olculdu: ok #ED4745, eylem #4188F6, Ülke/Kim #DA3622,
   rumuz #111. Satirin ortalanmasi G158'deki .sistem-duyuru kuralindan gelir. --- */
.pcGirisDuyuruNick { color: #111111; font-weight: 700; }
.pcGirisDuyuruOk { color: #ed4745; font-weight: 700; }
.pcGirisDuyuruEylem { color: #4188f6; font-weight: 700; }
.pcGirisDuyuruAyirac { color: #8d8d8d; padding: 0 2px; }
a.pcGirisDuyuruLink { color: #da3622 !important; font-weight: 700; text-decoration: none; cursor: pointer; white-space: nowrap; }
a.pcGirisDuyuruLink:hover, a.pcGirisDuyuruLink:active { text-decoration: underline; }
.pc-konum-not { margin-top: 10px; padding: 8px 10px; font-size: 12px; line-height: 1.45; color: #7a6a55; background: #fff8e8; border: 1px solid #e8dcc0; border-radius: 6px; }

/* ============ GOREV #162: DUVAR YAZILARI (PC kabugu, referans kart olculeri) ============
   Kart ust satiri 48px, avatar 34px, alt satir (Begenu/Sil) 52px; beste panelin altina
   yapisik (sticky) kalir. */
.pc-duvar-ust-baslik { display: flex; justify-content: flex-end; margin: -4px 0 10px; }
#pcDuvarBenim { color: #1274e6; font-size: 13px; font-weight: 600; cursor: pointer; }
.pc-duvar-kart { background: #fff; border: 1px solid #e6e9ee; border-radius: 8px; margin-bottom: 13px; overflow: hidden; }
.pc-duvar-ust { display: flex; align-items: center; height: 48px; padding: 0 10px; }
.pc-duvar-avatar { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; margin-right: 9px; flex: 0 0 auto; background: #eef1f5; }
.pc-duvar-ad { font-size: 14px; font-weight: 600; color: #222; line-height: 17px; }
.pc-duvar-tarih { font-size: 11.5px; color: #8a94a0; line-height: 15px; }
.pc-duvar-metin { padding: 0 12px 9px; font-size: 13.5px; color: #333; line-height: 19px; white-space: pre-wrap; word-break: break-word; }
.pc-duvar-foto { padding: 0 10px 10px; }
.pc-duvar-foto img { display: block; width: 100%; max-height: 420px; object-fit: cover; border-radius: 5px; background: #eef1f5; }
.pc-duvar-alt { display: flex; align-items: center; justify-content: space-between; height: 52px; padding: 0 12px; border-top: 1px solid #f0f2f5; }
.pc-duvar-begen, .pc-duvar-sil { display: flex; align-items: center; color: #5b6673; font-size: 13.5px; cursor: pointer; user-select: none; }
.pc-duvar-begen i, .pc-duvar-sil i { font-size: 15px; margin: 0 7px 0 0 !important; }
.pc-duvar-begen b { font-weight: 600; margin-left: 5px; }
.pc-duvar-begen.aktif, .pc-duvar-begen.aktif b { color: #1274e6; }
.pc-duvar-bos { padding: 22px 8px; text-align: center; color: #7c8794; font-size: 13.5px; }
.pc-duvar-daha { text-align: center; color: #1274e6; font-size: 13.5px; font-weight: 600; padding: 10px 0 2px; cursor: pointer; }
.pc-duvar-beste {
  position: sticky; bottom: -14px; margin: 0 -16px -14px; padding: 9px 16px; background: #fff;
  border-top: 1px solid #e6e9ee; border-radius: 0 0 10px 10px;
}
.pc-duvar-satir { display: flex; align-items: center; }
.pc-duvar-satir + .pc-duvar-satir { margin-top: 8px; }
#pcDuvarYaz { flex: 1 1 auto; }
#pcDuvarMetin { flex: 1 1 auto; width: auto !important; }
.pc-duvar-sec { flex: 0 0 auto; margin-left: 8px; color: #5b6673; cursor: pointer; font-size: 18px; }
#pcDuvarOnizle img { width: 36px; height: 36px; object-fit: cover; border-radius: 4px; margin-right: 8px; flex: 0 0 auto; background: #eef1f5; }
#pcDuvarDosyaAdi { flex: 1 1 auto; min-width: 0; font-size: 12.5px; color: #5b6673; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pc-duvar-vazgec { flex: 0 0 auto; margin-left: 8px; color: #5b6673; font-size: 13px; cursor: pointer; }
/* ===== G220 PC SEO paneli: renk dugmeleri (golden ile ayni) ===== */
.pc-btn.indigo { background: #4a55a2; }
.pc-btn.indigo:hover { background: #3d478a; }
.pc-btn.teal { background: #16a3a3; }
.pc-btn.teal:hover { background: #128a8a; }

/* ===== G220 PC SEO paneli (referans 87-92) ===== */
.pc-seo-alan { padding: 10px 16px 0; }
.pc-seo-etiket { color: #666; font-size: 13px; margin: 0 0 6px; }
.pc-seo-girdi { width: 100%; box-sizing: border-box; height: 44px; padding: 0 12px; border: 1px solid #cfd6dd; border-radius: 5px; font-size: 13.5px; color: #222; background: #fff; }
.pc-seo-ta { width: 100%; box-sizing: border-box; padding: 10px 12px; border: 1px solid #cfd6dd; border-radius: 5px; font-size: 13.5px; color: #222; line-height: 19px; background: #fff; resize: vertical; }
.pc-seo-girdi:focus, .pc-seo-ta:focus { border-color: #1274e6; outline: none; }
.pc-seo-girdi[disabled], .pc-seo-ta[disabled], .pc-seo-girdi[readonly] { background: #f4f6f8; color: #8a94a0; }
.pc-seo-not { margin-top: 5px; color: #8a94a0; font-size: 12px; line-height: 16px; }
.pc-seo-piller { display: flex; gap: 12px; padding: 14px 16px 0; }
.pc-seo-pil { width: 140px; height: 40px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; border: 1px solid #cfd6dd; border-radius: 6px; background: #fff; color: #4a5560; font-size: 13.5px; font-weight: 600; cursor: pointer; user-select: none; }
.pc-seo-pil.secili { border-color: #1274e6; background: #eaf2fd; color: #0d5fc4; }
.pc-seo-pil[data-pasil], .pc-btn[data-pasil] { opacity: .55; cursor: not-allowed; }
.pc-seo-secim { height: 44px; }
.pc-seo-dosya { display: flex; align-items: center; gap: 10px; }
.pc-seo-dosya .pc-seo-girdi { flex: 1 1 auto; min-width: 0; }
.pc-seo-dosya .pc-btn { flex: 0 0 auto; margin-left: 0; }
.pc-seo-kopyala { flex: 0 0 auto; margin-left: 6px; color: #16a3a3; font-size: 18px; line-height: 44px; cursor: pointer; }
.pc-seo-kopyala:hover { color: #128a8a; }
.pc-seo-mini { width: 44px; height: 44px; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; border-radius: 5px; object-fit: cover; background: #eef1f5; color: #b3bcc6; font-size: 16px; }
.pc-seo-kaydet-satir { padding: 16px 16px 6px; text-align: center; }
.pc-seo-kaydet-satir .pc-btn { min-width: 168px; padding: 10px 22px; margin-left: 0; font-size: 14px; }
.pc-seo-dipnot { padding: 0 16px 16px; line-height: 17px; }
.pc-seo-blok { padding-top: 12px; }
.pc-seo-kart-not { padding: 10px 12px; background: #fffbe6; border: 1px solid #f0e0a0; border-left: 4px solid #b58900; border-radius: 4px; color: #6b5900; font-size: 13px; line-height: 17px; }
.pc-seo-aciklama { padding: 0 16px 6px; font-size: 13px; line-height: 18px; color: #4a5560; }
.pc-seo-kart { text-align: center; }
.pc-seo-onizle { display: block; max-width: 100%; max-height: 260px; margin: 0 auto 10px; border-radius: 6px; object-fit: contain; background: #eef1f5; }
.pc-seo-kart-ad { font-size: 13px; color: #5b6673; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* ==== G253-c: PC duvar MODALINDE paylasim satiri ====
   pcDuvarAc() .pc-duvar-satir / .pc-duvar-sec / .pc-duvar-vazgec /
   .pc-duvar-ust-baslik siniflarini uretiyor ama bunlarin CSS'i hic yazilmamisti:
   .pc-modal-govde input[type=text] { width:100% } girdiyi satirin tamamina yayip
   "Resim sec" etiketini alt satira kiryordu; etiket 20x17 pikselik ciplak glife
   inip kaydirma kutusunun kirpilanir alt kenarina dusuyordu, boylece PC'de
   paylasim gonderilemiyordu. Kurallar yalniz modal kutusuna kapsamlanir; #187
   sol panel duvari (.pc-duvar-bas/.pc-duvar-ikon) oldugu gibi kalir. */
.pc-duvar-ust-baslik { display: flex; justify-content: flex-end; padding: 0 0 8px; }
.pc-duvar-ust-baslik a { font-size: 12.5px; font-weight: 600; color: #1274e6; text-decoration: none; }
.pc-duvar-ust-baslik a:hover { text-decoration: underline; }
.pc-duvar-satir { display: flex; align-items: center; gap: 8px; }
.pc-duvar-satir + .pc-duvar-satir { margin-top: 8px; }
.pc-duvar-satir input[type=text] { flex: 1 1 auto; width: auto; min-width: 0; height: 34px;
  padding: 0 12px; border-radius: 17px; font-size: 13px; }
.pc-duvar-sec { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px;
  height: 34px; padding: 0 12px; border: 1px solid #cfd6de; border-radius: 17px;
  background: #fff; color: #5b6675; font-size: 12.5px; font-weight: 600; cursor: pointer;
  white-space: nowrap; }
.pc-duvar-sec:hover { border-color: #1274e6; color: #1274e6; }
.pc-duvar-sec i.icon { font-size: 15px; margin: 0 !important; }
.pc-duvar-satir img { flex: 0 0 34px; width: 34px; height: 34px; border-radius: 6px; object-fit: cover; }
.pc-duvar-satir #pcDuvarDosyaAdi { flex: 1 1 auto; min-width: 0; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; color: #5b6675; }
.pc-duvar-vazgec { flex: 0 0 auto; font-size: 12.5px; font-weight: 600; color: #7b8794; cursor: pointer; white-space: nowrap; }
.pc-duvar-vazgec:hover { color: #d3383c; }
.pc-duvar-satir .pc-btn { flex: 0 0 auto; margin-left: 0; }
.pc-modal-kutu .pc-duvar-beste { flex-direction: column; align-items: stretch; row-gap: 8px; }
/* ==== G253-a: DM okunmamis sayaci (PC) ==== */
#ozel_kisilistesi i[id^="msgvar_"].g253a-sayili {
  font-family: Arial, Helvetica, sans-serif;
  font-style: normal;
  display: inline-block;
  min-width: 18px;
  height: 16px;
  padding: 0 4px;
  margin-left: 6px;
  border-radius: 9px;
  background: #e53935;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 16px;
  text-align: center;
  vertical-align: middle;
  box-sizing: border-box;
}
#ozel_kisilistesi i[id^="msgvar_"].g253a-sayili:before { content: none; }
#ozel_kisilistesi i[id^="msgvar_"].g253a-sayili:after { content: none; }

/* ===== G263: PC "Uye Profili" (referans 5) + mavi yuvarlak profil butonu =====
   Olculen referans degerleri: disk #7EB6FD, D=50 px, 3 beyaz cubuk %72 genislik,
   cubuk merkezleri %34/%52/%70; pencere basligi #0172FF, sol ray %34,
   menu sol-kenar #F1F1F1, aktif satir #ECECEC, buton cizgisi #D8DEE7. */
#pcProfilHamburger {
  position: absolute; right: 12px; top: 25px;
  width: 50px; height: 50px; padding: 0; border: none; border-radius: 50%;
  background: #7EB6FD; cursor: pointer; z-index: 3; outline: none;
}
#pcProfilHamburger span {
  position: absolute; left: 14%; width: 72%; height: 3px;
  background: #fff; border-radius: 2px; transform: translateY(-50%);
}
#pcProfilHamburger span:nth-child(1) { top: 34%; }
#pcProfilHamburger span:nth-child(2) { top: 52%; }
#pcProfilHamburger span:nth-child(3) { top: 70%; }
#pcProfilHamburger:hover { background: #6aa9fb; }
#pcProfilHamburger:active { background: #5a9dfa; }

.pc-profil-dlg, .ui-dialog:has(.ui-dialog-content#uyehesap) {
  padding: 0 !important; background: #fff !important;
  border: none !important; border-radius: 8px !important;
  box-shadow: 0 14px 40px rgba(16, 24, 40, .28) !important; overflow: hidden;
}
.pc-profil-dlg .ui-dialog-titlebar {
  background: #0172FF !important; border: none !important; border-radius: 0 !important;
  padding: 12px 14px !important; height: auto !important; display: flex;
  align-items: center; justify-content: space-between;
}
.pc-profil-dlg .ui-dialog-title {
  float: none !important; margin: 0 !important; color: #fff !important;
  font-size: 16px !important; font-weight: 700; letter-spacing: .3px;
}
.pc-profil-dlg .ui-dialog-titlebar-close {
  position: static; margin: 0; width: 26px; height: 26px; border: none;
  background: rgba(255, 255, 255, .92) !important; border-radius: 4px;
}
.pc-profil-dlg .ui-dialog-titlebar-close .ui-icon { display: none !important; }
.pc-profil-dlg .ui-dialog-titlebar-close::after {
  content: "\2715"; display: block; text-align: center; line-height: 26px;
  color: #0172FF; font-size: 13px; font-weight: 700;
}
.pc-profil-dlg .ui-dialog-content, .ui-dialog:has(.ui-dialog-content#uyehesap) > .ui-dialog-content {
  background: #fff !important; border: none !important; padding: 0 !important;
}
/* Iki sutun: menyu kardesteri bozmadan flex ile ayir (Semantic .tab() kardes
   cozumlemesini korumak icin sarmalayici div EKLENMEZ). */
#uyehesap { display: flex !important; align-items: stretch; }
/* Govde ekranı taşarsa pencere viewport'u aşardı ve alt gruplar (Site Teması)
   erişilemez kalırdı: yükseklik viewport'a sabitlenir, kaydırma .ui.tab'da kalır. */
#uyehesap { max-height: calc(100vh - 110px); }
#uyehesap > #tablamenuler {
  flex: 0 0 240px; width: 240px; display: block !important; margin: 0 !important;
  background: #fff; border: none !important; border-right: 1px solid #F1F1F1 !important;
  border-radius: 0 !important; box-shadow: none !important; padding: 8px 0 !important;
}
#uyehesap > #tablamenuler .item {
  display: flex !important; align-items: center; padding: 13px 16px !important;
  margin: 0 !important; border: none !important; border-radius: 0 !important;
  background: #fff !important; color: #4a5568 !important; font-size: 14px !important;
  font-weight: 500; text-align: left !important; cursor: pointer; box-shadow: none !important;
}
#uyehesap > #tablamenuler .item i.icon {
  margin: 0 12px 0 0 !important; width: 18px !important; text-align: center;
  color: #8b97a5 !important; font-size: 15px !important;
}
#uyehesap > #tablamenuler .item.active, #uyehesap > #tablamenuler .item:hover { background: #ECECEC !important; }
#uyehesap > #tablamenuler .item.active i.icon { color: #0172FF !important; }
#uyehesap > #tablamenuler .item.active { color: #222 !important; font-weight: 600 !important; }
/* pointing menu'nun oku dikey rayda gereksiz */
#uyehesap > #tablamenuler .item:after, #uyehesap > #tablamenuler .item::after { display: none !important; content: none !important; }
#uyehesap > .ui.tab { flex: 1 1 auto; min-width: 0; padding: 18px 20px !important; overflow: auto; }
#uyehesap > #uyeVerileriGelir { display: none; }
/* G263-13: "Profil Ek Özellikler" sekmesi yalniz sunucunun yetki verdigi (kendi
   .yonetebilir) kisiye acilir. Varsayilan gizli: üye/misafir hicbir an görmem.
   Secici, ustteki `#uyehesap > #tablamenuler .item { display:flex !important }`
   kuralindan OZGUelligi yuksek olmali; aksi halde !important ezilir. */
#uyehesap > #tablamenuler .item.pc-yon-gerek, #uyehesap > .ui.tab.pc-yon-gerek { display: none !important; }
#uyehesap > #tablamenuler a.item.pc-yon-acik { display: flex !important; }
#uyehesap > div.ui.tab.pc-yon-acik.active { display: block !important; }

#pcUyeProfilim { display: block; }
.pc-profil-kart { text-align: center; padding: 6px 4px 14px; }
.pc-profil-avatar {
  width: 110px; height: 110px; margin: 6px auto 14px; border-radius: 50%;
  border: 1px solid #dfe3e8; overflow: hidden; background: #f4f6f8;
}
.pc-profil-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pc-profil-rumuz { color: #111; font-size: 19px; font-weight: 700; letter-spacing: .3px; }
.pc-profil-rutbe { color: #8b97a5; font-size: 13.5px; margin-top: 4px; }
.pc-profil-satir { margin-top: 22px; }
.pc-profil-btn {
  display: inline-block; min-width: 132px; margin: 6px 5px; padding: 11px 16px;
  background: #fff; border: 1px solid #D8DEE7; border-radius: 7px;
  color: #5b6672; font-size: 13.5px; font-weight: 600; cursor: pointer; user-select: none;
}
.pc-profil-btn.genis { display: block; min-width: 0; width: 100%; box-sizing: border-box; }
.pc-profil-btn:hover { border-color: #0172FF; color: #0172FF; }
.pc-profil-efekt-liste { max-height: 190px; overflow: auto; margin-bottom: 10px; border: 1px solid #e6e9ee; border-radius: 6px; }
.pc-profil-efekt {
  padding: 8px 10px; font-size: 12.5px; color: #40495a; cursor: pointer;
  border-bottom: 1px solid #f0f2f5; text-align: left;
}
.pc-profil-efekt:last-child { border-bottom: none; }
.pc-profil-efekt:hover, .pc-profil-efekt.secili { background: #eef4ff; color: #0172FF; }

/* ===== G263-2: profil penceresi tercih gruplari (referans kareleri) =====
   Referans duzeni: anahtar SOLDA, etiket SAGDA; grup basligi ortada gri buyuk
   harf, iki yaninda hairline. Her satir vendor kutusunun yansimasidir; durum
   daima o kutudan okundugu icin ikinci bir stil kaynagi tutulmaz.
   Olculer (484 px'lik referans karesi; pencere govde sutunu 460 px => 0,95x):
   anahtar 43x25 kare px -> 41x24 CSS, sol kenar 48 -> 46 CSS, etiket 127 -> 121 CSS'te
   basliyor (anahtar + 34 px bosluk), satir adimi 51 -> 48 CSS, baslik kenardan 10 px icte,
   baslik gri #ABABAB, hairline #E2E2E2, etiket metni #5B5B5B, acik mavi #2297F3,
   "Ozel Dizayni Kaldir" mavisi #0471FF. */
.pc-ayarlar { margin-top: 22px; }
.pc-ayar-grup { padding: 0 0 12px; }
.pc-ayar-baslik {
  display: flex; align-items: center; gap: 14px; padding: 0 10px;
  color: #ABABAB; font-size: 12px; font-weight: 600; letter-spacing: .9px;
  text-transform: uppercase; margin: 22px 0 12px; white-space: nowrap;
}
.pc-ayar-baslik::before, .pc-ayar-baslik::after {
  content: ""; flex: 1 1 auto; height: 1px; background: #E2E2E2;
}
.pc-ayar-satir {
  display: flex; align-items: center; gap: 34px;
  min-height: 48px; padding: 3px 2px 3px 46px;
  font-size: 14px; color: #5B5B5B; cursor: pointer; user-select: none;
}
.pc-ayar-satir:hover { background: #f7f9fc; }
.pc-ayar-etiket { flex: 1 1 auto; min-width: 0; }
.pc-ayar-sw {
  position: relative; flex: 0 0 41px; width: 41px; height: 24px;
  border-radius: 24px; background: #F2F2F2; box-shadow: inset 0 0 0 1px #E2E6EA;
  transition: background .15s ease;
}
.pc-ayar-sw::after {
  content: ""; position: absolute; top: 2px; left: 2px; width: 20px; height: 20px;
  border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(16, 24, 40, .3);
  transition: transform .15s ease;
}
.pc-ayar-satir.aktif .pc-ayar-sw { background: #2297F3; box-shadow: none; }
.pc-ayar-satir.aktif .pc-ayar-sw::after { transform: translateX(17px); }
/* referans: "diger tum ayarlar..." genisleteni ortalidir */
.pc-ayar-diger {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  padding: 10px 0 2px; color: #9AA3AD; font-size: 13px; cursor: pointer; user-select: none;
}
.pc-ayar-diger:hover { color: #2297F3; }
.pc-ayar-diger-ok::after { content: "\25BC"; font-size: 9px; }
.pc-ayar-grup.genis-ac .pc-ayar-diger-ok::after { content: "\25B2"; }
.pc-ayar-genis { display: none; }
.pc-ayar-grup.genis-ac .pc-ayar-genis { display: block; }
/* kisisel oda dizaynlari: gorsel ve saklama alani olmadigi icin yalniz not + buton */
.pc-ayar-bos { padding: 2px 2px 6px; color: #8C96A3; font-size: 12.5px; }
.pc-ayar-orta { display: flex; justify-content: center; padding: 12px 0 2px; }
.pc-ayar-kaldir {
  background: #0471FF; color: #fff; font-size: 13.5px; font-weight: 700;
  border-radius: 8px; padding: 10px 22px; cursor: pointer; user-select: none;
}
.pc-ayar-kaldir[data-pasil] { background: #C9D4E2; cursor: not-allowed; }
.pc-ayar-temalar { display: flex; flex-wrap: wrap; justify-content: center; margin: 0 !important; }
.pc-ayar-temalar .tema_out { margin: 0 7px 9px 0 !important; }
.pc-ayar-temalar a.tema_on_izleme {
  width: 22px !important; height: 22px !important; min-width: 0; margin: 0 !important;
  border: 1px solid rgba(0, 0, 0, .12); box-shadow: none !important;
}

/* =====================================================================
   G281: PC sohbetinde alinti mesaj / cevapla / gönder.
   Yalnızca yeni seçiciler; mevcut kuralların hiçbirine dokunulmaz.
   ÖLÇÜ KAYNAĞI: referans karelerin (krop-ref01-bekleyen / krop-ref04-kart /
   krop-ref03-menu / krop-ref02-full) iç pikselleri + aynı karelerin gerçek
   Chrome ölçümü (g281/olc.cjs).
   KATMAN: özel mesaj penceresi jQuery-UI diyalogudur ve gövdesine satır içi
   z-index:100000 verilir (ölçüldü). 12000 katmanında menü/kart/"i" diski
   diyalogun ARKASINDA kalıp özel mesajda hiç tıklanamıyordu; vendor'un kendi
   sağ tık menüsü (.pc-sagtik) ve #ozelikonlar 999999 kullanır, G281 de aynı
   basamağa çıkar.
   Menü: 156 px, mavi başlık 28 px #00ADFF, satır adımı 27 px (15 px yazı,
   20 px sol boşluk, ayraç YOK), kırmızı satır #d9534f, "i" diski 16 px #9d9a94.
   Bekleyen kart: 218x72 dış ölçü (6 px beyaz çekme + #F1F0D8 gövde), köşe 10 px;
   fotoğraf 44x44 (içten sol 10 / üst 5, köşe 8 px), ad 15 px kalın,
   alıntı 13 px italik, saat sağ-altta 13 px #2f2f2f (içten sağ 8 / alt 12),
   ✕ sağ-üstte 13 px (içten 6).
   Kartın üstünde beyaz pulluk etiketi: 22 px yükseklik, köşe 11 px, 12 px yazı,
   kartın dış kenarından 22 px içeride ve beyaz çekmenin üstüne biner;
   mavi kalın rumuz + "·" + koyu metin + gri kısa saat.
   Balon içi kutu #F1EFD8, ÇERÇEVESİZ, köşe 10 px; fotoğraf 40x40 köşe 6 px;
   rumuz (kalın 13 px) ile saat (gri 12 px) AYNI satırda, alıntı metin altta.
   ===================================================================== */
#g277i {
  position: fixed;
  z-index: 999997;
  display: none;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #9d9a94;
  color: #fff;
  font: bold 11px/16px Arial, Helvetica, sans-serif;
  text-align: center;
  cursor: pointer;
  pointer-events: none;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .35);
}

#g277i.gorunur { display: block; }

#g277menu {
  position: fixed;
  z-index: 999999;
  display: none;
  width: 156px;
  background: #fff;
  border: 1px solid #d9d9d9;
  border-radius: 6px;
  box-shadow: 0 3px 12px rgba(0, 0, 0, .25);
  overflow: hidden;
}

.g277m-baslik {
  height: 28px;
  line-height: 28px;
  padding: 0 6px;
  background: #00ADFF;
  color: #fff;
  font-weight: 700;
  font-size: 13px;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.g277m-satir {
  height: 27px;
  line-height: 27px;
  padding: 0 20px;
  color: #222;
  font-size: 15px;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.g277m-satir:hover { background: #f2f8ff; }
.g277m-kirmizi { color: #d9534f; }

/* --- kartın üstünde asılı duran beyaz pulluk etiketi ---
   Ref-01/03: kartın beyaz çekmesine biner, dış kenardan ~22 px içeride
   (çerçeve 6 px => left 16 px), 22 px yüksekliğinde, mavi rumuz +
   koyu metin + gri kısa saat. Genel kural yalnız #g277Alinti içinde geçerlidir. */
.g277-al-etiket {
  position: absolute;
  left: 16px;
  bottom: 100%;
  z-index: 2;
  display: none;
  box-sizing: border-box;
  max-width: 218px;
  height: 22px;
  margin-bottom: 0;
  padding: 0 10px;
  background: #fff;
  border: 0;
  border-radius: 11px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .16);
  color: #333;
  font-size: 12px;
  line-height: 22px;
  white-space: nowrap;
  overflow: hidden;
}

#g277Alinti.dolu > .g277-al-etiket {
  display: flex;
  align-items: center;
}

.g277-al-et-ad {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 74px;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #00ADFF;
  font-weight: 700;
}

.g277-al-et-nokta {
  flex: 0 0 auto;
  margin: 0 4px;
  color: #9a9a9a;
}

.g277-al-et-yazi {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 96px;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #333;
}

.g277-al-et-saat {
  flex: 0 0 auto;
  margin-left: 5px;
  color: #8a8a8a;
}

/* --- yazma çubuğunun üstünde yüzen bekleyen alıntı kartı ---
   left/bottom değerleri g277.js tarafından gerçek çubuğa göre verilir. */
#g277Alinti {
  display: none;
  position: fixed;
  left: 8px;
  bottom: 60px;
  z-index: 999998;
  box-sizing: border-box;
  width: 218px;
  max-width: 72%;
  height: 72px;
  padding: 0;
  background: #F1F0D8;
  border: 6px solid #fff;
  border-radius: 10px;
  box-shadow: 0 1px 5px rgba(0, 0, 0, .22);
  color: #333;
  text-align: left;
}

#g277Alinti.dolu { display: block; }

/* Ref-01: ✕ cream'in sağ üst köşesinde (içten 6px). */
#g277Alinti > .g277-al-kapat {
  display: block;
  position: absolute;
  top: 6px;
  right: 6px;
  padding: 2px;
  color: #1b1b1b;
  font: bold 13px/14px Arial, Helvetica, sans-serif;
  cursor: pointer;
}

/* Ref-04/07: foto yuvarlak (sitenin avatar kuraliyla ayni). */
#g277Alinti > .g277-al-foto {
  float: left;
  width: 44px;
  height: 44px;
  margin: 5px 0 0 10px;
  border-radius: 50%;
  background: #d8d8d8 center center / cover no-repeat;
}

#g277Alinti > .g277-al-govde {
  display: block;
  margin-left: 8px;
  margin-right: 8px;
  overflow: hidden;
}

#g277Alinti > .g277-al-govde > .g277-al-ad {
  display: block;
  font-weight: 700;
  font-size: 15px;
  line-height: 18px;
  color: #1b1b1b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#g277Alinti > .g277-al-govde > .g277-al-yazi {
  display: block;
  font-style: italic;
  font-size: 13px;
  line-height: 15px;
  color: #454545;
  max-height: 30px;
  overflow: hidden;
}

/* Ref-01: saat sağ altta, içten sağ 8 / alt 12; iki satıra sarabilir. */
#g277Alinti > .g277-al-zaman {
  position: absolute;
  right: 8px;
  bottom: 12px;
  display: block;
  max-width: 100px;
  text-align: right;
  font-size: 13px;
  line-height: 14px;
  font-weight: 400;
  color: #2f2f2f;
}

/* --- balonun içine giden, herkese görünen alıntı kutusu ---
   Ref-04: krem kutu çerçevesiz, radius ~10; foto ~40; rumuz koyu + saat gri
   AYNI satırda; alıntılanan metin altta. */
.g277-al {
  display: block;
  position: relative;
  box-sizing: border-box;
  margin: 0 0 6px 0;
  padding: 6px 8px;
  background: #F1EFD8;
  border: 0;
  border-radius: 10px;
  color: #333;
  font-style: normal;
  text-align: left;
  overflow: hidden;
}

.g277-al-kapat { display: none; cursor: pointer; }

.g277-al-foto {
  float: left;
  width: 40px;
  height: 40px;
  margin: 0 8px 0 0;
  border-radius: 6px;
  background: #d8d8d8 center center / cover no-repeat;
}

.g277-al-govde { display: block; overflow: hidden; }

.g277-al-ust {
  display: block;
  white-space: nowrap;
  overflow: hidden;
}

.g277-al-ad {
  display: inline;
  font-weight: 700;
  font-size: 13px;
  line-height: 16px;
  color: #1b1b1b;
}

.g277-al-saat {
  display: inline;
  margin-left: 6px;
  font-size: 12px;
  line-height: 16px;
  color: #767676;
}

.g277-al-yazi {
  display: block;
  font-style: italic;
  font-size: 12px;
  line-height: 1.35;
  color: #454545;
  max-height: 2.8em;
  overflow: hidden;
}

.g277-al-zaman {
  display: block;
  clear: both;
  margin-top: 1px;
  font-size: 10px;
  color: #767676;
  text-align: right;
  white-space: nowrap;
}

/* mobilde kart, sabit duran mesaj cubugunun hemen uzerinde yuzer */
.g277-mobil {
  position: fixed;
  left: 8px;
  bottom: 56px;
  z-index: 11998;
  margin: 0;
}


/* --- arkadas notu bandi, butonu ve penceresi --- */
.g277-not-bant {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 45px;
  padding: 0 12px;
  background: #F8FFFF;
  border-bottom: 1px solid #e1e1e1;
  color: #2f2f2f;
  font-size: 14px;
  cursor: pointer;
}

.g277-not-bant .material-icons { margin-right: 8px; color: #5b5b5b; font-size: 20px; }
.g277-not-adet { margin-left: 6px; color: #e03131; font-weight: 700; }

.g277-not-ekle {
  height: 38px;
  line-height: 38px;
  margin: 10px 12px;
  padding: 0 14px;
  background: #00ADFF;
  border-radius: 19px;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  cursor: pointer;
}

#g277Not { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 12100; display: none; }
#g277Not.acik { display: block; }
.g277-not-perde { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, .45); }

.g277-not-kutu {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 92%;
  max-width: 520px;
  max-height: 78%;
  overflow: auto;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, .3);
}

.g277-not-baslik {
  position: sticky;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 44px;
  padding: 0 12px;
  background: #00ADFF;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
}

.g277-not-kapat { font-size: 22px; line-height: 1; cursor: pointer; padding: 0 6px; }
.g277-not-govde { padding: 12px; }
.g277-not-satir { padding: 10px 0; border-bottom: 1px solid #eee; }
.g277-not-satir b { color: #1b1b1b; font-size: 13.5px; }
.g277-not-yazi { margin-top: 4px; font-size: 14px; line-height: 1.4; color: #333; word-break: break-word; }
.g277-not-zaman { margin-top: 4px; font-size: 11px; color: #8a8a8a; }
.g277-not-bos { padding: 18px; text-align: center; color: #9a9a9a; font-size: 14px; }
.g277-not-uyari { padding: 0 0 10px; font-size: 12.5px; color: #6b6b6b; }
.g277-not-yazan { padding: 10px 0; border-top: 1px solid #eee; }
.g277-not-yazan-ad { font-size: 13.5px; font-weight: 700; color: #1b1b1b; margin-bottom: 5px; }
.g277-not-input { display: block; box-sizing: border-box; width: 100%; min-height: 58px; padding: 7px 8px; border: 1px solid #cfcfcf; border-radius: 6px; font-size: 14px; resize: vertical; }
.g277-not-kaydet { display: inline-block; margin-top: 6px; padding: 6px 16px; background: #00ADFF; border-radius: 15px; color: #fff; font-size: 13px; font-weight: 700; cursor: pointer; }

/* ===== G283-2: PC ozel DM — kabul edilen baslik/liste/kutlu ===== */
#ozelcerceve .ustkisibar.g283-baslik{background:#0073FE!important;height:45px;line-height:normal;display:flex;align-items:center;padding:0 8px;box-sizing:border-box;border-radius:6px 6px 0 0}
.g283-bas-avatar{width:28px;height:28px;border-radius:50%;object-fit:cover;margin-right:8px;border:1px solid rgba(255,255,255,.7);flex:0 0 auto}
.g283-bas-ad{display:flex;flex-direction:column;justify-content:center;line-height:1.25;flex:1;text-align:left!important;color:#fff;overflow:hidden;min-width:0}
.g283-bas-ad b{font-size:13px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.g283-bas-ad small{display:block;font-size:11px;color:rgba(255,255,255,.85);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#ozelcerceve .ustkisibar .g283-bas-kapat{width:26px;height:26px;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
#ozelcerceve .ustkisibar .g283-bas-kapat i{color:#0073FE!important;margin:0}
#ozel_kisilistesi div.aktifbutone{background:#6F8EA3!important}
#ozel_kisilistesi div[listsocr]{min-height:52px}
#ozel_kisilistesi .ozchat_img img{width:44px;height:44px;border-radius:50%;object-fit:cover}
#ozelcerceve .yazismalani_ozel{height:55px;align-items:center;background:#fff!important;padding:6px 8px!important;box-sizing:border-box;position:relative}
#ozelcerceve .message_oda_outer{background:#F7F7F7!important;border-radius:23px;height:43px;min-height:43px;display:flex;align-items:center}
#ozelcerceve .ozelinput{padding:12px 0 0 18px!important;background:transparent!important;height:38px!important;width:100%!important}
#ozelcerceve .emojionearea{flex:1}
#ozelcerceve .iconlarspan{color:#6b6b6b!important;width:34px!important;margin:0 2px!important}
#ozelcerceve .messagero .message-text{border-radius:12px}
#ozelcerceve .messagero.message-sent .message-text{background:#DDEBFF!important;color:#1b2735!important}

/* ---- DM yazma bandindaki arama tugmeleri + vendor menusundeki Titret satiri (ref6, ref7) ---- */
.g283-ara-dugmeler{display:flex;align-items:center;margin-left:6px;flex:0 0 auto}
a.g283-dugme{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#6b6b6b!important;margin:0 2px;cursor:pointer;flex:0 0 auto}
a.g283-dugme:hover{background:#F7F7F7;color:#0073FE!important}
a.g283-dugme svg{width:19px;height:19px;display:block;pointer-events:none}
#ozelcerceve .g283-pc-titret{cursor:pointer}
#ozelcerceve .g283-pc-titret i.g283-menu-ikon{display:inline-block;width:1.18em;margin-right:.2em;color:#4a4a4a;vertical-align:middle}
#ozelcerceve .g283-pc-titret i.g283-menu-ikon svg{width:1em;height:1em;display:block;pointer-events:none}

/* ---- alinan titretme: yalniz DM penceresi sallar ---- */
@keyframes g283salla{0%,100%{transform:translateX(0)}20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}
#ozelcerceve div[ozelsohbetsc].g283-sallaniyor{animation:g283salla .55s ease-in-out 2}

/* ===== G283-3: arama katmani (referans gorunumu) ===== */
#g283PcFikst .gizle,#g283PcKatman .gizle,#g283PcBar .gizle,#g283MbKatman .gizle{display:none!important}
#g283PcFikst,#g283PcKatman{position:fixed;z-index:999990;background:rgba(255,255,255,.25);overflow:hidden}
#g283PcKatman{right:18px;bottom:18px;width:330px;height:400px;border-radius:14px;box-shadow:0 12px 34px rgba(0,0,0,.35)}
.g283-cagri{position:absolute;left:0;right:0;top:0;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;box-sizing:border-box;padding:14px calc(100% - 334px) 0 0}
.g283-resim{position:relative;z-index:2;flex:0 0 auto;width:126px;height:126px;border-radius:50%;background:#e9eef3;box-shadow:0 0 0 4px #fff,0 6px 20px rgba(0,0,0,.18);overflow:hidden}
.g283-resim>img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%;background:#fff}
.g283-ad{margin-top:10px;font-size:20px;font-weight:600;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.4);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}
.g283-bant{position:relative;z-index:1;display:flex;align-items:center;height:34px;margin-top:12px;padding:0 0 0 14px;border-radius:17px;background:#fff;box-shadow:0 5px 18px rgba(0,0,0,.18)}
.g283-yazi{font-size:13.5px;color:#2b2b2b;min-width:64px;text-align:center;white-space:nowrap}
.g283-tug{display:flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;color:#fff!important;cursor:pointer;flex:0 0 auto;margin-left:8px}
.g283-bant .g283-kirmizi{margin-right:-23px}
.g283-tug svg{width:20px;height:20px;display:block}
.g283-tug *{pointer-events:none}
.g283-yesil{background:#4CAF50!important}
.g283-kirmizi{background:#EA4335!important}
.g283-turuncu{background:#F58220!important}
.g283-kapali{background:#7a828c!important}
.g283-gri{background:rgba(214,214,214,.92)!important;color:#2196F3!important}
#g283PcBar{position:fixed;top:112px;left:50%;transform:translateX(-50%);z-index:999992}
.g283-bar{position:relative;display:flex;align-items:center;height:74px;padding:0 16px;border-radius:37px;background:rgba(255,255,255,.88);box-shadow:0 8px 26px rgba(0,0,0,.25)}
.g283-bar .g283-tug{width:50px;height:50px;margin:0 2px}
.g283-bar .g283-tug svg{width:22px;height:22px}
.g283-bar .g283-resim{width:130px;height:130px;margin:0 12px;box-shadow:0 0 0 4px #fff,0 0 0 12px rgba(255,255,255,.4)}
.g283-bar-bant{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);padding:5px 2px;background:rgba(255,255,255,.62);text-align:center;line-height:1.3}
.g283-bar-bant b{display:block;font-size:13px;color:#222;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.g283-bar-bant span{display:block;font-size:12.5px;color:#3c3c3c;font-variant-numeric:tabular-nums}
video.g283-uzakvideo{display:block!important;position:absolute!important;left:0;top:0;width:100%!important;height:100%!important;margin:0!important;object-fit:cover;background:#000;z-index:3}
.g283-benvideo{position:absolute;right:-8px;top:-8px;display:none;box-sizing:border-box;width:96px;height:128px;object-fit:cover;border-radius:10px;border:2px solid rgba(255,255,255,.8);background:#111;z-index:5}
.g283-bagli.g283-goruntulu .g283-benvideo{display:block}

/* ---- kisa bildirim perdesi ---- */
#g283Toast{position:fixed;left:50%;top:64px;transform:translateX(-50%) translateY(-14px);max-width:78%;padding:10px 17px;border-radius:22px;background:rgba(18,18,18,.92);color:#fff;font-size:13.5px;line-height:1.4;text-align:center;opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease;z-index:9999999}
#g283Toast.g283-acik{opacity:1;transform:translateX(-50%) translateY(0)}