/* * form_filler.css — AI PDF Form Filler's dynamically-generated fields * form + AI-assist panel. Reuses page_swap.css and pdf_doctor.css for the * shared dropzone/loading-spinner/password-box/error-box/fix-section/ * fix-result pieces (see this page's - both load together). Only * the pieces genuinely unique to this tool - the AI-assist panel and the * per-field-type form controls - are defined here. */ .ff-ai-panel { border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); padding: 14px 16px; margin: 14px 0 20px; } .ff-ai-title { display: flex; align-items: center; gap: 6px; margin: 0 0 8px; font-size: 14px; font-weight: 600; color: var(--text); } .ff-ai-optional { font-weight: 400; color: var(--text-muted); font-size: 12.5px; } .ff-ai-panel textarea { width: 100%; padding: 9px 11px; border: 1px solid var(--border); border-radius: 8px; background: var(--card); color: var(--text); font-size: 13.5px; font-family: inherit; resize: vertical; box-sizing: border-box; } .ff-ai-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 8px; flex-wrap: wrap; } .ff-ai-note { margin: 8px 0 0; font-size: 12px; color: var(--text-muted); } .ff-fields-form { display: flex; flex-direction: column; gap: 14px; margin: 10px 0 20px; } .ff-field { display: flex; flex-direction: column; gap: 6px; border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; background: var(--card); } .ff-field.ff-field-readonly { background: var(--surface-soft); opacity: 0.75; } .ff-field.ff-field-checkbox { flex-direction: row; align-items: center; } .ff-field-label { font-size: 13.5px; font-weight: 600; color: var(--text); display: flex; align-items: center; gap: 6px; } .ff-field-required { color: var(--danger); font-weight: 700; } .ff-field-page { font-size: 11px; font-weight: 500; color: var(--text-muted); } .ff-field-just-suggested { display: inline-flex; align-items: center; gap: 3px; font-size: 10.5px; font-weight: 600; color: var(--accent); background: var(--surface-soft); padding: 1px 6px; border-radius: 5px; } .ff-field input[type="text"], .ff-field textarea, .ff-field select { padding: 8px 10px; border: 1px solid var(--border); border-radius: 7px; background: var(--surface-soft); color: var(--text); font-size: 13.5px; font-family: inherit; box-sizing: border-box; width: 100%; } .ff-field textarea { resize: vertical; min-height: 60px; } .ff-field input[readonly], .ff-field select[disabled] { cursor: not-allowed; } .ff-field-checkbox input[type="checkbox"] { width: 18px; height: 18px; flex-shrink: 0; order: -1; margin-right: 4px; } @media (max-width: 640px) { .ff-ai-row { flex-direction: column; align-items: stretch; } }