/* =====================================================================
 * smcs_zs 破图兜底样式（全宽度生效）
 *
 * 背景：部分图片来源已失效（服务端对这些地址返回 HTML 错误页），浏览器会渲染成
 * 「碎图图标 + alt 文字」，列表里高度参差不齐。这里给失效图片换成统一的浅灰
 * 占位块，并把尺寸锁回它原本该占的版面位置。
 *
 * 只作用于带 .img-broken 类的图片（由 assets/js/img-fallback.js 在加载失败时
 * 添加），正常图片完全不受影响。
 *
 * 注意：破图是没有内在尺寸的替换元素，浏览器会把它的 used width/height
 * 退化成 0 或 alt 文字尺寸，所以必须按「所在容器」逐一显式给回尺寸，
 * 否则占位块会缩成一个 16×16 的小点。
 * ===================================================================== */

img.img-broken {
  background-color: #e7ecf2;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cg fill='none' stroke='%23a9b7c6' stroke-width='1.6'%3E%3Crect x='4.5' y='7.5' width='23' height='17' rx='2.5'/%3E%3Cpath d='M4.5 21l6-5.5 5 4.5 4.5-4 7.5 6'/%3E%3Ccircle cx='21.5' cy='13' r='2'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 26px 26px;
  /* alt 文字不显示在占位块上（内容仍保留给读屏） */
  color: transparent !important;
  font-size: 0 !important;
  overflow: hidden;
}

/* ---- 按容器还原「该占多大就占多大」 ---- */

/* 首页轮播 */
.carousel_img img.img-broken,
#carouselContainer .el-carousel__item img.img-broken {
  display: block;
  width: 100% !important;
  height: 100% !important;
}

/* 视频在线 / 教学动态缩略图 */
.newsImageItem .image img.img-broken,
#main .newsImageItem .image img.img-broken {
  display: block;
  width: 100% !important;
  height: 100% !important;
}

/* 浮动招生简章 */
#float-news img.img-broken {
  display: block;
  width: 100% !important;
  height: 100% !important;
}

/* 常用链接 logo：统一成同一高度，避免破图把行高拉得参差不齐 */
#main .link img.img-broken {
  display: block;
  width: 100% !important;
  height: 54px !important;
  padding: 0 !important;
  background-size: 22px 22px;
  border-radius: 3px;
}

/* 二维码这类不该有图标的占位 */
img.img-broken.img-broken-plain {
  background-image: none;
  background-color: #f1f4f8;
}

/* 小图标位缩小占位图标 */
img.img-broken.img-broken-sm {
  background-size: 20px 20px;
}