/* ============================================================
   Zhongke Violet — 紫站(edu.zhongke.co)专属视觉皮肤
   目的：与绿站(ai.lvtanedu.com) 默认模板明显区分，且零 JS / 零后端改动。
   注入位置：public/index.html 的 </body> 之前（确保覆盖既有内联 patch）。
   作用域：仅本站点（随 index.html 加载），不影响绿站。
   ============================================================ */
:root{
  --zk-primary:#6D3BEF;
  --zk-primary-2:#4F46E5;
  --zk-grad:linear-gradient(135deg,#7C3AED 0%,#4F46E5 100%);
  --zk-grad-soft:linear-gradient(135deg,#8B5CF6 0%,#6366F1 100%);
  --zk-ink:#1E1B3A;
  --zk-sub:#6B6880;
  --zk-line:#ECEAF7;
  --zk-bg:#F6F5FF;
  --zk-card:#FFFFFF;
}

/* 1) Element Plus 主色整体替换为紫罗兰→靛蓝，所有主按钮/链接/选中态随之变色 */
:root{
  --el-color-primary:#6D3BEF !important;
  --el-color-primary-light-3:#9D7BFF !important;
  --el-color-primary-light-5:#B9A3FF !important;
  --el-color-primary-light-7:#D9CCFF !important;
  --el-color-primary-light-8:#E9E1FF !important;
  --el-color-primary-light-9:#F3EEFF !important;
  --el-color-primary-dark-2:#5B2FD6 !important;
}

/* 2) 全局画布：浅紫底，整体气质立刻区别于绿站纯白 */
body{background:var(--zk-bg) !important;color:var(--zk-ink) !important;}
/* 顶部一抹极淡紫晕，增加层次（不挡交互） */
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(900px 380px at 12% -8%, rgba(124,58,237,.10), transparent 60%),
    radial-gradient(760px 360px at 96% 4%, rgba(79,70,229,.08), transparent 60%);
}
/* 主内容区透出浅紫底（去掉默认白） */
section.el-container.is-vertical,
.el-main{background:transparent !important;}

/* 3) 顶栏（≥900px 由既有 patch 改为横栏）：改为紫罗兰渐变条 + 白字，强区分绿站白侧栏 */
@media (min-width:900px){
  aside.el-aside{
    background:var(--zk-grad) !important;
    border-bottom:none !important;
    box-shadow:0 8px 24px rgba(79,70,229,.28) !important;
  }
  aside.el-aside a.flex{ border-right:1px solid rgba(255,255,255,.22) !important; }
  aside.el-aside a.flex,
  aside.el-aside a.flex .text-\[16px\]{ color:#fff !important; }
  aside.el-aside a.flex img{ filter:brightness(0) invert(1) !important; }
  aside.el-aside a.nav-item{ color:#FFFFFF !important; text-shadow:0 1px 2px rgba(0,0,0,.20) !important; }
  aside.el-aside a.nav-item:hover{ background:rgba(255,255,255,.16) !important; color:#fff !important; }
  aside.el-aside a.nav-item.aigc-active{
    background:#fff !important; color:var(--zk-primary) !important;
    box-shadow:0 6px 16px rgba(0,0,0,.14) !important;
  }
  aside.el-aside a.nav-item.aigc-active img{ filter:none !important; }
  aside.el-aside .menu .menu-item{ color:#EAE6FF !important; text-shadow:0 1px 2px rgba(0,0,0,.18) !important; }
  aside.el-aside .menu .menu-item:hover{ color:#fff !important; background:rgba(255,255,255,.16) !important; }
  aside.el-aside .menu a,
  aside.el-aside .menu button{ color:#EAE6FF !important; text-shadow:0 1px 2px rgba(0,0,0,.18) !important; }
  aside.el-aside .change-theme{ background:rgba(255,255,255,.18) !important; color:#fff !important; }
}

/* 4) 主按钮：紫罗兰渐变 + 投影 */
.el-button--primary{
  background:var(--zk-grad) !important; border:none !important;
  box-shadow:0 6px 16px rgba(109,59,239,.28) !important; color:#fff !important;
}
.el-button--primary:hover{ filter:brightness(1.05) !important; box-shadow:0 8px 22px rgba(109,59,239,.36) !important; }
.el-button--primary.is-disabled{ background:var(--zk-grad) !important; opacity:.55 !important; }

/* 5) 输入框 / 文本域：紫描边焦点 */
.el-input__inner,
.el-textarea__inner{ border-radius:10px !important; }
.el-input__inner:focus,
.el-textarea__inner:focus,
.el-input.is-focus .el-input__inner{ border-color:var(--zk-primary) !important; box-shadow:0 0 0 2px rgba(109,59,239,.15) !important; }

/* 6) Hero 区：整块渐变面板（标题+建议卡同处），白字大标题 */
[class*="px-\[50px\]"]{
  background:var(--zk-grad) !important;
  border-radius:0 0 28px 28px !important;
  margin:0 16px !important;
  padding-top:34px !important;
  padding-bottom:44px !important;
  box-shadow:0 18px 40px rgba(79,70,229,.18) !important;
}
[class*="my-\[60px\]"]{
  color:#fff !important; font-size:34px !important; letter-spacing:1px !important; font-weight:600 !important;
  text-shadow:0 2px 10px rgba(0,0,0,.12);
}
/* “查看更多 >” 在渐变面板上变白 */
[class*="px-\[50px\]"] a,
[class*="px-\[50px\]"] [class*="cursor-pointer"]{ color:#fff !important; }

/* 7) 三张建议卡：白卡 + 紫顶条 + 圆角 + 悬浮上浮（明显区别于绿站扁平卡） */
[data-v-8be428e5].flex > [class*="flex-1"]{
  background:var(--zk-card) !important;
  border:1px solid var(--zk-line) !important;
  border-top:3px solid var(--zk-primary) !important;
  border-radius:16px !important;
  box-shadow:0 8px 24px rgba(109,59,239,.08) !important;
  padding:22px 14px !important;
  transition:transform .2s ease, box-shadow .2s ease !important;
}
[data-v-8be428e5].flex > [class*="flex-1"]:hover{
  transform:translateY(-4px) !important;
  box-shadow:0 16px 36px rgba(109,59,239,.18) !important;
}
/* 卡内缩略图圆角 */
[data-v-8be428e5].flex > [class*="flex-1"] img[class*="w-\[58px\]"]{
  border-radius:14px !important; box-shadow:0 4px 12px rgba(109,59,239,.18) !important;
}
/* 卡内标签 */
[data-v-8be428e5].flex > [class*="flex-1"] [class*="text-\[16px\]"]{ color:var(--zk-ink) !important; }
/* 示例问题胶囊 */
.sample-item{
  background:#F5F2FF !important;
  border:1px solid var(--zk-line) !important;
  border-radius:12px !important;
  color:var(--zk-ink) !important;
  transition:background .18s ease !important;
}
.sample-item:hover{ background:#ECE3FF !important; }

/* 查看更多 链接按钮（在渐变面板上改白，避免默认蓝/紫跳脱） */
[class*="px-\[50px\]"] .el-button.is-link{ color:#fff !important; }
[class*="px-\[50px\]"] .el-button.is-link:hover{ color:#E9E3FF !important; }
[class*="px-\[50px\]"] .el-button.is-link .el-icon{ color:#fff !important; }

/* 8) 标签 / 选中态等轻量点缀 */
.el-tag--primary,
.el-tag--violet{ background:var(--zk-grad-soft) !important; border-color:transparent !important; color:#fff !important; }
