/* 仅覆盖本项目“色彩工坊对齐版登录下拉”样式，避免影响主站基础壳样式 */

#kq-header-auth .header-auth-logged { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
#kq-header-auth .header-user-menu { position: relative; flex: 0 0 auto; }

/* 登录按钮（已登录态胶囊） */
#kq-header-auth #auth-user-center-btn.header-user-center-btn {
  position: relative;
  min-width: 114px;
  height: 42px;
  padding: 0 12px 0 8px;
  border: 1px solid #bfd5fa;
  border-radius: 999px;
  background: linear-gradient(180deg, #ffffff 0%, #f3f8ff 100%);
  color: #1f74ea;
  box-shadow: 0 10px 22px rgba(30, 136, 229, 0.12);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  font-family: Microsoft YaHei, PingFang SC, sans-serif;
  white-space: nowrap;
}
#kq-header-auth #auth-user-center-btn.header-user-center-btn:hover {
  border-color: #98bef8;
  background: linear-gradient(180deg, #ffffff 0%, #eef6ff 100%);
}

#kq-header-auth .auth-user-avatar {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  object-fit: cover;
  background: linear-gradient(180deg, #f4f8ff 0%, #dce9ff 100%);
  border: 1px solid #d8e5fb;
  flex: 0 0 auto;
  display: block;
}
#kq-header-auth .auth-user-avatar-fallback {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid #d8e5fb;
  background: linear-gradient(180deg, #f4f8ff 0%, #dce9ff 100%);
  color: #1f74ea;
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

#kq-header-auth .auth-user-label {
  max-width: 72px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: #1f74ea;
  line-height: 1;
}

#kq-header-auth .header-user-caret {
  width: 12px;
  height: 12px;
  opacity: 0.76;
  transition: transform 160ms ease, opacity 160ms ease;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
#kq-header-auth #auth-user-center-btn[aria-expanded="true"] .header-user-caret {
  transform: rotate(180deg);
  opacity: 1;
}

/* 下拉菜单（色彩工坊风格） */
#kq-header-auth .header-user-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 190px;
  padding: 10px 0 8px;
  border: 1px solid #ddeafb !important;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow: 0 16px 34px rgba(37, 99, 235, 0.14) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-4px);
  transition: opacity 160ms ease, transform 160ms ease, visibility 160ms ease;
  z-index: 100002;
}
#kq-header-auth .header-user-dropdown.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

#kq-header-auth .auth-user-panel {
  margin: 0 10px 8px;
  padding: 12px 14px 11px;
  border: 1px solid #e4eefc;
  border-radius: 14px;
  background: linear-gradient(180deg, #f9fbff 0%, #eef5ff 100%);
}
#kq-header-auth .auth-user-panel-name {
  font-size: 15px;
  line-height: 1.25;
  font-weight: 700;
  color: #0f4ea6;
  margin-bottom: 3px;
}
#kq-header-auth .auth-user-panel-id { font-size: 12px; color: #6b83aa; }

#kq-header-auth .header-user-dropdown-item {
  display: flex;
  align-items: center;
  gap: 8px;
  width: calc(100% - 16px);
  min-height: 42px;
  margin: 0 8px;
  padding: 0 12px;
  border: none;
  border-radius: 12px;
  background: transparent;
  color: #21456f;
  text-decoration: none;
  font-size: 14px;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
  white-space: nowrap;
  font-family: Microsoft YaHei, PingFang SC, sans-serif;
}
#kq-header-auth .header-user-dropdown-item:hover { background: #f4f8ff; color: #1f74ea; }
#kq-header-auth .header-user-dropdown-item.danger { color: #21456f; }
#kq-header-auth .header-user-dropdown-item.danger:hover { background: #f4f8ff; color: #1f74ea; }

#kq-header-auth .header-user-dropdown-item .auth-user-menu-icon {
  width: 26px;
  height: 26px;
  border-radius: 9px;
  background: #eef5ff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #4d7fc2;
  flex: 0 0 auto;
}
#kq-header-auth .header-user-dropdown-item .auth-user-menu-icon svg {
  width: 15px;
  height: 15px;
  display: block;
}

/* 修复 Tailwind `.container` 与页脚结构冲突：
   bundle 的页脚布局依赖 `.footer-content` 自己作为容器（max-width/padding），
   但 footer.html 里外层仍有 `.container`，会被 Tailwind 的 `.container` 影响。
   这里让页脚 `.container` 不参与布局，避免把内容挤坏。 */
.kq-site-footer .footer > .container {
  max-width: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 页脚四列布局修正：
   站点原样式首列最小 540px，当前容器宽度下会挤压后 3 列，造成“靠在一起”。 */
.kq-site-footer .footer-content {
  grid-template-columns: minmax(320px, 1.65fr) repeat(3, minmax(160px, 1fr)) !important;
  column-gap: 48px !important;
  row-gap: 22px !important;
  align-items: start !important;
}

/* 品牌文案宽度与换行更稳定，避免一行过长拉扯整体布局 */
.kq-site-footer .footer-brand-section {
  min-width: 0;
}
.kq-site-footer .footer-desc {
  max-width: 42ch;
  line-height: 1.85;
  word-break: break-word;
  overflow-wrap: anywhere;
}

/* 联系方式行内图标顶对齐，长地址换行时不挤压其他列 */
.kq-site-footer .contact-list li {
  align-items: flex-start;
}
.kq-site-footer .contact-list .contact-icon-img {
  margin-top: 3px;
}

@media (max-width: 1280px) {
  .kq-site-footer .footer-content {
    grid-template-columns: minmax(280px, 1.4fr) repeat(3, minmax(140px, 1fr)) !important;
    column-gap: 32px !important;
  }
}

/* 页脚可点击文字 hover 变蓝 */
.kq-site-footer .footer-section ul li a,
.kq-site-footer .footer-bottom a {
  transition: color 0.2s ease;
}
.kq-site-footer .footer-section ul li a:hover,
.kq-site-footer .footer-bottom a:hover {
  color: #4ea3ff !important;
}

