/* =============================================================================
   System portal — Tests config + Coach Certifications
   Two prefixes: stp- (System Tests Page) and scp- (System Cert Page).
   border-radius: 0 everywhere. System portal accent #534AB7.
   ============================================================================= */

/* Shared shell */
.stp-page,
.scp-page {
  padding: 24px;
  max-width: 1200px;
  margin: 0 auto;
  font-size: 14px;
  color: #1a1a18;
}
.stp-header,
.scp-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 20px;
  gap: 16px;
}
.stp-title,
.scp-title { font-size: 18px; font-weight: 500; }
.stp-subtitle,
.scp-subtitle { font-size: 12px; color: #666; margin-top: 4px; }
.stp-loading,
.scp-loading {
  padding: 24px;
  text-align: center;
  font-size: 12px;
  color: #888;
}
.stp-error,
.scp-error {
  padding: 14px;
  background: #FCEBEB;
  border: 0.5px solid #f5c0c0;
  font-size: 12px;
  color: #791F1F;
}

/* Buttons */
.stp-btn,
.scp-btn {
  padding: 7px 14px;
  font-size: 13px;
  border: 0.5px solid #aaa;
  background: transparent;
  color: #1a1a18;
  cursor: pointer;
  font-family: inherit;
  border-radius: 0;
}
.stp-btn:hover,
.scp-btn:hover { background: #f0f0ee; }
.stp-btn-primary,
.scp-btn-primary {
  background: #534AB7;
  border-color: #534AB7;
  color: #fff;
}
.stp-btn-primary:hover,
.scp-btn-primary:hover { background: #3F38A0; border-color: #3F38A0; }
.stp-btn-sm {
  padding: 4px 10px;
  font-size: 12px;
}

/* =============================================================================
   TESTS CONFIG TABLE
   ============================================================================= */
.stp-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  background: #fff;
  border: 0.5px solid #e0e0dc;
}
.stp-table th {
  text-align: left;
  padding: 9px 10px;
  font-size: 10px;
  font-weight: 500;
  color: #666;
  background: #f9f9f7;
  border-bottom: 0.5px solid #e0e0dc;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.stp-table td {
  padding: 10px;
  border-bottom: 0.5px solid #e0e0dc;
  vertical-align: middle;
}
.stp-table tr:last-child td { border-bottom: none; }
.stp-table tr.editing td { background: #F5F4FB; }
.stp-table tr.inactive td { color: #aaa; }

.stp-pill {
  display: inline-flex;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: 500;
  background: #f0f0ee;
  color: #666;
}
.stp-pill-active { background: #E1F5EE; color: #085041; }
.stp-pill-inactive { background: #f0f0ee; color: #888; }
.stp-pill-always-shared { background: #EEEDFE; color: #3C3489; }
.stp-pill-shared-by-default { background: #E6F1FB; color: #0C447C; }
.stp-pill-private-by-default { background: #FAEEDA; color: #633806; }

.stp-readonly-block {
  background: #f9f9f7;
  border: 0.5px dashed #ccc;
  padding: 8px 10px;
  margin-top: 8px;
  font-size: 11px;
  color: #666;
}
.stp-readonly-block strong {
  color: #1a1a18;
  font-weight: 500;
  display: inline-block;
  min-width: 110px;
}

/* Inline edit form (expands inside the row) */
.stp-edit-form {
  padding: 14px;
  background: #F5F4FB;
  border-top: 0.5px solid #534AB7;
  border-bottom: 0.5px solid #534AB7;
}
.stp-edit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}
.stp-edit-grid label {
  font-size: 11px;
  color: #555;
  display: block;
  margin-bottom: 4px;
}
.stp-edit-grid input,
.stp-edit-grid select,
.stp-edit-grid textarea {
  width: 100%;
  padding: 6px 10px;
  border: 0.5px solid #ccc;
  background: #fff;
  font-size: 13px;
  font-family: inherit;
  border-radius: 0;
  color: #1a1a18;
}
.stp-edit-actions {
  display: flex;
  gap: 8px;
}

/* =============================================================================
   COACH CERTIFICATIONS PAGE
   ============================================================================= */
.scp-coaches-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  background: #fff;
  border: 0.5px solid #e0e0dc;
  margin-bottom: 24px;
}
.scp-coaches-table th {
  text-align: left;
  padding: 9px 10px;
  font-size: 10px;
  font-weight: 500;
  color: #666;
  background: #f9f9f7;
  border-bottom: 0.5px solid #e0e0dc;
  text-transform: uppercase;
}
.scp-coaches-table td {
  padding: 10px;
  border-bottom: 0.5px solid #e0e0dc;
}
.scp-coaches-table tr:last-child td { border-bottom: none; }
.scp-coaches-table tr.flagged td { background: #FCEBEB; }
.scp-coaches-table tr.flagged td:first-child { border-left: 2px solid #E24B4A; }
.scp-coaches-table tr:hover td { background: #f9f9f7; cursor: pointer; }
.scp-coaches-table tr.flagged:hover td { background: #f8dbdb; }

.scp-detail {
  background: #fff;
  border: 0.5px solid #e0e0dc;
  padding: 16px;
}
.scp-detail-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.scp-detail-title {
  font-size: 14px;
  font-weight: 500;
}

.scp-cert-row {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr 1fr 0.8fr auto;
  gap: 10px;
  align-items: center;
  padding: 10px 0;
  border-bottom: 0.5px solid #e0e0dc;
  font-size: 12px;
}
.scp-cert-row:last-child { border-bottom: none; }
.scp-cert-row .label { font-size: 10px; color: #888; text-transform: uppercase; letter-spacing: 0.05em; }
.scp-cert-row .value { font-size: 12px; color: #1a1a18; }
.scp-cert-row .value strong { font-weight: 500; }

/* Status pills — shared with the cert tab */
.scp-status {
  display: inline-flex;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: 500;
}
.scp-status-valid     { background: #E1F5EE; color: #085041; }
.scp-status-warning   { background: #FAEEDA; color: #633806; }
.scp-status-critical  { background: #FCEBEB; color: #791F1F; }
.scp-status-expired   { background: #f0f0ee; color: #666; }
.scp-status-unverified { background: #E6F1FB; color: #0C447C; }

.scp-empty {
  padding: 16px;
  text-align: center;
  color: #888;
  font-size: 12px;
}

.scp-add-form {
  background: #F5F4FB;
  border: 0.5px solid #534AB7;
  padding: 14px;
  margin-top: 14px;
}
.scp-add-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}
.scp-add-grid label {
  font-size: 11px;
  color: #555;
  display: block;
  margin-bottom: 4px;
}
.scp-add-grid input,
.scp-add-grid select {
  width: 100%;
  padding: 6px 10px;
  border: 0.5px solid #ccc;
  background: #fff;
  font-size: 13px;
  font-family: inherit;
  border-radius: 0;
  color: #1a1a18;
}
.scp-add-actions { display: flex; gap: 8px; }

.scp-flag-summary {
  background: #FCEBEB;
  border: 0.5px solid #f5c0c0;
  padding: 10px 14px;
  margin-bottom: 16px;
  font-size: 12px;
  color: #791F1F;
}
.scp-flag-summary strong { font-weight: 500; }