/* HChat Professional UI v5
   Masaüstü yerleşim ve görsel iyileştirmeler. Bağlantı/IRC koduna müdahale etmez. */

:root {
  --h5-bg: #edf2f4;
  --h5-panel: #ffffff;
  --h5-panel-soft: #f6f9fa;
  --h5-line: #dbe5e8;
  --h5-line-soft: #edf2f3;
  --h5-text: #293940;
  --h5-muted: #74848c;
  --h5-primary: #15aaa4;
  --h5-primary-dark: #0b7d79;
  --h5-primary-soft: #e7f8f6;
  --h5-header: #15323b;
  --h5-header-end: #15565a;
  --h5-users-width: 270px;
  --h5-channels-width: 250px;
  --h5-radius: 16px;
}

/* Üst bar: kesilme ve hizalama düzeltmesi */
body.hchat-ui-v2 .chat-ust {
  flex: 0 0 72px !important;
  min-height: 72px !important;
  height: 72px !important;
  padding: 0 16px !important;
  overflow: visible !important;
  background:
    radial-gradient(circle at 18% -105%, rgba(70, 224, 215, .28), transparent 48%),
    linear-gradient(100deg, var(--h5-header), var(--h5-header-end)) !important;
}
body.hchat-ui-v2 .chat-ust > .row.ht-mob-hide,
body.hchat-ui-v2 .chat-ust > .row:not(.mob-top-menu) {
  min-height: 72px !important;
  height: 72px !important;
  padding-left: 182px !important;
  align-items: center !important;
}
body.hchat-ui-v2 .hchat-chat-brand {
  left: 16px !important;
  height: 72px !important;
}
body.hchat-ui-v2 .menu-one,
body.hchat-ui-v2 .menu-one > ul {
  height: 72px !important;
  min-height: 72px !important;
  align-items: center !important;
  overflow: visible !important;
}
body.hchat-ui-v2 .menu-one > ul {
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: flex-end !important;
  gap: 5px !important;
}
body.hchat-ui-v2 .menu-one ul li,
body.hchat-ui-v2 .menu-one ul li a,
body.hchat-ui-v2 .menu-one ul li.menu-nickname {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  align-self: center !important;
}
body.hchat-ui-v2 .menu-one ul li a,
body.hchat-ui-v2 .menu-one ul li.menu-nickname {
  height: 36px !important;
  min-height: 36px !important;
}
body.hchat-ui-v2 .menu-one ul li a {
  padding: 0 9px !important;
}
body.hchat-ui-v2 .menu-one ul li a .ml-2 {
  font-size: 9px !important;
  white-space: nowrap !important;
}

/* Panel düğmeleri artık panel başlıklarının üstünde, çakışmadan durur */
body.hchat-ui-v2 .hchat-chat-controls {
  top: 79px !important;
  right: 14px !important;
  bottom: auto !important;
  z-index: 75 !important;
}
body.hchat-ui-v2 .hchat-panel-toggle {
  height: 30px !important;
  padding: 0 11px !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.98) !important;
}

/* Ana alan ve kolonlar: sohbet + kişiler + odalar */
body.hchat-ui-v2 .main-content {
  padding: 43px 10px 10px !important;
  background: var(--h5-bg) !important;
}
body.hchat-ui-v2 .main-content .main-row {
  grid-template-columns: minmax(0, 1fr) var(--h5-users-width) var(--h5-channels-width) !important;
  grid-template-areas: "chat users channels" !important;
  gap: 10px !important;
}
body.hchat-ui-v2.hchat-hide-channels .main-content .main-row {
  grid-template-columns: minmax(0,1fr) var(--h5-users-width) 0 !important;
}
body.hchat-ui-v2.hchat-hide-users .main-content .main-row {
  grid-template-columns: minmax(0,1fr) 0 var(--h5-channels-width) !important;
}
body.hchat-ui-v2.hchat-hide-users.hchat-hide-channels .main-content .main-row {
  grid-template-columns: minmax(0,1fr) 0 0 !important;
}
body.hchat-ui-v2 .main-content .main-row > .main-col {
  border: 1px solid rgba(211,224,228,.96) !important;
  border-radius: var(--h5-radius) !important;
  background: var(--h5-panel) !important;
  box-shadow: 0 7px 25px rgba(33,61,71,.075) !important;
}

/* Panel başlıkları */
body.hchat-ui-v2 .hchat-side-head {
  flex-basis: 54px !important;
  height: 54px !important;
  padding: 0 13px !important;
}
body.hchat-ui-v2 .hchat-side-head-title {
  font-size: 12px !important;
}
body.hchat-ui-v2 .hchat-side-head-title i {
  width: 29px !important;
  height: 29px !important;
}
body.hchat-ui-v2 .hchat-side-head small {
  font-size: 8px !important;
  letter-spacing: .55px;
}

/* Kanal paneli */
body.hchat-ui-v2 .channel-list {
  padding: 11px 10px 18px !important;
}
body.hchat-ui-v2 .channel-list li {
  min-height: 42px !important;
  margin-bottom: 6px !important;
  border: 1px solid transparent !important;
  border-radius: 11px !important;
  color: #60717a !important;
  background: #f5f8f9 !important;
  box-shadow: none !important;
  transition: transform .16s ease, border-color .16s ease, background .16s ease !important;
}
body.hchat-ui-v2 .channel-list li:hover {
  border-color: #c7e5e2 !important;
  color: var(--h5-primary-dark) !important;
  background: #eef9f8 !important;
  transform: translateX(2px);
}
body.hchat-ui-v2 .channel-list li.current,
body.hchat-ui-v2 .channel-list li.active,
body.hchat-ui-v2 .channel-list li.selected,
body.hchat-ui-v2 .channel-list li.secili {
  border-color: transparent !important;
  color: #fff !important;
  background: linear-gradient(135deg, #16ada7, #0b7d79) !important;
  box-shadow: 0 8px 18px rgba(11,125,121,.22) !important;
}
body.hchat-ui-v2 .channel-list li.current *,
body.hchat-ui-v2 .channel-list li.active *,
body.hchat-ui-v2 .channel-list li.selected *,
body.hchat-ui-v2 .channel-list li.secili * {
  color: #fff !important;
}
body.hchat-ui-v2 .channel-list li .cl-table .cl-cell {
  font-size: 11px !important;
}

/* Kullanıcı paneli */
body.hchat-ui-v2 .user-search {
  padding: 10px 11px !important;
}
body.hchat-ui-v2 .user-search input {
  height: 39px !important;
  border-radius: 12px !important;
}
body.hchat-ui-v2 .us-ul li,
body.hchat-ui-v2 #chatListUser .list-group-item {
  min-height: 43px !important;
  padding-right: 10px !important;
  padding-left: 10px !important;
}

/* Sohbet alanı */
body.hchat-ui-v2 #chatPanel {
  background: #f7f9fa !important;
}
body.hchat-ui-v2 .chat-content {
  background-color: #f3f6f7 !important;
  background-image:
    linear-gradient(rgba(248,250,251,.88), rgba(248,250,251,.88)),
    radial-gradient(#ccd9dc .65px, transparent .65px) !important;
  background-size: auto, 19px 19px !important;
}
body.hchat-ui-v2 .m-topic {
  height: 51px !important;
  padding-top: 15px !important;
  color: #63747c !important;
  background: rgba(255,255,255,.96) !important;
}
body.hchat-ui-v2 .chat-panelimiz {
  padding: 13px 17px 22px !important;
}
body.hchat-ui-v2 .mesaj,
body.hchat-ui-v2 .chat-message {
  margin: 2px 0 !important;
  padding: 5px 8px !important;
  border-bottom: 1px solid rgba(220,229,232,.46);
  border-radius: 7px !important;
}
body.hchat-ui-v2 .mesaj:hover,
body.hchat-ui-v2 .chat-message:hover {
  background: rgba(225,243,241,.72) !important;
}
body.hchat-ui-v2 .mesaj.not,
body.hchat-ui-v2 .not-blue {
  border-bottom-color: transparent !important;
  border-left: 3px solid #4fc3bc !important;
  background: #e9f7f5 !important;
}

/* Alt editör: tek parça modern panel */
body.hchat-ui-v2 .chat-editor {
  flex: 0 0 108px !important;
  height: 108px !important;
  border-top: 1px solid var(--h5-line) !important;
  background: #f7f9fa !important;
  box-shadow: 0 -5px 18px rgba(35,65,75,.045);
}
body.hchat-ui-v2 .ce-top {
  height: 43px !important;
  padding: 0 8px !important;
  border-bottom: 1px solid var(--h5-line-soft) !important;
  background: #f8fafb !important;
}
body.hchat-ui-v2 .cel-col,
body.hchat-ui-v2 .cer-col {
  height: 42px !important;
  min-width: 38px !important;
  border-color: transparent !important;
  border-radius: 8px;
}
body.hchat-ui-v2 .ce-bot {
  height: 64px !important;
  padding: 10px 11px !important;
  background: #fff !important;
}
body.hchat-ui-v2 .ce-bot .ceb-col:not(.inputdiv) {
  min-width: 36px !important;
}
body.hchat-ui-v2 .inputdiv {
  padding: 0 8px !important;
}
body.hchat-ui-v2 #btn-input,
body.hchat-ui-v2 .inputyolla {
  height: 43px !important;
  padding: 0 46px 0 15px !important;
  border-color: #d7e2e5 !important;
  border-radius: 14px !important;
  background: #f4f7f8 !important;
}
body.hchat-ui-v2 #btn-input:focus,
body.hchat-ui-v2 .inputyolla:focus {
  border-color: #82d0cc !important;
  background: #fff !important;
}
body.hchat-ui-v2 .send-button {
  min-width: 105px !important;
  height: 43px !important;
  border-radius: 13px !important;
  background: linear-gradient(135deg, #18b2ac, #0b827e) !important;
  box-shadow: 0 8px 18px rgba(11,130,126,.22) !important;
  line-height: 43px !important;
}

/* Eski sağ-alt Gizle düğmesi yeni panel kontrolleriyle çakışmasın */
body.hchat-ui-v2 #gizler {
  display: none !important;
}

/* Orta boy ekranlarda panelleri dengeli küçült */
@media (max-width: 1450px) and (min-width: 992px) {
  :root {
    --h5-users-width: 235px;
    --h5-channels-width: 220px;
  }
  body.hchat-ui-v2 .menu-one ul li a .ml-2 {
    display: none !important;
  }
  body.hchat-ui-v2 .menu-one ul li a {
    width: 36px !important;
    justify-content: center !important;
    padding: 0 !important;
  }
}

/* Mobil yapı mevcut davranışı korur */
@media (max-width: 991px) {
  body.hchat-ui-v2 .chat-ust {
    flex: 0 0 54px !important;
    min-height: 54px !important;
    height: 54px !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
  body.hchat-ui-v2 .main-content {
    padding: 0 !important;
  }
  body.hchat-ui-v2 .hchat-chat-controls {
    display: none !important;
  }
  body.hchat-ui-v2 .chat-editor {
    height: 48px !important;
    flex-basis: 48px !important;
  }
  body.hchat-ui-v2 .ce-bot {
    height: 47px !important;
    padding: 5px !important;
  }
  body.hchat-ui-v2 #btn-input,
  body.hchat-ui-v2 .inputyolla {
    height: 35px !important;
  }
  body.hchat-ui-v2 .send-button {
    min-width: 64px !important;
    height: 35px !important;
    line-height: 35px !important;
  }
}