/* Chitter 皮肤：覆盖 Element 的绿色强调色色阶（由 tools/make_theme.py 生成，别手改） */
.cpd-theme-light.cpd-theme-light.cpd-theme-light {
  --cpd-color-green-100: #f8fdfc;
  --cpd-color-green-200: #f1fbf9;
  --cpd-color-green-300: #e3f7f4;
  --cpd-color-green-400: #c5efe7;
  --cpd-color-green-500: #97e2d5;
  --cpd-color-green-600: #70d8c6;
  --cpd-color-green-700: #0bc4a3;
  --cpd-color-green-800: #019a7f;
  --cpd-color-green-900: #0e8a74;
  --cpd-color-green-1000: #006b58;
  --cpd-color-green-1100: #005c4b;
  --cpd-color-green-1200: #00493c;
  --cpd-color-green-1300: #00342b;
  --cpd-color-green-1400: #00231d;
}
.cpd-theme-light-hc.cpd-theme-light-hc.cpd-theme-light-hc {
  --cpd-color-green-100: #f8fdfc;
  --cpd-color-green-200: #f1fbf9;
  --cpd-color-green-300: #e3f7f4;
  --cpd-color-green-400: #c5efe7;
  --cpd-color-green-500: #97e2d5;
  --cpd-color-green-600: #70d8c6;
  --cpd-color-green-700: #0bc4a3;
  --cpd-color-green-800: #019a7f;
  --cpd-color-green-900: #0e8a74;
  --cpd-color-green-1000: #006b58;
  --cpd-color-green-1100: #005c4b;
  --cpd-color-green-1200: #00493c;
  --cpd-color-green-1300: #00342b;
  --cpd-color-green-1400: #00231d;
}
.cpd-theme-dark.cpd-theme-dark.cpd-theme-dark {
  --cpd-color-green-100: #001c16;
  --cpd-color-green-200: #001f19;
  --cpd-color-green-300: #00251d;
  --cpd-color-green-400: #012d25;
  --cpd-color-green-500: #013c31;
  --cpd-color-green-600: #014739;
  --cpd-color-green-700: #015948;
  --cpd-color-green-800: #017961;
  --cpd-color-green-900: #35b99f;
  --cpd-color-green-1000: #18ab8e;
  --cpd-color-green-1100: #20bfa0;
  --cpd-color-green-1200: #72d5c2;
  --cpd-color-green-1300: #b5e8de;
  --cpd-color-green-1400: #d9f4ef;
}
.cpd-theme-dark-hc.cpd-theme-dark-hc.cpd-theme-dark-hc {
  --cpd-color-green-100: #001c16;
  --cpd-color-green-200: #001f19;
  --cpd-color-green-300: #00251d;
  --cpd-color-green-400: #012d25;
  --cpd-color-green-500: #013c31;
  --cpd-color-green-600: #014739;
  --cpd-color-green-700: #015948;
  --cpd-color-green-800: #017961;
  --cpd-color-green-900: #35b99f;
  --cpd-color-green-1000: #18ab8e;
  --cpd-color-green-1100: #20bfa0;
  --cpd-color-green-1200: #72d5c2;
  --cpd-color-green-1300: #b5e8de;
  --cpd-color-green-1400: #d9f4ef;
}

/* 登录页品牌 logo 尺寸 */
.mx_AuthHeaderLogo img, .mx_AuthHeaderLogo { max-width: 180px; }
/* 欢迎页不显示「创建账号」：注册只走 /join 的邀请链接 */
.mx_ButtonCreateAccount { display: none !important; }

/* ---------- 手机适配（≤767px）：单列布局，列表和会话二选一，返回按钮由 branding/mobile.js 注入 ---------- */
#ch-back { display: none; }
@media (max-width: 767px) {
  .mx_AuthPage { padding: 0 !important; }
  .mx_AuthPage_modal { width: 100% !important; max-width: 100% !important; margin: 0 !important; border-radius: 0 !important; flex-direction: column !important; min-height: 100%; }
  .mx_AuthHeader { display: none !important; }
  .mx_AuthBody { width: 100% !important; max-width: 100% !important; border-radius: 0 !important; padding: 24px 20px calc(24px + env(safe-area-inset-bottom)) !important; box-sizing: border-box; }
  .mx_AuthBody .mx_AuthBody_language { display: none; }
  .mx_AuthFooter { flex-wrap: wrap; justify-content: center; padding: 12px; }
  .mx_SpacePanel { display: none !important; }
  .mx_ResizeHandle, .mx_Separator { display: none !important; }
  /* Element 1.12 的主区域是两个可拖拽面板：A 放房间列表（含 .mx_LeftPanel），B 放会话/首页（含 .mx_RoomView_wrapper）；窄屏时它会把 A 折成 0 宽 */
  .mx_MatrixChat > div > div:has(> .mx_LeftPanel_panel) { flex: 1 1 100% !important; width: 100% !important; min-width: 0 !important; max-width: none !important; }
  .mx_LeftPanel_panel, .mx_LeftPanel_outerWrapper, .mx_LeftPanel_wrapper, .mx_LeftPanel { width: 100% !important; max-width: none !important; min-width: 0 !important; }
  body.ch-mobile:not(.ch-room) .mx_MatrixChat > div > div:has(> .mx_LeftPanel_panel .mx_RoomView_wrapper) { display: none !important; }
  body.ch-mobile.ch-room .mx_MatrixChat > div > div:has(> .mx_LeftPanel_panel .mx_LeftPanel) { display: none !important; }
  .mx_RoomView, .mx_RoomView_wrapper, .mx_UserView { width: 100% !important; min-width: 0 !important; }
  .mx_RightPanel { position: fixed !important; inset: 0 !important; width: 100% !important; max-width: none !important; z-index: 900; background: var(--cpd-color-bg-canvas-default); }
  body.ch-mobile.ch-room #ch-back { display: flex; position: fixed; top: calc(env(safe-area-inset-top) + 10px); left: 4px; width: 44px; height: 44px; border: 0; border-radius: 22px; background: transparent; color: var(--cpd-color-text-action-accent); align-items: center; justify-content: center; z-index: 60; cursor: pointer; }
  body.ch-mobile.ch-room .mx_RoomHeader { padding-left: 46px !important; }
  .mx_RoomHeader { padding-top: env(safe-area-inset-top); height: calc(64px + env(safe-area-inset-top)) !important; }
  .mx_LeftPanel { padding-top: env(safe-area-inset-top); }
  .mx_MessageComposer { padding-bottom: calc(env(safe-area-inset-bottom) + 6px) !important; }
  .mx_Dialog_fixedWidth { width: calc(100vw - 24px) !important; max-width: none !important; }
  .mx_Dialog { padding: 20px 16px !important; max-height: calc(100vh - 24px) !important; }
  .mx_UserSettingsDialog, .mx_RoomSettingsDialog, .mx_SpaceSettingsDialog { width: 100vw !important; height: 100% !important; max-width: none !important; }
  .mx_TabbedView_tabsOnLeft .mx_TabbedView_tabLabels { position: static !important; width: 100% !important; max-width: none !important; display: flex !important; flex-direction: row !important; overflow-x: auto; gap: 4px; margin-bottom: 8px !important; }
  .mx_TabbedView_tabsOnLeft .mx_TabbedView_tabLabel { white-space: nowrap; flex-shrink: 0; }
  .mx_TabbedView_tabsOnLeft .mx_TabbedView_tabPanel { margin-left: 0 !important; }
  .mx_HomePage { width: 100% !important; padding: 0 16px; }
}