@import url("./fonts.css");

/* 1. 全局盒模型与边距重置 */
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* * {
  white-space: pre-wrap;
} */

/* 2. 设置基础 body 样式（可选，但常见） */
body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

/* 3. 取消列表默认样式（有序/无序） */
ul,
ol {
  list-style: none;
}

/* 4. 取消链接默认下划线，并继承颜色 */
a {
  cursor: pointer;
  text-decoration: none;
  color: inherit;
}

/* 5. 取消图片边框，并使其自适应容器 */
img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
  border: 0;
}

/* 6. 重置表单元素默认样式（按钮、输入框等） */
input,
button,
textarea,
select {
  font: inherit;
  letter-spacing: inherit;
  word-spacing: inherit;
  color: inherit;
  background: none;
  border: none;
  outline: none;
}

/* 7. 重置按钮的默认指针与外观 */
button {
  cursor: pointer;
  background: transparent;
  border: 0;
  padding: 0;
}

/* 8. 重置表格边框、单元格间距 */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* 9. 引用、水平线等常用元素重置 */
blockquote,
q {
  quotes: none;
}

blockquote::before,
blockquote::after,
q::before,
q::after {
  content: '';
}

hr {
  border: 0;
  border-top: 1px solid;
  margin: 1rem 0;
}

/*
 * 兼容旧 Banner HTML：模块内联样式在窄屏会把 .tj-banner-desktop 设为 display:none，
 * 而页面编辑器保存时又只留下 desktop 节点，导致移动端整块消失。
 * 用更高优先级覆盖；若仍存在紧随其后的 .tj-banner-mobile，则继续隐藏 desktop。
 */
@media (max-width: 767px) {
  main .tj-banner-desktop {
    display: block !important;
  }

  main .tj-banner-desktop:has(+ .tj-banner-mobile) {
    display: none !important;
  }

  main .tj-banner-mobile {
    display: block !important;
  }

  main .tj-banner-desktop > div[style*="position:absolute"],
  main .tj-banner-section .tj-banner-panel {
    position: static !important;
    transform: none !important;
    width: 100% !important;
    max-width: 100%;
    left: 0 !important;
    box-sizing: border-box;
  }

  /* 单图：旧 HTML 用 min-height 把窄屏图拉高导致变形，改为等比例裁剪 */
  main .tj-si-section img {
    object-fit: cover !important;
    object-position: center !important;
    width: 100% !important;
    height: 20rem !important;
    min-height: 0 !important;
  }
}

/*
 * 文档全册：StPageFlip 的 .stf__parent 带 translateZ(0)，移动端单页时会盖住左侧上一页按钮。
 * 右侧仍是翻页角落，所以下一页看起来正常。把箭头抬到书本层之上。
 */
main .tj-dfc-flip {
  z-index: 0;
}
main .tj-dfc-nav {
  z-index: 30 !important;
  pointer-events: auto;
  touch-action: manipulation;
}