/* driver-form.css —— 司机表单「专业版 / 商业版」观感（2026.v2807）
   光年要求 ✗：原表单 7 列挤成一排、标签与输入无层次、按钮通栏 ⇒ 不够大方、不够明确 ✗
   本文件只服务【司机新增/编辑弹窗】✓ 全部规则以 .df- 前缀 / #adm-modal 作用域限定 ✓ 不影响其它页面 ✓
   设计要点 ✓：
     · 分区卡片（基本信息 / 联系与住址 / 证件信息 / 用工与结算 / 离职状态 ✓）
     · 4 栏栅格 + 14/18px 呼吸间距 ✓ 窄屏自动 3/2/1 栏 ✓
     · 统一的 40px 输入高度、10px 圆角、清晰焦点态 ✓
     · 两个到期日各带**阈值化**红黄灯（驾驶证 90 天 / 资格证 30 天 ✓ 网络查证的真实换证规则 ✓）
     · 底部按钮：白底描边（次要）+ 品牌蓝实心（主要）✓ 右对齐、固定最小宽度 ✓ 不再通栏 ✗ */

/* ===== 分区 ===== */
#adm-modal .df-sec { margin: 0 0 18px; }
#adm-modal .df-sec:last-of-type { margin-bottom: 6px; }
#adm-modal .df-sec-h { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; }
#adm-modal .df-sec-t { font-size: 14px; font-weight: 700; color: #0f172a; letter-spacing: .4px; white-space: nowrap; position: relative; padding-left: 11px; }
#adm-modal .df-sec-t::before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 4px; height: 15px; border-radius: 3px; background: linear-gradient(180deg, #2563eb, #38bdf8); }
#adm-modal .df-sec-line { flex: 1; height: 1px; background: linear-gradient(90deg, #e6ebf3, rgba(230, 235, 243, 0)); }

/* ===== 栅格：4 栏（覆盖弹窗自动多栏注入的紧排 ✗）===== */
#adm-modal .df-grid { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 14px 18px !important; align-items: start; }
#adm-modal .df-f { display: flex !important; flex-direction: column; gap: 6px; min-width: 0; }
#adm-modal .df-f.df-w2 { grid-column: span 2 !important; }
@media (max-width: 1240px) { #adm-modal .df-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
@media (max-width: 940px)  { #adm-modal .df-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } #adm-modal .df-f.df-w2 { grid-column: span 2 !important; } }
@media (max-width: 640px)  { #adm-modal .df-grid { grid-template-columns: 1fr !important; } #adm-modal .df-f.df-w2 { grid-column: span 1 !important; } }

/* ===== 标签与输入 ===== */
#adm-modal .df-f > label { font-size: 12.5px; font-weight: 600; color: #475569; letter-spacing: .2px; display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
#adm-modal .df-f > label .req { color: #dc2626; font-weight: 700; }
#adm-modal .df-hint { font-weight: 400; color: #94a3b8; font-size: 11.5px; letter-spacing: 0; }
#adm-modal .df-f input[type=text],
#adm-modal .df-f select,
#adm-modal .df-f .dw-wrap { height: 40px; border: 1px solid #dde3ec; border-radius: 10px; background: #fff; font-size: 14px; color: #0f172a; padding: 0 12px; width: 100%; box-sizing: border-box; transition: border-color .15s, box-shadow .15s, background .15s; }
#adm-modal .df-f select { appearance: none; -webkit-appearance: none; background-image: linear-gradient(45deg, transparent 50%, #94a3b8 50%), linear-gradient(135deg, #94a3b8 50%, transparent 50%); background-position: calc(100% - 18px) 17px, calc(100% - 13px) 17px; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; padding-right: 34px; }
#adm-modal .df-f input[type=text]:hover, #adm-modal .df-f select:hover, #adm-modal .df-f .dw-wrap:hover { border-color: #c3ccdb; }
#adm-modal .df-f input[type=text]:focus, #adm-modal .df-f select:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37, 99, 235, .13); background: #fff; }
#adm-modal .df-f input::placeholder { color: #b6c0cf; }
#adm-modal .df-f input[type=text]:disabled, #adm-modal .df-f select:disabled { background: #f6f8fb; color: #94a3b8; }

/* ===== 到期提示（阈值化红黄灯 ✓）===== */
#adm-modal .df-exp { display: flex; align-items: center; gap: 7px; font-size: 12px; color: #94a3b8; min-height: 18px; line-height: 1.35; }
#adm-modal .df-exp b { font-weight: 600; color: #64748b; letter-spacing: .2px; }
#adm-modal .df-exp .df-dot { width: 7px; height: 7px; border-radius: 50%; background: #cbd5e1; flex: 0 0 auto; }
#adm-modal .df-exp.is-warn { color: #b45309; }
#adm-modal .df-exp.is-warn b { color: #b45309; }
#adm-modal .df-exp.is-warn .df-dot { background: #f59e0b; box-shadow: 0 0 0 3px rgba(245, 158, 11, .16); }
#adm-modal .df-exp.is-bad { color: #dc2626; font-weight: 600; }
#adm-modal .df-exp.is-bad b { color: #dc2626; }
#adm-modal .df-exp.is-bad .df-dot { background: #dc2626; box-shadow: 0 0 0 3px rgba(220, 38, 38, .16); }
#adm-modal .df-exp .df-exp-tip { color: #a8b3c4; }

/* ===== 底部说明信息面板 ===== */
#adm-modal .df-foot-note { margin: 4px 0 2px; padding: 11px 13px; border-radius: 10px; background: #f7f9fc; border: 1px solid #e8eef7; border-left: 3px solid #93c5fd; color: #5b6b81; font-size: 12.5px; line-height: 1.6; }

/* ===== 按钮：次要（白底描边） + 主要（品牌蓝实心），右对齐、固定最小宽 ✓ ===== */
#adm-modal .modal-actions { gap: 12px !important; }
#adm-modal .modal-actions .btn { width: auto !important; min-width: 108px !important; height: 40px !important; padding: 0 20px !important; border-radius: 10px !important; font-size: 14px !important; font-weight: 600 !important; letter-spacing: .3px; box-shadow: none; transition: background .15s, border-color .15s, box-shadow .15s, transform .06s; }
#adm-modal .modal-actions .df-btn-ghost { background: #fff !important; border: 1px solid #d8e0ea !important; color: #475569 !important; }
#adm-modal .modal-actions .df-btn-ghost:hover { background: #f6f8fb !important; border-color: #c3ccdb !important; }
#adm-modal .modal-actions .df-btn-primary { background: linear-gradient(180deg, #2f74f6, #2563eb) !important; border: 1px solid #2563eb !important; color: #fff !important; box-shadow: 0 2px 6px rgba(37, 99, 235, .24) !important; }
#adm-modal .modal-actions .df-btn-primary:hover { background: linear-gradient(180deg, #2563eb, #1d4ed8) !important; box-shadow: 0 4px 12px rgba(37, 99, 235, .3) !important; }
#adm-modal .modal-actions .df-btn-primary:active { transform: translateY(1px); }

/* ===== 标题更专业（只在司机弹窗生效 ✓ 靠"存在 .df-sec"判别 ✓ 不影响其它弹窗 ✓）===== */
#adm-modal .modal-box:has(.df-sec) .modal-title { text-align: left !important; padding-left: 2px !important; font-size: 20px !important; letter-spacing: .5px; }
#adm-modal .modal-box:has(.df-sec) { background: linear-gradient(180deg, #fbfdff, #fff 120px); }

/* 2026.v5574：v5573 的规则已移至 responsive-driver.css（司机端必载）——
   本文件司机端并不加载，为避免误导，原有规则已在此清除 ✓ */