/* Poppins override — swaps the platform body font from Manrope to Poppins.
   Local files in /assets/fonts/poppins/ */

@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/poppins/Poppins-Regular-400.ttf') format('truetype');
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/assets/fonts/poppins/Poppins-Medium-500.ttf') format('truetype');
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/assets/fonts/poppins/Poppins-SemiBold-600.ttf') format('truetype');
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/assets/fonts/poppins/Poppins-Bold-700.ttf') format('truetype');
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/assets/fonts/poppins/Poppins-ExtraBold-800.ttf') format('truetype');
}

:root {
  /* Override the platform body font variable */
  --font-manrope: Poppins, sans-serif;
}

/* Highlight the price text in the paywall legal copy with a black background */
._postscript_wrapper_1bn1a_481 strong,
._postscript_wrapper_1bn1a_481 p strong,
._offer_promotional_1bn1a_364 strong,
._offer_desktop_1bn1a_185 strong {
  background: #000 !important;
  color: #fff !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
  display: inline-block !important;
  margin: 0 2px !important;
}

/* Force the headline price pill ("Just $2.99") to a pure black background.
   The inline style on the div already sets background — use a child selector
   to win over the class+inline combo and ensure the whole pill renders black. */
[class*="_right_price_"] {
  background-color: #000 !important;
  background-image: none !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
}
[class*="_right_price_"] p {
  color: #fff !important;
}

/* Make the headline price "Get Full Access For Just $X.XX" appear on a
   black background so it stands out. The original _subtitle_1svrp_617 rule
   only sets color:#000 (no background) with position:absolute — keep the
   positioning, just add a black pill background and make text white. */
[class*="_subtitle_"][class*="1svrp_"] {
  background-color: #000 !important;
  background-image: none !important;
  color: #fff !important;
  padding: 8px 18px !important;
  border-radius: 999px !important;
  white-space: nowrap;
}

/* Style the inline price element inside the subtitle as part of the pill
   (so "$3.99" inherits white text and pill background) */
[class*="_subtitle_"][class*="1svrp_"] p,
[class*="_subtitle_"][class*="1svrp_"] span {
  color: #fff !important;
}

/* Also force black background on _right_price_ pill (the $1.99 redeem coupon
   price) so it pops. The knitting theme already sets background:#000000
   inline — this guarantees any theme gets a black pill. */
[class*="_right_price_"] {
  background-color: #000 !important;
  background-image: none !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
}
[class*="_right_price_"] p {
  color: #fff !important;
}