/* ═════════════════════════════════════════════
 * common/css/form.css — 全站统一表单样式
 * 提取自各模块重复定义的基础 class
 * 各模块 CSS 可覆盖 width/gap 等尺寸差异
 * ═════════════════════════════════════════════ */

/* ── 表单行 ── */
.form-row { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; font-size: 13px; }
.form-row:last-child { margin-bottom: 0; }

/* ── 表单内 select 统一：用项目字体，不用系统字体 ── */
.form-row select { font-family: "MiSans", sans-serif; font-weight: 400; }

/* ── 标签 ── */
.form-row .lbl { color: var(--color-brand); font-weight: 600; white-space: nowrap; min-width: 60px; }

/* ── 求测人输入框 ── */
.seeker-input { padding: 4px 8px; border: 1px solid var(--color-border); border-radius: 4px; font-size: 13px; background: var(--color-input-bg, #fff); color: var(--color-text); font-family: inherit; }
.seeker-input:focus { outline: none; border-color: var(--color-gold); }

/* ── 日期输入框 ── */
.date-input { padding: 4px 6px; border: 1px solid var(--color-border); border-radius: 4px; font-size: 13px; text-align: center; width: 40px; background: var(--color-input-bg, #fff); color: var(--color-text); font-family: inherit; }
.date-input.year { width: 55px; }
.date-input:focus { outline: none; border-color: var(--color-gold); }

/* ── 日期后缀文字（年月日时分）── */
.dt-suf { font-size: 13px; color: var(--color-text-sec); }

/* ── 公历/农历切换组 ── */
.cal-group { display: inline-flex; border: 1px solid var(--color-border); border-radius: 4px; overflow: hidden; }
.cal-group label { display: flex; align-items: center; padding: 4px 10px; font-size: 12px; cursor: pointer; background: var(--color-panel, #fff); color: var(--color-text-sec); border-right: 1px solid var(--color-border); transition: background .15s, color .15s; white-space: nowrap; }
.cal-group label:last-child { border-right: none; }
.cal-group label.active { background: var(--color-brand); color: #fff; }
.cal-group input[type="radio"] { display: none; }
.cal-group .mob-only { display: none; }

/* ── 盘式/方法按钮组 ── */
.panshi-group, .method-radio-group { display: flex; gap: 0; flex-wrap: wrap; }
.panshi-group label, .method-radio-group label { display: flex; align-items: center; gap: 3px; padding: 3px 8px; border: 1px solid var(--color-border); border-right: none; cursor: pointer; font-size: 12px; background: var(--color-panel); color: var(--color-text-sec); transition: background .15s; white-space: nowrap; }
.panshi-group label:first-child, .method-radio-group label:first-child { border-radius: 4px 0 0 4px; }
.panshi-group label:last-child, .method-radio-group label:last-child { border-radius: 0 4px 4px 0; border-right: 1px solid var(--color-border); }
.panshi-group label.active, .method-radio-group label.active { background: var(--color-brand); color: #fff; border-color: var(--color-brand); }
.panshi-group input[type="radio"], .method-radio-group input[type="radio"] { display: none; }

/* ── 类型切换组（小号，奇门用时家/日家等）── */
.panshi-type-group { display: flex; gap: 0; flex-wrap: wrap; }
.panshi-type-group label { padding: 2px 6px; border: 1px solid var(--color-border); border-right: none; font-size: 11px; cursor: pointer; background: var(--color-panel); color: var(--color-text-sec); transition: background .15s, color .15s; }
.panshi-type-group label:first-child { border-radius: 3px 0 0 3px; }
.panshi-type-group label:last-child { border-radius: 0 3px 3px 0; border-right: 1px solid var(--color-border); }
.panshi-type-group label.active { background: var(--color-brand); color: #fff; border-color: var(--color-brand); }
.panshi-type-group input[type="radio"] { display: none; }

/* ── 手机端底部操作栏 ── */
.mobile-actions-outside { display: none; }

/* ── dark 模式 ── */
html[data-theme="dark"] .seeker-input,
html[data-theme="dark"] .date-input { background: var(--color-input-bg); color: var(--color-text); border-color: #9a8ab8; }

/* ═════════════════════════════════════════════
 * Mob 端统一尺寸
 * ═════════════════════════════════════════════ */
body.mode-mobile .date-input { padding: 8px 2px; font-size: 15px; border-radius: 6px; text-align: center; }
body.mode-mobile .date-input.year { padding: 8px 2px; }
body.mode-mobile .seeker-input { padding: 10px 8px; font-size: 15px; border-radius: 6px; }
body.mode-mobile .btn-now { font-size: 14px; padding: 7px 10px; border-radius: 6px; }
body.mode-mobile select { font-family: "MiSans", sans-serif; font-weight: 400; }
body.mode-mobile .cs-display { min-height: unset; height: auto; padding: 6px 8px; font-size: 14px; border-radius: 4px; line-height: 1.4; }

/* Mob dark */
html[data-theme="dark"] body.mode-mobile .date-input,
html[data-theme="dark"] body.mode-mobile .seeker-input { background: var(--color-input-bg); color: var(--color-text); border-color: #9a8ab8; }