/* ==========================================================================
   Social Icons Group widget static style start
   ========================================================================== */

.qodef-social-icons-group {

	.qodef-icon-holder {
		margin-right: 9px;

		a {
			transition: $color-transition;
		}

		&:last-child {
			margin-right: 0;
		}

		&.qodef--textual {
			@include qodefParagraphStyle();
			display: block;
			margin-bottom: 8px;

			&:last-child {
				margin-bottom: 0;
			}

			a {
				position: relative;
				display: inline-block;
				color: inherit;

				&:after {
					content: '';
					position: absolute;
					left: 0;
					right: 0;
					bottom: 1px;
					width: 100%;
					height: 1px;
					background-color: currentColor;
					transform-origin: left;
					transform: scaleX(0);
					transition: transform .6s cubic-bezier(0.33, 1, 0.68, 1);
				}

				&:hover {
					color: inherit;

					&:after {
						transform: scaleX(1);
					}
				}
			}
		}
	}
}

/* ==========================================================================
   Social Icons Group widget variable style start
   ========================================================================== */

$local-widgets-area-map: (
		'':(
				link-color: null,
				link-hover-color: null,
				textual-link-color: null,
				textual-link-hover-color: null,
				icon-background-color: $additional-background-color,
				icon-background-hover-color: $heading-color,
				icon-with-background-link-hover-color: #fff,
		),
);

@each $key, $values in $local-widgets-area-map {
	#{$key} .widget {
		&.widget_ginevra_core_social_icons_group {

			.qodef-icon-holder {

				a {
					@if (map-get($values, 'link-color') != null) {
						color: map-get($values, 'link-color');
					}

					&:hover {
						@if (map-get($values, 'link-hover-color') != null) {
							color: map-get($values, 'link-hover-color');
						}
					}
				}

				&.qodef--textual {

					a {
						@if (map-get($values, 'textual-link-color') != null) {
							color: map-get($values, 'textual-link-color');
						}

						&:hover {
							@if (map-get($values, 'textual-link-hover-color') != null) {
								color: map-get($values, 'textual-link-hover-color');
							}
						}
					}
				}

				&.qodef-layout--circle,
				&.qodef-layout--square {
					@if (map-get($values, 'icon-background-color') != null) {
						background-color: map-get($values, 'icon-background-color');
					}

					&:hover {
						@if (map-get($values, 'icon-background-hover-color') != null) {
							color: map-get($values, 'icon-background-hover-color');
						}

						a {

							@if (map-get($values, 'icon-with-background-link-hover-color') != null) {
								color: map-get($values, 'icon-with-background-link-hover-color');
							}
						}
					}
				}
			}
		}
	}
}
