@import "../utilities/mixins";
@import "../utilities/variables";
@mixin addtoany{
	a.addtoany_share {
		@include font-heading;
		color: $ui-foreground-primary-text-headings;
		display: block;
		font-size: px-to-rem(16px);
		font-style: normal;
		font-weight: 390;
		letter-spacing: normal;
		line-height: 1.25; 
		margin: 0;
		max-width: 100%;
		order: -1;
		padding: 0;
		position: relative;
		text-align: center;
		text-decoration: none;
		text-transform: capitalize;
		transition: all 0.4s ease;
		width: auto;
		&::before {
			content: none;
		}
		span,
		.a2a_svg,
		.a2a_s__default,
		.a2a_s_a2a {
			display: none;
			margin: 0;
		}
		&:hover {
			text-decoration: underline;
		}
	}
	a:not(.addtoany_share) {
		color: $ui-foreground-primary-text-links;
		width: 35px;
		height: 35px;
		display: flex;
		border-radius: 2px;
		background-color: $ui-background-primary;
		align-items: center;
		padding: 0;
		span {
			width: 35px;
			height: 35px;
			border-radius: 0;
			padding: 0;
			color: $ui-foreground-primary-text-links;
			display: block;
			&.a2a_svg {
				background-color: transparent !important;
			}
			svg {
				path {
					fill: $ui-foreground-primary-text-links;
				}
			}
		}
		&.a2a_button_facebook {
			span {
				position: relative;
				&::after {
					content: "";
					background-image: url("data:image/svg+xml,%3Csvg width='13' height='20' viewBox='0 0 13 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.0924 10.9647L12.7147 7.67328H8.9809V5.36928C8.9809 4.44768 9.36984 3.72356 11.0812 3.72356H12.8703V0.695443C11.859 0.563786 10.77 0.432129 9.75877 0.432129C6.56949 0.432129 4.31366 2.07784 4.31366 5.04013V7.67328H0.813232V10.9647H4.31366V19.3249C5.09153 19.4566 5.86941 19.5224 6.64728 19.5224C7.42515 19.5224 8.20303 19.4566 8.9809 19.3249V10.9647H12.0924Z' fill='%23243C49'/%3E%3C/svg%3E%0A");
					background-position: center;
					background-repeat: no-repeat;
					background-size: 12px;
					bottom: unset;
					display: block;
					height: 100%;
					left: 50%;
					position: absolute;
					top: 50%;
					transform: translate(-50%, -50%);
					width: 100%;
				}
				svg {
					display: none;
				}
			}
		}
		&.a2a_button_twitter {
			span {
				position: relative;
				&::after {
					content: "";
					background-image: url("data:image/svg+xml,%3Csvg width='19' height='18' viewBox='0 0 19 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.1326 15.3672C15.1516 12.7274 13.1711 10.0872 11.1919 7.44558C10.9024 7.75293 10.6147 8.05844 10.327 8.3658C12.2634 10.9489 14.2018 13.5319 16.1382 16.1132C16.1738 16.161 16.2094 16.2073 16.2446 16.2552H13.7431L8.98742 9.79396C8.69785 10.1013 8.40829 10.4105 8.12058 10.7179C9.26289 12.2669 10.4033 13.8178 11.5438 15.3672C12.0681 16.0779 12.5901 16.7883 13.1143 17.4991H18.7317C18.1971 16.7883 17.6639 16.0779 17.133 15.3672H17.1326ZM2.69119 1.24352H4.98471L6.91747 3.81956C7.7932 4.9867 8.66931 6.15571 9.54504 7.32285C9.83275 7.01549 10.1205 6.70999 10.4085 6.40263C8.80797 4.26892 7.20703 2.1352 5.60647 0H0.230469C1.74391 2.05734 3.25771 4.11283 4.77152 6.1698C5.63131 7.33509 6.48962 8.50075 7.34755 9.66605C7.63526 9.35869 7.92297 9.05133 8.21253 8.74397L2.69119 1.24352Z' fill='%23243C49'/%3E%3Cpath d='M8.98719 9.79425C8.69763 10.1016 8.40806 10.4108 8.12036 10.7182C6.6655 12.2672 5.21027 13.8181 3.75541 15.3675C3.08916 16.0782 2.42291 16.7886 1.75517 17.4994H0C0.666253 16.7886 1.33251 16.0782 2.00024 15.3675C2.92566 14.3798 3.85329 13.3921 4.77871 12.4044C5.63479 11.4912 6.49124 10.5799 7.3477 9.66671C7.6354 9.35935 7.92311 9.05199 8.21268 8.74463L8.98719 9.79462V9.79425Z' fill='%23243C49'/%3E%3Cpath d='M18.1788 0C15.8497 2.48186 13.5206 4.96372 11.1915 7.44558C10.9019 7.75293 10.6142 8.05844 10.3265 8.3658C10.0669 8.01951 9.80594 7.671 9.54492 7.32285C9.83263 7.01549 10.1203 6.70999 10.4084 6.40263C12.4105 4.26892 14.4126 2.13372 16.4151 0H18.1791H18.1788Z' fill='%23243C49'/%3E%3C/svg%3E%0A");
					background-position: center;
					background-repeat: no-repeat;
					background-size: 14px;
					bottom: unset;
					display: block;
					height: 100%;
					left: 50%;
					position: absolute;
					top: 50%;
					transform: translate(-50%, -50%);
					width: 100%;
				}
				svg {
					display: none;
				}
			}
		}
		&.a2a_button_x {
			span {
				position: relative;
				&::after {
					content: "";
					background-image: url("data:image/svg+xml,%3Csvg width='20' height='18' viewBox='0 0 20 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.0749 15.8068C16.0372 13.0915 14 10.3758 11.9643 7.65857C11.6664 7.97472 11.3705 8.28896 11.0745 8.60511C13.0664 11.2621 15.0602 13.919 17.052 16.5741C17.0887 16.6233 17.1253 16.671 17.1615 16.7202H14.5884L9.69666 10.0741C9.39882 10.3903 9.10097 10.7083 8.80503 11.0245C9.98001 12.6178 11.1531 14.2131 12.3262 15.8068C12.8654 16.5379 13.4024 17.2686 13.9416 17.9996H19.7197C19.1698 17.2686 18.6214 16.5379 18.0752 15.8068H18.0749ZM3.22033 1.2791H5.57945L7.5675 3.92882C8.46829 5.12935 9.36945 6.3318 10.2702 7.53233C10.5662 7.21618 10.8621 6.90194 11.1584 6.58579C9.51208 4.39103 7.86535 2.19628 6.219 0H0.689209C2.24594 2.11619 3.80305 4.23048 5.36016 6.34629C6.24455 7.54492 7.12741 8.74393 8.00988 9.94256C8.30582 9.62641 8.60176 9.31026 8.89961 8.9941L3.22033 1.2791Z' fill='%23243C49'/%3E%3Cpath d='M9.69716 10.0748C9.39931 10.3909 9.10147 10.709 8.80553 11.0251C7.30905 12.6185 5.8122 14.2137 4.31572 15.8074C3.63041 16.5385 2.9451 17.2692 2.25826 18.0003H0.452881C1.13819 17.2692 1.82351 16.5385 2.51034 15.8074C3.46223 14.7915 4.4164 13.7755 5.36829 12.7596C6.24886 11.8203 7.12981 10.8829 8.01077 9.94357C8.30671 9.62742 8.60264 9.31127 8.90049 8.99512L9.69716 10.0751V10.0748Z' fill='%23243C49'/%3E%3Cpath d='M19.1521 0C16.7563 2.55286 14.3606 5.10571 11.9649 7.65857C11.667 7.97472 11.3711 8.28896 11.0752 8.60511C10.8082 8.24892 10.5397 7.89043 10.2712 7.53233C10.5672 7.21618 10.8631 6.90194 11.1594 6.58579C13.2188 4.39103 15.2782 2.19475 17.3379 0H19.1525H19.1521Z' fill='%23243C49'/%3E%3C/svg%3E%0A");
					background-position: center;
					background-repeat: no-repeat;
					background-size: 14px;
					bottom: unset;
					display: block;
					height: 100%;
					left: 50%;
					position: absolute;
					top: 50%;
					transform: translate(-50%, -50%);
					width: 100%;
				}
				svg {
					display: none;
				}
			}
		}
		&.a2a_button_linkedin{
			span {
				position: relative;
				&::after {
					content: "";
					background-image: url("data:image/svg+xml,%3Csvg width='18' height='16' viewBox='0 0 18 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.58055 15.6129V5.30867H0.979572V15.6129H4.58055ZM2.78034 3.90229C4.03541 3.90229 4.81756 3.11039 4.81756 2.12162C4.79401 1.11089 4.03541 0.341309 2.80407 0.341309C1.57273 0.341309 0.766846 1.11115 0.766846 2.12162C0.766846 3.11039 1.54827 3.90229 2.75678 3.90229H2.78034Z' fill='%23243C49'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.57544 15.613H10.1764V9.85863C10.1764 9.55078 10.2 9.24294 10.2951 9.02314C10.5553 8.40762 11.148 7.77029 12.1426 7.77029C13.446 7.77029 13.9669 8.71555 13.9669 10.1005V15.613H17.5677V9.70518C17.5677 6.5402 15.7913 5.06738 13.4219 5.06738C11.4792 5.06738 10.6264 6.10035 10.1527 6.80367H10.1764V5.3088H6.57544C6.62273 6.27551 6.57544 15.613 6.57544 15.613Z' fill='%23243C49'/%3E%3C/svg%3E%0A");
					background-position: center;
					background-repeat: no-repeat;
					background-size: 14px;
					bottom: unset;
					display: block;
					height: 100%;
					left: 50%;
					position: absolute;
					top: 50%;
					transform: translate(-50%, -50%);
					width: 100%;
				}
				svg {
					display: none;
				}
			}
		}
		&.a2a_button_email {
			span {
				position: relative;
				&::after {
					content: "";
					background-image: url("data:image/svg+xml,%3Csvg width='19' height='19' viewBox='0 0 19 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.832 3.16699H3.16536C2.29453 3.16699 1.58995 3.87949 1.58995 4.75033L1.58203 14.2503C1.58203 15.1212 2.29453 15.8337 3.16536 15.8337H15.832C16.7029 15.8337 17.4154 15.1212 17.4154 14.2503V4.75033C17.4154 3.87949 16.7029 3.16699 15.832 3.16699ZM15.5154 6.53158L9.91828 10.0307C9.66495 10.1891 9.33245 10.1891 9.07911 10.0307L3.48203 6.53158C3.40265 6.48701 3.33313 6.42681 3.27769 6.3546C3.22225 6.2824 3.18204 6.19969 3.15949 6.11149C3.13693 6.0233 3.13251 5.93144 3.14649 5.84149C3.16046 5.75153 3.19255 5.66534 3.2408 5.58815C3.28904 5.51095 3.35245 5.44434 3.42719 5.39236C3.50192 5.34038 3.58643 5.30411 3.67559 5.28573C3.76475 5.26735 3.85671 5.26726 3.94591 5.28545C4.03511 5.30364 4.11969 5.33975 4.19453 5.39158L9.4987 8.70866L14.8029 5.39158C14.8777 5.33975 14.9623 5.30364 15.0515 5.28545C15.1407 5.26726 15.2326 5.26735 15.3218 5.28573C15.411 5.30411 15.4955 5.34038 15.5702 5.39236C15.6449 5.44434 15.7084 5.51095 15.7566 5.58815C15.8048 5.66534 15.8369 5.75153 15.8509 5.84149C15.8649 5.93144 15.8605 6.0233 15.8379 6.11149C15.8154 6.19969 15.7751 6.2824 15.7197 6.3546C15.6643 6.42681 15.5947 6.48701 15.5154 6.53158Z' fill='%23243C49'/%3E%3C/svg%3E%0A");
					background-position: center;
					background-repeat: no-repeat;
					background-size: 16px;
					bottom: unset;
					display: block;
					height: 100%;
					left: 50%;
					position: absolute;
					top: 50%;
					transform: translate(-50%, -50%);
					width: 100%;
				}
				svg {
					display: none;
				}
			}
		}
	}
}

/*
 * Bottom Pages Option
 */

.addtoany_share_save_container.addtoany_content.addtoany_content_bottom{
	margin-block-end: 1.5rem !important;
	.a2a_kit{
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: flex-end;
		gap: 20px;
		@include addtoany;
	}
}

/*
 * Directory top Block
 */
.social-header{
	.addtoany_shortcode {
		.a2a_kit {
			display: flex;
			flex-direction: row;
			flex-wrap: wrap;
			align-items: center;
			justify-content: flex-end;
			gap: 10px;
			margin-bottom: 1.5rem;
			@include media-breakpoint-up(sm) {
				justify-content: flex-start;
			}
			@include addtoany;
		}
	}
}

/*
 * Single Post Float
 */

article {
	position: relative;
	.addtoany-float {
		@include media-breakpoint-up(xl) {
			position: absolute;
			right: 0;
			top: 20vh;
			width: 40px;
		}
		@include media-breakpoint-down(xl) {
			margin: 20px 0;
		}
		.addtoany_shortcode {
			.a2a_kit {
				display: flex;
				align-items: center;
				flex-wrap: wrap;
				gap: 20px;
				@include media-breakpoint-up(xl) {
					flex-direction: column;
				}

				@include addtoany;
				
				a.addtoany_share {
					@include media-breakpoint-up(xl) {
						text-orientation: mixed;
						writing-mode: vertical-rl;
						transform: rotate(180deg);
						margin: 0 0 10px;
					}
				}
			}
		}
	}
}