/* =============================================================================
   POTAODE回收堂 表单公共样式（form.css）
   在 common.css 之后加载。依据：08／11／19_表单规格书
   移动优先·点击区不小于44px·type优化·无障碍
============================================================================= */

.form-wrap{max-width:680px;margin-inline:auto}

/* 互惠横幅（免费·30秒） */
.form-reassure{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:0 0 var(--sp-5)}
.form-reassure li{display:inline-flex;align-items:center;gap:6px;background:var(--c-surface);border:1px solid var(--c-border);border-radius:999px;padding:6px 14px;font-size:13px;font-weight:700;color:var(--c-text)}
.form-reassure li::before{content:"○";color:var(--c-success)}

/* 步骤进度 */
.steps-progress{display:flex;gap:8px;margin:0 0 var(--sp-6);counter-reset:s}
.steps-progress li{flex:1;text-align:center;font-size:12px;color:var(--c-text-muted);padding-top:28px;position:relative}
.steps-progress li::before{counter-increment:s;content:counter(s);position:absolute;top:0;left:50%;transform:translateX(-50%);width:24px;height:24px;border-radius:999px;background:var(--c-border);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}
.steps-progress li[aria-current="step"]{color:var(--c-text);font-weight:700}
.steps-progress li[aria-current="step"]::before{background:var(--c-cta)}
.steps-progress li[data-done="true"]::before{background:var(--c-primary)}

/* 字段 */
.field{margin-bottom:var(--sp-5)}
.field > label,.field-legend{display:block;font-weight:700;font-size:15px;margin-bottom:8px}
.req{display:inline-block;margin-left:6px;font-size:11px;font-weight:700;color:#fff;background:var(--c-cta);border-radius:4px;padding:2px 6px;vertical-align:middle}
.opt{display:inline-block;margin-left:6px;font-size:11px;font-weight:700;color:var(--c-text-sub);background:var(--c-surface);border:1px solid var(--c-border);border-radius:4px;padding:2px 6px}
.field-hint{font-size:12px;color:var(--c-text-muted);margin:0 0 8px}

/* 输入框（点击区不小于44px·16px） */
.input,select.input,textarea.input{
  width:100%;min-height:48px;padding:12px 14px;font-size:16px;font-family:var(--font-jp);
  color:var(--c-text);background:var(--c-bg);border:1.5px solid var(--c-border);border-radius:var(--radius-btn);
  -webkit-appearance:none;appearance:none;line-height:1.6;
}
textarea.input{min-height:120px;resize:vertical}
select.input{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2352525B' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px}
.input:focus{border-color:var(--c-primary);outline:2px solid var(--c-cta);outline-offset:1px}
.input[aria-invalid="true"]{border-color:var(--c-negative);background:#fff7f6}

/* 地址等横向排列 */
.field-row{display:grid;gap:12px;grid-template-columns:1fr}
@media (min-width:481px){ .field-row--zip{grid-template-columns:160px 1fr} .field-row--2{grid-template-columns:1fr 1fr} }

/* 期望日期时间 */
.wish{display:grid;gap:8px;grid-template-columns:1fr;margin-bottom:8px}
@media (min-width:481px){ .wish{grid-template-columns:1fr 160px} }
.wish__label{font-size:13px;font-weight:700;color:var(--c-text-sub);grid-column:1/-1}

/* 复选·单选（确保点击区域） */
.choice{display:flex;align-items:flex-start;gap:10px;min-height:44px;padding:10px;border:1.5px solid var(--c-border);border-radius:var(--radius-btn);cursor:pointer;background:var(--c-bg)}
.choice + .choice{margin-top:8px}
.choice input{width:22px;height:22px;margin-top:2px;flex:0 0 auto;accent-color:var(--c-cta)}
.choice span{font-size:15px}
.choice a{text-decoration:underline}
.choice--inline{display:inline-flex;margin-right:8px}

/* 错误信息 */
.field-error{display:none;color:var(--c-negative);font-size:13px;font-weight:700;margin:6px 0 0}
.field-error::before{content:"⚠ ";}
.field.has-error .field-error{display:block}

/* 蜜罐（对视觉与屏幕阅读器隐藏） */
.hp-field{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* 确认页一览 */
.confirm-summary{border:1px solid var(--c-border);border-radius:var(--radius-card);overflow:hidden;margin-bottom:var(--sp-5)}
.confirm-summary dl{margin:0}
.confirm-summary div{display:grid;grid-template-columns:1fr;gap:2px;padding:14px 16px;border-bottom:1px solid var(--c-border)}
.confirm-summary div:last-child{border-bottom:0}
.confirm-summary dt{font-size:13px;font-weight:700;color:var(--c-text-sub);margin:0}
.confirm-summary dd{margin:0;font-size:16px;white-space:pre-wrap;word-break:break-word}
@media (min-width:481px){ .confirm-summary div{grid-template-columns:200px 1fr;gap:16px;align-items:baseline} }

/* 按钮行 */
.form-actions{display:grid;gap:12px;grid-template-columns:1fr;margin-top:var(--sp-5)}
@media (min-width:481px){ .form-actions--2{grid-template-columns:1fr 2fr} }

/* 安全补充说明（保管期限） */
.form-note{font-size:12px;color:var(--c-text-muted);margin-top:var(--sp-4);line-height:1.7}
.form-note a{text-decoration:underline}

/* 提交中状态 */
.btn[aria-busy="true"]{opacity:.7;pointer-events:none}
