:root {
  --color-acid: #c68c4a !important; 
  --color-acid-deep: #855026 !important;
}

/* Hardcoded greens in components need overriding globally */
.tl-dot.connected { background: #c68c4a !important; }
.tl-status[data-kind="success"] { border-color: #c68c4a !important; color: #855026 !important; background: #f4e8dc !important; }
.tl-status a, #prepared-costs a { color: #855026 !important; }
.tl-consent { border-color: #c68c4a !important; background: #f4e8dc !important; color: #855026 !important; }
.tl-consent input { accent-color: #c68c4a !important; }

/* Image filter to convert green to bronze */
img[src*="jtm-exchange-pixel-light"] {
  filter: sepia(1) hue-rotate(-30deg) saturate(1.5) brightness(0.9) contrast(1.2);
}

/* Existing utilities inherit these tokens, preserving hover states and opacity.
   Do not match class substrings: that would activate hover-only backgrounds. */
#main #draft-status,
#pairing-token-ticker { color: var(--color-acid-deep) !important; }