/* Portail des Applications UVCW : mise en page propre à cette page.
   Les éléments (boutons, cadres, champs, interrupteurs, ronds…) viennent de uvcw-ui.css. */

/* Pas de défilement doux global : il entrerait en concurrence avec le saut vers #profil à l'ouverture.
   Les clics dans la navigation de gauche défilent en douceur (portail.js). */
html {
  scroll-padding-top: calc(var(--uvcw-topbar-height) + 24px);
}

/* --- Navigation à gauche, contenu à droite --- */

.layout {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: clamp(24px, 4vw, 56px);
  max-width: 1280px;
  margin: 0 auto;
  padding: 32px var(--uvcw-page-gutter) 80px;
}

.sidenav {
  position: sticky;
  top: calc(var(--uvcw-topbar-height) + 32px);
  align-self: start;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.sidenav a {
  padding: 8px 14px;
  border-radius: var(--uvcw-radius-pill);
  color: var(--uvcw-ink-muted);
  font-weight: 500;
  transition:
    color var(--uvcw-duration-fast),
    background-color var(--uvcw-duration-fast);
}

.sidenav a:hover {
  color: var(--uvcw-ink);
}

.sidenav a[aria-current='true'] {
  color: var(--uvcw-ink);
  background: var(--uvcw-surface);
  box-shadow: var(--uvcw-shadow-raised);
  font-weight: 600;
}

.portal-h2 {
  margin-bottom: 18px;
}

.portal-search {
  width: min(100%, 420px);
}

#apps {
  margin-top: var(--uvcw-space-6);
}

/* Plus d'air entre les applications récentes et la grille. */
#recent:not(:empty) {
  margin-bottom: var(--uvcw-space-4);
}

.uvcw-eyebrow {
  margin-top: 26px;
}

/* --- Liens utiles, regroupés --- */

.link-groups {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 14px;
}

.link-group {
  padding: 16px 18px;
}

/* Picto centré sur la hauteur du titre, séparé de lui par un espace. */
.link-group .uvcw-eyebrow {
  display: flex;
  align-items: center;
  gap: var(--uvcw-space-2);
  margin-top: 0;
  line-height: 1;
}

.link-group .uvcw-eyebrow svg {
  flex: none;
}

.link-group a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 0;
  border-top: 1px solid var(--uvcw-hairline);
  font-size: var(--uvcw-text-md);
}

.link-group h3 + a {
  border-top: 0;
}

.link-group a svg {
  color: var(--uvcw-ink-muted);
}

.link-group a:hover {
  color: var(--uvcw-ink-muted);
}

/* --- Profil et réglages --- */

.profile {
  display: flex;
  align-items: center;
  gap: 22px;
}

.identity {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.identity strong {
  font-size: var(--uvcw-text-xl);
}

.identity span {
  color: var(--uvcw-ink-muted);
}

.identity .uvcw-btn {
  margin-top: 8px;
}

/* Sans fiche à montrer : pas de cadre vide. */
.facts:empty {
  display: none;
}

.facts {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 10px 28px;
  margin: 14px 0 0;
}

.facts dt {
  color: var(--uvcw-ink-muted);
}

.facts dd {
  margin: 0;
}

.settings {
  padding-top: 6px;
  padding-bottom: 6px;
}

@media (max-width: 760px) {
  .layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .sidenav {
    position: static;
    flex-direction: row;
    overflow-x: auto;
  }

  .sidenav a {
    white-space: nowrap;
  }

  .uvcw-setting {
    flex-wrap: wrap;
  }
}


/* --- Fiche en pleine page (portail-fiche.js) : seule dans la colonne de contenu --- */

.content.fiche-open > :not(.uvcw-form-page) {
  display: none;
}

/* --- Gestion des applications --- */

.manage-list {
  padding-top: 4px;
  padding-bottom: 4px;
}

.manage-row > .manage-app {
  flex-direction: row;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.manage-app > div {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.manage-app span:not(.uvcw-pill, .uvcw-app-icon) {
  overflow: hidden;
  color: var(--uvcw-ink-muted);
  font-size: var(--uvcw-text-sm);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.manage-actions {
  display: flex;
  flex: none;
  align-items: center;
  gap: 8px;
}


.manage-color {
  height: 38px;
  padding: 4px;
}

.manage-image {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 14px;
  padding: 10px 0;
}

.manage-image__preview {
  display: grid;
  place-items: center;
  width: 56px;
  height: 44px;
  border-radius: var(--uvcw-radius-sm);
  background: var(--uvcw-bg);
}

.manage-image__preview img {
  max-width: 48px;
  max-height: 36px;
  object-fit: contain;
}

.manage-image__preview span {
  color: var(--uvcw-ink-muted);
  font-size: var(--uvcw-text-2xs);
}

.manage-image__text {
  display: flex;
  flex-direction: column;
  font-size: var(--uvcw-text-md);
}

.manage-image__text span:not(.uvcw-field-error) {
  color: var(--uvcw-ink-muted);
  font-size: var(--uvcw-text-sm);
}

/* « Supprimer » et l'erreur générale, à gauche de la barre d'actions. */
.manage-actions-start {
  display: flex;
  align-items: center;
  gap: var(--uvcw-space-3);
}

.uvcw-form-actions .uvcw-field-error {
  margin: 0;
}

@media (max-width: 600px) {
  .manage-row {
    flex-wrap: wrap;
  }
}

/* --- Menu à damier (gestion) --- */

#menu-damier .uvcw-note {
  margin-bottom: 0;
}

.launcher-heading {
  margin: 0;
  padding: var(--uvcw-space-4) 0 var(--uvcw-space-2);
}

.manage-list > .launcher-heading:first-child {
  padding-top: var(--uvcw-space-2);
}

.launcher-none {
  margin: 0;
  padding: var(--uvcw-space-3) 0;
  font-size: var(--uvcw-text-sm);
}

/* --- Utilisateurs (admins) --- */

.users-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--uvcw-space-2) var(--uvcw-space-4);
  margin-bottom: var(--uvcw-space-4);
}

.users-tools .uvcw-note {
  margin: 0;
}

/* Services (personnel) ou dernière connexion (comptes du portail), à droite de la ligne. */
.users-aside {
  flex: 0 1 220px;
  color: var(--uvcw-ink-muted);
  font-size: var(--uvcw-text-sm);
  text-align: right;
}

/* Cases à cocher de la fiche d'ajout, un peu sous leur intitulé. */
[data-checklist] .uvcw-checkbox-group {
  margin-top: var(--uvcw-space-2);
}