$style[ $prefix . '_inset' ] ) ? 'inset' : '';
		$box_shadow_offset_horizontal = ! empty( $style[ $prefix . '_offset_horizontal' ] ) ? $style[ $prefix . '_offset_horizontal' ] : 0;
		$box_shadow_offset_vertical = ! empty( $style[ $prefix . '_offset_vertical' ] ) ? $style[ $prefix . '_offset_vertical' ] : '5px';
		$box_shadow_blur = ! empty( $style[ $prefix . '_blur' ] ) ? $style[ $prefix . '_blur' ] : '15px';
		$box_shadow_spread = ! empty( $style[ $prefix . '_spread' ] ) ? $style[ $prefix . '_spread' ] : '';

		// Migrate legacy color setting.
		if ( isset( $style[ $prefix . '_opacity' ] ) ) {
			// If invalid hex, don't attempt migration and don't try to output a box shadow.
			if ( empty( sanitize_hex_color( $style[ $prefix . '_color' ] ) ) ) {
				return false;
			}

			if ( ! class_exists( 'SiteOrigin_Color_Object' ) ) {
				require plugin_dir_path( __FILE__ ) . '../widgets/lib/color.php';
			}
			$color = new SiteOrigin_Color_Object( $style[ $prefix . '_color' ] );
			$color = $color->__get( 'rgb' );

			$opacity_default = $prefix == 'box_shadow' ? 0.15 : 0.30;
			$opacity = is_numeric( $style[ $prefix . '_opacity' ] ) ? min( 100, $style[ $prefix . '_opacity' ] ) / 100 : $opacity_default;
			
			$box_shadow_color = "rgba($color[0],$color[1],$color[2],$opacity)";
			unset( $style[ $prefix . '_opacity' ] );
		} else {
			$box_shadow_color = ! empty( $style[ $prefix . '_color' ] ) ? $style[ $prefix . '_color' ] :  'rgba( 0, 0, 0, ' . ( $prefix == 'box_shadow' ? 0.15 : 0.30 ) . ')';
		}

		return array(
			'box-shadow' => "$box_shadow_inset $box_shadow_offset_horizontal $box_shadow_offset_vertical $box_shadow_blur $box_shadow_spread $box_shadow_color"
		);
	}

	/**
	 * Get the CSS styles that apply to all rows, cells and widgets.
	 *
	 * @return mixed
	 */
	public static function general_style_css( $css, $style ) {
		if ( ! empty( $style['background'] ) ) {
			$css[ 'background-color' ] = $style['background'];
		}

		if (
			(
				! empty( $style['background_image_attachment'] ) ||
				! empty( $style['background_image_attachment_fallback'] )
			) &&
			! empty( $style['background_display'] ) &&
			(
				! self::is_background_parallax( $style['background_display'] ) ||
				siteorigin_panels_setting( 'parallax-type' ) == 'legacy'
			)
		) {
			if ( ! empty( $style['background_image_attachment'] ) ) {
				$url = self::get_attachment_image_src( $style['background_image_attachment'], ! empty( $style['background_image_size'] ) ? $style['background_image_size'] : 'full' );
			}

			if ( empty( $url ) && ! empty( $style['background_image_attachment_fallback'] ) ) {
				$url = $style['background_image_attachment_fallback'];
			}

			if ( ! empty( $url ) ) {
				$css['background-image'] = 'url(' . ( is_array( $url ) ? $url[0] : $url ) . ')';

				switch ( $style['background_display'] ) {
					case 'parallax':
					case 'parallax-original':
						// Only used by Legacy Parallax.
						$css[ 'background-position' ] = 'center center';
						$css[ 'background-repeat' ] = 'no-repeat';
						break;

					case 'tile':
						$css[ 'background-repeat' ] = 'repeat';
						break;

					case 'cover':
						$css[ 'background-position' ] = 'center center';
						$css[ 'background-size' ] = 'cover';
						break;

					case 'contain':
						$css[ 'background-size' ] = 'contain';
						break;

					case 'center':
						$css[ 'background-position' ] = 'center center';
						$css[ 'background-repeat' ] = 'no-repeat';
						break;

					case 'fixed':
						$css[ 'background-attachment' ] = 'fixed';
						$css[ 'background-position' ] = 'center center';
						$css[ 'background-size' ] = 'cover';
						break;
				}
			}
		}

		if ( ! empty( $style['border_color'] ) && ! siteorigin_panels_setting( 'inline-styles' ) ) {
			$css['border'] = ( ! empty( $style['border_thickness'] ) ? $style['border_thickness'] : '1px' ) . ' solid ' . $style['border_color'];
		}

		if ( ! empty( $style['font_color'] ) ) {
			$css['color'] = $style['font_color'];
		}

		if ( ! empty( $style['padding'] ) && ! siteorigin_panels_setting( 'inline-styles' ) ) {
			$css['padding'] = $style['padding'];
		}

		// Find which key the CSS is stored in.
		foreach ( array( 'row_css', 'cell_css', 'widget_css', '' ) as $css_key ) {
			if ( empty( $css_key ) || ! empty( $style[ $css_key ] ) ) {
				break;
			}
		}

		if ( ! empty( $css_key ) && ! empty( $style[ $css_key ] ) ) {
			preg_match_all( '/^([A-Za-z0-9\-]+?):(.+?);?$/m', $style[ $css_key ], $matches );

			if ( ! empty( $matches[0] ) ) {
				for ( $i = 0; $i < count( $matches[0] ); $i ++ ) {
					$css[ $matches[1][ $i ] ] = $matches[2][ $i ];
				}
			}
		}

		if ( isset( $style['border_radius'] ) ) {
			$css['border-radius'] = $style['border_radius'];
		}

		if (
			! empty( $style['box_shadow'] ) &&
			! empty( $style['box_shadow_color'] )
		) {
			$css['box-shadow'] = self::generate_box_shadow_css( 'box_shadow', $style )['box-shadow'];
		}

		if ( ! empty( $style['box_shadow_hover'] ) && empty( $css['transition'] ) ) {
			$css['transition'] = '300ms ease-in-out box-shadow';
		}

		if ( ! empty( $style['full_height'] ) ) {
			$css['min-height'] = apply_filters( 'siteorigin_panels_row_style_full_height', '100vh' );
		}

		return $css;
	}

	/**
	 * Get the tablet styling for rows, cells and widgets.
	 *
	 * @return mixed
	 */
	public static function general_style_tablet_css( $css, $style ) {
		if ( ! empty( $style['tablet_padding'] ) ) {
			$css['padding'] = $style['tablet_padding'] . ( siteorigin_panels_setting( 'inline-styles' ) ? ' !important' : '' );
		}

		if (
			! empty( $style['background_display'] ) &&
			 $style['background_display'] == 'fixed' &&
			 ! ( empty( $style['background_image_attachment'] ) && empty( $style['background_image_attachment_fallback'] ) )
		) {
			$css[ 'background-attachment' ] = 'scroll';
		}

		return $css;
	}

	/**
	 * Get the mobile styling for rows, cells and widgets.
	 *
	 * @return mixed
	 */
	public static function general_style_mobile_css( $css, $style ) {
		if ( ! empty( $style['mobile_padding'] ) ) {
			$css['padding'] = $style['mobile_padding'] . ( siteorigin_panels_setting( 'inline-styles' ) ? ' !important' : '' );
		}

		if ( ! empty( $style['background_display'] ) &&
			 $style['background_display'] == 'fixed' &&
			 ! ( empty( $style['background_image_attachment'] ) && empty( $style['background_image_attachment_fallback'] ) )
		) {
			$css[ 'background-attachment' ] = 'scroll';
		}

		if ( ! empty( $style[ 'mobile_css' ] ) ) {
			preg_match_all( '/^([A-Za-z0-9\-]+?):(.+?);?$/m', $style[ 'mobile_css' ], $matches );

			if ( ! empty( $matches[0] ) ) {
				for ( $i = 0; $i < count( $matches[0] ); $i ++ ) {
					$css[ $matches[1][ $i ] ] = $matches[2][ $i ];
				}
			}
		}

		return $css;
	}

	/**
	 * @param SiteOrigin_Panels_Css_Builder $css
	 *
	 * @return mixed
	 */
	public static function filter_css_object( $css, $panels_data, $post_id, $layout ) {
		$tablet_width = siteorigin_panels_setting( 'tablet-width' );
		$tablet_layout = siteorigin_panels_setting( 'tablet-layout' );
		$mobile_width = siteorigin_panels_setting( 'mobile-width' );

		if ( empty( $layout ) ) {
			return $css;
		}

		foreach ( $layout as $ri => $row ) {
			if ( empty( $row['style'] ) ) {
				$row[ 'style' ] = array();
			}

			$standard_css = apply_filters( 'siteorigin_panels_row_style_css', array(), $row['style'] );
			$tablet_css = $tablet_layout ? apply_filters( 'siteorigin_panels_row_style_tablet_css', array(), $row['style'] ) : '';
			$mobile_css = apply_filters( 'siteorigin_panels_row_style_mobile_css', array(), $row['style'] );

			if ( ! empty( $standard_css ) ) {
				$css->add_row_css(
					$post_id,
					$ri,
					'> .panel-row-style',
					$standard_css
				);
			}

			if ( ! empty( $tablet_css ) ) {
				$css->add_row_css(
					$post_id,
					$ri,
					'> .panel-row-style',
					$tablet_css,
					"$tablet_width:$mobile_width"
				);
			}

			if ( ! empty( $mobile_css ) ) {
				$css->add_row_css(
					$post_id,
					$ri,
					'> .panel-row-style',
					$mobile_css,
					$mobile_width
				);
			}

			if (
				! empty( $row['style']['box_shadow_hover'] ) &&
				! empty( $row['style']['box_shadow_hover_color'] ) 
			) {
				$css->add_row_css(
					$post_id,
					$ri,
					'> .panel-row-style:hover',
					self::generate_box_shadow_css(
						'box_shadow_hover',
						$row['style']
					)
				);
			}

			// Add in flexbox alignment to the main row element.
			if ( siteorigin_panels_setting( 'legacy-layout' ) != 'always' && ! SiteOrigin_Panels::is_legacy_browser() && ! empty( $row['style']['cell_alignment'] ) ) {
				$selector = array();
				$container_settings = SiteOrigin_Panels::container_settings();
				// What selector we use is dependent on their row setup.
				if ( // Is CSS Container Breaker is enabled, and is the row full width?
					$container_settings['css_override'] &&
					isset( $row['style']['row_stretch'] ) &&
					$row['style']['row_stretch'] == 'full'
				) {
					$selector[] = '.panel-has-style > .panel-row-style > .so-panels-full-wrapper';
				} else {
					$selector[] = '.panel-has-style > .panel-row-style';
					$selector[] = '.panel-no-style';
				}

				$css->add_row_css(
					$post_id,
					$ri,
					$selector,
					array(
						'-webkit-align-items' => $row['style']['cell_alignment'],
						'align-items'         => $row['style']['cell_alignment'],
					)
				);
			}

			// Process the cells if there are any.
			if ( empty( $row['cells'] ) ) {
				continue;
			}

			foreach ( $row[ 'cells' ] as $ci => $cell ) {
				if ( empty( $cell['style'] ) ) {
					$cell[ 'style' ] = array();
				}

				$standard_css = apply_filters( 'siteorigin_panels_cell_style_css', array(), $cell['style'] );
				$tablet_css = $tablet_layout ? apply_filters( 'siteorigin_panels_cell_style_tablet_css', array(), $cell['style'] ) : '';
				$mobile_css = apply_filters( 'siteorigin_panels_cell_style_mobile_css', array(), $cell['style'] );

				if ( ! empty( $standard_css ) ) {
					$css->add_cell_css(
						$post_id,
						$ri,
						$ci,
						'> .panel-cell-style',
						$standard_css
					);
				}

				if ( ! empty( $tablet_css ) ) {
					$css->add_cell_css(
						$post_id,
						$ri,
						$ci,
						'> .panel-cell-style',
						$tablet_css,
						"$tablet_width:$mobile_width"
					);
				}

				if ( ! empty( $mobile_css ) ) {
					$css->add_cell_css(
						$post_id,
						$ri,
						$ci,
						'> .panel-cell-style',
						$mobile_css,
						$mobile_width
					);
				}

				if ( ! empty( $cell[ 'style' ]['vertical_alignment'] ) ) {
					$css->add_cell_css(
						$post_id,
						$ri,
						$ci,
						'',
						array(
							'align-self' => $cell[ 'style' ]['vertical_alignment'],
						)
					);
				}

				if (
					! empty( $cell['style']['box_shadow_hover'] ) &&
					! empty( $cell['style']['box_shadow_hover_color'] )
				) {
					$css->add_cell_css(
						$post_id,
						$ri,
						$ci,
						'> .panel-cell-style:hover',
						self::generate_box_shadow_css(
							'box_shadow_hover',
							$cell['style']
						)
					);
				}

				if ( ! empty( $cell['style']['link_color'] ) ) {
					$css->add_cell_css(
						$post_id,
						$ri,
						$ci,
						' a',
						array(
							'color' => $cell['style']['link_color'],
						)
					);
				}

				if ( ! empty( $cell['style']['link_color_hover'] ) ) {
					$css->add_cell_css(
						$post_id,
						$ri,
						$ci,
						' a:hover',
						array(
							'color' => $cell['style']['link_color_hover'],
						)
					);
				}

				// Process the widgets if there are any.
				if ( empty( $cell[ 'widgets' ] ) ) {
					continue;
				}

				foreach ( $cell['widgets'] as $wi => $widget ) {
					if ( empty( $widget['panels_info'] ) ) {
						continue;
					}

					if ( empty( $widget['panels_info']['style'] ) ) {
						$widget['panels_info']['style'] = array();
					}

					$standard_css = apply_filters( 'siteorigin_panels_widget_style_css', array(), $widget['panels_info']['style'] );
					$tablet_css = $tablet_layout ? apply_filters( 'siteorigin_panels_widget_style_tablet_css', array(), $widget['panels_info']['style'] ) : '';
					$mobile_css = apply_filters( 'siteorigin_panels_widget_style_mobile_css', array(), $widget['panels_info']['style'] );

					if ( ! empty( $standard_css ) ) {
						$css->add_widget_css(
							$post_id,
							$ri,
							$ci,
							$wi,
							'> .panel-widget-style',
							$standard_css
						);
					}

					if ( ! empty( $tablet_css ) ) {
						$css->add_widget_css(
							$post_id,
							$ri,
							$ci,
							$wi,
							'> .panel-widget-style',
							$tablet_css,
							"$tablet_width:$mobile_width"
						);
					}

					if ( ! empty( $mobile_css ) ) {
						$css->add_widget_css(
							$post_id,
							$ri,
							$ci,
							$wi,
							'> .panel-widget-style',
							$mobile_css,
							$mobile_width
						);
					}

					if ( ! empty( $widget['panels_info']['style']['link_color'] ) ) {
						$css->add_widget_css( $post_id, $ri, $ci, $wi, ' a', array(
							'color' => $widget['panels_info']['style']['link_color'],
						) );
					}

					if ( ! empty( $widget['panels_info']['style']['link_color_hover'] ) ) {
						$css->add_widget_css( $post_id, $ri, $ci, $wi, ' a:hover', array(
							'color' => $widget['panels_info']['style']['link_color_hover'],
						) );
					}

					if (
						! empty( $widget['panels_info']['style']['box_shadow_hover'] ) &&
						! empty( $widget['panels_info']['style']['box_shadow_hover_color'] )
					) {
						$css->add_widget_css(
							$post_id,
							$ri,
							$ci,
							$wi,
							'> .panel-widget-style:hover',
							self::generate_box_shadow_css(
								'box_shadow_hover',
								$widget['panels_info']['style']
							)
						);
					}
				}
			}
		}

		return $css;
	}

	/**
	 * Add in custom styles for the row's bottom margin.
	 *
	 * @return mixed
	 */
	public static function filter_row_bottom_margin( $margin, $grid ) {
		if ( ! empty( $grid['style']['bottom_margin'] ) ) {
			$margin = $grid['style']['bottom_margin'];
		}

		return $margin;
	}

	/**
	 * Add in custom styles for spacing between cells in a row.
	 *
	 * @return mixed
	 */
	public static function filter_row_cell_bottom_margin( $margin, $cell, $ci, $row, $ri ) {
		if ( ! empty( $row['style']['mobile_cell_margin'] ) ) {
			$margin = $row['style']['mobile_cell_margin'];
		}

		return $margin;
	}

	public static function filter_widget_mobile_margin( $margin, $widget, $wi, $panels_data, $post_id ) {
		if ( ! empty( $widget['style']['mobile_margin'] ) ) {
			$margin = $widget['style']['mobile_margin'];
		}

		return $margin;
	}

	/**
	 * Add in custom styles for a row's mobile bottom margin.
	 *
	 * @return mixed
	 */
	public static function filter_row_mobile_bottom_margin( $margin, $grid ) {
		if ( ! empty( $grid['style']['mobile_bottom_margin'] ) ) {
			$margin = $grid['style']['mobile_bottom_margin'];
		}

		return $margin;
	}

	public static function filter_row_gutter( $gutter, $grid ) {
		if ( ! empty( $grid['style']['gutter'] ) ) {
			$gutter = $grid['style']['gutter'];
		}

		return $gutter;
	}

	/**
	 * Adds widget specific styles not included in the general style fields.
	 *
	 * @param $widget_css The CSS properties and values.
	 * @param $widget_style_data The style settings as obtained from the style fields.
	 *
	 * @return mixed
	 */
	public static function filter_widget_style_css( $widget_css, $widget_style_data ) {
		if ( ! empty( $widget_style_data['margin'] ) && ! siteorigin_panels_setting( 'inline-styles' ) ) {
			$widget_css['margin'] = $widget_style_data['margin'];
		}

		return $widget_css;
	}

	public static function get_attachment_image_src( $image, $size = 'full' ) {
		if ( empty( $image ) ) {
			return false;
		} elseif ( is_numeric( $image ) ) {
			return wp_get_attachment_image_src( $image, $size );
		} elseif ( is_string( $image ) ) {
			preg_match( '/(.*?)\#([0-9]+)x([0-9]+)$/', $image, $matches );

			return ! empty( $matches ) ? $matches : false;
		}
	}
}