.aw-ssi-widget {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}

.aw-ssi-widget .aw-ssi-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	min-width: 40px;
	min-height: 40px;
	text-decoration: none;
	border-radius: 50%;
	transition: transform 0.2s ease;
	color: var(--aw-ssi-icon-color, #333333) !important;
	background-color: var(--aw-ssi-bg-color, #ffffff) !important;
	border: 2px solid var(--aw-ssi-icon-color, #333333) !important;
	cursor: pointer;
	box-sizing: border-box;
}

.aw-ssi-widget .aw-ssi-icon:hover {
	transform: translateY(-2px);
}

.aw-ssi-widget .aw-ssi-icon-no-url,
.aw-ssi-widget .aw-ssi-icon-no-url:hover {
	cursor: default;
	opacity: 0.65;
	transform: none;
}

.aw-ssi-widget .aw-ssi-icon i {
	font-size: 18px;
	color: inherit;
}

.aw-ssi-widget.aw-ssi-icon-set-enfold .aw-ssi-icon svg,
.aw-ssi-widget.aw-ssi-icon-set-enfold .aw-ssi-icon svg path,
.aw-ssi-widget.aw-ssi-icon-set-enfold .aw-ssi-icon svg use {
	fill: currentColor !important;
}

.aw-ssi-widget.aw-ssi-icon-set-enfold .aw-ssi-icon svg {
	width: 1em;
	height: 1em;
	max-width: 100%;
	max-height: 100%;
}

.aw-ssi-widget.aw-ssi-style-outline .aw-ssi-icon {
	background-color: transparent !important;
	color: var(--aw-ssi-icon-color, #333333) !important;
	border-color: var(--aw-ssi-icon-color, #333333) !important;
}

.aw-ssi-widget.aw-ssi-style-filled .aw-ssi-icon {
	background-color: var(--aw-ssi-icon-color, #333333) !important;
	color: var(--aw-ssi-bg-color, #ffffff) !important;
	border-color: var(--aw-ssi-icon-color, #333333) !important;
}

.aw-ssi-widget.aw-ssi-style-icon-only .aw-ssi-icon {
	background-color: transparent !important;
	border: 0 !important;
	width: auto;
	min-width: 0;
	height: auto;
	min-height: 0;
	padding: 0;
	border-radius: 0;
}

.aw-ssi-widget.aw-ssi-style-icon-only .aw-ssi-icon i {
	font-size: 24px;
}

.aw-ssi-widget.aw-ssi-style-square .aw-ssi-icon {
	border-radius: 4px;
	background-color: var(--aw-ssi-bg-color, #ffffff) !important;
	color: var(--aw-ssi-icon-color, #333333) !important;
	border-color: var(--aw-ssi-icon-color, #333333) !important;
}

.aw-ssi-widget.aw-ssi-style-rounded-square .aw-ssi-icon {
	border-radius: 8px;
	background-color: var(--aw-ssi-bg-color, #ffffff) !important;
	color: var(--aw-ssi-icon-color, #333333) !important;
	border-color: var(--aw-ssi-icon-color, #333333) !important;
}

.aw-ssi-widget.aw-ssi-size-small .aw-ssi-icon {
	width: 25px;
	height: 25px;
	min-width: 25px;
	min-height: 25px;
	font-size: 25px;
}

.aw-ssi-widget.aw-ssi-size-small .aw-ssi-icon i {
	font-size: 14px;
}

.aw-ssi-widget.aw-ssi-size-medium .aw-ssi-icon {
	width: 30px;
	height: 30px;
	min-width: 30px;
	min-height: 30px;
	font-size: 30px;
}

.aw-ssi-widget.aw-ssi-size-medium .aw-ssi-icon i {
	font-size: 16px;
}

.aw-ssi-widget.aw-ssi-size-large .aw-ssi-icon {
	width: 35px;
	height: 35px;
	min-width: 35px;
	min-height: 35px;
	font-size: 35px;
}

.aw-ssi-widget.aw-ssi-size-large .aw-ssi-icon i {
	font-size: 18px;
}

.aw-ssi-widget.aw-ssi-style-icon-only.aw-ssi-size-small .aw-ssi-icon,
.aw-ssi-widget.aw-ssi-style-icon-only.aw-ssi-size-small .aw-ssi-icon i {
	font-size: 20px;
}

.aw-ssi-widget.aw-ssi-style-icon-only.aw-ssi-size-medium .aw-ssi-icon,
.aw-ssi-widget.aw-ssi-style-icon-only.aw-ssi-size-medium .aw-ssi-icon i {
	font-size: 24px;
}

.aw-ssi-widget.aw-ssi-style-icon-only.aw-ssi-size-large .aw-ssi-icon,
.aw-ssi-widget.aw-ssi-style-icon-only.aw-ssi-size-large .aw-ssi-icon i {
	font-size: 28px;
}

.widget_agency_worker_simple_social_icon_widget.aw-ssi-no-padding {
	margin: 0 !important;
	padding: 0 !important;
}

.aw-ssi-no-padding .aw-ssi-widget {
	margin: 0 !important;
	padding: 0 !important;
}

.widget.widget_agency_worker_simple_social_icon_widget {
	overflow: visible !important;
}

.aw-ssi-widget-form {
	margin-bottom: 15px;
}

.aw-ssi-widget-form p {
	margin: 0 0 14px;
}

.aw-ssi-widget-form label {
	display: block;
	margin-bottom: 4px;
	font-weight: 600;
	font-size: 13px;
}

.aw-ssi-widget-form .widefat,
.aw-ssi-widget-form input[type="text"].aw-ssi-color-picker,
.aw-ssi-widget-form input[type="url"].aw-ssi-url-input {
	max-width: 100%;
	box-sizing: border-box;
}

.aw-ssi-icons-section {
	margin-top: 20px;
	padding: 16px;
	background: #f6f7f7;
	border: 1px solid #dcdcde;
	border-radius: 4px;
}

.aw-ssi-icons-section h4 {
	margin: 0 0 12px;
	font-size: 13px;
	font-weight: 600;
	color: #1d2327;
}

.aw-ssi-icons-container {
	margin-bottom: 12px;
}

.aw-ssi-icon-row {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 10px;
	padding: 10px 28px 10px 12px;
	background: #fff;
	border: 1px solid #dcdcde;
	border-radius: 4px;
	position: relative;
	min-height: 44px;
}

.aw-ssi-icon-row:last-child {
	margin-bottom: 0;
}

.aw-ssi-drag-handle {
	cursor: grab;
	color: #787c82;
	font-size: 18px;
	width: 28px;
	min-width: 28px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	border-radius: 4px;
}

.aw-ssi-drag-handle:hover {
	color: #1d2327;
	background: #f0f0f1;
}

.aw-ssi-drag-handle:active {
	cursor: grabbing;
}

.aw-ssi-platform-select,
.aw-ssi-url-input {
	padding: 6px 10px;
	border: 1px solid #8c8f94;
	border-radius: 4px;
	font-size: 13px;
	height: 34px;
	box-sizing: border-box;
}

.aw-ssi-platform-select {
	width: 145px;
	flex: 0 0 145px;
}

.aw-ssi-url-input {
	flex: 1 1 auto;
	min-width: 0;
}

.aw-ssi-remove-icon {
	position: absolute;
	top: -5px;
	right: -5px;
	width: 20px;
	height: 20px;
	padding: 0;
	border: 0;
	background: #dc3232;
	color: #fff;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	line-height: 1;
}

.aw-ssi-remove-icon:hover {
	background: #a00;
}

.aw-ssi-add-icon {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
}

.aw-ssi-color-picker {
	width: 100%;
	max-width: 120px;
}

@media (max-width: 782px) {
	.aw-ssi-icon-row {
		flex-wrap: wrap;
	}

	.aw-ssi-platform-select,
	.aw-ssi-url-input {
		flex: 1 1 100%;
		width: 100%;
	}
}
