/* Promo code coupon style — applied sitewide.
   No colour fill. Dotted border. Scissors icon on the cut line.
   Overrides .bbf-code, .bbt-code, .bc-promo, .ac-promo-code,
   .promo-code-cell[data-code-type="branded"] and similar pill components. */

/* ---------- Featured card promo code (betting-bonuses-south-africa) ---------- */
.bbf-code{
  position: relative;
  background: transparent !important;
  border: 1.5px dashed var(--color-text-muted, #6b7280) !important;
  color: var(--color-text) !important;
  padding: 14px 18px 14px 44px !important;
  border-radius: var(--radius-md);
}
.bbf-code .bbf-code-label{ color: var(--color-text-muted) !important; }
.bbf-code .bbf-code-value{ color: var(--color-text) !important; background: transparent !important; }
.bbf-code .bbf-code-hint{ color: var(--color-text-muted) !important; }

/* Scissors icon on the left "cut line" */
.bbf-code::before{
  content: "";
  position: absolute;
  left: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><circle cx='6' cy='6' r='3'/><circle cx='6' cy='18' r='3'/><line x1='20' y1='4' x2='8.12' y2='15.88'/><line x1='14.47' y1='14.48' x2='20' y2='20'/><line x1='8.12' y1='8.12' x2='12' y2='12'/></svg>");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
}

/* ---------- Compact comparison-table cell promo code ---------- */
.bbt-code{
  position: relative;
  background: transparent !important;
  border: 1.5px dashed var(--color-text-muted, #6b7280) !important;
  color: var(--color-text) !important;
  padding: 6px 10px 6px 28px !important;
  border-radius: 6px;
}
.bbt-code .bbt-code-value{ color: var(--color-text) !important; }
.bbt-code .bbt-code-hint{ color: var(--color-text-muted) !important; }
.bbt-code.copied{
  background: transparent !important;
  border-color: var(--color-success, #16a34a) !important;
}
.bbt-code.copied .bbt-code-hint{ color: var(--color-success, #16a34a) !important; }
.bbt-code::before{
  content: "";
  position: absolute;
  left: 5px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><circle cx='6' cy='6' r='3'/><circle cx='6' cy='18' r='3'/><line x1='20' y1='4' x2='8.12' y2='15.88'/><line x1='14.47' y1='14.48' x2='20' y2='20'/><line x1='8.12' y1='8.12' x2='12' y2='12'/></svg>");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
}

/* ---------- Bonus-codes hub list ---------- */
.bc-promo{
  position: relative;
  background: transparent !important;
  border: 1.5px dashed var(--color-text-muted, #6b7280) !important;
  color: var(--color-text) !important;
  padding-left: 36px !important;
}
.bc-promo:hover{
  background: transparent !important;
  border-color: var(--color-text) !important;
}
.bc-promo::before{
  content: "";
  position: absolute;
  left: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><circle cx='6' cy='6' r='3'/><circle cx='6' cy='18' r='3'/><line x1='20' y1='4' x2='8.12' y2='15.88'/><line x1='14.47' y1='14.48' x2='20' y2='20'/><line x1='8.12' y1='8.12' x2='12' y2='12'/></svg>");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
}

/* ---------- Affiliate-card promo button (tcz-row, ac-promo-code) ---------- */
.ac-promo-code{
  position: relative;
  background: transparent !important;
  border: 1.5px dashed var(--color-text-muted, #6b7280) !important;
  color: var(--color-text) !important;
  padding-left: 36px !important;
}
.ac-promo-code:hover{
  background: transparent !important;
  border-color: var(--color-text) !important;
}
.ac-promo-code .ac-promo-value{ color: var(--color-text) !important; background: transparent !important; }
.ac-promo-code .ac-promo-copy{ color: var(--color-text-muted) !important; }
.ac-promo-code::before{
  content: "";
  position: absolute;
  left: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><circle cx='6' cy='6' r='3'/><circle cx='6' cy='18' r='3'/><line x1='20' y1='4' x2='8.12' y2='15.88'/><line x1='14.47' y1='14.48' x2='20' y2='20'/><line x1='8.12' y1='8.12' x2='12' y2='12'/></svg>");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
}

/* ---------- Inline promo-code pill (.promo-code-cell, branded variant) ---------- */
.promo-code-cell[data-code-type="branded"],
.promo-code-cell{
  background: transparent !important;
  border: 1.5px dashed var(--color-text-muted, #6b7280) !important;
  color: var(--color-text) !important;
}
.promo-code-cell[data-code-type="branded"]::after{
  /* Hide the "BRAND CODE" yellow flag — coupon look only */
  display: none !important;
}

/* ---------- Promo-code page hero box ---------- */
.promo-code-wrap,
.promo-code-box,
.promo-code-block{
  position: relative;
  background: transparent !important;
  border: 1.5px dashed var(--color-text-muted, #6b7280) !important;
  padding-left: 56px !important;
}
.promo-code-block::before,
.promo-code-wrap::before,
.promo-code-box::before{
  content: "";
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><circle cx='6' cy='6' r='3'/><circle cx='6' cy='18' r='3'/><line x1='20' y1='4' x2='8.12' y2='15.88'/><line x1='14.47' y1='14.48' x2='20' y2='20'/><line x1='8.12' y1='8.12' x2='12' y2='12'/></svg>");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
}
.promo-code-text,
.promo-code-inline{
  background: transparent !important;
  color: var(--color-text) !important;
}
.promo-code-copy-btn{
  background: transparent !important;
  color: var(--color-text) !important;
  border: 1px solid var(--color-text-muted, #6b7280) !important;
}
.promo-code-copy-btn:hover{
  background: var(--color-text) !important;
  color: var(--color-bg) !important;
}

/* Dark-mode: lighten the dashed border so it stays visible */
[data-theme="dark"] .bbf-code,
[data-theme="dark"] .bbt-code,
[data-theme="dark"] .bc-promo,
[data-theme="dark"] .ac-promo-code,
[data-theme="dark"] .promo-code-cell,
[data-theme="dark"] .promo-code-wrap,
[data-theme="dark"] .promo-code-box,
[data-theme="dark"] .promo-code-block{
  border-color: var(--color-text-muted, #9ca3b0) !important;
}
[data-theme="dark"] .bbf-code::before,
[data-theme="dark"] .bbt-code::before,
[data-theme="dark"] .bc-promo::before,
[data-theme="dark"] .ac-promo-code::before,
[data-theme="dark"] .promo-code-block::before,
[data-theme="dark"] .promo-code-wrap::before,
[data-theme="dark"] .promo-code-box::before{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3b0' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><circle cx='6' cy='6' r='3'/><circle cx='6' cy='18' r='3'/><line x1='20' y1='4' x2='8.12' y2='15.88'/><line x1='14.47' y1='14.48' x2='20' y2='20'/><line x1='8.12' y1='8.12' x2='12' y2='12'/></svg>");
}