/* Softer, see-through buttons (matches the Riley demo's softer style).
 * These override the colours set inside the app, so remove this file
 * (and its <link> in index.html) to go back to the original look. */

/* Spotify / Venmo / Instagram pills: frosted see-through pills */
a.rounded-full[style*="rgb(29, 185, 84)"],
a.rounded-full[style*="rgb(0, 112, 204)"],
a.rounded-full[style*="rgb(0, 140, 255)"],
a.rounded-full[style*="linear-gradient(45deg"] {
  background: rgba(251, 248, 242, .12) !important;
  color: #34465E !important;
  border: 1.5px solid rgba(52, 70, 94, .38) !important;
  text-shadow: 0 0 6px rgba(255, 255, 255, .7);
  -webkit-backdrop-filter: none; backdrop-filter: none;
}
a.rounded-full[style*="rgb(29, 185, 84)"] svg,
a.rounded-full[style*="linear-gradient(45deg"] svg circle[stroke="none"] { fill: currentColor !important; }
a.rounded-full[style*="linear-gradient(45deg"] svg { stroke: currentColor !important; }
a.rounded-full[style*="rgb(0, 112, 204)"] span,
a.rounded-full[style*="rgb(0, 140, 255)"] span { background: #34465E !important; color: #FBF8F2 !important; }

/* Banner buttons: see-through gold and a frosted outline */
button.rounded-full[style*="background: rgb(227, 195, 131)"] { background: rgba(227, 195, 131, .78) !important; -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
button.rounded-full[style*="border: 1.5px solid rgb(227, 195, 131)"] { background: rgba(255, 255, 255, .10) !important; -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }

/* "Request a song" button: see-through slate */
button[style*="linear-gradient(135deg, rgb(78, 110, 147), rgb(59, 88, 120))"] {
  background: linear-gradient(135deg, rgba(78, 110, 147, .22), rgba(110, 138, 170, .16)) !important;
  color: #2B3A4E !important;
  text-shadow: 0 0 8px rgba(255, 255, 255, .8);
  box-shadow: 0 6px 18px rgba(52, 70, 94, .10) !important;
  border: 1px solid rgba(255, 255, 255, .55) !important;
  -webkit-backdrop-filter: none; backdrop-filter: none;
}

/* Announcement banner ("Vote for Vibeka!"): see-through honey gold */
a[style*="rgb(140, 106, 46)"].rounded-xl,
div[style*="rgb(140, 106, 46)"].rounded-xl {
  background: rgba(150, 116, 56, .20) !important;
  color: #5A4320 !important;
  text-shadow: 0 0 8px rgba(255, 255, 255, .8);
  border: 1px solid rgba(255, 255, 255, .55) !important;
  -webkit-backdrop-filter: none; backdrop-filter: none;
}

/* Form buttons and Venmo pay buttons: see-through slate */
button.w-full[style*="background: rgb(78, 110, 147)"],
button.flex-1[style*="background: rgb(78, 110, 147)"],
a.w-full[style*="rgb(0, 140, 255)"],
a.w-full[style*="rgb(0, 112, 204)"] { background: rgba(78, 110, 147, .78) !important; }
a.w-full[style*="border: 1.5px solid rgb(0, 140, 255)"],
a.w-full[style*="border: 1.5px solid rgb(0, 112, 204)"] { background: rgba(255, 255, 255, .45) !important; border-color: rgba(78, 110, 147, .6) !important; color: #4E6E93 !important; }

/* Rounder main buttons */
button.w-full.rounded-lg, a.w-full.rounded-lg { border-radius: 12px !important; }
