/**
 * CSS Niveau 2 — Widget Presets Bar & Module Preset Strip (presets-bar.css)
 * Plafond strict < 180 lignes.
 */
.presets-bar-widget {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  background: var(--color-bg-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-3) var(--space-4);
  width: 100%;
}

.presets-bar__header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }

.presets-bar__title {
  font-family: var(--font-family-display);
  font-size: var(--font-size-sm);
  font-weight: 700;
  color: var(--color-text-primary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.presets-bar__select {
  background: var(--color-bg-base);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  color: var(--color-text-secondary);
  font-size: var(--font-size-xs);
  padding: var(--space-1) var(--space-2);
  outline: none;
  cursor: pointer;
}

.presets-bar__list { display: flex; gap: var(--space-2); overflow-x: auto; padding-bottom: var(--space-2); scrollbar-width: thin; }
.presets-bar__loader, .presets-bar__empty { font-size: var(--font-size-xs); color: var(--color-text-muted); padding: var(--space-2) 0; }

.preset-card {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-1) var(--space-3);
  cursor: pointer;
  white-space: nowrap;
  transition: all var(--transition-fast);
}

.preset-card:hover { border-color: var(--color-brand-blue); }
.preset-card__badge { font-size: 0.65rem; font-weight: 800; padding: 1px 4px; border-radius: var(--radius-sm); background: rgba(59, 130, 246, 0.2); color: #60a5fa; }
.preset-card--factory .preset-card__badge { background: rgba(217, 38, 248, 0.2); color: #e879f9; }
.preset-card__name { font-size: var(--font-size-xs); font-weight: 600; color: var(--color-text-primary); }
.preset-card__apply-btn, .preset-card__del-btn { background: transparent; border: none; color: var(--color-brand-blue); font-size: var(--font-size-xs); font-weight: 700; cursor: pointer; }
.presets-bar__actions { display: flex; align-items: center; justify-content: flex-end; gap: var(--space-2); }

.presets-bar__btn {
  font-size: var(--font-size-xs);
  font-weight: 600;
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-md);
  background: transparent;
  border: 1px dashed var(--color-border);
  color: var(--color-text-secondary);
  cursor: pointer;
}

/* --- Bandeau Preset Compact du Bloc 3 (mountModulePresetStrip) --- */
.preset-strip {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-2);
  background: rgba(15, 23, 42, 0.65);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-2) var(--space-3);
}

.preset-strip__status {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-2xs);
  font-weight: 700;
  padding: 3px 8px;
  border-radius: var(--radius-full);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--color-border);
  color: var(--color-text-muted);
}

.preset-strip__status.has-preset { color: #38bdf8; background: rgba(56, 189, 248, 0.14); border-color: rgba(56, 189, 248, 0.4); }
.preset-strip__status.is-dirty { color: #fbbf24; background: rgba(245, 158, 11, 0.16); border-color: rgba(245, 158, 11, 0.45); }

.preset-strip__actions { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; }

.preset-strip__action-btn {
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  color: var(--color-text-primary);
  font-size: var(--font-size-2xs);
  font-weight: 600;
  padding: 4px 9px;
  cursor: pointer;
  transition: all var(--transition-fast);
}

.preset-strip__action-btn--ai { border-color: rgba(217, 38, 248, 0.45); background: rgba(217, 38, 248, 0.14); color: #f0abfc; }
.preset-strip__action-btn:hover { border-color: var(--color-brand-blue); color: #ffffff; }
