/* ==========================================================================
   rise-halloween-popup.css — Halloween 2026 corner promo (Traitors Live!)

   Enqueued only while rise_halloween_popup_is_active() (functions.php) —
   i.e. until RISE_HALLOWEEN_POPUP_END. Markup is built by
   rise_render_halloween_popup() only for visitors who haven't dismissed it.

   Non-modal: a small card pinned to the lower-left corner, no overlay,
   no scroll lock. Palette matches the Halloween flyer: graveyard green,
   pumpkin orange.
   ========================================================================== */

.rise-hwn-popup {
	--hwn-green:      #1F4A3D;
	--hwn-green-dark: #133027;
	--hwn-orange:     #F08236;

	position:      fixed;
	left:          var( --rise-space-4 );
	bottom:        var( --rise-space-4 );
	z-index:       9990; /* below the DSF modal overlay (99999) */
	width:         min( 340px, calc( 100vw - 32px ) );
	border-top:    4px solid var( --hwn-orange );
	border-radius: var( --rise-radius-md );
	background:    linear-gradient( 160deg, var( --hwn-green ) 0%, var( --hwn-green-dark ) 100% );
	color:         #FFFFFF;
	box-shadow:    var( --rise-shadow-lg );
	overflow:      hidden;
	opacity:       0;
	transform:     translateY( calc( 100% + 24px ) );
	transition:    transform var( --rise-dur-slow ) var( --rise-ease ), opacity var( --rise-dur-slow ) var( --rise-ease );
}

.rise-hwn-popup.is-visible {
	opacity:   1;
	transform: none;
}

.rise-hwn-popup-link {
	display:         flex;
	align-items:     center;
	gap:             var( --rise-space-3 );
	padding:         var( --rise-space-3 ) 40px var( --rise-space-3 ) var( --rise-space-3 );
	color:           #FFFFFF !important;
	text-decoration: none !important;
}
.rise-hwn-popup-link:focus-visible {
	outline:        3px solid var( --hwn-orange );
	outline-offset: -3px;
}

.rise-hwn-popup-icon {
	flex:        0 0 auto;
	line-height: 0;
}

.rise-hwn-popup-text {
	display:        flex;
	flex-direction: column;
	gap:            2px;
	min-width:      0;
}

.rise-hwn-popup-eyebrow {
	color:          var( --hwn-orange );
	font-family:    var( --rise-font-heading );
	font-weight:    var( --rise-fw-heavy );
	font-size:      var( --rise-fs-caption );
	text-transform: uppercase;
	letter-spacing: 0.05em;
	white-space:    nowrap;
}

.rise-hwn-popup-headline {
	font-family:    var( --rise-font-display );
	font-weight:    400;
	font-size:      28px;
	line-height:    var( --rise-lh-tight );
	letter-spacing: var( --rise-ls-display );
}

.rise-hwn-popup-sub {
	color:       rgba( 255, 255, 255, 0.85 );
	font-family: var( --rise-font-body );
	font-size:   var( --rise-fs-small );
	line-height: var( --rise-lh-snug );
}

.rise-hwn-popup-cta {
	margin-top:     4px;
	color:          var( --hwn-orange );
	font-family:    var( --rise-font-heading );
	font-weight:    var( --rise-fw-heavy );
	font-size:      var( --rise-fs-button );
	text-transform: uppercase;
	letter-spacing: var( --rise-ls-caps );
}
.rise-hwn-popup-link:hover .rise-hwn-popup-cta { text-decoration: underline; }

.rise-hwn-popup-close {
	position:      absolute;
	top:           6px;
	right:         6px;
	width:         28px;
	height:        28px;
	padding:       0;
	border:        none;
	border-radius: var( --rise-radius-pill );
	background:    none;
	color:         rgba( 255, 255, 255, 0.7 );
	font-size:     22px;
	line-height:   1;
	cursor:        pointer;
}
.rise-hwn-popup-close:hover,
.rise-hwn-popup-close:focus-visible {
	color:      #FFFFFF;
	background: rgba( 255, 255, 255, 0.12 );
}

@media ( prefers-reduced-motion: reduce ) {
	.rise-hwn-popup { transition: none; }
}

@media print {
	.rise-hwn-popup { display: none !important; }
}
