/**
 * Évaluation compétences — tableau et sélecteur mobile.
 */

.evaluation-item-label--skill {
  padding-left: 20px;
}

.evaluation-item-label--sub-skill {
  padding-left: 40px;
}

.evaluation-item-label--criteria {
  padding-left: 40px;
}

.evaluation-item-label--criteria-deep {
  padding-left: 60px;
}

.evaluation-level-picker__mobile {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  width: 100%;
}

.evaluation-level-picker__select {
  flex: 1 1 auto;
  min-width: 0;
}

/* Desktop : titre + boutons blocs sur une ligne, pastilles en dessous */
@media (min-width: 768px) {
  .evaluation-legend-group {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    column-gap: 1rem;
    row-gap: 0.5rem;
    align-items: center;
  }

  .evaluation-legend-group__title {
    grid-column: 1;
    grid-row: 1;
  }

  .evaluation-legend-group__expand {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
  }

  .evaluation-legend-group__badges {
    grid-column: 1 / -1;
    grid-row: 2;
    margin-bottom: 0 !important;
  }
}

@media (max-width: 767.98px) {
  .skills-evaluation-panel .evaluation-item-label--skill {
    padding-left: 0.15rem !important;
  }

  .skills-evaluation-panel .evaluation-item-label--sub-skill {
    padding-left: 0.35rem !important;
  }

  .skills-evaluation-panel .evaluation-item-label--criteria {
    padding-left: 0.45rem !important;
  }

  .skills-evaluation-panel .evaluation-item-label--criteria-deep {
    padding-left: 0.55rem !important;
  }

  .skills-evaluation-panel .evaluation-item-label .bi {
    margin-right: 0.35rem !important;
  }

  .skills-evaluation-panel .evaluation-table {
    font-size: 0.85rem;
  }

  .skills-evaluation-panel .evaluation-table tr {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.5rem;
    border-bottom: 1px solid #dee2e6;
    padding-bottom: 0.35rem;
    margin-bottom: 0.25rem;
  }

  .skills-evaluation-panel .evaluation-table td {
    border: none !important;
    padding: 0.15rem 0.35rem !important;
    text-align: left !important;
  }

  /* Ligne 1 : libellé compétence / sous-compétence */
  .skills-evaluation-panel .evaluation-table td:first-child {
    flex: 1 1 100%;
    width: 100% !important;
    order: 1;
  }

  /* Ligne 2 : code + dropdown sur la même ligne */
  .skills-evaluation-panel .evaluation-table td:nth-child(2):has(.badge) {
    flex: 0 0 auto;
    width: auto !important;
    order: 2;
    padding-right: 0 !important;
  }

  .skills-evaluation-panel .evaluation-table td:nth-child(2):not(:has(.badge)) {
    display: none !important;
  }

  .skills-evaluation-panel .evaluation-table td:nth-child(3) {
    flex: 1 1 0;
    min-width: 0;
    width: auto !important;
    order: 3;
    padding-left: 0 !important;
  }

  .skills-evaluation-panel .evaluation-table tr:not(:has(td:nth-child(2) .badge)) td:nth-child(3) {
    flex: 1 1 100%;
    order: 2;
  }

  .skills-evaluation-panel .evaluation-table td .badge {
    margin-top: 0;
  }

  /* En-tête de bloc : titre puis code + dropdown alignés */
  .skills-evaluation-panel .block-header {
    flex-direction: column;
    align-items: stretch !important;
    gap: 0.35rem;
  }

  .skills-evaluation-panel .block-header > .d-flex:first-child {
    margin-bottom: 0 !important;
  }

  .skills-evaluation-panel .evaluation-code-level-row {
    width: 100%;
  }

  .skills-evaluation-panel .evaluation-code-level-row .evaluation-level-picker {
    flex: 1 1 auto;
    min-width: 0;
  }

  .skills-evaluation-panel .evaluation-code-level-row__code {
    flex-shrink: 0;
  }

  .skills-evaluation-expand-actions.evaluation-legend-group__expand {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 0.25rem;
  }

  .skills-evaluation-expand-actions.evaluation-legend-group__expand .btn {
    width: 100%;
    border-radius: 0.25rem !important;
  }

  .evaluation-legend-group__badges {
    margin-bottom: 0.35rem !important;
  }

  .evaluation-level-picker__select {
    font-size: 0.85rem;
    padding: 0.3rem 0.45rem;
  }
}
