/* ============================================================
   深色模式
   思路:不是把浅色直接反相,而是换一套「夜里翻手帐」的配色。

   1. 底色不用纯黑,用暖调炭灰(#1c1a21),像旧纸在台灯下
   2. 描边和文字分开:描边用低对比的暖灰,文字才用浅色。
      浅色模式的描边是墨黑,深色下若直接变白,整页全是白线,极刺眼。
   3. 强调色全部降饱和、降明度,像水彩而不是霓虹灯
   4. 投影用纯黑半透明,不用白色,否则贴纸会浮起来
   ============================================================ */

[data-theme="dark"] {
  /* —— 文字 —— */
  --ink: #ece7f0;         /* 主文字:暖白,不刺眼 */
  --text-2: #b3acbe;      /* 正文次级 */
  --text-3: #a59db8;      /* 说明文字(v3.1.2 提亮:原 #948da1 在卡上仅 3.4:1) */
  --text-4: #7d7689;      /* 最弱提示 */
  --on-accent: #221f28;   /* 强调色块上用深色字,比白字柔和 */

  /* —— 描边与投影 —— */
  --line: #575060;        /* 描边:比底色亮一档的暖灰,不抢眼 */
  --shadow: #0d0c10;      /* 硬投影:近黑 */

  /* —— 底色 —— */
  --cream: #1c1a21;       /* 页面底色:暖炭灰 */
  --paper: #26232d;       /* 卡片:比底色亮一档 */
  --paper-warm: #2a2732;  /* 卡片(暖一档) */
  --bar-bg: #1f1c26;      /* 进度条槽底 */
  --nav-bg: rgba(28, 26, 33, 0.9);
  --overlay: rgba(8, 7, 10, 0.78);
  --hl: rgba(214, 178, 74, 0.34);   /* 高亮:压暗的黄,像真的荧光笔 */
  --invert-bg: #2e2a37;   /* 反色块:不再是死黑,而是浅一档的紫灰 */
  --invert-fg: #d9b96a;   /* 跑马灯文字:暗金,不刺眼 */
  --pink-shadow: #5a3348; /* 联系卡片的粉色投影,暗色下压成藕荷 */
  --bar-inset: rgba(0, 0, 0, 0.3);

  /* —— 强调色:统一降饱和到 45~60%,明度 60~72% —— */
  --pink: #d488a6;        /* 藕粉 */
  --pink-bg: #4a2f3d;
  --orange: #d19a70;      /* 陶土橙 */
  --orange-bg: #453222;
  --yellow: #d6b24a;      /* 陈金,不是亮黄 */
  --yellow-bg: #423a24;
  --teal: #6fb5ab;        /* 灰绿松石 */
  --teal-bg: #25403c;
  --purple: #9d8fc4;      /* 灰紫 */
  --purple-bg: #352d47;
  --blue: #7ba3c4;        /* 雾蓝 */
  --blue-bg: #26333f;
}

/* ================= 局部修正 ================= */

/* 整块铺底的区块:深色下 -bg 变量直接铺满会显得又闷又脏,
   改成「底色略亮一点点」,层次靠卡片自己撑,不靠大面积色块 */
[data-theme="dark"] .sec-yellow,
[data-theme="dark"] .sec-teal,
[data-theme="dark"] .sec-pink {
  background: #211e28;
}
/* 相邻区块之间给一条极淡的分隔,不然两块同色会糊在一起 */
[data-theme="dark"] .sec-yellow,
[data-theme="dark"] .sec-teal,
[data-theme="dark"] .sec-pink {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045),
              inset 0 -1px 0 rgba(255, 255, 255, 0.045);
}

/* 卡片在深色下用纯黑投影,贴纸才有厚度感 */
[data-theme="dark"] .card,
[data-theme="dark"] .stat,
[data-theme="dark"] .info-card,
[data-theme="dark"] .pol,
[data-theme="dark"] .tl-item::before,
[data-theme="dark"] .back-top,
[data-theme="dark"] .theme-toggle,
[data-theme="dark"] .qr-close,
[data-theme="dark"] .nav-links a:hover,
[data-theme="dark"] .section-head .tag,
[data-theme="dark"] .btn,
[data-theme="dark"] .contact-card .sticker,
[data-theme="dark"] .hero-badge {
  box-shadow: 6px 6px 0 var(--shadow);
}

/* 标题荧光笔:深色下透明度要更低,否则糊成一片 */
[data-theme="dark"] .hl {
  background: linear-gradient(102deg,
    transparent 0.5%, var(--hl) 4%, var(--hl) 96%, transparent 99%);
}

/* 波浪线在深色下换成柔和的粉 */
[data-theme="dark"] .wave-line {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='10' viewBox='0 0 28 10'%3E%3Cpath d='M0 5 Q 7 0 14 5 T 28 5' fill='none' stroke='%23d488a6' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") repeat-x;
}

/* 技能条斜纹:浅色条纹在深色底上太亮,换成暗条纹 */
[data-theme="dark"] .fill {
  background-image: linear-gradient(45deg,
    rgba(0, 0, 0, .22) 25%, transparent 25%, transparent 50%,
    rgba(0, 0, 0, .22) 50%, rgba(0, 0, 0, .22) 75%, transparent 75%);
}

/* 二维码图片自带白底,给它加个浅色内边距缓冲 */
[data-theme="dark"] .qr-box img {
  background: #f4f1f6;
  padding: 6px;
}

/* 时间线虚线在深色下要更淡 */
[data-theme="dark"] .timeline::before { opacity: .22; }

/* 联系方式卡片:粉色投影压成藕荷 */
[data-theme="dark"] .contact-card {
  box-shadow: 10px 10px 0 var(--pink-shadow);
}

/* 来访地图:海洋网格变淡,列表分隔线可见 */
[data-theme="dark"] .map-sea { color: var(--text-3); }
[data-theme="dark"] .map-land { opacity: .16; }
[data-theme="dark"] .city-item { border-bottom-color: rgba(255,255,255,.12); }

/* 页脚 */
[data-theme="dark"] footer { color: var(--text-3); background: var(--cream); }

/* 主题按钮图标:深色下显示月亮 */
[data-theme="dark"] .theme-toggle .ti-sun { display: none; }
[data-theme="dark"] .theme-toggle .ti-moon { display: inline; }

/* ================= v1.9 互动组件(v2.1 从 widgets.css 归位) ================= */

/* 便签墙 */
[data-theme="dark"] .msg-note::before { background: rgba(255,255,255,.12); }
[data-theme="dark"] .msg-reply { background: rgba(126, 200, 184, .18); }
[data-theme="dark"] .msg-note { border-color: var(--shadow); color: var(--ink); }

/* 六色便签:莫兰迪色压暗 */
[data-theme="dark"] .msg-pink   { background: #4a3340; }
[data-theme="dark"] .msg-orange { background: #4a3d2e; }
[data-theme="dark"] .msg-teal   { background: #2e423e; }
[data-theme="dark"] .msg-purple { background: #383452; }
[data-theme="dark"] .msg-yellow { background: #46422c; }
[data-theme="dark"] .msg-blue   { background: #2f3c52; }

/* 主题色快捷面板 */
[data-theme="dark"] .accent-btn { background: #2a2b33; color: var(--ink); border-color: var(--line); }
[data-theme="dark"] .accent-panel { background: #2a2b33; }
[data-theme="dark"] .accent-opt.on { border-color: #fff; }

/* 公告弹窗 */
[data-theme="dark"] .notice-pop { background: #2a2b33; }
[data-theme="dark"] .notice-pop .np-close { background: #2a2b33; color: var(--ink); }

/* 倒计时挂件 */
[data-theme="dark"] .cd-widget { background: #2a2b33; }

/* ================= v2.2 新组件深色态 ================= */
/* 随手记便签:压暗的莫兰迪 */
[data-theme="dark"] .note-teal   { background: #2e423e; }
[data-theme="dark"] .note-pink   { background: #4a3340; }
[data-theme="dark"] .note-yellow { background: #46422c; }
[data-theme="dark"] .note-purple { background: #383452; }
[data-theme="dark"] .note-blue   { background: #2f3c52; }
[data-theme="dark"] .note-orange { background: #4a3d2e; }
[data-theme="dark"] .note-card { color: var(--ink); }
/* 荣誉等级徽章微调 */
[data-theme="dark"] .hl-school .honor-level { color: var(--ink); }
[data-theme="dark"] .hl-other .honor-level { background: #2a2b33; }

/* ============ v3.1.2 暗色对比度修复 ============ */
/* 黄底贴纸/标签/按钮:--yellow 在暗色下是暗黄,浅字压上去只有 1.7:1,
   统一换成 --on-accent(暗色下为深字 #221f28,≈8:1),与 btn-pink/teal 同一套思路 */
[data-theme="dark"] .c-learn,
[data-theme="dark"] .work-pill,
[data-theme="dark"] .btn-yellow,
[data-theme="dark"] .map-head .sticker,
[data-theme="dark"] .contact-card .sticker { color: var(--on-accent); }

/* 点赞按钮:原硬编码白底黑字,暗色下一颗突兀的白药丸;
   换纸色底 + 描边用 --line,已赞态用暗化的粉 */
[data-theme="dark"] .like-btn {
  background: var(--paper); border-color: var(--line); color: var(--ink);
}
[data-theme="dark"] .like-btn.liked { background: #4a3340; border-color: var(--pink); }

/* v3.1.2:技能背包标签暗色下恢复彩色身份。
   六个 -bg 底色在暗色下全是近似的深泥色,JavaScript(粉)/Java(黄)完全分不出颜色;
   改成彩色描边 + 彩色文字(粉/紫在强调色基础上略提亮以保住 4.5:1) */
[data-theme="dark"] .c-pink   { color: #e39db8; border-color: var(--pink); }
[data-theme="dark"] .c-teal   { color: var(--teal);   border-color: var(--teal); }
[data-theme="dark"] .c-yellow { color: var(--yellow); border-color: var(--yellow); }
[data-theme="dark"] .c-purple { color: #b1a5d6; border-color: var(--purple); }
[data-theme="dark"] .c-blue   { color: var(--blue);   border-color: var(--blue); }
[data-theme="dark"] .c-orange { color: var(--orange); border-color: var(--orange); }