/* 移动端适配（附带少量全局修正），由 _config.anzhiyu.yml 的 inject.head 引入 */

/* ===== 手机侧栏菜单 ===== */
/* 顺序：站点数据 → 页面导航 → 功能 */
#sidebar #sidebar-menus {
  display: flex;
  flex-direction: column;
}
#sidebar #sidebar-menus > * {
  flex-shrink: 0;
}
#sidebar #sidebar-menus > .sidebar-site-data {
  order: -2;
  margin-bottom: 14px;
}
#sidebar #sidebar-menus > .menus_items {
  order: -1;
  padding: 0 16px;
  margin-bottom: 14px;
}
#sidebar #sidebar-menus .menus_items > .menus_item {
  margin-bottom: 6px;
}

/* 一级菜单项与“显示模式”按钮同款 */
#sidebar #sidebar-menus .menus_items > .menus_item > a.site-page.faa-parent {
  display: flex;
  align-items: center;
  padding: 4px 8px;
  font-size: 14px;
  line-height: 32px;
  color: var(--anzhiyu-fontcolor);
  background: var(--anzhiyu-card-bg);
  border: var(--style-border-always);
  border-radius: 8px;
}

/* 主题模板用 substring(0,4)=="anzhiyu" 判断一级菜单图标，永远不成立，图标不会输出；按链接补图标，未列出的链接留空位对齐 */
#sidebar #sidebar-menus .menus_items > .menus_item > a.site-page.faa-parent::before {
  content: "";
  display: inline-block;
  flex-shrink: 0;
  width: 16px;
  margin-right: 10px;
  font-family: anzhiyufont;
  font-size: 16px;
  font-style: normal;
  text-align: center;
  -webkit-font-smoothing: antialiased;
}
#sidebar #sidebar-menus .menus_items a.site-page.faa-parent[href="/link/"]::before {
  content: "\f0c1"; /* anzhiyu-icon-link */
}
#sidebar #sidebar-menus .menus_items a.site-page.faa-parent[href="/about/"]::before {
  content: "\e605"; /* anzhiyu-icon-paper-plane */
}

/* ===== 分类页按钮 ===== */
/* 竖排文字 + 悬停展开依赖鼠标，触屏上改成横排按钮 */
@media (hover: none), screen and (max-width: 768px) {
  .category-custom-links {
    flex-direction: column;
    height: auto;
  }
  .category-custom-links .catalog-button,
  .category-custom-links .catalog-button:hover {
    flex: none;
    height: 44px;
  }
  .category-custom-links .catalog-button span,
  .category-custom-links .catalog-button:hover span {
    transform: none;
  }
}

/* ===== 表格 ===== */
/* 主题写的是 overflow-x: scroll，桌面浏览器在每个表格下都会常驻空滚动条 */
#article-container .table-wrap {
  overflow-x: auto;
}

/* ===== 友链卡片 ===== */
/* 正文链接的下划线规则也作用到了整张卡片上 */
#article-container a.friend-avatar-card {
  border-bottom: none !important;
}

@media screen and (max-width: 600px) {
  .friend-avatar-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 0;
  }
  .friend-avatar-card {
    height: 150px;
  }
  .friend-avatar-card-front {
    gap: 12px;
  }
  .friend-avatar-card-front .friend-avatar-card-avatar {
    width: 60px;
    height: 60px;
    min-width: 60px;
  }
  .friend-avatar-card-name {
    font-size: 15px;
  }
  .friend-avatar-card-back {
    gap: 8px;
    padding: 12px;
  }
  .friend-avatar-card-back .friend-avatar-card-avatar {
    width: 32px;
    height: 32px;
    min-width: 32px;
  }
  .friend-avatar-card-motto {
    height: auto;
    -webkit-line-clamp: 4;
  }
}

@media screen and (max-width: 768px) {
  /* ===== 文章页头图 ===== */
  /* 主题在窄屏把头图滤镜换成了 blur(0)，桌面端的 brightness(60%) 也一起没了，白字压在亮图上看不清；补一层渐变遮罩（mainTone 关闭时） */
  #page-header.post-bg #post-top-cover::after {
    display: block;
    box-shadow: none;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.3) 0, rgba(0, 0, 0, 0.1) 120px, rgba(0, 0, 0, 0.5) 380px);
  }

  /* ===== 微信卡片 ===== */
  /* inject 里写死了 285px，窄屏侧栏占满整行时跟着撑满 */
  #aside-content #card-wechat,
  #aside-content #card-wechat #flip-wrapper {
    width: 100% !important;
  }

  /* ===== 归档列表 ===== */
  /* 缩图收窄，标题允许两行 */
  .article-sort-item-img {
    width: 112px;
    min-width: 112px;
  }
  .article-sort-item-info .article-sort-item-title {
    height: auto;
    -webkit-line-clamp: 2;
  }
}