/* ============================================================================
   【本文件是什么？】
   这是本站的「自定义补充样式」文件 —— 用来小修小补 Chirpy 主题的默认外观，
   不动主题源码，所以以后升级主题也不会冲突。

   【它是怎么被加载的？】
   在 _includes/metadata-hook.html 里用一行 <link> 引入。
   metadata-hook.html 是 Chirpy 主题官方预留的"自定义注入点"（在 </head> 之前），
   专门就是给这种小修改用的，属于官方支持的扩展方式，不是"野路子"。

   【为什么需要它？】
   页脚加上了「本站已稳定运行 X 天」之后，手机上会被顶到页脚顶部那根横线，
   原因见下面第 ① 条。本文件主要就是修这个。

   【可DIY修改】想调整数值，直接改下面数字即可，改完重新发布网站就生效。
   ============================================================================ */

/* ---------------------------------------------------------------------------
   ① 修掉「页脚内容顶到横线」—— 让页脚高度不再写死
   ---------------------------------------------------------------------------
   【问题现象】手机上页脚第一行紧贴/压住了顶部那根分隔线。

   【根本原因】Chirpy 主题给页脚设了「固定高度」：
       电脑端 5rem，手机端（屏宽 < 850px）6rem。
     原本页脚只有三行文字，高度刚好够用；
     加上"运行天数"后手机端内容变多、超过了固定的 6rem，
     多出来的部分就往上溢出，把第一行顶到了那根线上。

   【解决办法】把高度从"写死"改成"至少这么高，内容多了自动撑开"：
       height  : 6rem        →  min-height : 6rem  （手机上 6rem 起，可继续变高）
       height  : 5rem        →  min-height : 5rem  （电脑上 5rem 起）
     这样内容再多也只会把页脚"撑高"，而不会"顶出来"，横线就恢复正常了。
   ★ 手机端原本带了 padding: 1.5rem 0（上下各留 1.5rem 空白）——
     6rem 高度里光留白就占了 3rem，只剩 3rem 装三行文字，非常挤。
     所以这里把上下留白收窄到 0.75rem，把省下的高度让给文字，避免"撑得太高"。
   ★ 注意：只改高度和留白，**没有动那根 border-top 横线本身**，它原样保留。
   --------------------------------------------------------------------------- */
footer {
  height: auto;         /* 取消主题写死的固定高度 */
  min-height: 5rem;     /* 电脑端：至少 5rem 高（和主题原值一致） */
}

@media (max-width: 849.98px) {
  /* 媒体查询：只针对"屏幕宽度小于 850px"的窄屏（手机、平板竖屏）。
     850px 这个分界值是主题自己用的标准，保持一致最稳妥。 */

  footer {
    min-height: 6rem;       /* 手机端：至少 6rem 高（和主题原值一致） */
    padding: 0.75rem 0;     /* 上下留白从 1.5rem 收窄到 0.75rem，让给文字 */
  }
}

/* ---------------------------------------------------------------------------
   ② 运行天数那一小段本身
   ---------------------------------------------------------------------------
   只是让它"不允许从中间断开"，避免数字和"天"字被拆到两行、看起来莫名其妙。
   样式（灰色、字号）自动继承页脚的，不用重复设置。
   --------------------------------------------------------------------------- */
.footer-run-days {
  white-space: nowrap;  /* 这一小段不许在中间换行 */
}