/* ========================
   首页广告区对齐轮播顶部
   - 仅作用于首页三栏布局（.main.main-home）
   - 目的：让右侧广告区顶部与轮播区顶部对齐
   ======================== */

/*
  现状（见 home.css）：
  - .main.main-home 设置了 padding-top: 48px，导致 flex 子项从 48px 开始排版
  - 轮播 .home-carousel-fullwidth 是绝对定位，top: 24px
  因此广告栏会比轮播顶部下沉 24px（48 - 24）。
*/
.main.main-home .sidebar-ads {
  margin-top: calc(24px - 48px);
  /* = -24px：上移以对齐轮播 top */
  align-items: flex-end;
  /* 广告项靠右，匹配导航栏右边缘 */
}

/* 首页：显式取消 main.css 对首项的影响（确保完全独立） */
.main.main-home .sidebar-ads>*:first-child {
  margin-top: 0;
}

/* 首页广告项：取消居中（ads.css 的 margin: 0 auto），改为靠右 */
.main.main-home .sidebar-ads .ad-banner-link,
.main.main-home .sidebar-ads .ad-banner-placeholder {
  margin-left: auto;
  margin-right: 0;
}

/* 移动端使用正常流布局，不需要上移 */
@media (max-width: 768px) {
  .main.main-home .sidebar-ads {
    margin-top: 0;
    align-items: stretch;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  /* 移动端广告卡片：宽度为横向尺寸减去间距的一半，根据屏幕大小自适应 */
  .main.main-home .sidebar-ads .ad-banner-link,
  .main.main-home .sidebar-ads .ad-banner-placeholder {
    margin: 0;
    width: 100%;
    max-width: none; /* 移除 ads.css 中的 max-width: 260px 限制 */
  }
  
  /* 移动端广告图片：自适应卡片宽度 */
  .main.main-home .sidebar-ads .ad-banner-image {
    width: 100%;
    max-width: 100%;
  }
}