/* ============================================================
   WordSearchZ - FALL2026 promotional offer
   Styles for the site-wide promo bar and the pricing coupon.
   Click-to-copy (behaviour in promo-new.js). Load AFTER custom.css.
   Remove this file + its <link>, promo-new.js + its <script>, and
   the promo markup to end the promotion.
   ============================================================ */

.wsz-sr-only { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* site-wide promo bar */
.wsz-promo-bar {
  background:
    linear-gradient(90deg, rgba(34, 197, 94, 0.16), rgba(16, 185, 129, 0.10) 50%, rgba(34, 197, 94, 0.16));
  border-bottom: 1px solid rgba(74, 222, 128, 0.25);
}
.wsz-promo-inner {
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
  gap: 0.5rem 1rem; padding: 0.7rem 0; text-align: center;
}
.wsz-promo-tag {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-size: 0.62rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase;
  color: #04120a; background: #4ade80; padding: 0.22rem 0.6rem; border-radius: 9999px;
}
.wsz-promo-text { margin: 0; color: #d1fae5; font-size: 0.9rem; font-weight: 600; }
.wsz-promo-text strong { color: #fff; }

/* the code is a click-to-copy chip */
.wsz-promo-code {
  display: inline-flex; align-items: center; gap: 0.45rem; vertical-align: middle;
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-weight: 800; letter-spacing: 0.12em; color: #4ade80; cursor: pointer;
  padding: 0.18rem 0.6rem; margin: 0 0.15rem; border-radius: 0.55rem;
  background: rgba(3, 7, 18, 0.5); border: 1px dashed rgba(74, 222, 128, 0.6);
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.wsz-promo-code:hover { background: rgba(34, 197, 94, 0.14); border-color: #4ade80; color: #86efac; }
.wsz-promo-code:focus-visible { outline: 2px solid #4ade80; outline-offset: 2px; }
.wsz-promo-copy-ic { width: 0.85rem; height: 0.85rem; flex: 0 0 auto; }
.wsz-promo-copy-ic--check { display: none; }
.wsz-promo-code.is-copied { color: #86efac; border-style: solid; border-color: #4ade80; background: rgba(34, 197, 94, 0.18); }
.wsz-promo-code.is-copied .wsz-promo-copy-ic--copy { display: none; }
.wsz-promo-code.is-copied .wsz-promo-copy-ic--check { display: inline-block; }

.wsz-promo-cta {
  display: inline-flex; align-items: center; gap: 0.35rem;
  font-size: 0.8rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.05em;
  color: #04120a; background: #4ade80; padding: 0.35rem 0.85rem; border-radius: 9999px;
  text-decoration: none; transition: background 0.2s ease, transform 0.2s ease;
}
.wsz-promo-cta:hover { background: #86efac; transform: translateY(-1px); }

/* coupon block inside the pricing card */
.wsz-coupon {
  width: 100%; margin-bottom: 1.5rem; padding: 0.9rem 1rem; text-align: center;
  border-radius: 1rem; background: rgba(34, 197, 94, 0.06);
  border: 1px dashed rgba(74, 222, 128, 0.45);
}
.wsz-coupon-label {
  font-size: 0.6rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase;
  color: #4ade80; margin-bottom: 0.5rem;
}
.wsz-coupon-row { display: flex; align-items: center; justify-content: center; gap: 0.5rem; }
.wsz-coupon-code {
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-size: 1.15rem; font-weight: 900; letter-spacing: 0.14em; color: #fff;
}
.wsz-coupon-copy {
  display: inline-flex; align-items: center; gap: 0.35rem; cursor: pointer;
  font-size: 0.66rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em;
  color: #4ade80; background: rgba(3, 7, 18, 0.45); border: 1px solid rgba(74, 222, 128, 0.4);
  padding: 0.3rem 0.55rem; border-radius: 0.5rem; transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}
.wsz-coupon-copy:hover { color: #86efac; border-color: #4ade80; background: rgba(34, 197, 94, 0.12); }
.wsz-coupon-copy:focus-visible { outline: 2px solid #4ade80; outline-offset: 2px; }
.wsz-coupon-copy svg { width: 0.85rem; height: 0.85rem; flex: 0 0 auto; }
.wsz-coupon-copy .wsz-copy-done { display: none; }
.wsz-coupon-copy.is-copied { color: #04120a; background: #4ade80; border-color: #4ade80; }
.wsz-coupon-copy.is-copied .wsz-copy-default { display: none; }
.wsz-coupon-copy.is-copied .wsz-copy-done { display: inline; }
.wsz-coupon-sub { margin: 0.6rem 0 0; font-size: 0.8rem; color: #9ca3af; }
.wsz-coupon-sub strong { color: #4ade80; }

@media (prefers-reduced-motion: reduce) {
  .wsz-promo-code, .wsz-promo-cta, .wsz-coupon-copy { transition: none; }
}
