/* =====================================================
   1. CSS 变量映射：将 icat 组件变量对应到 butterfly 变量
   ===================================================== */
:root {
  --icat-card-bg: var(--card-bg);
  --icat-blue: var(--btn-bg);
  --icat-fontcolor: var(--font-color);
  --icat-white: #fff;
  --icat-shadow-border: var(--card-box-shadow);
  --icat-shadow-blue: 0 3px 8px 6px rgba(0, 104, 139, 0.18);
  --style-border: 1px solid var(--light-grey);
  --style-border-always: 1px solid var(--light-grey);
}
[data-theme='dark'] {
  --icat-fontcolor: rgba(255, 255, 255, 0.75);
  --style-border: 1px solid rgba(255, 255, 255, 0.12);
  --style-border-always: 1px solid rgba(255, 255, 255, 0.12);
}

/* =====================================================
   2. 修复 body { line-height: 2 } 对分类栏的影响
      策略：对栏内每个元素直接显式设置 line-height: 1，
      不依赖继承，不覆盖主题的 height / padding 原始值。
   ===================================================== */

/* 对分类栏内所有元素统一清除 line-height: 2 的继承 */
.icat-status-bar,
.icat-status-bar .status-bar-tips,
.icat-status-bar .status-bar,
.icat-status-bar .status-bar #bar-box,
.icat-status-bar .status-bar #bar-box .status-bar-item,
.icat-status-bar .status-bar #bar-box .status-bar-item a,
.icat-status-bar #status-bar-button,
.icat-status-bar #status-bar-button i {
  line-height: 1 !important;
}

/* Firefox 滚动条修复（webkit 已由 index.css 的 photo.styl 处理） */
.icat-status-bar .status-bar #bar-box {
  scrollbar-width: none;
}

/* =====================================================
   3. 相册图片样式
   ===================================================== */
.gallery-photos {
  width: 100%;
  margin-top: 16px;
  text-align: center;
}
.gallery-photo {
  min-height: 5rem;
  width: 24.99%;
  padding: 4px;
  position: relative;
}
.gallery-photo a {
  border-radius: 8px;
  border: var(--style-border-always);
  box-shadow: var(--icat-shadow-border);
  display: block;
  overflow: hidden;
}
.gallery-photo img {
  display: block;
  width: 100%;
  animation: fadeIn 1s;
  cursor: pointer;
  transition: all 0.4s ease-in-out !important;
}
.gallery-photo span.photo-title,
.gallery-photo span.photo-time {
  max-width: calc(100% - 7px);
  line-height: 1.8;
  position: absolute;
  left: 4px;
  font-size: 12px;
  background: rgba(0, 0, 0, 0.3);
  padding: 0 8px;
  color: #fff;
  animation: fadeIn 1s;
}
.gallery-photo span.photo-title {
  bottom: 3px;
  left: 3px;
  border-radius: 0 8px 0 8px;
}
.gallery-photo span.photo-time {
  top: 4px;
  border-radius: 8px 0 8px 0;
}
.gallery-photo:hover img {
  transform: scale(1.1);
}
@media screen and (max-width: 1100px) {
  .gallery-photo { width: 33.3%; }
}
@media screen and (max-width: 768px) {
  .gallery-photo { width: 49.9%; padding: 3px; }
}
@keyframes fadeIn {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}

/* 暂无照片提示 */
.photo-empty-tip {
  width: 100%;
  text-align: center;
  padding: 40px 0;
  color: var(--icat-fontcolor);
  opacity: 0.5;
  font-size: 15px;
  line-height: 2;
}
