/* Have fun adding your style here :) - PS: At all times this file should contain a comment or a rule, otherwise opera might act buggy :( */

/* General Custom CSS */

/* ---------- 全局响应式图片补丁 ---------- */
img, .avia-image-container img {
    max-width: 100%;
    height: auto !important;
    object-fit: cover;
}

/* 表格响应式容器 */
.table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.table-responsive table {
    width: 100%;
    min-width: 600px;
}

/*
Desktop Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the desktop view of your site */

@media only screen and (min-width: 768px) {
  /* Add your Desktop Styles here */

}



/*
Mobile Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the Mobile and Tablet Portrait view */

@media only screen and (max-width: 767px) {
  /* Add your Mobile Styles here */
  
  /* ---------- 1. 全站图片：自适应且不被裁剪 ---------- */
  img,
  .avia-image-container img {
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;   /* 保留完整画面 */
  }
  
  /* ---------- 2. 清理写死宽高的元素（含 table / img 内联尺寸） ---------- */
  [width],
  [height] {
    width: auto !important;
    height: auto !important;
  }
  
  /* ---------- 3. 表格处理：超出时允许横向滚动 ---------- */
  .table-responsive,
  table {
    display: block;
    width: 100% !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  
  .table-responsive {
    margin-bottom: 15px;
  }
  
  /* 表格内部元素也要自适应 */
  table td,
  table th {
    white-space: normal;
    word-wrap: break-word;
  }
  
  /* ---------- 4. 等高列组件取消绝对定位以防重叠 ---------- */
  .av-equal-height-column .avia-image-container-inner,
  .av-equal-height-column .flex_column {
    position: static !important;
    height: auto !important;
  }
  
  /* ---------- 5. 栅格列全部改为单列堆叠 ---------- */
  .flex_column {
    width: 100% !important;
    margin-bottom: 20px;
  }
  
  /* ---------- 6. Publication 页面图片优化 ---------- */
  .avia_textblock img {
    width: 100% !important;
    height: auto !important;
    max-width: 300px;
    margin: 10px auto;
    display: block;
  }
  
  /* ---------- 7. 首页出版处图片容器优化 ---------- */
  .avia-image-container {
    width: 100% !important;
    margin-bottom: 15px;
  }
  
  /* ---------- 8. 防止固定宽度的容器破坏布局 ---------- */
  .container,
  .av-content-full {
    max-width: 100%;
    overflow-x: hidden;
  }
}