/*
 * ConvertPlug "7% flash" modal — brand restyle (cart + checkout only).
 * Scoped to .ck-flash-restyle, which assets/js/flash-popup-close.js adds after
 * verifying this is the FLASH coupon modal. Without JS the stock look renders,
 * matching the stock (link) close behavior. Brand: navy #01234A, orange #BD5B0B.
 * NOTE: !important is required throughout — ConvertPlug writes inline styles and
 * generated per-module CSS.
 */

/* Card: kill the hotlinked black-grunge background, go clean white */
.cp-modal.ck-flash-restyle .cp-modal-body {
	background: #ffffff !important;
	background-image: none !important;
	border-top: 5px solid #BD5B0B;
	padding: 44px 36px 34px !important;
}
.cp-modal.ck-flash-restyle .cp_cs_overlay {
	display: none !important; /* dim layer that only made sense over the dark image */
}
.cp-modal.ck-flash-restyle .cp-modal-content {
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 24px 64px rgba(1, 35, 74, 0.35) !important;
}

/* The round "DISCOUNT" stamp image (hotlinked from live) — gone */
.cp-modal.ck-flash-restyle .cp-image-container {
	display: none !important;
}

/* Title */
.cp-modal.ck-flash-restyle .cp-title,
.cp-modal.ck-flash-restyle .cp-title span {
	color: #01234A !important;
	font-family: 'Montserrat', sans-serif !important;
	font-size: 30px !important;
	line-height: 1.25 !important;
	font-weight: 700 !important;
	text-align: center;
}

/* Body copy */
.cp-modal.ck-flash-restyle .cp-short-description,
.cp-modal.ck-flash-restyle .cp-short-description span {
	color: #1C2835 !important;
	font-family: 'Montserrat', sans-serif !important;
	font-size: 16px !important;
	line-height: 1.7 !important;
	font-weight: 500 !important;
}

/* The coupon code pill (span injected by flash-popup-close.js) */
.cp-modal.ck-flash-restyle .cp-short-description span.ck-flash-code {
	display: inline-block;
	padding: 3px 16px;
	margin: 6px 4px 0;
	border: 2px dashed #BD5B0B;
	border-radius: 8px;
	background: #FFF6EE;
	color: #BD5B0B !important;
	font-size: 22px !important;
	font-weight: 700 !important;
	letter-spacing: 0.08em;
}

/* CLOSE button: dark-red grunge → brand orange, readable type */
.cp-modal.ck-flash-restyle .cp-form-container .cp-submit.cp-btn-flat {
	background: #BD5B0B !important;
	border-radius: 8px !important;
	cursor: pointer;
	transition: background 0.2s ease;
	padding: 13px 15px !important;
}
.cp-modal.ck-flash-restyle .cp-form-container .cp-submit.cp-btn-flat:hover {
	background: #A44F09 !important;
}
.cp-modal.ck-flash-restyle .cp-form-container .cp-submit.cp-btn-flat,
.cp-modal.ck-flash-restyle .cp-form-container .cp-submit.cp-btn-flat span {
	color: #ffffff !important;
	font-family: 'Montserrat', sans-serif !important; /* overrides inline "Fredericka the Great" */
	font-size: 15px !important;
	font-weight: 600 !important;
	letter-spacing: 0.14em;
}

/* X close: the white cross.png vanishes on a white card — draw our own */
.cp-modal.ck-flash-restyle .cp-overlay-close img {
	display: none !important;
}
.cp-modal.ck-flash-restyle .cp-overlay-close {
	width: 32px;
	height: 32px;
	opacity: 0.55;
	transition: opacity 0.2s ease;
}
.cp-modal.ck-flash-restyle .cp-overlay-close::before {
	content: "\2715";
	display: block;
	text-align: center;
	font: 400 18px/32px 'Montserrat', sans-serif;
	color: #1C2835;
}
.cp-modal.ck-flash-restyle .cp-overlay-close:hover {
	opacity: 1;
}

@media (max-width: 480px) {
	.cp-modal.ck-flash-restyle .cp-modal-body {
		padding: 34px 20px 26px !important;
	}
	.cp-modal.ck-flash-restyle .cp-title,
	.cp-modal.ck-flash-restyle .cp-title span {
		font-size: 24px !important;
	}
	.cp-modal.ck-flash-restyle .cp-short-description span.ck-flash-code {
		font-size: 19px !important;
	}
}