/* ── Forms Module ──────────────────────────────────────────── */

.forms-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 16px;
  margin-top: 16px;
}

.form-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 20px;
  cursor: pointer;
  transition: box-shadow .15s, border-color .15s;
}
.form-card:hover {
  border-color: var(--primary);
  box-shadow: 0 2px 8px rgba(26,123,138,.1);
}

.form-card-category {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--primary);
  font-family: var(--font-display);
  margin-bottom: 6px;
}

.form-card-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--text);
  font-family: var(--font-display);
  line-height: 1.3;
}

.form-card-id {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 6px;
  font-family: monospace;
}

/* Detail Panel */
.form-detail-panel {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 24px;
}

.form-detail-header h2 {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 700;
  color: var(--text);
  margin: 0 0 4px;
}

.form-detail-header .detail-category {
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--primary);
  font-family: var(--font-display);
}

/* QR Section */
.qr-section {
  text-align: center;
  padding: 24px 0;
}

.qr-code-box {
  display: inline-block;
  padding: 16px;
  background: #fff;
  border: 2px solid var(--border);
  border-radius: 12px;
  margin-bottom: 16px;
}

.qr-code-box canvas {
  display: block;
}

.form-link-row {
  display: flex;
  gap: 8px;
  max-width: 500px;
  margin: 0 auto;
}

.form-link-row .form-input {
  flex: 1;
  font-size: 13px;
  color: var(--text-light);
}

/* Results */
.results-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.results-count {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  font-family: var(--font-display);
  margin-right: auto;
}

.results-table-wrap {
  overflow-x: auto;
}

.results-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.results-table th {
  background: var(--bg-alt);
  font-weight: 600;
  font-family: var(--font-display);
  text-align: left;
  padding: 10px 12px;
  border-bottom: 2px solid var(--border);
  white-space: nowrap;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--text-light);
}

.results-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border-light);
  color: var(--text);
  max-width: 250px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.results-table tr:hover td {
  background: var(--bg);
}

.text-muted {
  color: var(--text-muted);
  font-size: 14px;
}

/* Sub-tabs */
.subtab-content {
  margin-top: 16px;
}

/* Loading spinner */
.results-loading {
  text-align: center;
  padding: 40px;
  color: var(--text-muted);
}

/* Branch badge on form cards */
.form-card-branch {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 10px;
  background: var(--primary-xlight);
  color: var(--primary-dark);
  margin-top: 8px;
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: .04em;
}

/* Combined QR section (multiple branch forms) */
.combined-qr-section {
  display: flex;
  gap: 32px;
  justify-content: center;
  flex-wrap: wrap;
  padding: 16px 0;
}

.combined-qr-item {
  text-align: center;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 20px;
  min-width: 280px;
}

.combined-qr-item h4 {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  margin: 0 0 12px;
}

.qr-box-sub {
  display: inline-block;
  padding: 12px;
  background: #fff;
  border: 2px solid var(--border);
  border-radius: 12px;
  margin-bottom: 12px;
}

.qr-box-sub canvas {
  display: block;
}

.combined-qr-item .form-link-row {
  max-width: 100%;
}

.combined-qr-item .form-link-input {
  width: 100%;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm, 6px);
  font-size: 12px;
  color: var(--text-light);
  background: var(--white);
}

/* Branch badge in results table */
.branch-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 10px;
  background: var(--primary-xlight);
  color: var(--primary-dark);
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: .04em;
  white-space: nowrap;
}

/* Staff role: hide corporate tab and admin-only elements */
body.role-staff .staff-hide { display: none !important; }