mirror of
https://github.com/Sagit-chu/flvx.git
synced 2026-09-30 00:06:38 +08:00
qaq
1 line
28 KiB
CSS
1 line
28 KiB
CSS
*{margin:0;padding:0;box-sizing:border-box}body,html{width:100%;height:100%;overflow-x:hidden;-webkit-text-size-adjust:100%}#app{font-family:Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;height:100%;color:#333}@media screen and (max-width:768px){.el-table{width:100%!important;font-size:.8rem}.el-button{padding:8px 15px}.el-button,.el-form-item__label{font-size:.9rem}.el-dialog{width:95%!important;margin-top:15vh!important}.el-card{padding:5px!important}.el-card__body{padding:10px!important}.el-form-item__content,.el-input__inner,.el-table .cell{word-break:break-word!important;white-space:normal!important}.el-message-box{width:90%!important}}.el-container[data-v-ddcf7afa]{padding:0;margin:0;height:100%}.header-avatar[data-v-ddcf7afa]{float:right;display:flex;justify-content:space-around;align-items:center}.el-dropdown-link[data-v-ddcf7afa]{cursor:pointer}.el-header[data-v-ddcf7afa]{background-color:#2f54eb;color:#fff;line-height:50px}.el-aside[data-v-ddcf7afa]{color:#fff;line-height:200px}.el-main[data-v-ddcf7afa]{padding:0;height:calc(100vh - 100px)}a[data-v-ddcf7afa]{text-decoration:none}.el-menu-vertical-demo[data-v-ddcf7afa]{height:100%}.dialog-footer[data-v-ddcf7afa]{text-align:right}.el-dialog__body[data-v-ddcf7afa]{padding:20px}.el-form-item[data-v-ddcf7afa]{margin-bottom:22px}.login-container[data-v-354d4782]{height:100vh;width:100vw;position:relative;overflow:hidden;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center}.bg-decoration[data-v-354d4782]{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;z-index:1}.circle[data-v-354d4782]{position:absolute;border-radius:50%;background:hsla(0,0%,100%,.1);animation:float-354d4782 6s ease-in-out infinite}.circle-1[data-v-354d4782]{width:200px;height:200px;top:10%;left:10%;animation-delay:0s}.circle-2[data-v-354d4782]{width:150px;height:150px;top:60%;right:15%;animation-delay:2s}.circle-3[data-v-354d4782]{width:100px;height:100px;bottom:20%;left:20%;animation-delay:4s}@keyframes float-354d4782{0%,to{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-20px) rotate(180deg)}}.login-wrapper[data-v-354d4782]{position:relative;z-index:2;display:flex;justify-content:center;align-items:center;width:100%;max-width:500px}.login-form-container[data-v-354d4782]{width:100%;display:flex;align-items:center;justify-content:center;padding:40px}.login-form[data-v-354d4782]{width:100%;max-width:400px;background:hsla(0,0%,100%,.95);border-radius:20px;box-shadow:0 20px 40px rgba(0,0,0,.1);padding:40px;backdrop-filter:blur(10px)}.form-header[data-v-354d4782]{text-align:center;margin-bottom:40px}.form-title[data-v-354d4782]{font-size:2rem;font-weight:600;color:#1f2937;margin-bottom:.5rem}.form-subtitle[data-v-354d4782]{color:#6b7280;font-size:1rem;margin:0}.login-form-content[data-v-354d4782]{margin-bottom:30px}.input-wrapper[data-v-354d4782]{position:relative;margin-bottom:20px}.custom-input[data-v-354d4782] .el-input__inner{height:50px;border-radius:12px;border:2px solid #e5e7eb;font-size:16px;padding-left:45px;transition:all .3s ease;background:#f9fafb}.custom-input[data-v-354d4782] .el-input__inner:focus{border-color:#667eea;background:#fff;box-shadow:0 0 0 3px rgba(102,126,234,.1)}.custom-input[data-v-354d4782] .el-input__prefix{left:15px;color:#6b7280}.custom-input[data-v-354d4782] .el-input__suffix{right:15px}.login-btn-item[data-v-354d4782]{margin-bottom:0}.login-btn[data-v-354d4782]{width:100%;height:50px;border-radius:12px;font-size:16px;font-weight:600;background:linear-gradient(135deg,#667eea,#764ba2);border:none;transition:all .3s ease;box-shadow:0 4px 15px rgba(102,126,234,.4)}.login-btn[data-v-354d4782]:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(102,126,234,.6)}.login-btn[data-v-354d4782]:active{transform:translateY(0)}.form-footer[data-v-354d4782]{text-align:center;margin-top:30px}.copyright[data-v-354d4782]{color:#9ca3af;font-size:.875rem;margin:0}@media (max-width:768px){.login-form-container[data-v-354d4782]{padding:20px}.login-form[data-v-354d4782]{padding:30px 20px}.form-title[data-v-354d4782]{font-size:1.5rem}}.login-form-content[data-v-354d4782] .el-form-item__error{font-size:14px;color:#ef4444;margin-top:5px}.login-btn.is-loading[data-v-354d4782]{pointer-events:none}.package-container[data-v-6e2af254]{padding:20px;background-color:#f5f5f5;min-height:100vh}.page-header[data-v-6e2af254]{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding:20px;background:#fff;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,.1)}.page-title[data-v-6e2af254]{font-size:24px;font-weight:600;color:#333;margin:0}.overview-section[data-v-6e2af254]{margin-bottom:24px}.overview-card[data-v-6e2af254]{background:#fff;border-radius:12px;padding:24px;box-shadow:0 4px 12px rgba(0,0,0,.1)}.card-header[data-v-6e2af254]{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.card-header h3[data-v-6e2af254]{margin:0;font-size:20px;font-weight:600;color:#333}.overview-stats[data-v-6e2af254]{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:24px}.stat-item[data-v-6e2af254]{display:flex;align-items:center;padding:16px;background:#f8f9fa;border-radius:8px}.stat-icon[data-v-6e2af254]{width:48px;height:48px;border-radius:8px;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;margin-right:16px}.stat-icon i[data-v-6e2af254]{font-size:24px;color:#fff}.stat-content[data-v-6e2af254]{flex:1}.stat-value[data-v-6e2af254]{font-size:20px;font-weight:600;line-height:1.2}.stat-label[data-v-6e2af254]{font-size:14px;margin-top:4px}.progress-section[data-v-6e2af254]{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.progress-item[data-v-6e2af254]{padding:16px;background:#f8f9fa;border-radius:8px}.progress-header[data-v-6e2af254]{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-weight:500}.section-title[data-v-6e2af254]{font-size:18px;font-weight:600;color:#333;margin-bottom:16px}.forwards-section[data-v-6e2af254],.tunnels-section[data-v-6e2af254]{margin-bottom:24px}.tunnels-grid[data-v-6e2af254]{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:20px}.tunnel-card[data-v-6e2af254]{background:#fff;border-radius:12px;padding:20px;box-shadow:0 4px 12px rgba(0,0,0,.1);transition:transform .2s ease}.tunnel-card[data-v-6e2af254]:hover{transform:translateY(-2px)}.tunnel-header[data-v-6e2af254]{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.tunnel-name[data-v-6e2af254]{font-size:16px;font-weight:600;color:#333;display:flex;align-items:center}.tunnel-name i[data-v-6e2af254]{margin-right:8px;color:#409eff}.tunnel-status[data-v-6e2af254]{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.tunnel-stats[data-v-6e2af254]{margin-bottom:16px}.tunnel-stat-row[data-v-6e2af254]{display:flex;justify-content:space-between;margin-bottom:8px}.tunnel-stat-item[data-v-6e2af254]{flex:1;display:flex;justify-content:space-between;align-items:center}.tunnel-stat-item[data-v-6e2af254]:first-child{margin-right:16px}.stat-label[data-v-6e2af254]{font-size:12px;color:#666}.stat-value[data-v-6e2af254]{font-size:14px;font-weight:500;color:#333}.stat-value.used[data-v-6e2af254]{color:#f56c6c}.tunnel-progress[data-v-6e2af254]{margin-bottom:16px}.progress-mini[data-v-6e2af254]{margin-bottom:12px}.progress-mini[data-v-6e2af254]:last-child{margin-bottom:0}.progress-mini-header[data-v-6e2af254]{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px;font-size:12px;color:#666}.tunnel-footer[data-v-6e2af254]{border-top:1px solid #f0f0f0;padding-top:12px;margin-top:16px}.reset-time[data-v-6e2af254]{font-size:12px;color:#666;display:flex;align-items:center}.reset-time i[data-v-6e2af254]{margin-right:4px}.forwards-container[data-v-6e2af254]{background:#fff;border-radius:12px;padding:20px;box-shadow:0 4px 12px rgba(0,0,0,.1)}.forward-group[data-v-6e2af254]{margin-bottom:24px}.forward-group[data-v-6e2af254]:last-child{margin-bottom:0}.group-header[data-v-6e2af254]{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid #f0f0f0}.group-header h4[data-v-6e2af254]{margin:0;font-size:16px;font-weight:600;color:#333}.forward-list[data-v-6e2af254]{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}.forward-item[data-v-6e2af254]{display:flex;flex-direction:column;padding:16px;background:#fff;border-radius:12px;border-left:4px solid #409eff;box-shadow:0 2px 8px rgba(0,0,0,.1);transition:all .3s ease}.forward-item[data-v-6e2af254]:hover{background:#f8fafe;transform:translateY(-2px);box-shadow:0 6px 16px rgba(64,158,255,.2)}.forward-info[data-v-6e2af254]{width:100%;margin-bottom:8px}.forward-name[data-v-6e2af254]{font-size:16px;font-weight:600;color:#333;margin-bottom:8px;text-align:center}.forward-address[data-v-6e2af254]{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px;background:#f5f7fa;border-radius:8px;margin-bottom:8px}.address-source[data-v-6e2af254],.address-target[data-v-6e2af254]{font-size:15px;color:#333;font-family:Courier New,monospace;font-weight:600;text-align:center;padding:4px 12px;background:#ebeef5;border-radius:4px;min-width:120px}.address-source[data-v-6e2af254]{color:#52c41a}.address-target[data-v-6e2af254]{color:#1890ff}.address-arrow[data-v-6e2af254]{font-size:18px;color:#409eff;font-weight:700;margin:2px 0}.forward-traffic[data-v-6e2af254]{display:flex;justify-content:space-around;align-items:center;background:#f5f7fa;border-radius:8px;padding:8px}.traffic-item[data-v-6e2af254]{display:flex;flex-direction:column;align-items:center;flex:1}.traffic-label[data-v-6e2af254]{font-size:12px;color:#666;margin-bottom:4px;font-weight:500}.traffic-value[data-v-6e2af254]{font-size:14px;font-weight:600;padding:2px 6px;border-radius:4px}.traffic-value.in[data-v-6e2af254]{color:#52c41a;background:#f6ffed}.traffic-value.out[data-v-6e2af254]{color:#fa8c16;background:#fff7e6}.traffic-value.total[data-v-6e2af254]{color:#722ed1;background:#f9f0ff;font-weight:600}.empty-state[data-v-6e2af254]{grid-column:1/-1;display:flex;justify-content:center;align-items:center;height:200px}@media (max-width:768px){.package-container[data-v-6e2af254]{padding:10px}.page-header[data-v-6e2af254]{flex-direction:column;gap:15px;align-items:stretch}.forward-list[data-v-6e2af254],.overview-stats[data-v-6e2af254],.progress-section[data-v-6e2af254],.tunnels-grid[data-v-6e2af254]{grid-template-columns:1fr}.forward-item[data-v-6e2af254]{flex-direction:column;align-items:flex-start;gap:8px}.forward-info[data-v-6e2af254]{width:100%;margin-bottom:8px}.forward-traffic[data-v-6e2af254]{width:100%}}.user-container[data-v-1ce36542]{padding:20px;background-color:#f5f5f5;min-height:100vh}.page-header[data-v-1ce36542]{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding:20px;background:#fff;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,.1)}.page-title[data-v-1ce36542]{font-size:24px;font-weight:600;color:#333;margin:0}.header-actions[data-v-1ce36542]{display:flex;align-items:center}.add-btn[data-v-1ce36542]{border-radius:6px}.table-container[data-v-1ce36542]{background:#fff;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,.1);padding:20px}.pagination-container[data-v-1ce36542]{margin-top:20px;text-align:right}.dialog-footer[data-v-1ce36542]{text-align:right}.assign-section[data-v-1ce36542]{margin-bottom:20px}.assign-section h4[data-v-1ce36542],.permission-list-section h4[data-v-1ce36542]{margin-bottom:15px;color:#333;font-weight:600}.permission-list-section[data-v-1ce36542]{margin-top:20px}@media (max-width:768px){.user-container[data-v-1ce36542]{padding:10px}.page-header[data-v-1ce36542]{flex-direction:column;gap:15px;align-items:stretch}.header-actions[data-v-1ce36542]{flex-direction:column;gap:10px}.page-title[data-v-1ce36542],.pagination-container[data-v-1ce36542]{text-align:center}}.table-container[data-v-1ce36542] .el-table th{background-color:#fafafa}.table-container[data-v-1ce36542] .el-table--border td,.table-container[data-v-1ce36542] .el-table--border th{border-right:1px solid #ebeef5}.table-container[data-v-1ce36542] .el-button--mini{padding:5px 10px;margin:0 2px}.pagination-container[data-v-1ce36542] .el-pagination{padding:0}.flow-stats[data-v-1ce36542]{display:flex;flex-direction:column;gap:4px}.flow-item[data-v-1ce36542]{display:flex;justify-content:space-between;align-items:center}.flow-label[data-v-1ce36542]{font-size:12px;color:#909399;font-weight:500}.flow-value[data-v-1ce36542]{font-size:12px;font-weight:600}.flow-value.used[data-v-1ce36542]{color:#f56c6c}.flow-value.in[data-v-1ce36542]{color:#67c23a}.flow-value.out[data-v-1ce36542]{color:#e6a23c}.tunnel-flow-stats[data-v-1ce36542]{display:flex;flex-direction:column;gap:4px}.tunnel-flow-item[data-v-1ce36542]{display:flex;justify-content:space-between;align-items:center}.tunnel-flow-label[data-v-1ce36542]{font-size:12px;color:#909399;font-weight:500}.tunnel-flow-value[data-v-1ce36542]{font-size:12px;font-weight:600}.tunnel-flow-value.used[data-v-1ce36542]{color:#f56c6c}.tunnel-flow-usage[data-v-1ce36542]{margin-top:4px}.exp-time-expired[data-v-1ce36542]{color:#f56c6c;font-weight:700;text-decoration:line-through}.exp-time-soon[data-v-1ce36542]{color:#f56c6c;font-weight:600}.exp-time-mid[data-v-1ce36542]{color:#e6a23c;font-weight:500}.exp-time-long[data-v-1ce36542]{color:#67c23a;font-weight:500}.no-exptime[data-v-1ce36542],.no-reset-time[data-v-1ce36542]{color:#909399;font-style:italic}.node-container[data-v-0e93ac7f]{padding:20px;background-color:#f5f7fa;min-height:calc(100vh - 60px)}.page-header[data-v-0e93ac7f]{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;background:#fff;padding:20px 30px;border-radius:8px;box-shadow:0 2px 12px 0 rgba(0,0,0,.1)}.page-title[data-v-0e93ac7f]{font-size:24px;font-weight:600;color:#303133;margin:0;display:flex;align-items:center}.page-title i[data-v-0e93ac7f]{margin-right:8px;color:#409eff}.header-actions[data-v-0e93ac7f]{display:flex;align-items:center;gap:10px}.cards-container[data-v-0e93ac7f]{min-height:400px}.cards-grid[data-v-0e93ac7f]{display:grid;grid-template-columns:repeat(auto-fill,minmax(420px,1fr));gap:20px;margin-bottom:30px}.node-card[data-v-0e93ac7f]{background:#fff;border-radius:12px;padding:20px;box-shadow:0 2px 12px 0 rgba(0,0,0,.1);transition:all .3s ease;border-left:4px solid #ddd}.node-card[data-v-0e93ac7f]:hover{transform:translateY(-2px);box-shadow:0 4px 20px 0 rgba(0,0,0,.15)}.node-card.online[data-v-0e93ac7f]{border-left-color:#67c23a}.node-card.offline[data-v-0e93ac7f]{border-left-color:#f56c6c}.status-indicator[data-v-0e93ac7f]{display:flex;align-items:center;margin-bottom:15px}.status-dot[data-v-0e93ac7f]{width:8px;height:8px;border-radius:50%;margin-right:8px;animation:pulse-0e93ac7f 2s infinite}.status-dot.online[data-v-0e93ac7f]{background-color:#67c23a}.status-dot.offline[data-v-0e93ac7f]{background-color:#f56c6c}@keyframes pulse-0e93ac7f{0%{opacity:1}50%{opacity:.5}to{opacity:1}}.status-text[data-v-0e93ac7f]{font-size:12px;font-weight:500;color:#909399}.node-info[data-v-0e93ac7f]{margin-bottom:20px}.node-header[data-v-0e93ac7f]{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.node-name[data-v-0e93ac7f]{font-size:18px;font-weight:600;color:#303133;margin:0}.charts-container[data-v-0e93ac7f]{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:20px}.charts-container.offline-charts[data-v-0e93ac7f]{opacity:.6}.charts-container.offline-charts .chart-title[data-v-0e93ac7f]{color:#909399}.chart-item[data-v-0e93ac7f]{text-align:center}.chart-title[data-v-0e93ac7f]{font-size:13px;font-weight:500;color:#606266;margin-bottom:8px}.chart-wrapper[data-v-0e93ac7f]{background:#fafafa;border-radius:8px;padding:10px}.charts-container.offline-charts .chart-wrapper[data-v-0e93ac7f]{background:#f5f5f5}.traffic-stats[data-v-0e93ac7f]{display:grid;grid-template-columns:1fr 1fr;gap:10px}.traffic-stats.offline-stats[data-v-0e93ac7f]{opacity:.6}.traffic-stats.offline-stats .stat-header[data-v-0e93ac7f]{color:#909399}.traffic-stats.offline-stats .stat-header i[data-v-0e93ac7f]{color:#c0c4cc}.traffic-stats.offline-stats .ip-value[data-v-0e93ac7f],.traffic-stats.offline-stats .traffic-value[data-v-0e93ac7f]{color:#909399}.traffic-stats.offline-stats .stat-item[data-v-0e93ac7f]{background:#f5f5f5}.stat-item[data-v-0e93ac7f]{background:#fafafa;border-radius:6px;padding:10px}.stat-header[data-v-0e93ac7f]{display:flex;align-items:center;margin-bottom:6px;font-size:12px;color:#606266;font-weight:500}.stat-header i[data-v-0e93ac7f]{margin-right:6px;color:#409eff;width:14px}.stat-content[data-v-0e93ac7f]{text-align:center}.traffic-value[data-v-0e93ac7f]{font-size:13px;font-weight:600;color:#409eff;font-family:monospace}.traffic-value.total[data-v-0e93ac7f]{color:#67c23a;font-size:14px}.speed-info[data-v-0e93ac7f]{display:flex;justify-content:space-between;align-items:center;gap:8px}.speed-item[data-v-0e93ac7f]{display:flex;align-items:center;justify-content:center;gap:3px;flex:1}.speed-label[data-v-0e93ac7f]{font-size:12px;font-weight:700;color:#909399;width:12px}.speed-value[data-v-0e93ac7f]{font-size:11px;font-weight:600;color:#409eff;font-family:monospace}.ip-value[data-v-0e93ac7f]{font-size:12px;font-weight:600;color:#303133;font-family:monospace}.empty-state[data-v-0e93ac7f]{text-align:center;padding:60px 20px;color:#909399}.empty-state i[data-v-0e93ac7f]{font-size:64px;margin-bottom:20px;opacity:.5}.empty-state p[data-v-0e93ac7f]{font-size:16px;margin-bottom:20px}@media (max-width:768px){.cards-grid[data-v-0e93ac7f]{grid-template-columns:1fr;gap:15px}.charts-container[data-v-0e93ac7f],.traffic-stats[data-v-0e93ac7f]{grid-template-columns:1fr}.page-header[data-v-0e93ac7f]{flex-direction:column;align-items:stretch;gap:15px}.header-actions[data-v-0e93ac7f]{justify-content:center}.node-card[data-v-0e93ac7f]{padding:15px}}.node-actions[data-v-0e93ac7f]{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px;border-top:1px solid #ebeef5;padding-top:15px}@media (max-width:480px){.node-actions[data-v-0e93ac7f]{justify-content:center}.node-actions .el-button[data-v-0e93ac7f]{font-size:12px;padding:7px 12px}}.admin-info-panel[data-v-0e93ac7f]{margin-top:15px;padding:12px;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border-radius:8px;border-left:3px solid #007bff}.admin-title[data-v-0e93ac7f]{font-size:14px;font-weight:600;color:#007bff;margin-bottom:8px;display:flex;align-items:center}.admin-title[data-v-0e93ac7f]:before{content:"👑";margin-right:6px}.admin-details[data-v-0e93ac7f]{display:grid;gap:6px}.admin-item[data-v-0e93ac7f]{display:flex;justify-content:space-between;align-items:center;padding:4px 0;border-bottom:1px dotted #dee2e6}.admin-item[data-v-0e93ac7f]:last-child{border-bottom:none}.admin-item .label[data-v-0e93ac7f]{font-size:12px;color:#6c757d;font-weight:500}.admin-item .value[data-v-0e93ac7f]{font-size:12px;color:#495057;font-family:monospace;background:hsla(0,0%,100%,.6);padding:2px 6px;border-radius:4px}.admin-info[data-v-0e93ac7f]{font-size:11px;color:#007bff;font-weight:500}.tunnel-container[data-v-0242d058]{padding:20px;background-color:#f5f7fa;min-height:calc(100vh - 60px)}.page-header[data-v-0242d058]{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;background:#fff;padding:20px 30px;border-radius:8px;box-shadow:0 2px 12px 0 rgba(0,0,0,.1)}.page-title[data-v-0242d058]{font-size:24px;font-weight:600;color:#303133;margin:0;display:flex;align-items:center}.page-title i[data-v-0242d058]{margin-right:8px;color:#409eff}.header-actions[data-v-0242d058]{display:flex;align-items:center;gap:10px}.cards-container[data-v-0242d058]{min-height:400px}.cards-grid[data-v-0242d058]{display:grid;grid-template-columns:repeat(auto-fit,minmax(600px,1fr));gap:20px;margin-bottom:30px;align-items:start}.tunnel-card[data-v-0242d058]{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 12px 0 rgba(0,0,0,.1);transition:all .3s ease;border-left:4px solid #409eff;position:relative;height:auto;min-height:320px;display:flex;flex-direction:column}.tunnel-card[data-v-0242d058]:hover{transform:translateY(-2px);box-shadow:0 4px 20px 0 rgba(0,0,0,.15)}.tunnel-card.disabled[data-v-0242d058]{opacity:.6;background:#f5f7fa!important;border-left-color:#c0c4cc!important}.tunnel-card.disabled .flow-icon[data-v-0242d058]{background:#c0c4cc!important}.tunnel-card.disabled .tunnel-name[data-v-0242d058]{color:#909399!important}.tunnel-card.disabled .detail-item .value[data-v-0242d058],.tunnel-card.disabled .flow-label[data-v-0242d058]{color:#c0c4cc!important}.tunnel-card.disabled[data-v-0242d058]:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(192,196,204,.1);pointer-events:none;border-radius:12px}.tunnel-header[data-v-0242d058]{margin-bottom:20px;display:flex;align-items:center;justify-content:space-between}.tunnel-name[data-v-0242d058]{font-size:18px;font-weight:600;color:#303133;margin:0;flex:1}.tunnel-badges[data-v-0242d058]{display:flex;gap:8px;align-items:center}.tunnel-flow[data-v-0242d058]{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;padding:20px;background:#f8f9fa;border-radius:8px;overflow-x:auto}.flow-item[data-v-0242d058]{display:flex;flex-direction:column;align-items:center;min-width:100px;flex-shrink:0}.flow-icon[data-v-0242d058]{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:8px;font-size:18px;color:#fff}.client .flow-icon[data-v-0242d058]{background:#909399}.entrance .flow-icon[data-v-0242d058]{background:#409eff}.exit .flow-icon[data-v-0242d058]{background:#f56c6c}.target .flow-icon[data-v-0242d058]{background:#67c23a}.flow-label[data-v-0242d058]{font-size:14px;font-weight:500;color:#606266;margin-bottom:8px}.flow-detail[data-v-0242d058]{text-align:center}.detail-item[data-v-0242d058]{font-size:12px;color:#909399;margin-bottom:2px}.detail-item .label[data-v-0242d058]{font-weight:500}.detail-item .value[data-v-0242d058]{color:#303133;font-family:monospace}.flow-arrow[data-v-0242d058]{color:#c0c4cc;font-size:16px;margin:0 10px}.tunnel-meta[data-v-0242d058]{display:flex;align-items:center;margin-bottom:15px;font-size:12px;color:#909399}.meta-item[data-v-0242d058]{display:flex;align-items:center;margin-right:20px}.meta-item i[data-v-0242d058]{margin-right:5px}.tunnel-actions[data-v-0242d058]{display:flex;justify-content:flex-end;gap:10px;padding-top:15px;margin-top:auto}.form-hint[data-v-0242d058]{color:#909399;font-size:12px;margin-top:5px;line-height:1.4}.empty-state[data-v-0242d058]{text-align:center;padding:60px 20px;color:#909399}.empty-state i[data-v-0242d058]{font-size:64px;margin-bottom:20px;opacity:.5}.empty-state p[data-v-0242d058]{font-size:16px;margin-bottom:20px}@media (max-width:768px){.cards-grid[data-v-0242d058]{grid-template-columns:1fr;gap:15px}.tunnel-flow[data-v-0242d058]{flex-direction:column;gap:15px}.flow-arrow[data-v-0242d058]{transform:rotate(90deg)}.page-header[data-v-0242d058]{flex-direction:column;align-items:stretch;gap:15px}.header-actions[data-v-0242d058]{justify-content:center}.tunnel-card[data-v-0242d058]{padding:15px}.tunnel-name[data-v-0242d058]{margin-right:80px}}.forward-container[data-v-066b1068]{padding:20px;background-color:#f5f5f5;min-height:100vh}.page-header[data-v-066b1068]{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding:20px;background-color:#fff;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.1)}.page-title[data-v-066b1068]{margin:0;color:#303133;font-size:24px;font-weight:600}.header-actions[data-v-066b1068]{display:flex;align-items:center}.add-btn[data-v-066b1068]{border-radius:6px;font-weight:500}.table-container[data-v-066b1068]{padding:20px}.form-hint[data-v-066b1068]{font-size:12px;color:#909399;margin-top:5px}.tunnel-info[data-v-066b1068]{margin-top:10px}.dialog-footer[data-v-066b1068]{text-align:right}.el-table[data-v-066b1068]{border-radius:8px}.el-dialog[data-v-066b1068]{border-radius:12px}.el-dialog__title[data-v-066b1068]{font-weight:600}.el-button--mini[data-v-066b1068],.el-tag[data-v-066b1068]{border-radius:4px}.el-input-group__prepend[data-v-066b1068]{background-color:#f5f7fa;border-color:#dcdfe6;color:#606266}.cards-container[data-v-066b1068]{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px;padding:10px 0}.forward-card[data-v-066b1068]{background-color:#fff;border-radius:12px;box-shadow:0 4px 12px rgba(0,0,0,.1);padding:24px;transition:all .3s ease;border:1px solid #f0f0f0}.forward-card[data-v-066b1068]:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.15)}.card-header[data-v-066b1068]{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid #f0f0f0}.card-title[data-v-066b1068]{font-size:16px;font-weight:600;color:#303133;display:flex;align-items:center}.card-title i[data-v-066b1068]{margin-right:8px;color:#409eff}.card-actions[data-v-066b1068]{display:flex;align-items:center;gap:8px}.card-body[data-v-066b1068]{margin-top:16px}.info-row[data-v-066b1068]{display:flex;justify-content:space-between;margin-bottom:16px}.info-row[data-v-066b1068]:last-child{margin-bottom:0}.info-item[data-v-066b1068]{flex:1;display:flex;flex-direction:column}.info-item.full-width[data-v-066b1068]{flex:1}.info-item[data-v-066b1068]:not(:last-child){margin-right:20px}.label[data-v-066b1068]{font-size:12px;color:#909399;margin-bottom:4px;font-weight:500}.value[data-v-066b1068]{font-size:14px;color:#303133;font-weight:500}.empty-state[data-v-066b1068]{grid-column:1/-1;display:flex;justify-content:center;align-items:center;height:300px}.flow-stats-mini[data-v-066b1068]{display:flex;gap:8px}.flow-stat-item[data-v-066b1068]{flex:1;display:flex;flex-direction:column}.flow-stat-label[data-v-066b1068]{font-size:12px;color:#909399;margin-bottom:4px;font-weight:500}.flow-stat-value[data-v-066b1068]{font-size:14px;color:#303133;font-weight:500}.flow-stat-value.in[data-v-066b1068]{color:#67c23a}.flow-stat-value.out[data-v-066b1068]{color:#e6a23c}.flow-stat-value.total[data-v-066b1068]{color:#f56c6c}.el-switch[data-v-066b1068]{margin-right:8px}.el-switch__label[data-v-066b1068]{color:#606266;font-weight:500}.el-switch__label.is-active[data-v-066b1068]{color:#13ce66}.card-actions .el-switch[data-v-066b1068]{transform:scale(.9)}.el-switch.is-disabled[data-v-066b1068]{opacity:.6}.el-switch.is-disabled .el-switch__label[data-v-066b1068]{color:#c0c4cc!important}.speed-limit-container[data-v-c8993518]{padding:20px;background-color:#f5f5f5;min-height:100vh}.page-header[data-v-c8993518]{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding:20px;background-color:#fff;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.1)}.page-title[data-v-c8993518]{margin:0;color:#303133;font-size:24px;font-weight:600;display:flex;align-items:center}.page-title i[data-v-c8993518]{margin-right:12px;font-size:28px;color:#409eff}.header-actions[data-v-c8993518]{display:flex;align-items:center}.add-btn[data-v-c8993518]{border-radius:6px;font-weight:500}.table-container[data-v-c8993518]{background-color:#fff;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.1);padding:20px}.form-hint[data-v-c8993518]{font-size:12px;color:#909399;margin-top:5px}.dialog-footer[data-v-c8993518]{text-align:right}.empty-state[data-v-c8993518]{text-align:center;padding:40px}.el-table[data-v-c8993518]{border-radius:8px}.el-dialog[data-v-c8993518]{border-radius:12px}.el-dialog__title[data-v-c8993518]{font-weight:600}.el-button--mini[data-v-c8993518],.el-tag[data-v-c8993518]{border-radius:4px}.text-muted[data-v-c8993518]{color:#909399;font-style:italic}@media (max-width:768px){.speed-limit-container[data-v-c8993518]{padding:10px}.page-header[data-v-c8993518]{flex-direction:column;gap:15px;align-items:stretch}.header-actions[data-v-c8993518]{flex-direction:column;gap:10px}.page-title[data-v-c8993518]{text-align:center}} |