/* ==========================================================================
   Security & Compliance - Vulnerability Disclosure（PC，语种 en；ru 回退到本文件）
   ========================================================================== */

.vd-page {
    width: 100%;
    background-color: #fafafa;
    /* 站点 @font-face 里定义的是 'OPPOSans-R' / 'OPPOSans'（= OPPOSans-R.ttf），
       不能只写 Roboto/OPPOSans 裸名，否则会掉到系统默认字体 */
    font-family: 'OPPOSans-R', 'OPPOSans', Roboto, Arial, sans-serif;
    color: #1a1a1a;
    /* 顶部固定导航高度 60px（见 common/sidenav/en.css 的 .pc），
       站点 body 的 padding-top 被 layui 重置掉了，这里补回来 */
    padding-top: 60px;
}

/* 首屏 ---------------------------------------------------------------- */
/* 与对讲站一致：背景大图 + 居中盾牌水印 + 白色标题压在水印上 */
.vd-hero {
    position: relative;
    width: 100%;
    height: 49.6rem;
    background-color: #1c1c1c;
    background-image: url("/assets/img/security/vulnerability-hero.webp");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.vd-hero-inner {
    position: relative;
    width: 100%;
    height: 100%;
}

.vd-hero-shield {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    z-index: 1;
    width: 25rem;
    margin: 0 auto;
    transform: translateY(-50%);
}

.vd-hero-shield img {
    width: 100%;
    display: block;
}

.vd-hero-title {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    z-index: 2;
    margin: 0;
    /* 与站点 banner 一致：OPPOSans Regular */
    font-family: 'OPPOSans-R', 'OPPOSans', Roboto, Arial, sans-serif;
    font-size: 6rem;
    line-height: 1.2;
    font-weight: 400;
    color: #fff;
    text-align: center;
    transform: translateY(-50%);
}

/* 正文容器 ------------------------------------------------------------ */
.vd-content {
    width: 126rem;
    max-width: 92%;
    margin: 0 auto;
    padding: 7rem 0 10rem;
}

.vd-title {
    /* 标题统一用 banner 那套字体（OPPOSans），这里取 Bold 字重 */
    font-family: 'OPPOSans-B', 'OPPOSans-R', 'OPPOSans', Roboto, Arial, sans-serif;
    font-size: 4.8rem;
    font-weight: 700;
    text-align: center;
    margin: 0 0 4rem;
    line-height: 1.4;
}

.vd-section {
    margin-bottom: 7rem;
}

.vd-h2 {
    font-family: 'OPPOSans-B', 'OPPOSans-R', 'OPPOSans', Roboto, Arial, sans-serif;
    font-size: 3rem;
    font-weight: 700;
    line-height: 1.6;
    margin: 0 0 3.2rem;
}

/* 流程说明 ------------------------------------------------------------ */
/* 对讲站：图标占 306px 的浮动列，图片按原尺寸居中；文字占剩余宽度、24px */
.vd-process {
    display: flex;
    align-items: flex-start;
    margin-bottom: 3.2rem;
}

.vd-process-icon {
    flex: 0 0 30.6rem;
    width: 30.6rem;
    padding-top: 1rem;
}

.vd-process-icon img {
    width: 17.3rem;
    display: block;
    margin: 0 auto;
}

.vd-process-text {
    flex: 1 1 auto;
    width: calc(100% - 33.4rem);
}

.vd-process-text p {
    font-size: 2.4rem;
    line-height: 1.4;
    color: #333;
    margin: 0 0 2rem;
}

.vd-steps {
    width: 100%;
    margin: 6rem 0 3rem;
}

.vd-steps img {
    width: 100%;
    display: block;
}

/* 五步流程配图未到位时的占位框（素材放进来后自动消失） */
.vd-steps.is-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 24rem;
    border: 1px dashed #dcdcdc;
    border-radius: 1.2rem;
    background-color: #fafafa;
}

.vd-steps.is-empty::after {
    content: "Five-step process diagram (design asset pending)";
    font-size: 1.6rem;
    color: #aaa;
}

/* Note ---------------------------------------------------------------- */
.vd-note {
    font-size: 1.8rem;
    line-height: 1.7;
    color: #333;
}

.vd-note-title {
    font-weight: 700;
    margin: 0 0 1rem;
}

/* 站点全局 reset 把 list-style 清空了，这里显式恢复序号 1./2./3. */
.vd-note ol {
    margin: 0;
    padding-left: 2.4rem;
    list-style: decimal outside;
}

.vd-note li {
    display: list-item;
    list-style: decimal outside;
    margin-bottom: 0.8rem;
}

.vd-note a {
    color: #2f5fe0;
    word-break: break-all;
}

/* 安全公告表格 -------------------------------------------------------- */
/* 对讲站：白卡片浮在 #FAFAFA 底上，padding 24/64/52，圆角 20 */
.vd-table-wrap {
    width: 100%;
    border-radius: 2rem;
    background-color: #fff;
    padding: 2.4rem 6.4rem 5.2rem;
    box-sizing: border-box;
}

.vd-table {
    width: 100%;
    margin-top: 6.6rem;
    border-collapse: collapse;
    font-size: 1.8rem;
}

.vd-table th {
    font-size: 1.8rem;
    font-weight: 400;
    color: #111;
    text-align: left;
    padding: 0 0 1.6rem 0.8rem;
    border-bottom: 1px solid #eee;
}

.vd-table td {
    font-size: 1.8rem;
    line-height: 1.6;
    color: #333;
    height: 5rem;
    padding: 0.8rem 0 0.8rem 0.8rem;
    vertical-align: middle;
}

.vd-table td a {
    color: #333;
}

.vd-table td a:hover {
    color: #2f5fe0;
    text-decoration: underline;
}

.vd-col-id {
    width: 8%;
}

.vd-col-summary {
    width: 62%;
}

.vd-col-date {
    width: 30%;
}

.vd-empty {
    text-align: center;
    color: #999;
    padding: 4rem 0;
}

/* 报告表单 ------------------------------------------------------------ */
.vd-report-intro {
    font-size: 2.4rem;
    line-height: 1.4;
    color: #333;
    margin: 0 0 2.4rem;
}

.vd-report-intro a {
    color: #4d74ff;
}

.vd-warn {
    font-size: 2.4rem;
    line-height: 1.4;
    color: #333;
    margin: 0 0 0.6rem;
}

.vd-pgp {
    color: #4d74ff;
}

.vd-pgp.is-pending {
    color: #9a9a9a;
    cursor: not-allowed;
    text-decoration: none;
}

.vd-form {
    display: flex;
    flex-wrap: wrap;
    margin-top: 4rem;
}

.vd-form-left {
    flex: 0 0 52%;
    width: 52%;
    padding-right: 4rem;
    box-sizing: border-box;
}

.vd-form-right {
    flex: 1 1 48%;
    width: 48%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.vd-form-right img {
    width: 100%;
    max-width: 42rem;
    display: block;
}

.vd-field {
    margin-bottom: 2.6rem;
}

.vd-field label {
    display: block;
    font-size: 1.6rem;
    color: #333;
    margin-bottom: 1rem;
}

.vd-field input[type="text"],
.vd-field textarea {
    width: 100%;
    box-sizing: border-box;
    border: none;
    outline: none;
    border-radius: 0.6rem;
    background-color: #ededed;
    padding: 1.6rem 1.8rem;
    font-size: 1.6rem;
    font-family: inherit;
    color: #222;
}

.vd-field textarea {
    min-height: 14rem;
    resize: vertical;
    line-height: 1.6;
}

.vd-field input[type="text"]:focus,
.vd-field textarea:focus {
    background-color: #e4e4e4;
}

/* 附件 */
.vd-field-file {
    display: flex;
    align-items: center;
}

.vd-file-input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    overflow: hidden;
}

/* 选择器要压过上面的 .vd-field label（同为 label，特异性更高才生效） */
.vd-field .vd-file-label {
    display: inline-block;
    padding: 0.9rem 3.2rem;
    border-radius: 2.4rem;
    background-color: #3c6be5;
    color: #fff;
    font-size: 1.6rem;
    cursor: pointer;
    margin-bottom: 0 !important;
    transition: background-color 0.2s;
}

.vd-field .vd-file-label:hover {
    background-color: #2f5ad0;
}

.vd-file-name {
    margin-left: 1.6rem;
    font-size: 1.5rem;
    color: #888;
    max-width: 24rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* 验证码 */
.vd-captcha-row {
    display: flex;
    align-items: center;
}

.vd-captcha-row input[type="text"] {
    width: 18rem;
    margin-right: 1.6rem;
}

.vd-cap-img {
    height: 5.4rem;
    cursor: pointer;
    border-radius: 0.6rem;
}

/* 勾选项 */
.vd-consent {
    flex: 0 0 100%;
    width: 100%;
    margin-top: 1rem;
}

.vd-check {
    display: flex;
    align-items: flex-start;
    margin-bottom: 1.6rem;
    cursor: pointer;
}

.vd-checkbox {
    margin: 0.4rem 1.2rem 0 0;
    width: 1.8rem;
    height: 1.8rem;
    flex: 0 0 1.8rem;
}

.vd-check span {
    font-size: 1.5rem;
    line-height: 1.7;
    color: #555;
}

.vd-check a {
    color: #2f5fe0;
}

/* 提交 */
.vd-submit-row {
    flex: 0 0 100%;
    width: 100%;
    margin-top: 1.6rem;
}

.vd-submit {
    display: inline-block;
    min-width: 16rem;
    padding: 1.2rem 4rem;
    border: none;
    border-radius: 2.8rem;
    background-color: #3c6be5;
    color: #fff;
    font-size: 1.8rem;
    font-family: inherit;
    cursor: pointer;
    transition: background-color 0.2s;
}

.vd-submit:hover {
    background-color: #2f5ad0;
}

.vd-submit:disabled,
.vd-submit.is-loading {
    opacity: 0.6;
    cursor: not-allowed;
}

.vd-form-tip {
    display: inline-block;
    margin-left: 2rem;
    font-size: 1.5rem;
    color: #d33;
    opacity: 0;
    transition: opacity 0.2s;
}

/* 页脚留言表单 -------------------------------------------------------- */
/* 本页自带“Report a Vulnerability”表单，页脚再出现一个“Leave us a message”
   就是重复的表单，直接隐藏；页脚导航（.foot）保留。
   .footerTable 自带 85rem 高度和 -7rem 上边距，隐藏后由 .vd-content 的
   padding-bottom 与 .vd-section 的 margin-bottom 负责表单区到页脚的留白。 */
.vd-page .footerTable {
    display: none;
}
