@charset "utf-8";
/* ==========================================================
 * 在线客服弹窗
 *
 * 做成完全自包含：不依赖 common.css，也不依赖 auth.css。
 * 因为登录/注册页用的是 auth.css，登录后的页面用的是 common.css，
 * 两套页面都要能弹这个窗，所以样式单独一个文件。
 *
 * 约定：1rem = 100 设计像素（与全站一致）
 * 居中不用 transform，兼容旧内核。
 * ========================================================== */

.svc-mask {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 9500;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    background-color: #000\9;
    display: none;
}

.svc-mask.is-show {
    display: block;
}

/* 满高容器 + 内层垂直居中（不用 transform） */
.svc-wrap {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    white-space: nowrap;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.svc-wrap:before {
    content: "";
    display: inline-block;
    *display: inline;
    *zoom: 1;
    width: 0;
    height: 100%;
    vertical-align: middle;
}

.svc-box {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    position: relative;
    width: 8.4rem;
    margin: 0.4rem 0;
    vertical-align: middle;
    text-align: center;
    white-space: normal;
    background-color: #fcf6f0;
    -webkit-box-shadow: inset 0 0 0 0.0257rem #be1914;
    box-shadow: inset 0 0 0 0.0257rem #be1914;
    -webkit-border-radius: 0.244rem;
    border-radius: 0.244rem;
    overflow: hidden;
}

/* 标题条 */
.svc-box__hd {
    height: 0.86rem;
    line-height: 0.86rem;
    text-align: center;
    font-size: 0.38rem;
    font-weight: 600;
    color: #f8dbad;
    background-color: #b80404;
}

/* 二维码 */
.svc-box__bd {
    padding: 0.4rem 0.42rem 0.1rem;
}

/* 宽度固定，高度由 includes/service.php 按各自图片比例内联输出
   （写死尺寸是为了避免图片加载前后弹窗高度跳动）
   兜底 6.8rem：万一配置里没给高度也不会塌成 0 */
.svc-box__img {
    display: block;
    width: 5.4rem;
    height: 6.8rem;
    margin: 0 auto;
    background-color: #ffffff;
    -webkit-border-radius: 0.12rem;
    border-radius: 0.12rem;
}

.svc-box__tip {
    margin-top: 0.24rem;
    font-size: 0.26rem;
    line-height: 1.7;
    color: #8a7b6d;
    word-break: break-all;
}

/* 按钮区（竖排三个） */
.svc-box__ft {
    padding: 0.3rem 0.42rem 0.42rem;
}

.svc-btn {
    display: block;
    height: 1rem;
    line-height: 1rem;
    margin-top: 0.2rem;
    text-align: center;
    font-size: 0.32rem;
    font-weight: 600;
    -webkit-border-radius: 0.16rem;
    border-radius: 0.16rem;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.svc-btn:first-child {
    margin-top: 0;
}

.svc-btn:active {
    opacity: 0.85;
    filter: alpha(opacity=85);
}

/* 添加客服（金色，主操作） */
.svc-btn--gold {
    color: #6a3906;
    background-color: #f0b64a;
    background-image: -webkit-linear-gradient(top, #f8d489 0%, #e9a636 100%);
    background-image: linear-gradient(to bottom, #f8d489 0%, #e9a636 100%);
}

/* 下载安信平台（红色） */
.svc-btn--red {
    color: #fff5e2;
    background-color: #be1914;
    background-image: -webkit-linear-gradient(top, #d3211b 0%, #a10b06 100%);
    background-image: linear-gradient(to bottom, #d3211b 0%, #a10b06 100%);
}

/* 关闭 */
.svc-btn--plain {
    color: #8a7b6d;
    background-color: transparent;
    -webkit-box-shadow: inset 0 0 0 0.0257rem #d3c1ad;
    box-shadow: inset 0 0 0 0.0257rem #d3c1ad;
}

/* 文案长时自动缩小字号，保证一行放得下 */
.svc-btn.is-long {
    font-size: 0.28rem;
}