@charset "UTF-8";
/*
 * 报名系统 - 湖北艺术职业学院 (hca.edu.cn) 风格主题
 * 配色提取自 https://www.hca.edu.cn/
 * 主色：深红 #9b0d14 / #8b0202
 */

/* ============================================================
   CSS 变量 / 主题色
   ============================================================ */
:root {
  --hca-primary:        #9b0d14;
  --hca-primary-dark:   #7a0304;
  --hca-primary-hover:  #7c0a10;
  --hca-primary-accent: #8b0202;
  --hca-white:          #ffffff;
  --hca-bg-page:        #f5f5f5;
  --hca-bg-header:      #9b0d14;
  --hca-bg-footer:      #9b0d14;
  --hca-text-main:      #303133;
  --hca-text-sub:       #606266;
  --hca-text-light:     #909399;
  --hca-border:         #dcdfe6;
  --hca-font-family:    "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
}

/* ============================================================
   全局 / 页面背景
   ============================================================ */
body, html {
  background-color: var(--hca-bg-page) !important;
  background-image: none !important;
  font-family: var(--hca-font-family) !important;
  color: var(--hca-text-main);
}

/* ============================================================
   容器
   ============================================================ */
.bm_container {
  background-color: var(--hca-white);
  box-shadow: 0 2px 12px rgba(155, 13, 20, 0.08);
  border-radius: 2px;
}

.bm_container .panel.panel-default {
  border: none;
  box-shadow: none;
  border-radius: 0;
}

.bm_container .panel-body {
  background-color: var(--hca-white);
}

/* ============================================================
   页面顶部标题区 —— 仿 hca.edu.cn 头部
   结构：深红背景，顶部贴图独立一行，下方为考试标题
   ============================================================ */
.bm_container .bm_title {
  background-color: var(--hca-primary);
  background-image: linear-gradient(180deg, var(--hca-primary-dark) 0%, var(--hca-primary) 60%);
  color: var(--hca-white);
  padding: 0 16px 20px;
  margin: 0 !important;
  position: relative;
  text-align: center;
}

/* 顶部贴图独立一行（利用多背景图将 logo 和 装饰图放在同行） */
.bm_container .bm_title::before {
  content: "";
  display: block;
  width: 100%;
  height: 85px;
  margin: 0 auto 10px;
  background: 
    url(/images/bm/hca/newlogo.png) no-repeat left center / auto 65%,
    url(/images/bm/hca/icon_topxx1.png) no-repeat 320px center / auto 55%;
}

.bm_container .bm_title::after {
  display: none;
}

/* 考试标题文字（在贴图下方居中显示） */
.bm_container .bm_title .title {
  font-size: 26px;
  font-weight: 700;
  color: var(--hca-white);
  letter-spacing: 1px;
  line-height: 1.4;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}

.bm_container .bm_title .sub_title {
  font-size: 16px;
  color: rgba(255, 255, 255, 0.85);
  margin-top: 6px;
  letter-spacing: 0.5px;
}

/* ============================================================
   导航步骤条
   ============================================================ */
.bm_container .bm_navigate {
  background-color: var(--hca-primary-accent) !important;
  background-image: none !important;
  height: auto !important;
  min-height: 36px;
}

.bm_container .bm_navigate table {
  background-color: var(--hca-primary-accent) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-bottom: 1px solid var(--hca-primary-dark) !important;
}

.bm_container .bm_navigate table td {
  color: rgba(255, 255, 255, 0.9) !important;
  font-family: var(--hca-font-family) !important;
  font-size: 14px;
  height: 36px !important;
  border-right: 1px solid rgba(255, 255, 255, 0.25) !important;
  transition: background-color 0.2s;
}

.bm_container .bm_navigate table td:hover {
  background-color: var(--hca-primary-hover) !important;
  cursor: pointer;
}

.bm_container .bm_navigate table td.current {
  background-color: var(--hca-primary-dark) !important;
  color: var(--hca-white) !important;
  font-weight: 600;
}

/* ============================================================
   内容区
   ============================================================ */
.bm_container .bm_body {
  background-color: var(--hca-white);
  padding: 24px 30px !important;
}

/* ============================================================
   底部 footer
   ============================================================ */
.bm_container .bm_footer,
.panel-footer.bm_footer {
  background-color: var(--hca-bg-footer) !important;
  color: rgba(255, 255, 255, 0.75) !important;
  font-size: 13px;
  line-height: 26px;
  text-align: center;
  padding: 20px 16px;
  border-top: none !important;
  margin-top: 0 !important;
}

.panel-footer.bm_footer a {
  color: rgba(255, 255, 255, 0.85) !important;
  text-decoration: none;
  transition: color 0.2s;
}

.panel-footer.bm_footer a:hover {
  color: var(--hca-white) !important;
  text-decoration: underline;
}

.panel-footer.bm_footer b {
  color: var(--hca-white) !important;
}

.panel-footer.bm_footer .copyright {
  color: rgba(255, 255, 255, 0.7);
  margin-top: 8px;
}

.panel-footer.bm_footer .copyright a {
  color: rgba(255, 255, 255, 0.7) !important;
}

.panel-footer.bm_footer .copyright a:hover {
  color: var(--hca-white) !important;
}

/* ============================================================
   按钮 - 覆盖 Bootstrap 主色按钮为 HCA 深红风格
   ============================================================ */
.btn-primary {
  background-color: var(--hca-primary) !important;
  border-color: var(--hca-primary-dark) !important;
  color: var(--hca-white) !important;
  font-family: var(--hca-font-family);
  letter-spacing: 0.5px;
  transition: background-color 0.2s, border-color 0.2s;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: var(--hca-primary-hover) !important;
  border-color: var(--hca-primary-dark) !important;
  color: var(--hca-white) !important;
}

.btn-info {
  background-color: #c0392b !important;
  border-color: #a93226 !important;
  color: var(--hca-white) !important;
  transition: background-color 0.2s;
}

.btn-info:hover,
.btn-info:focus {
  background-color: #a93226 !important;
  border-color: #922b21 !important;
}

.btn-danger {
  background-color: var(--hca-primary-dark) !important;
  border-color: #5a0203 !important;
  color: var(--hca-white) !important;
  transition: background-color 0.2s, border-color 0.2s;
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active {
  background-color: #5a0203 !important;
  border-color: #400102 !important;
  color: var(--hca-white) !important;
}

.btn-success {
  background-color: #2b7a44 !important; /* 沉稳的深翠绿 */
  border-color: #226236 !important;
  color: var(--hca-white) !important;
  transition: background-color 0.2s, border-color 0.2s;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active {
  background-color: #1f5730 !important;
  border-color: #174224 !important;
  color: var(--hca-white) !important;
}

/* ============================================================
   表单控件
   ============================================================ */
.bm_container .form-control:focus {
  border-color: var(--hca-primary) !important;
  box-shadow: 0 0 0 3px rgba(155, 13, 20, 0.12) !important;
}

.bm_container label {
  color: var(--hca-text-main);
  font-weight: 500;
}

/* ============================================================
   面板 / 卡片
   ============================================================ */
.bm_container .panel-heading {
  background-color: var(--hca-primary) !important;
  border-color: var(--hca-primary-dark) !important;
  color: var(--hca-white) !important;
}

.bm_container .panel-default > .panel-heading {
  background-color: var(--hca-primary) !important;
  color: var(--hca-white) !important;
}

/* ============================================================
   链接
   ============================================================ */
.bm_container a {
  color: var(--hca-primary-accent);
  transition: color 0.2s;
}

.bm_container a:hover {
  color: var(--hca-primary-dark);
}

/* ============================================================
   标题文字颜色
   ============================================================ */
.bm_container h1,
.bm_container h2,
.bm_container h3,
.bm_container h4 {
  color: var(--hca-text-main);
  font-family: var(--hca-font-family);
}

/* 红色强调标题（参考 HCA i_title 样式）*/
.bm_container .section-title {
  border-left: 6px solid var(--hca-primary-accent);
  padding-left: 12px;
  color: var(--hca-primary-accent);
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 16px;
}

/* ============================================================
   列表
   ============================================================ */
.bm_container ul li a:hover,
.bm_container ol li a:hover {
  color: var(--hca-primary-accent) !important;
}

/* ============================================================
   响应式适配
   ============================================================ */
@media screen and (max-width: 768px) {
  .bm_container .bm_title {
    padding: 0 12px 16px;
  }

  /* 小屏幕：调整两张图片的尺寸和间距，将靠右移动缩小 */
  .bm_container .bm_title::before {
    height: 60px;
    margin-bottom: 5px;
    background: 
      url(/images/bm/hca/newlogo.png) no-repeat left center / auto 60%,
      url(/images/bm/hca/icon_topxx1.png) no-repeat 200px center / auto 45%;
  }

  .bm_container .bm_title .title {
    font-size: 18px;
  }

  .bm_container .bm_title .sub_title {
    font-size: 14px;
    margin-top: 4px;
  }

  .bm_container .bm_body {
    padding: 16px 12px !important;
  }
}

@media screen and (max-width: 480px) {
  .bm_container .bm_title {
    padding: 0 10px 14px;
  }

  /* 极小屏幕：隐藏辅助图标，仅显示 logo */
  .bm_container .bm_title::before {
    height: 50px;
    background: url(/images/bm/hca/newlogo.png) no-repeat center / auto 65%;
  }

  .bm_container .bm_title .title {
    font-size: 16px;
    letter-spacing: 0;
  }

  .bm_container .bm_title .sub_title {
    font-size: 12px;
  }

  .panel-footer.bm_footer {
    font-size: 12px;
    line-height: 22px;
    padding: 14px 10px;
  }
}
