/* ==================================
   VIP包房加密插件 UI 终极“贴纸”覆盖法
================================== */

/* 1. 把原版按钮变成一个透明的“骨架” */
.hbe-button {
  position: relative !important;
  background: transparent !important;
  border: none !important;
  /* 用下面这行替换掉原来的 color: transparent */
  font-size: 0 !important; /* 物理暴击：把原版英文字号强行变成0，让它彻底消失！ */
  min-width: 120px !important;
  min-height: 40px !important;
  padding: 0 !important;
  box-shadow: none !important;
}

/* 3. 制作一张完美的“贴纸”盖在骨架上 */
.hbe-button::after {
  content: "重新上锁" !important; /* 默认文字 */
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important; /* 宽屏覆盖 */
  height: 100% !important; /* 高度覆盖 */
  background: #2d3748 !important; /* 我们的高级深色底 */
  color: #fff !important; /* 白字 */
  border: 1px solid #3b82f6 !important;
  border-radius: 8px !important;
  
  /* 用 Flex 布局让文字绝对居中，专治各种竖排乱码 */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  
  font-size: 1rem !important;
  font-family: inherit !important;
  transition: all 0.3s ease !important;
  z-index: 99 !important; /* 极高层级，保证挡住下面的一切 */
  box-sizing: border-box !important;
}

/* 4. 悬浮发光特效直接加在贴纸上 */
.hbe-button:hover::after {
  background: #3b82f6 !important;
  box-shadow: 0 4px 15px rgba(59, 130, 246, 0.4) !important;
  transform: translateY(-2px) !important;
}

/* 5. 智能判断状态：如果界面里有密码输入框，贴纸就变成“验证解锁” */
#hexo-blog-encrypt:has(input) .hbe-button::after {
  content: "验证解锁" !important;
}

/* ==================================
   Fluid 原生适配版：自适应九宫格画廊
================================== */
.fluid-custom-gallery {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 12px !important;
  margin-top: 20px !important;
}

/* 终极防弹衣：防止 Markdown 引擎手贱用 <p> 标签包裹图片导致网格失效 */
.fluid-custom-gallery p {
  display: contents !important; 
}

/* Fluid 加载后会自动用 a.fancybox 包裹 img，我们直接统一接管样式 */
  .fluid-custom-gallery > img,
  .fluid-custom-gallery a.fancybox,
  .fluid-custom-gallery > a {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1) !important;
   text-decoration: none !important;
   cursor: zoom-in !important;
  aspect-ratio: 1 / 1 !important; /* 核心：强制裁切为绝美正方形 */
}

.fluid-custom-gallery img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  margin: 0 !important;
  transition: transform 0.4s ease !important;
}

/* 悬浮缩放特效 */
.fluid-custom-gallery a.fancybox:hover img,
.fluid-custom-gallery > img:hover {
  transform: scale(1.08) !important;
}

/* 手机端自适应：自动变成两列，高度依然保持完美正方形 */
@media (max-width: 768px) {
  .fluid-custom-gallery {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
}