/* 国家子站 · 申请大厅 */

/* 申请页 CSS 最后加载：再次压过 style.css 全局 a 下划线
 * 注意：不要给侧栏菜单 / 面包屑加 color:#fff（白底会看不见字） */
body.visa-country-apply a,
body.ca-page-body a,
body.visa-country-apply a:hover,
body.ca-page-body a:hover,
body.visa-country-apply a:focus,
body.ca-page-body a:focus,
body.visa-country-apply a:active,
body.ca-page-body a:active,
body.visa-country-apply a:visited,
body.ca-page-body a:visited,
body.visa-country-apply .ch-header .ch-nav a b,
body.visa-country-apply .ch-header .ch-nav a i,
body.visa-country-apply .ch-header .ch-nav a:hover b,
body.visa-country-apply .ch-header .ch-nav a:hover i,
body.visa-country-apply .ca-code-refresh,
body.visa-country-apply .ca-code-refresh:hover,
body.visa-country-apply .ch-logo,
body.visa-country-apply .ch-logo:hover,
body.visa-country-apply .ch-header a.ch-logo,
body.visa-country-apply .ch-header a.ch-logo:hover,
body.ca-page-body .ch-header a.ch-logo,
body.ca-page-body .ch-header a.ch-logo:hover {
  text-decoration: none !important;
  text-decoration-line: none !important;
}

/* 仅顶栏 Logo / 导航需要白字 */
body.visa-country-apply .ch-header a,
body.visa-country-apply .ch-header a:hover,
body.visa-country-apply .ch-header a:visited,
body.ca-page-body .ch-header a,
body.ca-page-body .ch-header a:hover,
body.ca-page-body .ch-header a:visited {
  color: #fff !important;
}

/* 面包屑：浅灰底用深色字 */
body.visa-country-apply .ca-page-crumb,
body.ca-page-body .ca-page-crumb {
  color: #666 !important;
}
body.visa-country-apply .ca-page-crumb a,
body.visa-country-apply .ca-page-crumb a:hover,
body.visa-country-apply .ca-page-crumb a:visited,
body.ca-page-body .ca-page-crumb a,
body.ca-page-body .ca-page-crumb a:hover,
body.ca-page-body .ca-page-crumb a:visited {
  color: #205fca !important;
  text-decoration: none !important;
}

/* 侧栏四步菜单：白底必须深色字 */
body.visa-country-apply .ca-side-item a,
body.visa-country-apply .ca-side-item a:hover,
body.visa-country-apply .ca-side-item a:visited,
body.ca-page-body .ca-side-item a,
body.ca-page-body .ca-side-item a:hover,
body.ca-page-body .ca-side-item a:visited {
  color: #333 !important;
  text-decoration: none !important;
}
body.visa-country-apply .ca-side-item.is-active a,
body.visa-country-apply .ca-side-item.is-active a:hover,
body.ca-page-body .ca-side-item.is-active a,
body.ca-page-body .ca-side-item.is-active a:hover {
  color: #c8561a !important;
}

/* 底部申请/产品卡片文字保持原样式，不要被顶栏白字覆盖 */
body.visa-country-apply .cg-side-act,
body.visa-country-apply .cg-side-act:hover,
body.ca-page-body .cg-side-act,
body.ca-page-body .cg-side-act:hover {
  text-decoration: none !important;
}
body.visa-country-apply .ch-header a.ch-logo .ch-logo-text strong,
body.visa-country-apply .ch-header a.ch-logo .ch-logo-text em,
body.visa-country-apply .ch-header a.ch-logo:hover .ch-logo-text strong,
body.visa-country-apply .ch-header a.ch-logo:hover .ch-logo-text em,
body.ca-page-body .ch-header a.ch-logo .ch-logo-text strong,
body.ca-page-body .ch-header a.ch-logo .ch-logo-text em,
body.ca-page-body .ch-header a.ch-logo:hover .ch-logo-text strong,
body.ca-page-body .ch-header a.ch-logo:hover .ch-logo-text em {
  color: #fff !important;
}

body.visa-country-apply,
body.ca-page-body {
  background: #eef1f5 !important;
  color: #1f2430;
}

.ca-page {
  width: 1200px;
  max-width: 96%;
  margin: 16px auto 40px;
}

/* 面包屑：左栏第一行；侧栏与主内容第二行顶对齐 */
.ca-layout.cg-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  grid-template-rows: auto auto;
  gap: 10px 16px;
  align-items: start;
}

.ca-layout .ca-page-crumb {
  grid-column: 1;
  grid-row: 1;
  margin: 0;
  padding: 0;
  font-size: 13px;
  color: #999;
  line-height: 1.5;
  text-align: left;
}

.ca-layout .ca-sidebar.cg-sidebar {
  grid-column: 1;
  grid-row: 2;
  width: 100%;
}

.ca-layout .ca-main.cg-main {
  grid-column: 2;
  grid-row: 2;
  width: 100%;
  min-width: 0;
}

.ca-page-crumb a {
  color: #666 !important;
  text-decoration: none !important;
}

.ca-page-crumb a:hover {
  color: #205fca !important;
  text-decoration: none !important;
}

/* ---- 侧栏：两块独立卡片（申请大厅 / 申请流程），中间留缝 ---- */
.ca-sidebar.cg-sidebar {
  width: 280px;
  flex-shrink: 0;
  background: transparent;
  border: none;
  border-radius: 0;
  overflow: visible;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.ca-sidebar .ca-side-block {
  box-sizing: border-box;
  width: 100%;
  border: 1px solid #b8cfe8;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
}

/* 申请大厅 · 亮蓝（与下方青绿流程区分离） */
.ca-sidebar .ca-side-block-apply .cg-side-hd {
  margin: 0;
  padding: 16px;
  background: linear-gradient(180deg, #3d8ef0 0%, #2878e8 100%);
  color: #fff;
  text-align: center;
}

.ca-sidebar .ca-side-block-apply .cg-side-hd h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
}

.ca-sidebar .ca-side-block-apply .cg-side-hd em {
  display: block;
  margin-top: 6px;
  font-style: normal;
  font-size: 11px;
  letter-spacing: .08em;
  opacity: .92;
  text-transform: uppercase;
}

/* 申请流程 · 青绿标题 + 白底步骤列表（独立第二块） */
.ca-side-process-hd {
  margin: 0;
  padding: 14px 16px 12px;
  background: linear-gradient(180deg, #00a3b5 0%, #008997 100%);
  color: #fff;
  text-align: center;
}

.ca-side-process-title {
  display: block;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: .06em;
}

.ca-side-process-sub {
  display: block;
  margin-top: 6px;
  font-size: 11px;
  line-height: 1.45;
  opacity: .95;
  font-weight: 400;
}

.ca-side-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  background: #fff;
}

.ca-side-item {
  border-bottom: 1px solid #eef2f7;
}

.ca-side-item:last-child {
  border-bottom: 0;
}

.ca-side-item a {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  color: #333 !important;
  text-decoration: none !important;
  font-size: 15px;
  transition: background .15s, color .15s;
}

.ca-side-ico {
  flex-shrink: 0;
  width: 27px;
  height: 27px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ca-side-ico img {
  display: block;
  width: 27px;
  height: 27px;
  object-fit: contain;
}

.ca-side-label {
  flex: 1;
  font-weight: 500;
  line-height: 1.3;
}

.ca-side-item.is-active a {
  color: #c8561a !important;
  background: #fff;
}

.ca-side-item a:hover {
  background: #f3f8ff;
  color: #205fca !important;
}

.ca-side-item.is-active a:hover {
  color: #c8561a !important;
  background: #fff;
}

/* 底部申请/产品卡片：与上方流程块分离 */
.ca-sidebar .cg-side-foot {
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  gap: 10px;
}

/* 9 步流程图：与上方申请流程容器同宽、同边框 */
.ca-flow-graphic {
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 1px solid #b8cfe8;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
  min-height: 0;
}

.ca-flow-img {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
  margin: 0;
  vertical-align: top;
}

/* ---- 主区 ---- */
.ca-main {
  background: #fff;
  border: 1px solid #e3e9f2;
  border-radius: 4px;
  padding: 20px 28px 32px;
}

.ca-hd {
  margin-bottom: 24px;
  padding-bottom: 0;
  border-bottom: none;
  text-align: center;
}

.ca-title {
  margin: 0;
  font-size: 26px;
  font-weight: 700;
  color: #1a1a1a;
  padding-bottom: 10px;
  border-bottom: 3px solid #205fca;
  display: inline-block;
}

/* ---- 表单区块 ---- */
.ca-block {
  margin-bottom: 26px;
}

.ca-block-last {
  margin-bottom: 8px;
}

.ca-block-hd {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  font-size: 16px;
  font-weight: 700;
  color: #222;
}

.ca-ico {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  background: #8a94a6 center/16px no-repeat;
  border-radius: 50%;
  opacity: .85;
}

.ca-ico-loc { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%238a94a6'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5a2.5 2.5 0 110-5 2.5 2.5 0 010 5z'/%3E%3C/svg%3E"); }
.ca-ico-type { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%238a94a6'%3E%3Cpath d='M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm1 9h-4v2h4v-2zm0 4h-4v2h4v-2z'/%3E%3C/svg%3E"); }
.ca-ico-num { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%238a94a6'%3E%3Cpath d='M19 3H5a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2V5a2 2 0 00-2-2zm-7 14H7v-2h5v2zm5-4H7v-2h10v2zm0-4H7V7h10v2z'/%3E%3C/svg%3E"); }
.ca-ico-id { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%238a94a6'%3E%3Cpath d='M12 12a5 5 0 100-10 5 5 0 000 10zm-7 9v-1c0-2.76 5.24-4 7-4s7 1.24 7 4v1H5z'/%3E%3C/svg%3E"); }
.ca-ico-date { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%238a94a6'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2V6a2 2 0 00-2-2zm0 16H5V9h14v11z'/%3E%3C/svg%3E"); }
.ca-ico-people { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%238a94a6'%3E%3Cpath d='M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5s-3 1.34-3 3 1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5C15 14.17 10.33 13 8 13zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z'/%3E%3C/svg%3E"); }
.ca-ico-user { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%238a94a6'%3E%3Cpath d='M12 2a5 5 0 100 10 5 5 0 000-10zm0 12c-3.87 0-8 1.94-8 5.8V22h16v-2.2C20 15.94 15.87 14 12 14z'/%3E%3C/svg%3E"); }

.ca-tip {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  margin: 0 0 12px;
  font-size: 12px;
  color: #d4380d;
  line-height: 1.5;
}

.ca-tip i {
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  margin-top: 1px;
  border-radius: 50%;
  background: #d4380d;
  color: #fff;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ca-desc {
  margin: 0 0 12px;
  font-size: 12px;
  color: #888;
}

.ca-chip-grid {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 10px 8px;
}

.ca-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.ca-chip {
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid #d8dee8;
  border-radius: 4px;
  background: #fff;
  color: #555;
  font-size: 13px;
  cursor: pointer;
  transition: border-color .15s, color .15s, background .15s;
}

.ca-chip:hover {
  border-color: #205fca;
  color: #205fca;
}

.ca-chip.is-on {
  background: #205fca;
  border-color: #205fca;
  color: #fff;
}

.ca-date-wrap {
  position: relative;
  max-width: 280px;
}

.ca-input {
  width: 100%;
  height: 40px;
  padding: 0 12px;
  border: 1px solid #d8dee8;
  border-radius: 4px;
  font-size: 14px;
  box-sizing: border-box;
  outline: none;
}

.ca-input:focus {
  border-color: #205fca;
}

.ca-input-date {
  color: #333;
}

.ca-date-ph {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 13px;
  color: #aaa;
  pointer-events: none;
}

.ca-input-date:focus + .ca-date-ph,
.ca-input-date:not(:placeholder-shown) + .ca-date-ph,
.ca-input-date:valid + .ca-date-ph {
  display: none;
}

.ca-fields {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 420px;
}

.ca-field label {
  display: block;
  margin-bottom: 6px;
  font-size: 14px;
  color: #333;
}

.ca-field label em {
  color: #d4380d;
  font-style: normal;
}

.ca-code-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.ca-code-row .ca-input {
  flex: 1;
  min-width: 120px;
}

.ca-code-img {
  height: 40px;
  border: 1px solid #e3e9f2;
  border-radius: 4px;
  cursor: pointer;
}

.ca-code-refresh {
  font-size: 12px;
  color: #205fca !important;
  white-space: nowrap;
}

.ca-submit-wrap {
  text-align: center;
  padding-top: 8px;
}

.ca-submit {
  min-width: 200px;
  height: 46px;
  padding: 0 40px;
  border: none;
  border-radius: 4px;
  background: linear-gradient(180deg, #52c41a 0%, #389e0d 100%);
  color: #fff;
  font-size: 17px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(56, 158, 13, .35);
  transition: opacity .15s, transform .1s;
}

.ca-submit:hover {
  opacity: .94;
}

.ca-submit:active {
  transform: translateY(1px);
}

.ca-submit:disabled {
  opacity: .65;
  cursor: not-allowed;
}

@media (max-width: 992px) {
  .ca-layout.cg-layout {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
  }

  .ca-layout .ca-page-crumb {
    grid-column: 1;
    grid-row: 1;
  }

  .ca-layout .ca-sidebar.cg-sidebar {
    grid-column: 1;
    grid-row: 2;
  }

  .ca-layout .ca-main.cg-main {
    grid-column: 1;
    grid-row: 3;
  }

  .ca-sidebar.cg-sidebar {
    width: 100%;
  }

  .ca-flow-graphic {
    width: 100%;
  }

  .ca-flow-img {
    width: 100%;
    max-width: none;
  }

  .ca-main {
    padding: 16px 14px 24px;
  }

  .ca-chip-grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .ca-fields {
    max-width: none;
  }
}

@media (max-width: 480px) {
  .ca-chip-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
