/* Torro buttons v2 — tinted fill + hairline stroke, like the reference.
   Brand action (Book Us, Offer Gig, Post, Play…): a light iris wash, an iris stroke, ink text.
   Green only means "yes / confirmed" (Answer an offer, Accept, Going, Booked) — never a second brand colour.
   Every text pair passes WCAG AA (ink on the coral wash ≈ 14:1; white on #1D8538 = 4.7:1). */

:root {
  --btn-brand-bg: rgba(91, 91, 214, 0.10);
  --btn-brand-bg-hover: rgba(91, 91, 214, 0.17);
  --btn-brand-line: rgba(91, 91, 214, 0.8);
  --btn-brand-ink: #17171C;
  --color-positive: #1D8538;
  --color-on-positive: #FFFFFF;
  --btn-pos-bg: rgba(29, 133, 56, 0.1);
  --btn-pos-line: rgba(29, 133, 56, 0.75);
  --btn-pos-ink: #17171C;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --btn-brand-bg: rgba(124, 122, 240, 0.18);
    --btn-brand-bg-hover: rgba(124, 122, 240, 0.28);
    --btn-brand-line: rgba(142, 140, 242, 0.85);
    --btn-brand-ink: #F2F2F5;
    --color-positive: #3DD68C;
    --color-on-positive: #111010;
    --btn-pos-bg: rgba(61, 214, 140, 0.14);
    --btn-pos-line: rgba(61, 214, 140, 0.7);
    --btn-pos-ink: #F2F2F5;
  }
}
:root[data-theme="dark"] {
  --btn-brand-bg: rgba(124, 122, 240, 0.18);
  --btn-brand-bg-hover: rgba(124, 122, 240, 0.28);
  --btn-brand-line: rgba(142, 140, 242, 0.85);
  --btn-brand-ink: #F2F2F5;
  --color-positive: #3DD68C;
  --color-on-positive: #111010;
  --btn-pos-bg: rgba(61, 214, 140, 0.14);
  --btn-pos-line: rgba(61, 214, 140, 0.7);
  --btn-pos-ink: #F2F2F5;
}

/* Brand action: wash + stroke */
.dx-btn--primary,
.pf-btn--primary,
.pf-playall,
.pf-cta,
.of-cta,
.dx-cta,
.cmp__post,
.pf-track__play.is-on {
  background: var(--btn-brand-bg);
  color: var(--btn-brand-ink);
  box-shadow: inset 0 0 0 1px var(--btn-brand-line);
}
.pf-track__play.is-on svg, .pf-playall svg { color: var(--btn-brand-ink); }
.dx-cta:disabled, .cmp__post:disabled { background: var(--color-field); color: var(--color-ink-muted); box-shadow: none; }

/* Yes / confirmed: solid green for the decision, green wash once it is done */
.dx-cta[data-a="accept"], .btn-positive {
  background: var(--color-positive);
  color: var(--color-on-positive);
  box-shadow: none;
}
.dx-btn.is-on,
.dx-btn[data-answer] {
  background: var(--btn-pos-bg);
  color: var(--btn-pos-ink);
  box-shadow: inset 0 0 0 1px var(--btn-pos-line);
}
.dx-btn.is-on svg { color: var(--color-positive); }
.ev__rsvp .ev__ok { color: var(--color-positive); }
.dx-tag.is-booked {
  background: var(--btn-pos-bg);
  color: var(--btn-pos-ink);
  box-shadow: inset 0 0 0 1px var(--btn-pos-line);
}
.dx-tag.is-booked svg { color: var(--color-positive); }

@media (hover: hover) and (pointer: fine) {
  .dx-btn--primary:hover, .pf-btn--primary:hover, .pf-playall:hover, .pf-cta:hover, .of-cta:hover,
  .dx-cta:not(:disabled):not([data-a="accept"]):hover, .cmp__post:not(:disabled):hover {
    background: var(--btn-brand-bg-hover);
    filter: none;
  }
  .dx-cta[data-a="accept"]:hover, .btn-positive:hover { filter: brightness(1.08); }
  .dx-btn[data-answer]:hover { background: rgba(29, 133, 56, 0.18); }
}