/**
 * Styles for frontend advertisements.
 */

.iap-ad-wrapper {
	margin: 20px 0;
	text-align: center;
	display: block;
	clear: both;
}

.iap-ad-wrapper.iap-align-left {
	float: left;
	margin: 0 20px 20px 0;
	text-align: left;
}

.iap-ad-wrapper.iap-align-right {
	float: right;
	margin: 0 0 20px 20px;
	text-align: right;
}

.iap-ad-wrapper.iap-align-center {
	text-align: center;
	margin: 20px auto;
	display: block;
}

.iap-ad-wrapper.iap-align-none {
	text-align: left;
	margin: 10px 0;
}

/* Floating Sticky Ads Placement Styles */
.iap-ad-wrapper.iap-floating {
	position: fixed;
	z-index: 99999;
	margin: 0;
	background: #fff;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
	border: 1px solid #ddd;
	padding: 10px;
	border-radius: 4px;
	animation: iapFadeIn 0.3s ease-out;
}

.iap-ad-wrapper.iap-floating-top {
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: auto;
	max-width: 100%;
}

.iap-ad-wrapper.iap-floating-bottom {
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: auto;
	max-width: 100%;
}

.iap-ad-wrapper .iap-ad-close {
	position: absolute;
	top: -10px;
	right: -10px;
	background: #333;
	color: #fff;
	border: none;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	font-size: 11px;
	line-height: 20px;
	text-align: center;
	cursor: pointer;
	padding: 0;
	box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.iap-ad-wrapper .iap-ad-close:hover {
	background: #ff4d4d;
}

@keyframes iapFadeIn {
	from { opacity: 0; transform: translate(-50%, 10px); }
	to { opacity: 1; transform: translate(-50%, 0); }
}

@media (max-width: 767px) {
	.iap-hide-mobile { display: none !important; }
}
@media (min-width: 768px) and (max-width: 1023px) {
	.iap-hide-tablet { display: none !important; }
}
@media (min-width: 1024px) {
	.iap-hide-desktop { display: none !important; }
}