/* DGS Client Logos Block - Editor Styles */

/* Ensure block displays properly in editor */
.wp-block-dgs-client-logos {
  max-width: 100%;
}

/* Editor-specific spacing adjustments */
.editor-styles-wrapper .dgs-client-logos {
  padding: var(--space-l) var(--space-m);
}

/* Make sure grid displays correctly in narrow editor */
.editor-styles-wrapper .dgs-client-logos__grid {
  max-width: 100%;
}

/* Adjust item sizing for editor preview */
.editor-styles-wrapper .dgs-client-logos__item {
  min-width: 180px;
}

/* Ensure proper alignment in editor */
.editor-styles-wrapper .dgs-client-logos__header {
  margin-bottom: var(--space-l);
}

/* Empty state styling in editor */
.editor-styles-wrapper .dgs-client-logos__empty {
  background-color: var(--neutral-ultra-light);
  border: 2px dashed var(--neutral-light);
  border-radius: var(--radius);
}

.editor-styles-wrapper .dgs-client-logos__empty p {
  color: var(--neutral);
  font-style: italic;
}

/* Make logo placeholders more visible in editor */
.editor-styles-wrapper .dgs-client-logos__logo-placeholder {
  color: var(--neutral);
}

/* Prevent hover effects from interfering with editing */
.editor-styles-wrapper .dgs-client-logos__item--linked {
  pointer-events: none;
}

/* Show arrow in editor for linked items (for preview purposes) */
.editor-styles-wrapper .dgs-client-logos__item--linked .dgs-client-logos__arrow {
  opacity: 0.5;
}

/* Alignment support in editor */
.wp-block-dgs-client-logos.alignwide,
.wp-block-dgs-client-logos.alignfull {
  max-width: 100%;
}

/* Handle editor width constraints */
@media (max-width: 782px) {
  .editor-styles-wrapper .dgs-client-logos__item {
    min-width: 160px;
  }

  .editor-styles-wrapper .dgs-client-logos__heading {
    font-size: var(--h3);
  }
}

/* Reorder media picker controls in block inspector */
/* Target the logo field controls to show media library button first */
.block-editor-block-inspector .components-base-control.components-base-control {
  display: flex;
  flex-direction: column;
}

.block-editor-block-inspector .components-base-control__field {
  display: flex;
  flex-direction: column;
}

/* Move the "Open Media Library" button to appear first */
.block-editor-block-inspector .components-panel__row {
  order: -1;
}

/* Move size selector and other controls after the media button */
.block-editor-block-inspector .components-base-control {
  order: 3;
  padding-top: 1rem;
}