/* UBlockout shared promo bar
 *
 * Pink-shimmer announcement strip used at the top of landing pages.
 * Markup expected on the page:
 *
 *   <div data-ub-promo-bar
 *        data-end="2026-05-10"
 *        data-prefix="Mother's Day Sleep Package - ">
 *     Mother's Day Sleep Package + 25% Off
 *   </div>
 *
 * The script at /promo/promo-bar.js adds the .ub-promo-bar class on
 * mount and replaces the inner text with the computed countdown.
 *
 * No position/z-index here — the page provides positioning context
 * (e.g. wrap with `class="relative z-10"` if it sits over a hero).
 */

.ub-promo-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 12px 16px;
  text-align: center;
  color: #000;
  background: linear-gradient(110deg, #F5D1CF 0%, #FAE0DE 20%, #FFF0EF 40%, #FFFFFF 50%, #FFF0EF 60%, #FAE0DE 80%, #F5D1CF 100%);
  background-size: 200% 100%;
  animation: ubPromoBarShimmer 5s linear infinite;
  font-family: "HK Nova", -apple-system, system-ui, sans-serif;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

@media (min-width: 768px) {
  .ub-promo-bar { font-size: 12px; letter-spacing: 2px; }
}

@keyframes ubPromoBarShimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: 0 0; }
}