.ss-page-head{
  display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  margin-bottom:1.4rem;
}
.ss-page-head h1{ margin-bottom:0 !important; }

.ss-field-row{ display:flex; gap:1rem; flex-wrap:wrap; }
.ss-field-row .ss-field{ flex:1 1 220px; }
.ss-field select{ max-width:15rem; }

.ss-admin-whoami{ font-size:.82rem; color:var(--ss-muted); margin-inline-end:.3rem; }

.ss-icon-picker{ display:flex; align-items:flex-start; gap:.9rem; margin-top:.4rem; }
.ss-icon-preview{
  width:52px; height:52px; border-radius:var(--ss-radius-sm); flex-shrink:0;
  display:flex; align-items:center; justify-content:center; overflow:hidden;
  background:var(--ss-chalk); color:#fff; font-weight:700; font-size:1.3rem;
  box-shadow: var(--ss-shadow-sm);
}
.ss-icon-preview img{ width:100%; height:100%; object-fit:contain; }

.ss-version-footer{
  padding:.6rem .9rem; font-size:.68rem; color:var(--ss-muted);
  border-top:1px solid var(--ss-paper-line);
}

.ss-system-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:.9rem; margin:1rem 0 1.4rem; }
.ss-system-item{
  background:#fff; border:1px solid var(--ss-paper-line); border-radius:var(--ss-radius-sm);
  padding:.9rem 1rem; box-shadow: var(--ss-shadow-sm); border-top:3px solid var(--sys-c, var(--ss-paper-line));
  display:flex; gap:.7rem; align-items:flex-start;
}
[data-ss-theme="dark"] .ss-system-item{ background:#162030; }
.ss-system-item .icon{
  width:34px; height:34px; border-radius:var(--ss-radius-sm); flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background:color-mix(in srgb, var(--sys-c, var(--ss-muted)) 14%, white); color:var(--sys-c, var(--ss-muted));
}
.ss-system-item .icon svg{ width:18px; height:18px; }
.ss-system-item .label{ font-size:.72rem; color:var(--ss-muted); margin-bottom:.25rem; }
.ss-system-item .value{ font-weight:700; font-size:.98rem; color:var(--sys-c, var(--ss-ink)); }

.ss-list-row{ flex-wrap:wrap; border-bottom:1px solid var(--ss-paper-line); }
.ss-list-row:last-child{ border-bottom:none; }
.ss-list-row-actions{ flex-wrap:wrap; }

@media (max-width:640px){
  .ss-list-row{ align-items:flex-start; flex-direction:column; gap:.6rem; }
  .ss-list-row-actions{ width:100%; }
}

/**
 * Ce qui suit reprend TEL QUEL les classes locales définies dans le
 * squelette hello-world (assets/css/app.css + docs/THEME_GUIDE.md §4) —
 * tableaux, boutons icône, formulaire multilingue en grille — pour
 * rester cohérent avec les autres apps de la suite plutôt que
 * réinventer un style propre à celle-ci.
 */

/* Tableaux -- zébrures, alignement, boutons icône avec info-bulle */
.ss-table { width: 100%; border-collapse: collapse; margin-bottom: .9rem; font-size: .85rem; }
.ss-table th, .ss-table td { padding: .5rem .7rem; text-align: start; border-bottom: 1px solid var(--ss-paper-line); }
.ss-table th { font-weight: 600; color: var(--ss-muted); }
.ss-table tbody tr:nth-child(even) { background: var(--ss-paper); }
[data-ss-theme="dark"] .ss-table tbody tr:nth-child(even) { background: rgba(255,255,255,.03); }
.ss-table tbody tr { transition: background .12s; }
.ss-table tbody tr:hover { background: var(--ss-chalk) !important; }
.ss-table td.ss-td-actions { text-align: end; white-space: nowrap; }
.ss-table th.ss-th-actions { text-align: end; }
.ss-table td.ss-td-center, .ss-table th.ss-th-center { text-align: center; }

.ss-icon-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; padding: 0; margin-inline-start: .25rem;
  border: 1px solid var(--ss-paper-line); border-radius: var(--ss-radius-sm);
  background: #fff; color: var(--ss-ink); cursor: pointer; text-decoration: none;
  transition: background .15s, border-color .15s;
}
[data-ss-theme="dark"] .ss-icon-btn { background: #162030; }
.ss-icon-btn:hover { background: var(--ss-paper); border-color: var(--ss-slate); color: var(--ss-slate); }
.ss-icon-btn svg { width: 15px; height: 15px; }
.ss-icon-btn.ss-icon-danger { color: #DC2626; }
.ss-icon-btn.ss-icon-danger:hover { background: #FEE2E2; border-color: #DC2626; }
.ss-icon-btn.ss-icon-success { color: #16A34A; }
.ss-icon-btn.ss-icon-success:hover { background: #DCFCE7; border-color: #16A34A; }
.ss-icon-btn:disabled { opacity: .4; cursor: not-allowed; }

/* Formulaires multilingues -- une petite grille FR/EN/DE/ES/AR sous un même champ */
.ss-lang-row { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .3rem; }
.ss-lang-item { flex: 1; min-width: 110px; }
.ss-lang-tag { font-size: .7rem; color: var(--ss-muted); display: block; margin-bottom: .2rem; }

/* Grille de cases à cocher (ex. sélection multiple depuis un référentiel) */
.ss-checkbox-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: .4rem .8rem; margin-top: .3rem; }

/**
 * Journal des erreurs (admin/errors.php) -- sévérités, filtres, détail
 * dépliable. Deux teintes de badge n'existent pas dans le kit partagé
 * (ss-badge-active/-pending/-revoked ne couvrent pas "erreur"/"critique").
 */
.ss-badge.ss-sev-error { background:#FCEBEB; color:#C0392B; }
.ss-badge.ss-sev-critical { background:#FCEBEB; color:#7B1616; font-weight:700; }
[data-ss-theme="dark"] .ss-badge.ss-sev-error { background:rgba(192,57,43,.18); }
[data-ss-theme="dark"] .ss-badge.ss-sev-critical { background:rgba(123,22,22,.28); }

.ss-sev-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:.6rem; margin-bottom:1.1rem; }
.ss-sev-card{
  display:block; text-decoration:none; background:#fff; border:1px solid var(--ss-paper-line);
  border-radius:var(--ss-radius-sm); padding:.85rem .9rem; box-shadow:var(--ss-shadow-sm);
  border-top:3px solid currentColor; transition:box-shadow .15s, border-color .15s, transform .1s;
}
.ss-sev-card:hover{ transform:translateY(-1px); box-shadow:var(--ss-shadow); }
[data-ss-theme="dark"] .ss-sev-card{ background:#162030; }
.ss-sev-card.on{ box-shadow:0 0 0 2px currentColor; }
.ss-sev-card .label{ font-size:.68rem; text-transform:uppercase; letter-spacing:.04em; color:inherit; margin-bottom:.25rem; font-weight:700; }
.ss-sev-card .value{ font-family:var(--ss-font-display); font-size:1.4rem; font-weight:700; color:inherit; }
.ss-sev-card.ss-badge-revoked{ color:var(--ss-muted); }
.ss-sev-card.ss-badge-active{ color:var(--ss-success); }
.ss-sev-card.ss-badge-pending{ color:var(--ss-ochre-deep); }
.ss-sev-card.ss-sev-error{ color:#C0392B; }
.ss-sev-card.ss-sev-critical{ color:#7B1616; }

@media (max-width:760px){ .ss-sev-grid{ grid-template-columns:repeat(2,1fr); } }

.ss-errors-filters{ display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; margin-bottom:.8rem; }
.ss-errors-filters select, .ss-errors-filters input[type=text],
.ss-errors-actions select{
  border:1px solid var(--ss-paper-line); border-radius:var(--ss-radius-sm); padding:.5rem .65rem;
  font-size:.85rem; background:#fff; color:var(--ss-ink); font-family:inherit; cursor:pointer;
  transition:border-color .15s, box-shadow .15s;
}
.ss-errors-filters input[type=text]{ cursor:text; }
.ss-errors-filters select:hover, .ss-errors-filters input[type=text]:hover,
.ss-errors-actions select:hover{ border-color:var(--ss-slate); }
.ss-errors-filters select:focus, .ss-errors-filters input[type=text]:focus,
.ss-errors-actions select:focus{ outline:none; border-color:var(--ss-slate); box-shadow:0 0 0 3px rgba(27,59,122,.12); }
[data-ss-theme="dark"] .ss-errors-filters select, [data-ss-theme="dark"] .ss-errors-filters input[type=text],
[data-ss-theme="dark"] .ss-errors-actions select{ background:#162030; }

.ss-errors-filters input[name="q"]{
  padding-inline-start:2.1rem;
  background-repeat:no-repeat; background-position:.65rem center; background-size:15px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7A8D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
}
[dir="rtl"] .ss-errors-filters input[name="q"]{ padding-inline-start:.6rem; padding-inline-end:2.1rem; background-position:right .65rem center; }
[data-ss-theme="dark"] .ss-errors-filters input[name="q"]{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237A8EA3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
}

.ss-errors-actions{ display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; margin-bottom:.9rem; }

.ss-errors-msg-cell{ max-width:340px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.ss-errors-detail{ display:none; }
.ss-errors-detail.show{ display:table-row; }
.ss-errors-detail td{ background:var(--ss-chalk); padding:.9rem 1rem !important; border-bottom:1px solid var(--ss-paper-line); }
[data-ss-theme="dark"] .ss-errors-detail td{ background:rgba(255,255,255,.03); }
.ss-errors-meta{ font-size:.72rem; color:var(--ss-muted); font-family:ui-monospace,monospace; margin:0; }
.ss-errors-trace{
  background:#1A2433; color:#DEE8F2; padding:.8rem; border-radius:8px; font-size:.72rem;
  font-family:ui-monospace,monospace; white-space:pre-wrap; overflow:auto; max-height:220px; margin-top:.4rem;
}

.ss-errors-pagination{ display:flex; gap:.3rem; justify-content:flex-end; margin-top:.9rem; }
.ss-errors-pagination a{
  padding:.3rem .65rem; border:1px solid var(--ss-paper-line); border-radius:var(--ss-radius-sm);
  font-size:.78rem; color:var(--ss-ink); background:#fff; text-decoration:none; transition:all .15s;
}
[data-ss-theme="dark"] .ss-errors-pagination a{ background:#162030; }
.ss-errors-pagination a.on, .ss-errors-pagination a:hover{ background:var(--ss-slate); color:#fff; border-color:var(--ss-slate); }