/**
 * JT Flash Sale (Countdown) widget styles.
 *
 * Extracted verbatim from the shared jt-widgets.css Flash Sale
 * section. Already scoped by stable classes, not per-instance IDs,
 * so no selector rewriting was needed.
 */

/* --- JT Flash Sale (Countdown) Styles --- */
.jt-flash-container { display: flex; width: 100%; }
.jt-flash-premium-wrapper {
	position: relative;
	overflow: hidden;
	display: flex; align-items: center; justify-content: space-between;
	border-radius: 24px; padding: 35px 45px; width: 100%;
	box-shadow: 0 20px 40px -10px rgba(15, 23, 42, 0.05), 0 10px 20px -5px rgba(15, 23, 42, 0.02); 
	flex-wrap: wrap; gap: 30px; box-sizing: border-box;
}
.jt-flash-premium-wrapper::before {
	content: ''; position: absolute; top: -100px; left: -50px; width: 350px; height: 350px;
	background: radial-gradient(circle, rgba(250, 52, 52, 0.08) 0%, rgba(250, 52, 52, 0) 70%);
	border-radius: 50%; z-index: 0; pointer-events: none;
}
.jt-fp-info, .jt-fp-timer-area, .jt-fp-action { position: relative; z-index: 1; }
.jt-fp-info { display: flex; align-items: center; gap: 16px; flex: 1; min-width: 250px; }
.jt-fp-icon { 
	width: 50px; height: 50px; background: linear-gradient(135deg, #FA3434 0%, #ff6b6b 100%); color: #ffffff; border-radius: 50%; 
	display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; 
	box-shadow: 0 12px 24px -6px rgba(250,52,52,0.4); 
}
.jt-fp-text { display: flex; flex-direction: column; }
.jt-fp-title { font-size: 24px; font-weight: 900; color: #0f172a; margin: 0 0 6px 0; letter-spacing: -0.8px; line-height: 1.2; }
.jt-fp-subtitle { font-size: 14.5px; color: #64748b; margin: 0; font-weight: 500; line-height: 1.4; }

.jt-flash-timer { display: flex; align-items: center; gap: 6px; }
.jt-fp-timebox {
	display: flex; flex-direction: column; align-items: center; justify-content: center; 
	background: #ffffff; border: 1px solid rgba(241, 245, 249, 0.8); border-radius: 16px; width: 64px; height: 64px; 
	box-shadow: 0 10px 20px -5px rgba(0,0,0,0.04), inset 0 2px 4px rgba(255,255,255,1); transition: all 0.3s ease;
}
.jt-flash-timer:hover .jt-fp-timebox { border-color: #ffbaba; transform: translateY(-2px); box-shadow: 0 12px 24px -5px rgba(250,52,52,0.12), inset 0 2px 4px rgba(255,255,255,1); }
.jt-fp-digit { font-size: 22px; font-weight: 800; color: #FA3434; line-height: 1; }
.jt-fp-label { font-size: 11px; font-weight: 700; color: #64748b; text-transform: uppercase; letter-spacing: 0.5px; margin-top: 4px; }
.jt-fp-sep { font-size: 24px; font-weight: 800; color: #cbd5e1; margin: 0 2px; animation: joom-blink 1.2s infinite alternate; }

.jt-fp-action { flex-shrink: 0; }
.jt-fp-btn {
	position: relative; overflow: hidden;
	background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%); color: #ffffff; padding: 13px 28px; border-radius: 100px; 
	font-weight: 700; font-size: 14.5px; display: inline-flex; align-items: center; gap: 8px; 
	text-decoration: none; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 8px 20px rgba(15,23,42,0.15);
}
.jt-fp-btn::after {
	content: ''; position: absolute; top: 0; left: -100%; width: 50%; height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
	transform: skewX(-20deg); transition: 0.6s ease;
}
.jt-fp-btn i { font-size: 12px; transition: transform 0.3s ease; }
.jt-fp-btn:hover { background: #FA3434; transform: translateY(-3px); box-shadow: 0 12px 24px rgba(250,52,52,0.25); color: #ffffff; }
.jt-fp-btn:hover i { transform: translateX(4px); }
.jt-fp-btn:hover::after { left: 150%; }

.jt-flash-expired-msg { color: #ef4444; font-weight: 800; font-size: 18px; }
@keyframes joom-blink { 0% { opacity: 1; transform: scale(1); } 100% { opacity: 0.4; transform: scale(0.9); } }

@media (max-width: 1024px) {
	.jt-flash-premium-wrapper { padding: 24px; justify-content: center; }
	.jt-fp-info { min-width: 100%; text-align: center; justify-content: center; flex-direction: column; gap: 12px; }
}
@media (max-width: 600px) {
	.jt-flash-premium-wrapper {
		flex-direction: column;
		padding: 24px 20px;
		gap: 20px;
	}
	.jt-fp-title { font-size: 20px; }
	.jt-fp-timebox { width: 56px; height: 56px; }
	.jt-fp-digit { font-size: 18px; }
	.jt-fp-label { font-size: 10px; }
	.jt-fp-sep { font-size: 20px; }
	.jt-fp-action, .jt-fp-btn { width: 100%; justify-content: center; }
}