/* ═══ Bénévoles d'événement — back-office ═══════════════════════════════════
   Uniquement les classes vol-* : le reste vient de components.css. */

.vol-root { max-width: 1200px; }
.vol-grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 24px; }
.vol-check { display: flex; gap: 6px; align-items: center; font-size: 13px; margin: 6px 0; cursor: pointer; }
.vol-num { width: 72px; }
.vol-time { width: 110px; }
.vol-table td, .vol-table th { padding: 6px 8px; vertical-align: middle; }
.vol-table .form-input { min-width: 0; }
.vol-table select.form-input { min-width: 120px; }
.vol-generator .form-input { width: auto; }
.vol-generator .vol-num { width: 72px; }
.vol-generator .vol-time { width: 110px; }
.vol-step-body, .vol-view { overflow-x: auto; }
.vol-alert { border-left: 4px solid var(--color-warning, #f59e0b); background: var(--color-surface-2, rgba(245, 158, 11, .08)); padding: 10px 12px; border-radius: 6px; margin-bottom: 12px; font-size: 13px; }
.vol-errors { border-left: 4px solid var(--color-danger, #ef4444); padding: 10px 12px; margin-bottom: 12px; font-size: 13px; }
.vol-list { display: flex; flex-direction: column; gap: 4px; max-height: 320px; overflow: auto; }

/* Liste des campagnes */
.vol-campaigns { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.vol-campaign { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; text-align: left; padding: 14px; border-radius: 10px; border: 1px solid var(--color-border, rgba(127,127,127,.25)); background: var(--color-surface, transparent); color: inherit; cursor: pointer; }
.vol-campaign:hover { border-color: var(--color-primary, #f59e0b); }
.vol-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.vol-tabs { margin-bottom: 16px; }

/* Questionnaire */
.vol-steps { display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 16px; }
.vol-step { border: 1px solid var(--color-border, rgba(127,127,127,.25)); background: none; color: inherit; border-radius: 999px; padding: 4px 12px; font-size: 12px; cursor: pointer; }
.vol-step.active { background: var(--color-primary, #f59e0b); color: #fff; border-color: transparent; }
.vol-step.has-error { border-color: var(--color-danger, #ef4444); }
.vol-wizard-footer { display: flex; justify-content: space-between; margin-top: 20px; padding-top: 12px; border-top: 1px solid var(--color-border, rgba(127,127,127,.2)); }
.vol-generator { padding: 12px; border-radius: 8px; border: 1px dashed var(--color-border, rgba(127,127,127,.35)); }
.vol-question { padding: 10px; margin: 8px 0; border-radius: 8px; border: 1px solid var(--color-border, rgba(127,127,127,.2)); }
.vol-preview { padding: 12px; border-radius: 8px; background: var(--color-surface-2, rgba(127,127,127,.06)); }
.vol-preview ol { margin: 8px 0 0 18px; }

/* Planning */
.vol-toolbar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
.vol-day { margin-bottom: 18px; }
.vol-day h3 { font-size: 15px; margin-bottom: 8px; text-transform: capitalize; }
.vol-slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
.vol-slot { padding: 10px; border-radius: 10px; border: 1px solid var(--color-border, rgba(127,127,127,.25)); }
.vol-slot.full { border-color: var(--color-success, #22c55e); }
.vol-slot.locked { background: var(--color-surface-2, rgba(127,127,127,.08)); }
.vol-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.vol-chip { display: inline-flex; gap: 4px; align-items: center; padding: 4px 8px; border-radius: 999px; border: 1px solid var(--color-border, rgba(127,127,127,.3)); background: none; color: inherit; font-size: 12px; cursor: pointer; min-height: 32px; }
.vol-chip .badge { font-size: 10px; }
.vol-hot td { font-weight: 600; }
.vol-history { max-height: 360px; overflow: auto; font-size: 13px; display: flex; flex-direction: column; gap: 4px; }
.vol-wa { display: inline-block; padding: 4px 0; }
.vol-modal-wide { max-width: min(960px, 96vw); width: 96vw; }
.vol-modal-body { max-height: 75vh; overflow: auto; }

@media (max-width: 640px) {
  .vol-slots { grid-template-columns: 1fr; }
  /* Cibles tactiles : 44 px au doigt */
  .vol-root .btn-xs, .vol-touch, .vol-step, .vol-chip, .vol-campaign .badge + * { min-height: 44px; min-width: 44px; }
  .vol-root input[type="checkbox"] { width: 22px; height: 22px; }
  .vol-table { display: block; overflow-x: auto; }
}

/* Impression : seul le planning, un jour par page */
#vol-print { display: none; }
@media print {
  body.vol-printing > *:not(#vol-print) { display: none !important; }
  body.vol-printing #vol-print { display: block; color: #000; background: #fff; font: 11pt/1.35 system-ui, sans-serif; }
  .vol-print-day { page-break-after: always; }
  .vol-print-day:last-child { page-break-after: auto; }
  #vol-print h1 { font-size: 16pt; margin: 0 0 8pt; }
  #vol-print h2 { font-size: 12pt; margin: 12pt 0 4pt; border-bottom: 1px solid #999; }
  #vol-print table { width: 100%; border-collapse: collapse; }
  #vol-print td { border-bottom: 1px solid #ddd; padding: 3pt 4pt; }
}