/**
 * CartNexa Add To Cart Widget CSS
 * Isolated per-widget styling with luxury baby aesthetic
 */

.cn-add-to-cart-wrapper {
	width: 100%;
	font-family: var(--cn-font-family, sans-serif);
	box-sizing: border-box;
}

/* Stock Status Row */
.cn-stock-status-row {
	margin-bottom: 14px;
}

.cn-stock-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 14px;
	border-radius: 50px;
	font-size: 13px;
	font-weight: 600;
}

.cn-stock-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	display: inline-block;
}

.cn-stock-badge.instock {
	background-color: rgba(34, 197, 94, 0.1);
	color: var(--cn-success, #22C55E);
}
.cn-stock-badge.instock .cn-stock-dot {
	background-color: var(--cn-success, #22C55E);
	box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.2);
}

.cn-stock-badge.lowstock {
	background-color: rgba(250, 204, 21, 0.15);
	color: #D97706;
}
.cn-stock-badge.lowstock .cn-stock-dot {
	background-color: var(--cn-warning, #FACC15);
	box-shadow: 0 0 0 3px rgba(250, 204, 21, 0.3);
}

.cn-stock-badge.outofstock {
	background-color: rgba(239, 68, 68, 0.1);
	color: var(--cn-danger, #EF4444);
}
.cn-stock-badge.outofstock .cn-stock-dot {
	background-color: var(--cn-danger, #EF4444);
}

/* Add To Cart Form & Button */
.cn-add-to-cart-form {
	margin: 0;
	padding: 0;
	width: 100%;
}

.cn-add-to-cart-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: auto;
	height: 54px;
	padding: 0 32px;
	background-color: var(--cn-primary, #25C4C8);
	color: #FFFFFF;
	font-family: var(--cn-font-family, sans-serif);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.3px;
	border: none;
	border-radius: var(--cn-radius, 18px);
	cursor: pointer;
	position: relative;
	overflow: hidden;
	transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
	box-shadow: 0 6px 20px rgba(37, 196, 200, 0.3);
	outline: none;
}

.cn-btn-full-width-yes .cn-add-to-cart-btn {
	width: 100%;
}

/* Hover & Active States */
.cn-add-to-cart-btn:hover:not(:disabled):not(.disabled) {
	background-color: var(--cn-primary-hover, #19B0B4);
	transform: translateY(-2px);
	box-shadow: 0 10px 25px rgba(25, 176, 180, 0.4);
}

.cn-add-to-cart-btn:active:not(:disabled):not(.disabled) {
	transform: translateY(0);
	box-shadow: 0 4px 12px rgba(25, 176, 180, 0.3);
}

.cn-add-to-cart-btn:focus-visible {
	box-shadow: 0 0 0 3px var(--cn-primary, #25C4C8);
}

/* Disabled State */
.cn-add-to-cart-btn:disabled,
.cn-add-to-cart-btn.disabled {
	background-color: var(--cn-border, #E6EEF2);
	color: #98A2B3;
	cursor: not-allowed;
	box-shadow: none;
	transform: none;
}

/* Icons & Labels */
.cn-btn-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.cn-btn-icon svg {
	display: block;
}

/* Loading Spinner & Success Checkmark */
.cn-btn-spinner,
.cn-btn-success-check {
	display: none;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.cn-add-to-cart-btn.loading .cn-btn-text,
.cn-add-to-cart-btn.loading .cn-btn-icon {
	opacity: 0;
}

.cn-add-to-cart-btn.loading .cn-btn-spinner {
	display: inline-block;
	animation: cnSpin 0.8s linear infinite;
}

.cn-add-to-cart-btn.success {
	background-color: var(--cn-success, #22C55E) !important;
	box-shadow: 0 6px 20px rgba(34, 197, 94, 0.4) !important;
}

.cn-add-to-cart-btn.success .cn-btn-text,
.cn-add-to-cart-btn.success .cn-btn-icon {
	opacity: 0;
}

.cn-add-to-cart-btn.success .cn-btn-success-check {
	display: inline-block;
	animation: cnCheckBounce 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

@keyframes cnSpin {
	100% {
		transform: translate(-50%, -50%) rotate(360deg);
	}
}

@keyframes cnCheckBounce {
	0% {
		transform: translate(-50%, -50%) scale(0.3);
		opacity: 0;
	}
	100% {
		transform: translate(-50%, -50%) scale(1);
		opacity: 1;
	}
}
