/* V14 TARGETED FINAL - only the requested layout/theme/performance fixes. */

/* 1) Chat surfaces: exact same background, no visible frame around composer. */
.chat-main,
.chat-window,
.chat-input-zone,
.zalo-toolbar,
.zalo-input-area,
.zalo-input-box{
  background-color:var(--bg-main) !important;
  background-image:none !important;
}
.chat-input-zone,
.zalo-toolbar,
.zalo-input-box{border:0 !important;box-shadow:none !important}

/* 2) Structural separators: remove the thin horizontal/vertical lines while
   leaving real form controls and semantic danger controls untouched. */
.sidebar-icon,
.sidebar-menu,
.chat-header,
.chat-main,
.right-info-panel,
.panel-top,
.panel-section-box,
.admin-modal-content,
.admin-modal-header,
.admin-modal-body,
.admin-tabs,
.msg-mgmt-container,
.msg-mgmt-sidebar,
.msg-mgmt-content,
.admin-table th,
.admin-table td,
.msg-mgmt-room-item,
.room-manager-setting{
  border-top:0 !important;
  border-right:0 !important;
  border-bottom:0 !important;
  border-left:0 !important;
}

/* Keep spacing to separate sections visually instead of borders. */
.admin-tabs{padding-bottom:4px !important}
.msg-mgmt-room-item{margin:2px 6px !important;border-radius:9px !important}
.msg-mgmt-room-item.active{background:var(--primary) !important;color:var(--primary-contrast,#fff) !important}

/* 3) Member list: restore the compact established member-row appearance;
   only the scrollbar follows the active light/dark surface. */
.member-list-wrapper{
  background:transparent !important;
  scrollbar-color:color-mix(in srgb,var(--text-sub) 42%,var(--bg-main)) var(--bg-main) !important;
  scrollbar-width:thin !important;
}
.member-list-wrapper::-webkit-scrollbar{width:6px !important}
.member-list-wrapper::-webkit-scrollbar-track{background:var(--bg-main) !important}
.member-list-wrapper::-webkit-scrollbar-thumb{
  background:color-mix(in srgb,var(--text-sub) 42%,var(--bg-main)) !important;
  border:0 !important;border-radius:999px !important;
}
.member-row{background:color-mix(in srgb,var(--bg-main) 96%,var(--primary) 4%) !important;border:0 !important}

/* 4) Group-management controls: icons, compact and accent-aware. */
#adminBox .group-add-btn,
#adminBox .group-update-btn{
  font-size:0 !important;
  width:40px !important;
  min-width:40px !important;
  height:36px !important;
  padding:0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:var(--primary) !important;
  color:var(--primary-contrast,#fff) !important;
  border:0 !important;
}
#adminBox .group-add-btn::before,
#adminBox .group-update-btn::before{
  content:"";display:block;width:17px;height:17px;background:currentColor;
  -webkit-mask-position:center;-webkit-mask-repeat:no-repeat;-webkit-mask-size:contain;
  mask-position:center;mask-repeat:no-repeat;mask-size:contain;
}
#adminBox .group-add-btn::before{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M11 5h2v6h6v2h-6v6h-2v-6H5v-2h6V5Z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M11 5h2v6h6v2h-6v6h-2v-6H5v-2h6V5Z'/%3E%3C/svg%3E");
}
#adminBox .group-update-btn::before{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M17.65 6.35A8 8 0 1 0 19.9 14h-2.05a6 6 0 1 1-1.62-5.1L14 11h6V5l-2.35 1.35Z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M17.65 6.35A8 8 0 1 0 19.9 14h-2.05a6 6 0 1 1-1.62-5.1L14 11h6V5l-2.35 1.35Z'/%3E%3C/svg%3E");
}
#adminBox .v13-delete-group-btn{border:1px solid color-mix(in srgb,#ef4444 42%,var(--bg-main)) !important}
#adminBox .v13-delete-group-btn:hover{background:color-mix(in srgb,#ef4444 10%,var(--bg-main)) !important}

/* 5-6) All three Admin screens: buttons use the current theme. Danger remains red. */
#adminModal #adminUserTable .action-btn,
#adminModal #adminUserTable .kick-btn,
#adminModal .admin-action-button,
#adminModal .add-btn,
#adminModal .primary-btn,
#adminModal .save-btn,
#adminModal .update-btn{
  background:var(--bg-header) !important;
  border-color:color-mix(in srgb,var(--primary) 24%,var(--border-color)) !important;
  color:var(--primary) !important;
  box-shadow:none !important;
}
#adminModal #adminUserTable .action-btn:hover,
#adminModal .admin-action-button:hover,
#adminModal .add-btn:hover,
#adminModal .save-btn:hover,
#adminModal .update-btn:hover{
  background:var(--hover-bg) !important;
  border-color:var(--primary) !important;
}
#adminModal #adminUserTable .kick-btn,
#adminModal .admin-action-delete{
  color:#ef4444 !important;
  border-color:color-mix(in srgb,#ef4444 42%,var(--border-color)) !important;
}
#adminModal #adminUserTable .kick-btn:hover,
#adminModal .admin-action-delete:hover{background:color-mix(in srgb,#ef4444 10%,var(--bg-header)) !important}

/* 7) Admin message/log lists: compact initial page + incremental scroll. */
#adminModal .admin-message-scroll,
#adminModal .admin-log-scroll,
#adminModal .msg-mgmt-sidebar{
  scrollbar-color:color-mix(in srgb,var(--text-sub) 42%,var(--bg-main)) var(--bg-main) !important;
  scrollbar-width:thin !important;
}
#adminModal .admin-message-scroll::-webkit-scrollbar,
#adminModal .admin-log-scroll::-webkit-scrollbar,
#adminModal .msg-mgmt-sidebar::-webkit-scrollbar{width:6px !important}
#adminModal .admin-message-scroll::-webkit-scrollbar-track,
#adminModal .admin-log-scroll::-webkit-scrollbar-track,
#adminModal .msg-mgmt-sidebar::-webkit-scrollbar-track{background:var(--bg-main) !important}
#adminModal .admin-message-scroll::-webkit-scrollbar-thumb,
#adminModal .admin-log-scroll::-webkit-scrollbar-thumb,
#adminModal .msg-mgmt-sidebar::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--text-sub) 42%,var(--bg-main)) !important;border:0 !important;border-radius:999px !important}

/* No row grid lines in Admin tables; spacing still separates rows. */
#adminModal .admin-table tbody tr{border:0 !important}
#adminModal .admin-table th,
#adminModal .admin-table td{border:0 !important}
#adminModal .admin-table tbody tr + tr td{padding-top:12px !important}

/* Keep message-management controls readable in both themes. */
#adminModal .admin-message-actions .admin-action-edit,
#adminModal .admin-message-actions .admin-action-toggle,
#adminModal .admin-message-actions .admin-action-forward{color:var(--primary) !important;background:var(--bg-header) !important}
#adminModal .admin-message-actions .admin-action-delete{color:#ef4444 !important;background:var(--bg-header) !important}

/* Media list is intentionally part of the group panel, not a separate mode. */
.v13-group-media-section{border:0 !important;background:transparent !important}
.v13-group-media-head{border:0 !important;background:var(--bg-header) !important}
.v13-group-media-item{border:0 !important;background:var(--input-bg) !important}
.v13-group-media-action{border:0 !important;background:var(--bg-header) !important;color:var(--primary) !important}

/* 8) Theme-matched global scrollbars, including PC/tablet/mobile. */
html,body,*{
  scrollbar-color:color-mix(in srgb,var(--text-sub) 38%,var(--bg-main)) var(--bg-main);
}
::-webkit-scrollbar-track{background:var(--bg-main) !important}
::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--text-sub) 38%,var(--bg-main)) !important;border:0 !important}

@media(max-width:768px){
  .chat-main,.chat-window,.chat-input-zone,.zalo-toolbar,.zalo-input-area,.zalo-input-box{background-color:var(--bg-main) !important}
  .right-info-panel,.panel-top,.panel-section-box{border:0 !important}
}