/* ==================== SNX Login Theme v9 ====================
   方向：浅色清爽 · 深紫主色 #4A3A6B · 金色点缀 #D4AF37
   更新：修复卡片双重重叠（v8 的 .pf-v5-c-login__container 未加 body 限定，
         导致 PatternFly 内部子容器的 grid 被意外修改）
   ========================================================== */

/* —— 背景：极浅紫白，去掉 Keycloak 默认图 —— */
html, body, body#keycloak-bg, .login-pf, .login-pf body,
.pf-v5-c-login {
  background-color: #F7F5FB !important;
  background-image: none !important;
}

/* —— 品牌名：深紫，唯一的主视觉 —— */
#kc-header-wrapper, #kc-header-wrapper.pf-v5-c-brand, #kc-header {
  background: none !important;
  -webkit-text-fill-color: #4A3A6B !important;
  color: #4A3A6B !important;
  font-weight: 800 !important;
  font-size: 22px !important;
  letter-spacing: 1.5px !important;
  text-shadow: none !important;
  filter: none !important;
}

/* —— 卡片：白底 + 柔和阴影 + 顶部金色细线 —— */
.pf-v5-c-login__main, .card-pf, #kc-form-wrapper, .pf-v5-c-login__main-body {
  background-color: #FFFFFF !important;
  border: none !important;
  border-top: 4px solid #D4AF37 !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 24px rgba(74,58,107,.08) !important;
}

/* —— 页面标题 —— */
#kc-page-title, .pf-v5-c-title, .pf-v5-c-login__main-header h1 {
  color: #2D2A3A !important;
  font-weight: 600 !important;
  font-size: 17px !important;
}
.pf-v5-c-login__main-header { border-bottom: 1px solid #EFEAF7 !important; }

/* —— 表单标签 —— */
label, .pf-v5-c-form__label, .pf-v5-c-form__label-text,
.pf-v5-c-check__label {
  color: #4A3A6B !important;
  font-weight: 600 !important;
  font-size: 13px !important;
}

/* —— 输入框 —— */
input[type=text], input[type=password], input[type=email],
.pf-v5-c-form-control, .pf-v5-c-form-control > input {
  background-color: #FFFFFF !important;
  color: #2D2A3A !important;
  border: 1px solid #E5E0F0 !important;
  border-radius: 10px !important;
}
input[type=text]:focus, input[type=password]:focus, input[type=email]:focus,
.pf-v5-c-form-control:focus-within {
  border-color: #4A3A6B !important;
  box-shadow: 0 0 0 3px rgba(74,58,107,.12) !important;
  outline: none !important;
}

/* —— 主按钮：深紫 → hover 转金 —— */
#kc-login, button[type=submit].pf-m-primary, input[name=login] {
  background-color: #4A3A6B !important;
  border: none !important;
  color: #FFFFFF !important;
  font-weight: 600 !important;
  letter-spacing: .3px !important;
  border-radius: 10px !important;
  padding: 11px 24px !important;
  box-shadow: none !important;
  transition: background-color .18s, color .18s !important;
}
#kc-login:hover, button[type=submit].pf-m-primary:hover, input[name=login]:hover {
  background-color: #D4AF37 !important;
  color: #3A2B5A !important;
}

/* —— 链接 —— */
a, .pf-v5-c-button.pf-m-link { color: #4A3A6B !important; font-weight: 600 !important; }
a:hover { color: #D4AF37 !important; text-decoration: underline !important; }

/* —— 次要按钮（Show password 等）—— */
.pf-v5-c-button.pf-m-control, .pf-v5-c-button.pf-m-secondary {
  background-color: #F4F1FA !important;
  border-color: #E5E0F0 !important;
  color: #4A3A6B !important;
  border-radius: 8px !important;
}

/* —— 页脚信息区 —— */
.pf-v5-c-login__main-footer, #kc-info, #kc-info-wrapper { color: #7A7391 !important; }


/* ==================== SNX Page Title OUTLINE+FILL (2026-09-13) ============
   需求：登录页标题 "Sign in to your account" 改为 金色描边 + 深紫填充。
   ======================================================================== */
#kc-page-title,
.pf-v5-c-title,
.pf-v5-c-login__main-header h1 {
  color: #4A3A6B !important;
  -webkit-text-fill-color: #4A3A6B !important;
  -webkit-text-stroke: 1px #D4AF37 !important;
  paint-order: stroke fill !important;
  background-image: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  text-shadow: none !important;
  font-weight: 700 !important;
}

/* 回退：不支持 -webkit-text-stroke 的环境，用金色四向阴影模拟描边 */
@supports not (-webkit-text-stroke: 1px #D4AF37) {
  #kc-page-title,
  .pf-v5-c-title,
  .pf-v5-c-login__main-header h1 {
    text-shadow:
      -1px -1px 0 #D4AF37,
       1px -1px 0 #D4AF37,
      -1px  1px 0 #D4AF37,
       1px  1px 0 #D4AF37 !important;
  }
}

/* ==================== SNX Brand ABOVE CARD (2026-09-13) ==================
   需求：把品牌名 (#kc-header) 从左侧栏移到登录卡片上方并居中。
   修改进度（v9）：
     - 增加 body[data-page-id^="login"] 前缀限定作用域，避免影响其他页面
     - 仅针对 .pf-v5-c-login[role="main"] 这一根容器设置 grid 布局
   ======================================================================== */
body[data-page-id^="login"] .pf-v5-c-login[role="main"] {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}
body[data-page-id^="login"] .pf-v5-c-login__header {
  order: -1 !important; /* header 提到最上面 */
  justify-self: center !important;
  text-align: center !important;
  margin-bottom: 1rem;
  width: 100% !important;
}
body[data-page-id^="login"] .pf-v5-c-login__main {
  width: 100% !important;
  max-width: 34rem !important; /* 与 PF 桌面端 main 列宽一致 */
}
body[data-page-id^="login"] .pf-v5-c-login__footer {
  order: 10 !important; /* footer 放最下面 */
  text-align: center !important;
}

/* ==================== SNX Page Title CENTER v2 (2026-09-13) ============
   需求：登录卡片内标题 "Sign in to your account" 在卡片内真正水平居中。
   ======================================================================== */
body[data-page-id^="login-"] .pf-v5-c-login__main-header {
  display: flex !important;
  justify-content: center !important;
}
body[data-page-id^="login-"] .pf-v5-c-login__main-header,
body[data-page-id^="login-"] .pf-v5-c-login__main-header h1,
body[data-page-id^="login-"] #kc-page-title,
body[data-page-id^="login-"] .pf-v5-c-title {
  text-align: center !important;
}