/* JP Form Helper Styles */
.jpfhr-container {
  --bg:#ffffff;
  --text:#1f2937;
  --muted:#6b7280;
  --primary:#2563eb;
  --primary-ghost:#e0e7ff;
  --border:#e5e7eb;
  --success:#10b981;
  --warn:#f59e0b;
  --danger:#ef4444;

  background: var(--bg);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
  max-width: 980px;
  margin: 24px auto;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

.jpfhr-header h2 {
  margin: 0 0 6px;
  font-size: 22px;
  line-height: 1.2;
}
.jpfhr-header p { margin: 0 0 10px; color: var(--muted); }

.jpfhr-toolbar {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 12px;
}
.jpfhr-field label { display:block; font-size:13px; color:var(--muted); margin-bottom:4px;}
.jpfhr-field select, .jpfhr-field input[type="text"] {
  width: 100%; border:1px solid var(--border); border-radius:10px; padding:10px; font-size:14px; background:#fff;
}
.jpfhr-toggle { align-self:end; grid-column: 1 / -1; font-size: 13px; color: var(--muted); }
.jpfhr-toggle input { margin-right: 6px; }

.jpfhr-inputs { display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.jpfhr-card { border:1px solid var(--border); border-radius:12px; padding:12px; background:#fff; }
.jpfhr-card h3 { margin:0 0 8px; font-size:16px; }
.jpfhr-text { width:100%; min-height:140px; border:1px solid var(--border); border-radius:10px; padding:10px; font-size:14px; resize:vertical; }
.jpfhr-filehint { font-size:12px; color:var(--muted); margin-top:6px; }

.jpfhr-actions { display:flex; flex-wrap:wrap; gap:8px; margin:14px 0; }
.jpfhr-btn {
  background: var(--primary);
  color: #fff;
  border: 0;
  border-radius: 999px;
  padding: 10px 16px;
  font-size: 14px;
  cursor: pointer;
}
.jpfhr-btn.ghost { background: var(--primary-ghost); color: #1e3a8a; }
.jpfhr-btn[disabled] { opacity:.5; cursor:not-allowed; }

.jpfhr-disclaimer {
  font-size: 12px;
  color: var(--muted);
  border-left: 3px solid var(--warn);
  padding-left: 10px;
  margin: 8px 0 16px;
}

.jpfhr-output { border-top:1px dashed var(--border); padding-top: 10px; }
.jpfhr-loader {
  width: 28px; height: 28px; border-radius: 50%;
  border: 3px solid var(--primary-ghost);
  border-top-color: var(--primary);
  animation: spin 1s linear infinite;
  margin: 8px auto;
}
@keyframes spin { to { transform: rotate(360deg) } }
.jpfhr-skeleton { text-align:center; color:var(--muted); }

.jpfhr-report h3 { margin: 4px 0 10px; font-size:18px; }
.jpfhr-fieldcard {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px;
  margin-bottom: 10px;
  background: #fff;
}
.jpfhr-fieldcard .top {
  display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:6px;
}
.jpfhr-fieldcard .labels .ja { font-weight:600; }
.jpfhr-fieldcard .labels .sub { font-size:12px; color:var(--muted); }
.jpfhr-fieldcard .badge .req { background:#ecfeff; color:#0e7490; padding:4px 8px; border-radius:999px; font-size:11px; }
.jpfhr-fieldcard .badge .opt { background:#fef3c7; color:#92400e; padding:4px 8px; border-radius:999px; font-size:11px; }
.jpfhr-fieldcard .how { margin:6px 0; }
.jpfhr-fieldcard .example, .jpfhr-fieldcard .notes, .jpfhr-fieldcard .pv { font-size:13px; color:#374151; margin-top:6px; }
.jpfhr-empty { color: var(--muted); padding: 12px; border:1px dashed var(--border); border-radius:10px; text-align:center; }

/* Responsive */
@media (max-width: 840px) {
  .jpfhr-toolbar { grid-template-columns: 1fr; }
  .jpfhr-inputs { grid-template-columns: 1fr; }
}
/* Print */
@media print {
  .jpfhr-actions, .jpfhr-inputs, .jpfhr-toolbar, .jpfhr-disclaimer { display:none !important; }
  .jpfhr-container { box-shadow:none; border:0; }
}


/* Fillable Form */
.jpfhr-section-title { margin: 14px 0 6px; font-size: 16px; }
.jpfhr-fillwrap { border:1px solid var(--border); border-radius:12px; padding:12px; background:#fff; }
.jpfhr-fillform { display:grid; grid-template-columns: 1fr 1fr; gap:12px; }
.jpfhr-ff-field { display:flex; flex-direction:column; gap:6px; }
.jpfhr-ff-field label { font-weight:600; font-size:13px; }
.jpfhr-ff-field input[type="text"],
.jpfhr-ff-field input[type="email"],
.jpfhr-ff-field input[type="tel"],
.jpfhr-ff-field input[type="number"],
.jpfhr-ff-field input[type="date"],
.jpfhr-ff-field select,
.jpfhr-ff-field textarea {
  width:100%; border:1px solid var(--border); border-radius:10px; padding:10px; font-size:14px; background:#fff;
}
.jpfhr-ff-field textarea { min-height:90px; resize:vertical; }
.jpfhr-ff-group { display:flex; flex-wrap:wrap; gap:8px; }
.jpfhr-ff-inline { display:inline-flex; align-items:center; gap:6px; border:1px solid var(--border); padding:6px 10px; border-radius:999px; background:#fafafa; }
.jpfhr-signature-box { height:100px; border:1px dashed var(--border); border-radius:8px; background:#f9fafb; }
.jpfhr-ff-notes { color:var(--muted); font-size:12px; }

.jpfhr-ff-actions { display:flex; gap:8px; margin-top:12px; }

@media (max-width: 840px) {
  .jpfhr-fillform { grid-template-columns: 1fr; }
}

/* Print only form helper */
@media print {
  .jpfhr-print-form-only .jpfhr-report,
  .jpfhr-print-form-only .jpfhr-header,
  .jpfhr-print-form-only .jpfhr-toolbar,
  .jpfhr-print-form-only .jpfhr-inputs,
  .jpfhr-print-form-only .jpfhr-actions,
  .jpfhr-print-form-only .jpfhr-disclaimer,
  .jpfhr-print-form-only .jpfhr-section-title:first-of-type { display:none !important; }
  .jpfhr-print-form-only .jpfhr-container { border:0; box-shadow:none; }
}