/* ============================================================================
 * 客户台专属样式
 * 登录壳、开关、表格、按钮等通用件全部来自 shared/design-system.css，此处只放
 * 客户台独有的东西，避免两端各写一套。
 * ==========================================================================*/

/* 诊断问题列表 */
.issue-list { display: flex; flex-direction: column; }
.issue { display: flex; gap: var(--space-3); align-items: flex-start; padding: var(--space-3) 0; border-bottom: 1px solid var(--border); }
.issue:last-child { border-bottom: none; }
.issue__body { flex: 1; min-width: 0; }
.issue__title { color: var(--text); font-weight: 600; }
.issue__fix { color: var(--text-2); font-size: 13px; margin-top: 2px; }

/* 首页业务闭环：用数据驱动下一步，而不是让客户在菜单里猜路径。 */
.workflow-panel { margin-top: var(--space-5); }
.workflow-head { margin: 0 0 var(--space-3); }
.workflow-head h2 { margin: 0; }
.workflow-head p { margin: 5px 0 0; }
.workflow-progress-label { color: var(--primary); font-weight: 800; font-size: 14px; white-space: nowrap; }
.workflow-steps { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; margin-top: var(--space-4); }
.workflow-step { min-width: 0; display: flex; align-items: flex-start; gap: 8px; padding: 11px 9px; text-align: left; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-2); color: var(--text); cursor: pointer; transition: border-color .2s, transform .2s, background .2s; }
.workflow-step:hover { transform: translateY(-2px); border-color: var(--primary); }
.workflow-step__index { flex: 0 0 22px; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: var(--border); color: var(--text-2); font-size: 11px; font-weight: 800; }
.workflow-step__body { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.workflow-step__body strong { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.workflow-step__body small { color: var(--text-2); line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.workflow-step--done { border-color: color-mix(in srgb, var(--ok) 42%, var(--border)); }
.workflow-step--done .workflow-step__index { background: var(--ok); color: #fff; }
.workflow-step--current { border-color: var(--primary); box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 15%, transparent); }
.workflow-step--current .workflow-step__index { background: var(--primary); color: #fff; }
.workflow-next { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: var(--space-4); padding: 13px 15px; border-left: 3px solid var(--primary); background: color-mix(in srgb, var(--primary) 8%, transparent); }
.workflow-next div { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.workflow-next span { color: var(--text-2); font-size: 13px; }
@media (max-width: 1000px) { .workflow-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 640px) { .workflow-head { align-items: flex-start; } .workflow-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } .workflow-next { align-items: flex-start; flex-direction: column; } .workflow-next .btn { width: 100%; } }

/* 首轮使用引导：把真实 readiness 转成客户可执行的下一步。 */
.hero-help { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 10px; color: var(--text-2); font-size: 12px; }
.hero-help .btn { color: var(--primary); }
.eyebrow--small { padding: 4px 9px; font-size: 11px; }
.smart-guide { margin-top: var(--space-5); padding: var(--space-5); border-left: 3px solid var(--primary); }
.smart-guide__head { display: flex; justify-content: space-between; gap: var(--space-4); align-items: flex-start; }
.smart-guide__head h2 { margin-top: 10px; font-size: 21px; }
.smart-guide__head p { margin-top: 4px; }
.smart-guide__body { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); margin-top: var(--space-4); padding: 14px 16px; background: color-mix(in srgb, var(--primary) 7%, transparent); border: 1px solid var(--border); border-radius: var(--radius-sm); }
.smart-guide__hint { display: flex; gap: 10px; align-items: flex-start; min-width: 0; color: var(--text-2); font-size: 13px; }
.smart-guide__dot { width: 8px; height: 8px; margin-top: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--primary); box-shadow: 0 0 0 4px var(--primary-soft); }
.smart-guide__facts { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-top: 14px; color: var(--text-2); font-size: 12px; }
.smart-guide__facts b { color: var(--text); font-size: 14px; margin-right: 4px; }
.guide-modal { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.guide-modal__step { display: flex; gap: 12px; padding: 16px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface-2); }
.guide-modal__step > span { color: var(--primary); font: 800 12px/1 var(--font-mono); padding-top: 3px; }
.guide-modal__step strong { font-size: 15px; }
.guide-modal__step p { margin-top: 6px; color: var(--text-2); font-size: 13px; line-height: 1.65; }
@media (max-width: 640px) { .smart-guide__head, .smart-guide__body { flex-direction: column; align-items: flex-start; } .smart-guide__body .btn { width: 100%; } .guide-modal { grid-template-columns: 1fr; } }