/* ============================================================
   CREATEEL 品牌层（brand.css）· v7
   由 nginx 注入官方前端 HTML 尾部，不侵入官方任何文件。
   参照：原自研前端 /home/ubuntu/ekko-static/custom-login.css（v6）
   强调色：logo 深蓝 #233176 ｜ 环形渐变 2A4E9E → 3390E7
   ============================================================ */

/* —— 品牌令牌 —— */
:root {
  --accent-primary: #233176 !important;
  --accent-primary-rgb: 35, 49, 118 !important;
  --accent: #233176 !important;
  --brand-gradient-from: #2a4e9e;
  --brand-gradient-to: #3390e7;

  --font-ui: "Inter", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
    system-ui, -apple-system, "Segoe UI", Roboto, sans-serif !important;
  --radius-component: 10px !important;
}

/* 深色主题：深蓝 #233176 在黑底上几乎看不见，
   按品牌环形渐变（2A4E9E → 3390E7）取亮端派生一个浅蓝作强调色。 */
html.dark {
  --accent-primary: #5b84e8 !important;
  --accent-primary-rgb: 91, 132, 232 !important;
  --accent: #5b84e8 !important;
}

/* —— logo 兜底：任何位置的品牌 logo 都不许超过 140px ——
   官方组件自己声明的尺寸（24/48/72/80px）照常生效，
   这里只是防止某个容器把图片撑成原图大小（1024px）。 */
img[src*="/logo.png"] {
  max-width: 140px !important;
  max-height: 140px !important;
  object-fit: contain;
}

/* ============================================================
   登录页
   ============================================================ */

/* —— 页面背景：白底 + 极淡深蓝氛围光晕 —— */
.login-view {
  background:
    radial-gradient(1100px 620px at 50% -6%, rgba(42, 78, 158, 0.07), transparent 70%),
    radial-gradient(760px 420px at 88% 108%, rgba(35, 49, 118, 0.05), transparent 65%),
    #ffffff !important;
  position: relative;
}

/* —— 卡片：更宽更扁，宽高比舒展 —— */
.login-card {
  background: #ffffff !important;
  border: 1px solid #e8ecf3 !important;
  border-radius: 16px !important;
  box-shadow: 0 1px 2px rgba(13, 37, 61, 0.04), 0 12px 32px rgba(13, 37, 61, 0.06) !important;
  width: 460px !important;
  max-width: calc(100vw - 40px) !important;
  padding: 34px 48px 30px !important;
  text-align: center;
}

/* —— Logo —— */
.login-logo { margin: 0 auto 20px !important; }
.login-logo img {
  border-radius: 14px !important;
  box-shadow: 0 8px 24px rgba(13, 37, 61, 0.12);
  width: 140px !important;
  height: 140px !important;
  max-width: 90% !important;
}

/* —— 主标题 —— */
.login-title {
  color: #0d253d !important;
  font-size: 28px !important;
  font-weight: 600 !important;
  letter-spacing: -0.6px !important;
  line-height: 1.2 !important;
  margin: 0 0 8px !important;
  -webkit-text-fill-color: #0d253d;
  font-family: -apple-system, "SF Pro Display", Inter, system-ui, sans-serif;
}

/* —— 副标题（品牌 slogan） —— */
.login-title::after {
  content: "你的全能 AI 助理";
  display: block;
  margin-top: 6px;
  font-size: 15px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.6;
  color: #64748d;
  -webkit-text-fill-color: #64748d;
  font-family: -apple-system, "SF Pro Text", Inter, system-ui, sans-serif;
}

.login-desc { color: #64748d !important; }

/* 默认账号密码提示（admin/123456）——自研版已去掉，这里一并隐藏，
   登录锁在 nginx 层，页面上不给任何默认凭据线索。
   （.login-lock-hint 是被限流时的提示，自研版保留了，不动） */
.login-default-hint {
  display: none !important;
}

/* —— 表单 —— */
.login-form {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  margin-top: 24px !important;
}

/* —— 输入框 —— */
.login-input {
  background: #ffffff !important;
  border: 1px solid #d9e0ea !important;
  border-radius: 8px !important;
  color: #0d253d !important;
  padding: 12px 16px !important;
  font-size: 15px !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  text-align: left;
}
.login-input::placeholder { color: #94a3b8 !important; }
.login-input:hover { border-color: #b9c2d2 !important; }
.login-input:focus {
  border-color: #233176 !important;
  box-shadow: 0 0 0 3px rgba(35, 49, 118, 0.13);
  outline: none !important;
}

/* —— 登录按钮 —— */
.login-btn {
  background: #233176 !important;
  border: none !important;
  border-radius: 9999px !important;
  color: #ffffff !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  padding: 12px 16px !important;
  letter-spacing: 0.2px !important;
  margin-top: 6px;
  cursor: pointer;
  transition: transform 0.12s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.login-btn:hover {
  background: #2a4e9e !important;
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(35, 49, 118, 0.28) !important;
  opacity: 1 !important;
}
.login-btn:active { transform: scale(0.98) !important; box-shadow: none; }
.login-btn:disabled { opacity: 0.5 !important; cursor: default; }

/* —— 错误提示 —— */
.login-error {
  color: #dc2626 !important;
  font-size: 13px !important;
  text-align: left;
  margin-top: 2px;
}

/* —— 锁定提示 —— */
.login-lock-hint {
  border: 1px solid rgba(245, 158, 11, 0.35) !important;
  background: rgba(251, 191, 36, 0.07) !important;
  color: #92400e !important;
  border-radius: 8px !important;
  text-align: left;
}
.login-lock-hint code { color: #b45309 !important; }

/* —— 底部版权小字 —— */
.login-card::after {
  content: "© CREATEEL INTERNATIONAL LTD. · All rights reserved";
  display: block;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid #f0f2f6;
  font-family: -apple-system, "SF Pro Text", Inter, system-ui, sans-serif;
  font-size: 11px;
  letter-spacing: 0.04em;
  color: #94a3b8;
}

@media (max-width: 540px) {
  .login-card { padding: 26px 24px !important; }
  .login-title { font-size: 24px !important; }
}

/* ============================================================
   品牌层补的「管理控制台」入口
   ============================================================ */
.sidebar-nav > a[data-ekko-brand="1"] { position: relative; }
.sidebar-nav > a[data-ekko-brand="1"]::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -6px;
  height: 1px;
  background: var(--border-color, rgba(127, 127, 127, 0.18));
}

/* ============================================================
   移动端上下白边
   官方 global.scss 里 body 的背景色是编译期写死的浅色（不跟主题走），
   加上 <meta name="theme-color"> 写死 #f7f7f4，Android 会拿这个颜色去刷
   状态栏和系统导航栏 —— 深色主题下页面上下就各留一条白边，跟内容断层。
   --ekko-brand-bg 由 brand.js 按当前主题实时写入（深色 #1a1a1a / 浅色 #fafafa）。
   ============================================================ */
html,
body {
  background-color: var(--ekko-brand-bg, var(--bg-primary, #fafafa)) !important;
}

/* 桌面客户端要透明底，别覆盖 */
html.hermes-desktop-windows,
html.hermes-desktop-windows body {
  background-color: transparent !important;
}