/**
 * ChairCrazy Popups — Frontend CSS.
 */

.ccp-popup {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: inherit;
}

.ccp-popup[hidden] { display: none !important; }

.ccp-overlay {
	position: absolute;
	inset: 0;
	cursor: pointer;
	animation: ccp-fade-in 200ms ease-out;
}

.ccp-container {
	position: relative;
	max-width: 480px;
	width: calc(100% - 32px);
	max-height: calc(100vh - 48px);
	overflow-y: auto;
	background: #fff;
	color: #222;
	border-radius: 8px;
	padding: 36px 28px 28px;
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.25);
	animation: ccp-pop-in 220ms cubic-bezier(.2,.9,.3,1.2);
}

/* Positions */
.ccp-popup.ccp-pos-top { align-items: flex-start; padding-top: 48px; }
.ccp-popup.ccp-pos-bottom { align-items: flex-end; padding-bottom: 48px; }
.ccp-popup.ccp-pos-top-left { align-items: flex-start; justify-content: flex-start; padding: 24px; }
.ccp-popup.ccp-pos-top-right { align-items: flex-start; justify-content: flex-end; padding: 24px; }
.ccp-popup.ccp-pos-bottom-left { align-items: flex-end; justify-content: flex-start; padding: 24px; }
.ccp-popup.ccp-pos-bottom-right { align-items: flex-end; justify-content: flex-end; padding: 24px; }

.ccp-close {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 32px;
	height: 32px;
	border: none;
	background: transparent;
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
	color: inherit;
	opacity: 0.6;
	padding: 0;
}
.ccp-close:hover { opacity: 1; }
.ccp-close:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; opacity: 1; }

.ccp-content { line-height: 1.5; }
.ccp-content > :first-child { margin-top: 0; }
.ccp-content > :last-child { margin-bottom: 0; }

/* Success state */
.ccp-state-success { text-align: center; padding: 8px 0; }
.ccp-success-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: #16a34a;
	color: #fff;
	font-size: 32px;
	font-weight: 700;
	margin: 0 auto 16px;
}
.ccp-success-headline { margin: 0 0 8px; font-size: 22px; }
.ccp-success-message { margin: 0 0 20px; opacity: 0.8; }

.ccp-coupon-wrap {
	border: 2px dashed currentColor;
	border-radius: 8px;
	padding: 20px 16px;
	margin: 0 auto 20px;
	opacity: 0.95;
}
.ccp-coupon-label {
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin: 0 0 8px;
	opacity: 0.7;
}
.ccp-coupon-row {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-bottom: 12px;
}
.ccp-coupon-code {
	font-size: 22px;
	font-weight: 700;
	letter-spacing: 0.05em;
	background: rgba(0,0,0,0.04);
	padding: 6px 12px;
	border-radius: 4px;
	user-select: all;
}
.ccp-coupon-copy {
	border: 1px solid currentColor;
	background: transparent;
	color: inherit;
	padding: 6px 14px;
	cursor: pointer;
	border-radius: 4px;
	font-size: 13px;
}
.ccp-coupon-copy:hover { background: rgba(0,0,0,0.06); }
.ccp-coupon-expires { font-size: 13px; opacity: 0.7; margin: 0 0 16px; }
.ccp-coupon-apply {
	display: inline-block;
	padding: 10px 22px;
	background: #111;
	color: #fff;
	text-decoration: none;
	border-radius: 4px;
	font-weight: 600;
}
.ccp-coupon-apply:hover { opacity: 0.9; color: #fff; }

/* Lock body scroll when popup open */
html.ccp-open, html.ccp-open body { overflow: hidden; }

/* Trigger button helper for block render */
.ccp-trigger-btn {
	display: inline-block;
	padding: 10px 22px;
	background: #111;
	color: #fff;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	font-size: 14px;
}
.ccp-trigger-btn:hover { opacity: 0.9; }

@keyframes ccp-fade-in {
	from { opacity: 0; }
	to   { opacity: 1; }
}
@keyframes ccp-pop-in {
	from { opacity: 0; transform: translateY(16px) scale(0.96); }
	to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* Divi-built popups: let the builder layout control width and padding. */
.ccp-divi .ccp-container {
	max-width: none;
	width: auto;
	padding: 0;
}

@media (max-width: 480px) {
	.ccp-container { padding: 32px 18px 22px; }
	.ccp-divi .ccp-container { padding: 0; }
	.ccp-coupon-code { font-size: 18px; }
}
