/* PLAR staff module — administrative, matches CursorUI tokens */
.plar-app { max-width: 1200px; margin: 0 auto; padding: var(--spacing-xl); min-height: 100vh; }
.plar-app .app-container { height: auto; min-height: auto; overflow: visible; max-width: none; box-shadow: none; }
.plar-header { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: var(--spacing-md); margin-bottom: var(--spacing-xl); }
.plar-title { font-size: 1.5rem; font-weight: 700; color: var(--text-primary); }
.plar-sub { color: var(--text-secondary); font-size: 0.875rem; margin-top: var(--spacing-xs); }
.plar-nav { display: flex; flex-wrap: wrap; gap: var(--spacing-sm); align-items: center; }
.plar-nav a { text-decoration: none; }
.plar-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: var(--spacing-md); margin-bottom: var(--spacing-xl); }
.plar-card { background: var(--bg-primary); border: 1px solid var(--border-color); border-radius: var(--border-radius); padding: var(--spacing-md); box-shadow: var(--shadow-sm); }
.plar-card-label { font-size: 0.75rem; font-weight: 600; color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.04em; }
.plar-card-value { font-size: 1.75rem; font-weight: 700; color: var(--text-primary); margin-top: var(--spacing-xs); }
.plar-section { margin-bottom: var(--spacing-xl); }
.plar-section h2 { font-size: 1rem; font-weight: 600; color: var(--text-secondary); margin-bottom: var(--spacing-md); text-transform: uppercase; letter-spacing: 0.04em; }
.plar-table-wrap { overflow-x: auto; border-radius: var(--border-radius); border: 1px solid var(--border-color); background: var(--bg-primary); }
.plar-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.plar-table th, .plar-table td { padding: var(--spacing-sm) var(--spacing-md); text-align: left; border-bottom: 1px solid var(--border-color); vertical-align: top; }
.plar-table th { background: var(--bg-secondary); color: var(--text-secondary); font-weight: 600; white-space: nowrap; }
.plar-table tr:last-child td { border-bottom: none; }
.plar-table tbody tr { cursor: pointer; }
.plar-table tbody tr:hover { background: var(--bg-secondary); }
.plar-err { background: #fef2f2; color: #991b1b; padding: var(--spacing-md); border-radius: var(--border-radius-sm); margin-bottom: var(--spacing-md); font-size: 0.875rem; display: none; }
.plar-err.show { display: block; }
.plar-msg { font-size: 0.8125rem; margin-top: var(--spacing-sm); padding: var(--spacing-sm); border-radius: var(--border-radius-sm); display: none; }
.plar-msg.ok { display: block; background: #ecfdf5; color: #047857; }
.plar-msg.err { display: block; background: #fef2f2; color: #991b1b; }
.plar-muted { color: var(--text-tertiary); font-size: 0.8125rem; }
.plar-filters { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: var(--spacing-md); margin-bottom: var(--spacing-lg); align-items: end; }
.plar-filters label { display: block; font-size: 0.8125rem; font-weight: 500; color: var(--text-secondary); margin-bottom: var(--spacing-xs); }
.plar-filters input, .plar-filters select { width: 100%; padding: var(--spacing-sm) var(--spacing-md); border: 1px solid var(--border-color); border-radius: var(--border-radius-sm); font-family: inherit; font-size: 0.875rem; background: var(--bg-primary); color: var(--text-primary); box-sizing: border-box; }
.plar-actions { display: flex; flex-wrap: wrap; gap: var(--spacing-sm); margin-bottom: var(--spacing-md); }
.badge { display: inline-block; font-size: 0.75rem; font-weight: 600; padding: 0.2rem 0.5rem; border-radius: 999px; line-height: 1.2; }
.badge-ws-draft { background: var(--bg-tertiary); color: var(--text-secondary); }
.badge-ws-submitted { background: #eff6ff; color: #1d4ed8; }
.badge-ws-assigned { background: #eef2ff; color: #4338ca; }
.badge-ws-review { background: #fffbeb; color: #b45309; }
.badge-ws-info { background: #fef3c7; color: #92400e; }
.badge-ws-resubmit { background: #e0e7ff; color: #3730a3; }
.badge-ws-decision { background: #dbeafe; color: #1e40af; }
.badge-ws-done { background: #ecfdf5; color: #047857; }
.badge-ws-cancel { background: #f3f4f6; color: #6b7280; }
.badge-wr-pending { background: var(--bg-tertiary); color: var(--text-secondary); }
.badge-wr-approved { background: #ecfdf5; color: #047857; }
.badge-wr-partial { background: #d1fae5; color: #065f46; }
.badge-wr-denied { background: #fef2f2; color: #991b1b; }
.badge-wr-withdrawn { background: #f3f4f6; color: #4b5563; }
.plar-detail-layout { display: grid; grid-template-columns: minmax(260px, 320px) 1fr; gap: var(--spacing-lg); align-items: start; }
@media (max-width: 900px) { .plar-detail-layout { grid-template-columns: 1fr; } }
.plar-summary { background: var(--bg-primary); border: 1px solid var(--border-color); border-radius: var(--border-radius); padding: var(--spacing-lg); font-size: 0.875rem; position: sticky; top: var(--spacing-md); }
.plar-summary dl { margin: 0; }
.plar-summary dt { color: var(--text-secondary); font-size: 0.75rem; font-weight: 600; margin-top: var(--spacing-sm); }
.plar-summary dt:first-child { margin-top: 0; }
.plar-summary dd { margin: 0.125rem 0 0 0; color: var(--text-primary); }
.plar-tabs { display: flex; flex-wrap: wrap; gap: 0; border-bottom: 1px solid var(--border-color); margin-bottom: var(--spacing-lg); }
.plar-tab { padding: var(--spacing-sm) var(--spacing-md); border: none; background: transparent; font-family: inherit; font-size: 0.875rem; font-weight: 500; color: var(--text-secondary); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.plar-tab:hover { color: var(--text-primary); }
.plar-tab.active { color: var(--text-primary); border-bottom-color: var(--primary-color); }
.plar-tab-panel { display: none; }
.plar-tab-panel.active { display: block; }
.plar-form-grid { display: grid; gap: var(--spacing-md); max-width: 40rem; }
.plar-form-grid label { font-size: 0.8125rem; font-weight: 500; color: var(--text-secondary); }
.plar-form-grid input, .plar-form-grid select, .plar-form-grid textarea { width: 100%; padding: var(--spacing-sm) var(--spacing-md); border: 1px solid var(--border-color); border-radius: var(--border-radius-sm); font-family: inherit; font-size: 0.875rem; background: var(--bg-primary); color: var(--text-primary); box-sizing: border-box; }
.plar-form-grid textarea { min-height: 6rem; }

/* Learner PLAR claim editor (learner-application.html): heavier, easier-to-scan inputs */
#claimsEditor select,
#claimsEditor input[type="text"],
#claimsEditor input[type="url"],
#claimsEditor input[type="number"],
#claimsEditor textarea {
  padding: 0.55rem 0.75rem;
  border: 1px solid rgba(15, 23, 42, 0.18);
  border-radius: 10px;
  background: #fff;
  color: var(--text-primary);
  font-size: 0.9375rem;
  line-height: 1.35;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03);
}

#claimsEditor label {
  color: var(--text-secondary);
  font-weight: 600;
  letter-spacing: 0.01em;
}

#claimsEditor select:focus,
#claimsEditor input:focus,
#claimsEditor textarea:focus {
  outline: none;
  border-color: rgba(37, 99, 235, 0.55);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

#claimsEditor textarea {
  min-height: 7.5rem;
}

/* Evidence rows use compact inline styles in JS; this makes inputs feel consistent. */
#claimsEditor .ev-row select,
#claimsEditor .ev-row input,
#claimsEditor .ev-row textarea {
  background: #fff;
}

/* Vault upload row inside each evidence block */
#claimsEditor .plar-ev-upload {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  padding: 0.5rem 0.65rem;
  margin: 0.25rem 0 0.35rem;
  border-radius: 10px;
  border: 1px dashed rgba(15, 23, 42, 0.2);
  background: rgba(255, 255, 255, 0.65);
}

#claimsEditor .plar-ev-upload .ev-file {
  flex: 1 1 12rem;
  min-width: 0;
  font-size: 0.875rem;
}

#claimsEditor .plar-ev-upload .ev-upload-msg {
  flex: 1 1 100%;
  margin: 0;
}
.plar-detail-actions { display: flex; flex-wrap: wrap; gap: var(--spacing-sm); margin-bottom: var(--spacing-lg); }
.modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.4); display: none; align-items: center; justify-content: center; z-index: 2000; padding: var(--spacing-md); }
.modal-overlay.show { display: flex; }
.modal-box { background: var(--bg-primary); border-radius: var(--border-radius); max-width: 520px; width: 100%; max-height: 90vh; overflow: auto; box-shadow: var(--shadow-lg); border: 1px solid var(--border-color); }
.modal-head { padding: var(--spacing-md) var(--spacing-lg); border-bottom: 1px solid var(--border-color); font-weight: 600; }
.modal-body { padding: var(--spacing-lg); }
.modal-foot { padding: var(--spacing-md) var(--spacing-lg); border-top: 1px solid var(--border-color); display: flex; justify-content: flex-end; gap: var(--spacing-sm); }
.timeline { border-left: 2px solid var(--border-color); margin-left: 0.5rem; padding-left: var(--spacing-md); }
.timeline-item { margin-bottom: var(--spacing-md); position: relative; }
.timeline-item::before { content: ''; position: absolute; left: calc(-1 * var(--spacing-md) - 5px); top: 0.35rem; width: 8px; height: 8px; border-radius: 50%; background: var(--primary-color); }

.btn-secondary {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xs);
  padding: var(--spacing-sm) var(--spacing-md);
  border-radius: var(--border-radius-sm);
  background: var(--bg-tertiary);
  color: var(--text-primary);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 500;
  border: 1px solid var(--border-color);
  cursor: pointer;
  font-family: inherit;
}
.btn-secondary:hover { background: var(--border-color); }
.btn-primary {
  display: inline-flex;
  align-items: center;
  padding: var(--spacing-sm) var(--spacing-md);
  border-radius: var(--border-radius-sm);
  background: var(--primary-color);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 600;
  border: none;
  cursor: pointer;
  font-family: inherit;
}
.btn-primary:hover { background: var(--primary-dark); }
.btn-ghost {
  background: transparent;
  border: 1px solid var(--border-color);
  color: var(--text-primary);
}