/* ============================================================================
   机器人英才网 · 公共样式
   由 companydetail.html 的内联 <style> 提取生成（原第 6 段，原始 4741 字节）
   出现于：companydetail、jobdetail
   ⚠ 本文件由脚本生成，请勿手工编辑；改样式请改源 HTML 后重跑 _tools/v1_extract.py
   ============================================================================ */
/* 右侧登录 手机号表单 ⇄ 二维码
   ============================================================================ */

/* ==================================================================
   r23 · 需求6.2 —— 右侧「切换二维码登录」
   ------------------------------------------------------------------
   原站右侧只有手机号短信表单，切换按钮依赖 Vue 事件（离线后失效）。
   本次把「标题头 + 切换按钮」从 .sign-form 提到 .sign-wrap 层，
   使手机号态与二维码态共用同一标题栏与同一切换入口，
   并补一个静态可用的二维码面板。
   jobdetail / companydetail 使用完全相同的 HTML/CSS/JS → 体验一致。
   ================================================================== */
/* ── 标题头（两种形态共用） ── */
.job-sider .sign-wrap.sign-wrap-v2,
.company-sider .sign-wrap.sign-wrap-v2{ position:relative; }
.job-sider .sign-wrap .epjob-login-head,
.company-sider .sign-wrap .epjob-login-head{
    position:absolute;left:12px;right:12px;top:12px;height:72px;z-index:2;
}
.job-sider .sign-wrap .epjob-login-head canvas#sign-side,
.company-sider .sign-wrap .epjob-login-head canvas#sign-side{
    display:block;position:absolute;left:-12px;right:-12px;top:-12px;
    width:284px;height:96px;
}
.job-sider .sign-wrap .epjob-login-head h3.title,
.company-sider .sign-wrap .epjob-login-head h3.title{
    display:block;position:relative;margin:0;height:47px;line-height:26px;
    color:#fff;font-size:18px;font-weight:500;padding-top:9px;
}
.job-sider .sign-wrap .epjob-login-head .sub-title,
.company-sider .sign-wrap .epjob-login-head .sub-title{
    display:block;height:25px;line-height:20px;color:#fff;font-size:12px;
    font-weight:400;padding-top:1px;
}
/* ── 切换按钮（图标随形态翻转） ── */
.job-sider .sign-wrap .epjob-login-head .switch-login-btn.app-way,
.company-sider .sign-wrap .epjob-login-head .switch-login-btn.app-way{
    display:block;position:absolute;top:0;right:0;width:50px;height:50px;
    cursor:pointer;z-index:4;
    background:url(../.././_assets/epjob-red-switch-qr.png) center/24px auto no-repeat;
    transition:transform .2s linear;
}
.job-sider .sign-wrap .epjob-login-head .switch-login-btn.app-way:hover,
.company-sider .sign-wrap .epjob-login-head .switch-login-btn.app-way:hover{ transform:scale(1.12); }
.job-sider .sign-wrap.sign-wrap-v2.epjob-qr-mode .epjob-login-head .switch-login-btn.app-way,
.company-sider .sign-wrap.sign-wrap-v2.epjob-qr-mode .epjob-login-head .switch-login-btn.app-way{
    background-image:url(../.././_assets/epjob-red-switch-phone.png);
}
/* ── 内容区下移给标题让位，标题底部保留 16px 间距 ── */
.job-sider .sign-wrap .sign-form,
.company-sider .sign-wrap .sign-form{ padding-top:100px !important; }
/* 🔴 品牌红底纹原挂在 .sign-form 上（.epjob-kit-head 下 4 类名 (0,4,0)）。
   切到二维码态时 .sign-form 被隐藏 → 底纹与圆角一起消失。
   故把同一份底纹补到 sign-wrap / qrcode 上（去掉 padding/margin/min-height，
   只保留 background + border-radius），两种形态视觉一致。 */
.job-sider .sign-wrap.sign-wrap-v2,
.company-sider .sign-wrap.sign-wrap-v2{
    background:url(../../../_assets/myz8vq8tfh1655797191987.png) 16px 14px/auto 50px no-repeat,
               linear-gradient(180deg,#d61518,#bf1215) hsla(0,0%,100%,.21);
    border-radius:14px;
}
.job-sider .sign-wrap .sign-form,
.company-sider .sign-wrap .sign-form{
    background:none;border-radius:0;min-height:0;
}
.job-sider .sign-wrap .epjob-qrcode,
.company-sider .sign-wrap .epjob-qrcode{
    display:none;padding:100px 22px 26px;background:none;
}
/* ── 二维码形态 ── */
.job-sider .sign-wrap.sign-wrap-v2.epjob-qr-mode .epjob-qrcode,
.company-sider .sign-wrap.sign-wrap-v2.epjob-qr-mode .epjob-qrcode{ display:block; }
.job-sider .sign-wrap.sign-wrap-v2.epjob-qr-mode .sign-form,
.company-sider .sign-wrap.sign-wrap-v2.epjob-qr-mode .sign-form{ display:none !important; }
.job-sider .sign-wrap .epjob-qrcode-box,
.company-sider .sign-wrap .epjob-qrcode-box{
    position:relative;width:180px;height:180px;margin:0 auto;
    border:1px solid #f0f0f0;border-radius:8px;background:#fff;overflow:hidden;
}
.job-sider .sign-wrap .epjob-qrcode-box img,
.company-sider .sign-wrap .epjob-qrcode-box img{
    display:block;width:180px;height:180px;border-radius:8px;
}
.job-sider .sign-wrap .epjob-qrcode-mask,
.company-sider .sign-wrap .epjob-qrcode-mask{
    display:none;position:absolute;left:0;top:0;width:180px;height:180px;
    background:rgba(255,255,255,.94);align-items:center;justify-content:center;
    text-align:center;font-size:13px;line-height:22px;color:#999;cursor:pointer;
}
.job-sider .sign-wrap .epjob-qrcode-mask span,
.company-sider .sign-wrap .epjob-qrcode-mask span{ color:#d61518;font-weight:500; }
.job-sider .sign-wrap .epjob-qrcode-box.epjob-qr-expired .epjob-qrcode-mask,
.company-sider .sign-wrap .epjob-qrcode-box.epjob-qr-expired .epjob-qrcode-mask{ display:flex; }
.job-sider .sign-wrap .epjob-qrcode-tip,
.company-sider .sign-wrap .epjob-qrcode-tip{
    display:block;margin:16px 0 0;font-size:13px;line-height:20px;
    color:#999;text-align:center;
}
.job-sider .sign-wrap .epjob-qrcode-tip b,
.company-sider .sign-wrap .epjob-qrcode-tip b{ color:#666;font-weight:500; }