Enqueue style for the block

includes/css/card.css

@@ -1,6 +1,6 @@
 .wzpa-card {
     --wzpa-font-family: inherit;
-    --wzpa-margin: 0;
+    --wzpa-margin: auto;
     --wzpa-min-column-width: 96px;
     --wzpa-max-column-width: max-content;
     --wzpa-grid-gap: 10px;
@@ -17,7 +17,8 @@
 
 .wzpa_authors.wzpa-card {
     font-family: var(--wzpa-font-family);
-    margin: var(--wzpa-margin);
+    margin-left: var(--wzpa-margin);
+    margin-right: var(--wzpa-margin);
 }
 
 .wzpa_authors.wzpa-card ul {

includes/frontend/blocks/class-blocks.php

@@ -8,6 +8,7 @@
 namespace WebberZone\Popular_Authors\Frontend\Blocks;
 
 use WebberZone\Popular_Authors\Frontend\Display;
+use WebberZone\Popular_Authors\Frontend\Styles_Handler;
 
 if ( ! defined( 'WPINC' ) ) {
 	die;
@@ -110,6 +111,27 @@ public static function render_block_popular_authors( $attributes ) {
 		 */
 		$arguments = apply_filters( 'wzpa_block_popular_authors_arguments', $arguments, $attributes );
 
+		// Enqueue the stylesheet for the selected style for this block.
+		if ( isset( $arguments['styles'] ) ) {
+			$suffix = ( defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ) ? '' : '.min';
+
+			$style_array = Styles_Handler::get_style( $arguments['styles'] );
+
+			if ( ! empty( $style_array['name'] ) ) {
+				$style     = $style_array['name'];
+				$extra_css = $style_array['extra_css'];
+
+				wp_register_style(
+					"wzpa-style-{$style}",
+					plugins_url( "includes/css/{$style}{$suffix}.css", POP_AUTHOR_PLUGIN_FILE ),
+					array(),
+					POP_AUTHOR_VERSION
+				);
+				wp_enqueue_style( "wzpa-style-{$style}" );
+				wp_add_inline_style( "wzpa-style-{$style}", $extra_css );
+			}
+		}
+
 		return Display::list_popular_authors( $arguments );
 	}