/* =====================================================================
   ConferenceShow/vote/css/vote.css
   v20261027b: 文件名可编辑输入框样式 (.vote-file-name-input, 替代只读 span,
   选完文件自动回填原文件名, 支持中英文修改);
   v20261027a: 英文版 - 新增 .vote-lang-bar 中英切换条 (list/detail 头部) 与
   创建页英文输入样式 (.vote-input-en / .vote-option-inputs / .vote-option-input-en);
   既有投票组件样式零改动。
   ===================================================================== */

﻿/* =====================================================================
   ConferenceShow/vote/css/vote.css
   投票系统共享样式 (list / create / detail / manage 四页共用)
   版本: v=20261015b (新增 .vote-init-* 选项初始值弹层行样式 + .vote-export-link 导出令牌链接样式,
                配合 detail.js 20261015f / manage.js 20261015d)
   依赖: ../css/site.css (page-root/nav-bar/toast/empty-state/loading-box/load-more)
   设计: 移动优先(max-width 600px 容器), 品牌蓝 #2A7AE5 体系, 与站点卡片语言一致
   ===================================================================== */

/* ============================ 列表 TAB ============================ */
.vote-view-tabs {
    position: sticky; top: 48px; z-index: 40;
    background: rgba(255,255,255,0.96);
    border-bottom: 1px solid rgba(42,122,229,0.10);
}
.vote-view-tabs-inner { display: flex; max-width: 600px; margin: 0 auto; }
.vote-view-tab {
    flex: 1; border: none; background: none; cursor: pointer;
    padding: 11px 0 9px; font-size: 14px; color: #6b7f97;
    border-bottom: 2px solid transparent; font-family: inherit;
    -webkit-appearance: none; appearance: none;
}
.vote-view-tab.active { color: #2A7AE5; font-weight: 600; border-bottom-color: #2A7AE5; }

/* ============================ 搜索条 ============================ */
.vote-toolbar { display: flex; gap: 8px; margin: 12px 12px 0; }
.vote-search-wrap {
    flex: 1; display: flex; align-items: center; gap: 8px;
    background: #fff; border: 1px solid #dbe7f5; border-radius: 10px; padding: 0 12px; height: 38px;
}
.vote-search-icon { width: 16px; height: 16px; color: #9aa8b8; flex-shrink: 0; }
.vote-search-input { flex: 1; border: none; outline: none; font-size: 13px; color: #102033; background: transparent; min-width: 0; }
.vote-btn-search {
    border: none; cursor: pointer; height: 38px; padding: 0 16px;
    background: #2A7AE5; color: #fff; font-size: 13px; border-radius: 10px; font-family: inherit;
}
.vote-btn-search:active { background: #1f66c9; }

/* ============================ 投票卡片 ============================ */
.vote-list { margin: 12px; }
.vote-card {
    background: #fff; border: 1px solid #e3edf9; border-radius: 14px;
    padding: 14px 16px; margin-bottom: 12px; cursor: pointer;
    box-shadow: 0 2px 8px rgba(24,70,128,0.04);
    transition: transform 0.15s, box-shadow 0.15s;
}
.vote-card:active { transform: scale(0.985); box-shadow: 0 1px 4px rgba(24,70,128,0.08); }
.vote-card-head { display: flex; align-items: flex-start; gap: 8px; }
.vote-card-title { flex: 1; font-size: 15px; font-weight: 600; color: #102033; line-height: 1.45; }
.vote-badge {
    flex-shrink: 0; font-size: 11px; padding: 2px 9px; border-radius: 20px; font-weight: 600; white-space: nowrap;
}
.vote-badge.active   { background: #e6f7ec; color: #1a9e52; }
.vote-badge.notstart { background: #e8f1ff; color: #2A7AE5; }
.vote-badge.paused   { background: #fff3e0; color: #d9820a; }
.vote-badge.ended    { background: #eef1f5; color: #8595a8; }
.vote-card-desc {
    font-size: 12px; color: #6b7f97; margin-top: 6px; line-height: 1.5;
    overflow: hidden; text-overflow: ellipsis; display: -webkit-box;
    -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.vote-card-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 10px; font-size: 12px; color: #8595a8; }
.vote-card-meta span { display: inline-flex; align-items: center; gap: 4px; }
.vote-card-meta svg { width: 13px; height: 13px; }
.vote-card-foot {
    display: flex; align-items: center; justify-content: space-between;
    margin-top: 10px; padding-top: 10px; border-top: 1px dashed #e8eef7;
}
.vote-card-stat { font-size: 12px; color: #6b7f97; }
.vote-card-stat b { color: #2A7AE5; font-size: 15px; margin-right: 2px; }
.vote-card-creator { font-size: 12px; color: #9aa8b8; max-width: 45%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ============================ 悬浮新建按钮 ============================ */
.vote-fab {
    position: fixed; right: 18px; bottom: 28px; z-index: 90;
    display: inline-flex; align-items: center; gap: 6px;
    height: 46px; padding: 0 20px; border: none; cursor: pointer;
    background: linear-gradient(135deg, #2A7AE5 0%, #145fc1 100%);
    color: #fff; font-size: 14px; font-weight: 600; border-radius: 24px; font-family: inherit;
    box-shadow: 0 6px 18px rgba(42,122,229,0.42);
}
.vote-fab:active { transform: scale(0.96); }
.vote-fab svg { width: 17px; height: 17px; }

/* ============================ 表单 (create) ============================ */
.vote-form-card {
    background: #fff; border: 1px solid #e3edf9; border-radius: 14px;
    margin: 12px; padding: 16px; box-shadow: 0 2px 8px rgba(24,70,128,0.04);
}
.vote-form-label { display: block; font-size: 13px; font-weight: 600; color: #36516d; margin: 0 0 8px; }
.vote-form-label .req { color: #e0402e; margin-left: 2px; }
.vote-form-label .opt { color: #9aa8b8; font-weight: 400; font-size: 12px; margin-left: 6px; }
.vote-input, .vote-textarea {
    width: 100%; box-sizing: border-box; border: 1px solid #dbe7f5; border-radius: 10px;
    padding: 10px 12px; font-size: 14px; color: #102033; font-family: inherit;
    background: #fbfdff; outline: none; -webkit-appearance: none; appearance: none;
}
.vote-input:focus, .vote-textarea:focus { border-color: #2A7AE5; background: #fff; }
.vote-textarea { min-height: 84px; resize: vertical; line-height: 1.5; }
.vote-form-row { margin-bottom: 18px; }
.vote-form-row:last-child { margin-bottom: 0; }
.vote-form-hint { font-size: 11.5px; color: #9aa8b8; margin-top: 6px; line-height: 1.5; }
.vote-form-row .flatpickr-input { background: #fbfdff; }
.vote-time-row { display: flex; gap: 10px; align-items: center; }
.vote-time-sep { color: #9aa8b8; font-size: 12px; flex-shrink: 0; }

/* 选项行 */
.vote-option-row { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.vote-option-no {
    flex-shrink: 0; width: 24px; height: 24px; border-radius: 50%;
    background: #e8f1ff; color: #2A7AE5; font-size: 12px; font-weight: 600;
    display: inline-flex; align-items: center; justify-content: center;
}
.vote-option-row .vote-input { flex: 1; }
.vote-option-del {
    flex-shrink: 0; width: 30px; height: 30px; border: none; cursor: pointer;
    background: #fdeeee; color: #e0402e; border-radius: 8px; font-size: 16px; line-height: 1;
    display: inline-flex; align-items: center; justify-content: center;
}
.vote-option-del:disabled { background: #f0f3f7; color: #b8c4d4; cursor: not-allowed; }
.vote-btn-addopt {
    width: 100%; border: 1px dashed #a9c8f0; background: #f4f9ff; color: #2A7AE5;
    border-radius: 10px; padding: 9px 0; font-size: 13px; cursor: pointer; font-family: inherit;
}
.vote-btn-addopt:disabled { color: #b8c4d4; border-color: #e0e9f5; cursor: not-allowed; }

/* 芯片单选组 (频次 / 结果可见性) */
.vote-chip-group { display: flex; flex-wrap: wrap; gap: 8px; }
.vote-chip {
    border: 1px solid #dbe7f5; background: #fbfdff; color: #36516d;
    border-radius: 18px; padding: 7px 14px; font-size: 13px; cursor: pointer; font-family: inherit;
    -webkit-appearance: none; appearance: none;
}
.vote-chip.active { background: #e8f1ff; border-color: #2A7AE5; color: #2A7AE5; font-weight: 600; }
.vote-perday-input { width: 76px; text-align: center; }

/* 附件上传 */
.vote-upload-box {
    border: 1px dashed #a9c8f0; border-radius: 12px; background: #f7faff;
    padding: 16px 12px; text-align: center; color: #6b7f97; font-size: 13px; cursor: pointer;
}
.vote-upload-box svg { width: 26px; height: 26px; margin: 0 auto 6px; color: #2A7AE5; display: block; }
.vote-upload-box:active { background: #eef5ff; }
.vote-file-item {
    display: flex; align-items: center; gap: 10px; background: #f4f9ff;
    border: 1px solid #dbe7f5; border-radius: 10px; padding: 10px 12px; margin-top: 10px;
}
.vote-file-item svg { width: 20px; height: 20px; color: #2A7AE5; flex-shrink: 0; }
.vote-file-name { flex: 1; font-size: 13px; color: #102033; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vote-file-del { border: none; background: none; color: #e0402e; font-size: 13px; cursor: pointer; flex-shrink: 0; padding: 4px; font-family: inherit; }
.upload-progress { display: none; margin-top: 10px; background: #eef2f8; border-radius: 6px; height: 8px; overflow: hidden; }
.upload-progress-bar { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #2A7AE5, #4d9af0); transition: width 0.2s; }

/* 表单底部提交 */
.vote-form-actions { margin: 4px 12px 28px; display: flex; gap: 10px; }
.vote-btn-primary {
    flex: 1; height: 46px; border: none; cursor: pointer; border-radius: 12px;
    background: linear-gradient(135deg, #2A7AE5 0%, #145fc1 100%);
    color: #fff; font-size: 15px; font-weight: 600; font-family: inherit;
    box-shadow: 0 4px 14px rgba(42,122,229,0.32);
}
.vote-btn-primary:disabled { background: #b9cbe4; box-shadow: none; cursor: not-allowed; }
.vote-btn-ghost {
    flex: 1; height: 46px; border: 1px solid #c9dbf2; cursor: pointer; border-radius: 12px;
    background: #fff; color: #36516d; font-size: 15px; font-family: inherit;
}

/* ============================ 详情页 ============================ */
.vote-hero {
    background: linear-gradient(135deg, #2A7AE5 0%, #145fc1 100%);
    margin: 12px; border-radius: 14px; padding: 18px 16px 16px; color: #fff;
    box-shadow: 0 6px 18px rgba(24,90,200,0.25);
}
.vote-hero-title { font-size: 18px; font-weight: 700; line-height: 1.5; }
.vote-hero-badges { margin-top: 8px; display: flex; gap: 8px; flex-wrap: wrap; }
.vote-hero-badges .vote-badge { background: rgba(255,255,255,0.18); color: #fff; }
.vote-hero-meta { margin-top: 10px; font-size: 12px; color: rgba(255,255,255,0.82); line-height: 1.7; }
.vote-hero-desc {
    margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,0.16);
    font-size: 13px; color: rgba(255,255,255,0.92); line-height: 1.6; white-space: pre-wrap; word-break: break-word;
}

/* 阅读门槛卡片 */
.vote-gate {
    background: #fff7e6; border: 1px solid #f5d9a8; border-radius: 14px;
    margin: 12px; padding: 14px 16px;
}
.vote-gate.done { background: #f0f9eb; border-color: #c8e8b8; }
.vote-gate-head { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: #8a5a00; }
.vote-gate.done .vote-gate-head { color: #2d7a2d; }
.vote-gate-head svg { width: 18px; height: 18px; flex-shrink: 0; }
.vote-gate-body { margin-top: 8px; font-size: 12.5px; color: #9c7a2e; line-height: 1.6; }
.vote-gate.done .vote-gate-body { color: #4d8a4d; }
.vote-gate-file {
    display: flex; align-items: center; gap: 10px; margin-top: 10px;
    background: #fff; border: 1px solid #f0e0bd; border-radius: 10px; padding: 10px 12px;
}
.vote-gate-file svg { width: 20px; height: 20px; color: #d9820a; flex-shrink: 0; }
.vote-gate-filename { flex: 1; font-size: 13px; color: #6b5320; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.vote-btn-read {
    flex-shrink: 0; border: none; cursor: pointer; border-radius: 18px; padding: 7px 16px;
    background: #d9820a; color: #fff; font-size: 13px; font-weight: 600; font-family: inherit;
}
.vote-btn-read:disabled { background: #e8c9a0; cursor: not-allowed; }
.vote-countdown-ring {
    width: 46px; height: 46px; margin: 12px auto 0; border-radius: 50%;
    background: conic-gradient(#d9820a var(--p, 0%), #f3e6c8 0);
    display: none; align-items: center; justify-content: center; position: relative;
}
.vote-countdown-ring::after {
    content: ''; position: absolute; inset: 5px; background: #fff; border-radius: 50%;
}
.vote-countdown-num { position: relative; z-index: 1; font-size: 16px; font-weight: 700; color: #d9820a; }

/* 选项列表 */
.vote-options { margin: 12px; }
.vote-option-item {
    display: flex; align-items: center; gap: 12px; background: #fff;
    border: 1.5px solid #e3edf9; border-radius: 12px; padding: 13px 14px; margin-bottom: 10px;
    cursor: pointer; transition: border-color 0.15s, background 0.15s;
}
.vote-option-item.checked { border-color: #2A7AE5; background: #f4f9ff; }
.vote-option-item.disabled { opacity: 0.55; cursor: not-allowed; }
.vote-option-box {
    flex-shrink: 0; width: 20px; height: 20px; border: 1.5px solid #c3d4ea; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center; background: #fff; box-sizing: border-box;
}
.vote-option-item.multi .vote-option-box { border-radius: 6px; }
.vote-option-box svg { width: 12px; height: 12px; color: #fff; opacity: 0; }
.vote-option-item.checked .vote-option-box { background: #2A7AE5; border-color: #2A7AE5; }
.vote-option-item.checked .vote-option-box svg { opacity: 1; }
.vote-option-text { flex: 1; font-size: 14px; color: #102033; line-height: 1.5; word-break: break-word; }

/* 提交栏 */
.vote-submit-bar {
    position: sticky; bottom: 0; z-index: 60; padding: 10px 12px 14px;
    background: linear-gradient(to top, #eef5ff 70%, rgba(238,245,255,0));
}
.vote-btn-submit {
    width: 100%; height: 46px; border: none; cursor: pointer; border-radius: 12px;
    background: linear-gradient(135deg, #2A7AE5 0%, #145fc1 100%);
    color: #fff; font-size: 15px; font-weight: 600; font-family: inherit;
    box-shadow: 0 4px 14px rgba(42,122,229,0.32);
}
.vote-btn-submit:disabled { background: #b9cbe4; box-shadow: none; cursor: not-allowed; }
.vote-submit-tip { text-align: center; font-size: 11.5px; color: #8595a8; margin-top: 8px; }

/* 结果统计 */
.vote-results { margin: 12px; }
.vote-result-row { background: #fff; border: 1px solid #e3edf9; border-radius: 12px; padding: 12px 14px; margin-bottom: 10px; }
.vote-result-head { display: flex; justify-content: space-between; align-items: center; font-size: 13.5px; color: #102033; }
.vote-result-pct { font-weight: 700; color: #2A7AE5; }
.vote-result-bar { margin-top: 8px; height: 10px; background: #edf3fb; border-radius: 6px; overflow: hidden; }
.vote-result-fill { display: block; height: 100%; width: 0; border-radius: 6px; background: linear-gradient(90deg, #4d9af0, #2A7AE5); transition: width 0.6s ease; }
.vote-result-row.top .vote-result-fill { background: linear-gradient(90deg, #f0b14d, #e08e0b); }
.vote-result-row.top .vote-result-pct { color: #d9820a; }
.vote-result-summary {
    display: flex; gap: 8px; margin-bottom: 12px;
}
.vote-result-summary .stat-cell {
    flex: 1; background: #fff; border: 1px solid #e3edf9; border-radius: 12px;
    text-align: center; padding: 12px 4px;
}
.stat-cell .stat-num { font-size: 19px; font-weight: 700; color: #2A7AE5; }
.stat-cell .stat-label { font-size: 11.5px; color: #8595a8; margin-top: 3px; }

/* 创建者/管理员操作区 */
.vote-admin-box { margin: 12px; background: #fff; border: 1px solid #e3edf9; border-radius: 14px; padding: 14px 16px; }
.vote-admin-title { font-size: 13px; font-weight: 600; color: #36516d; margin-bottom: 10px; }
.vote-admin-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.vote-btn-act {
    border: 1px solid #c9dbf2; background: #fff; color: #36516d;
    border-radius: 9px; padding: 8px 14px; font-size: 13px; cursor: pointer; font-family: inherit;
}
.vote-btn-act:active { background: #f0f6ff; }
.vote-btn-act.warn { border-color: #f0c98a; color: #d9820a; }
.vote-btn-act.danger { border-color: #f0b3ab; color: #e0402e; }
.vote-btn-act.primary { border-color: #2A7AE5; color: #2A7AE5; }

/* 海报弹层 */
.vote-modal { position: fixed; inset: 0; z-index: 200; display: none; }
.vote-modal.show { display: block; }
.vote-modal-mask { position: absolute; inset: 0; background: rgba(16,32,51,0.62); }
.vote-modal-body {
    position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
    width: 86%; max-width: 340px; max-height: 84vh; overflow: auto;
    background: #fff; border-radius: 16px; padding: 16px;
}
.vote-modal-title { text-align: center; font-size: 15px; font-weight: 600; color: #102033; margin-bottom: 12px; }
.vote-poster-img { width: 100%; border-radius: 10px; border: 1px solid #e3edf9; min-height: 160px; background: #f5f8fc; }
.vote-modal-tip { text-align: center; font-size: 12px; color: #8595a8; margin-top: 10px; }
.vote-modal-actions { display: flex; gap: 10px; margin-top: 12px; }
.vote-modal-actions .vote-btn-primary, .vote-modal-actions .vote-btn-ghost { height: 40px; font-size: 14px; }

/* ============================ 管理端明细弹层 ============================ */
.vote-sheet { position: fixed; inset: 0; z-index: 200; display: none; }
.vote-sheet.show { display: block; }
.vote-sheet-mask { position: absolute; inset: 0; background: rgba(16,32,51,0.55); }
.vote-sheet-panel {
    position: absolute; left: 0; right: 0; bottom: 0; margin: 0 auto; max-width: 600px;
    background: #fff; border-radius: 18px 18px 0 0; max-height: 76vh;
    display: flex; flex-direction: column;
}
.vote-sheet-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 16px 10px; border-bottom: 1px solid #eef3fa;
}
.vote-sheet-title { font-size: 15px; font-weight: 600; color: #102033; }
.vote-sheet-close { border: none; background: none; font-size: 22px; color: #9aa8b8; cursor: pointer; padding: 0 4px; line-height: 1; }
.vote-sheet-body { flex: 1; overflow: auto; padding: 6px 16px 16px; }
.vote-sub-row { padding: 11px 2px; border-bottom: 1px dashed #e8eef7; font-size: 13px; color: #102033; }
.vote-sub-row:last-child { border-bottom: none; }
.vote-sub-user { font-weight: 600; color: #36516d; }
.vote-sub-meta { color: #9aa8b8; font-size: 12px; margin-top: 3px; }
.vote-sub-opts { margin-top: 5px; color: #2A7AE5; font-size: 12.5px; line-height: 1.5; }
.vote-sheet-foot { padding: 10px 16px 14px; border-top: 1px solid #eef3fa; display: flex; gap: 10px; }
.vote-sheet-foot .vote-btn-primary, .vote-sheet-foot .vote-btn-ghost { height: 42px; font-size: 14px; }

/* 加载中/无更多 */
.vote-loading-more { text-align: center; padding: 14px; color: #9aa8b8; font-size: 12px; }


/* ============================ 选项初始值弹层 (detail, v20261015b) ============================ */
.vote-init-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 6px; }
.vote-init-meta { font-size: 12px; color: #9aa8b8; }
.vote-init-input-wrap { font-size: 12px; color: #6b7f97; display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; }
.vote-init-input {
    width: 76px; text-align: center; border: 1px solid #dbe7f5; border-radius: 8px;
    padding: 5px 6px; font-size: 13px; color: #102033; font-family: inherit; outline: none;
    -webkit-appearance: none; appearance: none;
}
.vote-init-input:focus { border-color: #2A7AE5; background: #fff; }

/* 导出令牌链接 (detail/manage, v20261015b) */
.vote-export-link {
    width: 100%; box-sizing: border-box; border: 1px solid #dbe7f5; border-radius: 10px;
    padding: 9px 10px; font-size: 12px; color: #36516d; background: #fbfdff;
    word-break: break-all; outline: none; font-family: inherit;
}
.vote-export-link:focus { border-color: #2A7AE5; background: #fff; }

/* PC 端适配 (>=640px): 容器加宽留白, 卡片投影增强 */
@media (min-width: 640px) {
    .vote-fab { right: calc(50% - 300px + 18px); }
    .vote-card:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(24,70,128,0.10); }
    .vote-modal-body { width: 380px; }
}

/* ============================ v20261027a 英文版 ============================ */

/* 中英切换条 (list 头部 tabs 上方 / detail 导航栏下方, 右对齐小胶囊) */
.vote-lang-bar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    padding: 8px 16px 0;
    font-size: 13px;
}
.vote-lang-bar a {
    color: #64748B;
    text-decoration: none;
    padding: 3px 12px;
    border-radius: 14px;
    background: #EEF2F7;
    line-height: 1.5;
}
.vote-lang-bar a.on {
    background: #2A7AE5;
    color: #fff;
    font-weight: 600;
}
.vote-lang-sep { color: #C4CBD6; }

/* 创建页英文输入 (标题/描述下方, 选项行内第二输入) */
.vote-input-en,
.vote-option-input-en {
    margin-top: 8px;
    border-left: 3px solid #C9A227;
    background: #FCFBF6;
}
.vote-option-inputs {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}
.vote-option-inputs .vote-option-input { width: 100%; }

/* v20261027b: 文件名可编辑输入框 (替代只读 span, 与图标/删除按钮同行) */
.vote-file-name-input {
    flex: 1;
    min-width: 0;
    border: 1px solid #D8E0EA;
    border-radius: 8px;
    padding: 8px 10px;
    font-size: 13px;
    color: #1F2937;
    background: #fff;
}
.vote-file-name-input:focus { border-color: #2A7AE5; outline: none; }
