/**
 * Group themes — applied via body[data-group-theme="..."] when a logged-in
 * user is viewing a page scoped to a group with a theme set.
 */

/* ─── Tropical (Parrot Heads, beach clubs) ─── */
body[data-group-theme="tropical"] {
  --theme-primary: #06b6d4;     /* turquoise */
  --theme-primary-dark: #0891b2;
  --theme-accent: #f97316;      /* sunset orange */
  --theme-accent-soft: #fb923c;
  --theme-bg: #ecfeff;
  --theme-card-border: #67e8f9;
  --theme-link: #0e7490;
}
body[data-group-theme="tropical"] .group-themed-hero {
  background:
    linear-gradient(135deg, rgba(8,145,178,0.92) 0%, rgba(6,182,212,0.85) 40%, rgba(249,115,22,0.92) 100%),
    radial-gradient(ellipse at top right, rgba(252,211,77,0.5) 0%, transparent 60%);
  color: white;
  padding: 48px 32px;
  border-radius: 16px;
  position: relative;
  overflow: hidden;
  min-height: 240px;
  box-shadow: inset 0 -60px 40px -20px rgba(0,0,0,0.15);
}
/* Big colorful parrot centered behind the text */
body[data-group-theme="tropical"] .group-themed-hero::before {
  content: '';
  position: absolute;
  right: 4%;
  top: 50%;
  transform: translateY(-50%) scaleX(-1) rotate(-8deg);
  width: 220px;
  height: 220px;
  background: url('https://api.iconify.design/fluent-emoji/parrot.svg') no-repeat center / contain;
  filter: drop-shadow(0 8px 20px rgba(0,0,0,0.35));
  opacity: 0.95;
  z-index: 1;
  animation: heroParrotBob 4s ease-in-out infinite alternate;
}
/* Palm tree silhouettes at the bottom for depth */
body[data-group-theme="tropical"] .group-themed-hero::after {
  content: '🌴 🌴 🌴 🌴 🌴 🌴 🌴 🌴';
  position: absolute;
  bottom: -8px;
  left: 0; right: 0;
  text-align: center;
  font-size: 1.5rem;
  letter-spacing: 28px;
  opacity: 0.35;
  pointer-events: none;
  z-index: 0;
}
@keyframes heroParrotBob {
  0%   { transform: translateY(-50%) scaleX(-1) rotate(-8deg); }
  100% { transform: translateY(calc(-50% - 8px)) scaleX(-1) rotate(-4deg); }
}
body[data-group-theme="tropical"] .group-themed-hero > * {
  position: relative;
  z-index: 2;
  max-width: 60%;
}
body[data-group-theme="tropical"] .group-themed-hero h2 {
  color: #fff;
  font-weight: 900;
  font-size: 2.5rem;
  text-shadow: 0 2px 10px rgba(0,0,0,0.25);
}
body[data-group-theme="tropical"] .group-themed-hero .tagline {
  color: #fff;
  font-style: italic;
  font-size: 1.25rem;
  text-shadow: 0 1px 6px rgba(0,0,0,0.2);
}
body[data-group-theme="tropical"] .group-themed-hero .motto {
  color: #fef3c7;
  font-size: 1rem;
  text-shadow: 0 1px 4px rgba(0,0,0,0.25);
}

/* Mobile: stack the parrot below the text */
@media (max-width: 768px) {
  body[data-group-theme="tropical"] .group-themed-hero {
    padding: 24px 16px 200px;
    min-height: 360px;
  }
  body[data-group-theme="tropical"] .group-themed-hero > * { max-width: 100%; }
  body[data-group-theme="tropical"] .group-themed-hero::before {
    right: 50%;
    top: auto;
    bottom: 12px;
    transform: translateX(50%) scaleX(-1) rotate(-4deg);
    width: 160px;
    height: 160px;
    animation: none;
  }
}
body[data-group-theme="tropical"] .btn-theme {
  background: #f97316; color: #fff; border: none;
}
body[data-group-theme="tropical"] .btn-theme:hover { background: #ea580c; color: #fff; }
body[data-group-theme="tropical"] .badge-theme { background: #06b6d4; color: #fff; }
body[data-group-theme="tropical"] .theme-divider {
  height: 4px;
  background: linear-gradient(to right, #06b6d4, #f97316, #06b6d4);
  border: none; border-radius: 2px; margin: 16px 0;
}

/* ─── Flying tropical critters (tropical theme only) ─── */
/* All sprites use Twemoji SVGs for identical rendering across OSes.
   The parrot is mirrored (scaleX(-1)) so the beak faces direction of travel. */
.flying-parrot,
.flying-margarita,
.flying-flamingo,
.flying-pinacolada,
.flying-hibiscus,
.flying-sun {
  position: fixed;
  pointer-events: none;
  z-index: 9998;
  display: none;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,0.25));
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  opacity: 0;
}
body[data-group-theme="tropical"] .flying-parrot,
body[data-group-theme="tropical"] .flying-margarita,
body[data-group-theme="tropical"] .flying-flamingo,
body[data-group-theme="tropical"] .flying-pinacolada,
body[data-group-theme="tropical"] .flying-hibiscus,
body[data-group-theme="tropical"] .flying-beer,
body[data-group-theme="tropical"] .flying-beach,
body[data-group-theme="tropical"] .flying-coconut,
body[data-group-theme="tropical"] .flying-sun { display: block; }

.flying-beer {
  width: 56px; height: 56px;
  background-image: url('https://api.iconify.design/fluent-emoji/beer-mug.svg');
  bottom: 30vh; left: -80px;
  animation: driftRight 30s linear infinite;
  animation-delay: 18s;
}
.flying-beach {
  width: 60px; height: 60px;
  background-image: url('https://api.iconify.design/fluent-emoji/beach-with-umbrella.svg');
  top: 70vh; right: -80px;
  animation: flamingoFly 28s linear infinite;
  animation-delay: 11s;
}
.flying-coconut {
  width: 44px; height: 44px;
  background-image: url('https://api.iconify.design/fluent-emoji/coconut.svg');
  top: -40px; left: 70vw;
  animation: tumbleDown 22s linear infinite;
  animation-delay: 12s;
}

/* The big macaw — Microsoft Fluent Emoji (vivid red/yellow/blue scarlet macaw,
   more "Jimmy Buffett tropical" than Twitter's flatter green parrot).
   Flies left → right; beak points right via scaleX(-1). */
.flying-parrot {
  width: 110px; height: 110px;
  background-image: url('https://api.iconify.design/fluent-emoji/parrot.svg');
  bottom: 10vh; left: -140px;
  animation: parrotFly 18s linear infinite, parrotFlap 0.35s ease-in-out infinite alternate;
  transform-origin: 50% 50%;
}
@keyframes parrotFly {
  0%   { left: -140px; bottom: 10vh; opacity: 0; }
  4%   { opacity: 1; }
  20%  { left: 25vw;   bottom: 22vh; }
  35%  { left: 42vw;   bottom: 8vh;  }
  50%  { left: 58vw;   bottom: 28vh; }
  65%  { left: 72vw;   bottom: 14vh; }
  80%  { left: 88vw;   bottom: 26vh; }
  96%  { opacity: 1; }
  100% { left: 115vw;  bottom: 18vh; opacity: 0; }
}
@keyframes parrotFlap {
  /* scaleX(-1) flips so beak faces right (direction of travel) */
  0%   { transform: scaleX(-1) scaleY(1)    rotate(-4deg); }
  100% { transform: scaleX(-1) scaleY(0.88) rotate(2deg); }
}

/* Margarita — drifts top edge, gentle bob */
.flying-margarita {
  width: 64px; height: 64px;
  background-image: url('https://api.iconify.design/fluent-emoji/tropical-drink.svg');
  top: 20vh; left: -80px;
  animation: driftRight 26s linear infinite, bobUp 4s ease-in-out infinite alternate;
  animation-delay: 3s, 0s;
}
/* Pina colada (cocktail glass) — middle drift */
.flying-pinacolada {
  width: 60px; height: 60px;
  background-image: url('https://api.iconify.design/fluent-emoji/cocktail-glass.svg');
  top: 50vh; left: -80px;
  animation: driftRight 32s linear infinite;
  animation-delay: 14s;
  transform: rotate(8deg);
}
/* Flamingo — Fluent emoji (more lifelike), flies right → left */
.flying-flamingo {
  width: 78px; height: 78px;
  background-image: url('https://api.iconify.design/fluent-emoji/flamingo.svg');
  top: 12vh; right: -80px;
  animation: flamingoFly 22s linear infinite;
  animation-delay: 7s;
}
/* Hibiscus — tumbles down across screen */
.flying-hibiscus {
  width: 44px; height: 44px;
  background-image: url('https://api.iconify.design/fluent-emoji/hibiscus.svg');
  top: -40px; left: 30vw;
  animation: tumbleDown 18s linear infinite;
  animation-delay: 5s;
}
/* Sun — pinned in corner, gentle pulse */
.flying-sun {
  width: 56px; height: 56px;
  background-image: url('https://api.iconify.design/fluent-emoji/sun.svg');
  top: 80px; right: 30px;
  opacity: 0.85;
  animation: sunPulse 5s ease-in-out infinite alternate;
}

@keyframes driftRight {
  0%   { left: -100px; opacity: 0; }
  6%   { opacity: 0.95; }
  94%  { opacity: 0.95; }
  100% { left: 115vw;  opacity: 0; }
}
@keyframes bobUp {
  0%   { transform: translateY(0)   rotate(-4deg); }
  100% { transform: translateY(-22px) rotate(6deg); }
}
@keyframes flamingoFly {
  0%   { right: -100px; top: 12vh; opacity: 0; transform: scaleY(1); }
  6%   { opacity: 1; }
  30%  { top: 18vh; transform: scaleY(0.92); }
  60%  { top: 8vh;  transform: scaleY(1); }
  94%  { opacity: 1; }
  100% { right: 115vw; top: 14vh; opacity: 0; transform: scaleY(0.92); }
}
@keyframes tumbleDown {
  0%   { top: -40px; opacity: 0; transform: rotate(0deg); }
  10%  { opacity: 0.9; }
  100% { top: 110vh; opacity: 0; transform: rotate(720deg); }
}
@keyframes sunPulse {
  0%   { transform: scale(1) rotate(0deg);   opacity: 0.7; }
  100% { transform: scale(1.12) rotate(20deg); opacity: 0.95; }
}

/* Sprinkle of palm tree decoration on tropical pages */
body[data-group-theme="tropical"]::before {
  content: '🌴';
  position: fixed;
  bottom: 12px;
  left: 12px;
  font-size: 2.6rem;
  opacity: 0.18;
  pointer-events: none;
  z-index: 1;
  transform: rotate(-12deg);
}
body[data-group-theme="tropical"]::after {
  content: '🌺';
  position: fixed;
  top: 64px;
  right: 18px;
  font-size: 1.6rem;
  opacity: 0.25;
  pointer-events: none;
  z-index: 1;
  animation: hibiscusSway 6s ease-in-out infinite;
}
@keyframes hibiscusSway {
  0%, 100% { transform: rotate(-8deg); }
  50%      { transform: rotate(8deg); }
}

/* Tropical avatars */
.chapter-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px; height: 32px;
  border-radius: 50%;
  background: linear-gradient(135deg, #06b6d4, #f97316);
  font-size: 1.1rem;
  margin-right: 6px;
  flex-shrink: 0;
}
.chapter-avatar.large { width: 56px; height: 56px; font-size: 2rem; }

/* ─── Patriotic (military / veterans groups) ─── */
body[data-group-theme="patriotic"] {
  --theme-primary: #dc2626;
  --theme-primary-dark: #b91c1c;
  --theme-accent: #1d4ed8;
  --theme-bg: #fef2f2;
}
body[data-group-theme="patriotic"] .group-themed-hero {
  background: linear-gradient(135deg, #dc2626 0%, #1d4ed8 100%);
  color: white;
  padding: 32px 24px; border-radius: 12px;
}
body[data-group-theme="patriotic"] .btn-theme { background: #dc2626; color: #fff; border: none; }
body[data-group-theme="patriotic"] .badge-theme { background: #1d4ed8; color: #fff; }

/* ─── Cigar Lounge (cigar / tobacco clubs) ─── */
body[data-group-theme="cigar"] {
  --theme-primary: #78350f;        /* mahogany */
  --theme-primary-dark: #451a03;
  --theme-accent: #d97706;         /* amber */
  --theme-bg: #fef3c7;
}
body[data-group-theme="cigar"] .group-themed-hero {
  background:
    linear-gradient(135deg, rgba(67,29,9,0.95) 0%, rgba(120,53,15,0.92) 50%, rgba(217,119,6,0.85) 100%),
    radial-gradient(ellipse at center, rgba(252,211,77,0.3) 0%, transparent 60%);
  color: white;
  padding: 48px 32px;
  border-radius: 16px;
  position: relative;
  overflow: hidden;
  min-height: 240px;
  box-shadow: inset 0 -60px 40px -20px rgba(0,0,0,0.35);
}
body[data-group-theme="cigar"] .group-themed-hero::before {
  /* Large illustrated cigar in the hero — game-icons set, gold-tinted */
  content: '';
  position: absolute;
  right: 6%;
  top: 50%;
  transform: translateY(-50%) rotate(-12deg);
  width: 220px;
  height: 220px;
  background: url('https://api.iconify.design/game-icons/cigar.svg?color=%23fbbf24') no-repeat center / contain;
  filter: drop-shadow(0 8px 20px rgba(0,0,0,0.5));
  opacity: 0.95;
  z-index: 1;
}
body[data-group-theme="cigar"] .group-themed-hero::after {
  /* Tobacco-leaf decorative band at bottom of hero */
  content: '';
  position: absolute;
  bottom: 0;
  left: 0; right: 0;
  height: 28px;
  background:
    url('https://api.iconify.design/game-icons/cigar.svg?color=%23fef3c7') repeat-x left center / 36px 24px,
    linear-gradient(to bottom, transparent, rgba(0,0,0,0.4));
  opacity: 0.45;
  pointer-events: none;
  z-index: 0;
}
body[data-group-theme="cigar"] .group-themed-hero > * {
  position: relative;
  z-index: 2;
  max-width: 60%;
}
body[data-group-theme="cigar"] .group-themed-hero h2 {
  color: #fef3c7;
  font-weight: 900;
  font-size: 2.4rem;
  font-family: Georgia, 'Times New Roman', serif;
  text-shadow: 0 2px 12px rgba(0,0,0,0.4);
  letter-spacing: 0.5px;
}
body[data-group-theme="cigar"] .group-themed-hero .tagline {
  color: #fde68a;
  font-style: italic;
  font-size: 1.2rem;
  font-family: Georgia, serif;
  text-shadow: 0 1px 6px rgba(0,0,0,0.4);
}
body[data-group-theme="cigar"] .group-themed-hero .motto {
  color: #fbbf24;
  font-size: 0.95rem;
  font-family: Georgia, serif;
  text-shadow: 0 1px 4px rgba(0,0,0,0.4);
}
body[data-group-theme="cigar"] .btn-theme { background: #78350f; color: #fef3c7; border: none; }
body[data-group-theme="cigar"] .btn-theme:hover { background: #451a03; }
body[data-group-theme="cigar"] .badge-theme { background: #d97706; color: #fff; }
body[data-group-theme="cigar"] .theme-divider {
  height: 4px;
  background: linear-gradient(to right, #78350f, #d97706, #78350f);
}

/* Floating cigar-themed sprites */
body[data-group-theme="cigar"] .flying-cigar,
body[data-group-theme="cigar"] .flying-whiskey,
body[data-group-theme="cigar"] .flying-bourbon,
body[data-group-theme="cigar"] .flying-decanter,
body[data-group-theme="cigar"] .flying-clink,
body[data-group-theme="cigar"] .flying-pipe,
body[data-group-theme="cigar"] .flying-leaf,
body[data-group-theme="cigar"] .flying-humidor,
body[data-group-theme="cigar"] .flying-match,
body[data-group-theme="cigar"] .flying-ashtray,
body[data-group-theme="cigar"] .flying-seal,
body[data-group-theme="cigar"] .smoke-wisp-1,
body[data-group-theme="cigar"] .smoke-wisp-2,
body[data-group-theme="cigar"] .smoke-wisp-3,
body[data-group-theme="cigar"] .lounge-gentleman { display: block; }

.flying-cigar, .flying-whiskey, .flying-bourbon, .flying-decanter, .flying-clink, .flying-pipe, .flying-leaf, .flying-humidor, .flying-match, .flying-ashtray, .flying-seal, .lounge-gentleman {
  position: fixed;
  pointer-events: none;
  z-index: 9998;
  display: none;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  opacity: 0;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,0.35));
}
/* Real cigar from game-icons set, tinted amber/brown */
.flying-cigar {
  width: 80px; height: 80px;
  background-image: url('https://api.iconify.design/game-icons/cigar.svg?color=%23d97706');
  bottom: 14vh; left: -100px;
  animation: driftRight 24s linear infinite;
  transform: rotate(-12deg);
}
.flying-whiskey {
  width: 64px; height: 64px;
  background-image: url('https://api.iconify.design/fluent-emoji/tumbler-glass.svg');
  top: 25vh; left: -80px;
  animation: driftRight 30s linear infinite, bobUp 5s ease-in-out infinite alternate;
  animation-delay: 8s, 0s;
}
/* Second bourbon — amber rocks glass (Noto emoji style) */
.flying-bourbon {
  width: 60px; height: 60px;
  background-image: url('https://api.iconify.design/noto/tumbler-glass.svg');
  top: 45vh; right: -80px;
  animation: flamingoFly 26s linear infinite;
  animation-delay: 17s;
}
/* Bourbon decanter / liquor bottle */
.flying-decanter {
  width: 60px; height: 80px;
  background-image: url('https://api.iconify.design/material-symbols/liquor.svg?color=%23b45309');
  bottom: 18vh; right: -80px;
  animation: flamingoFly 34s linear infinite;
  animation-delay: 24s;
}
/* Clinking glasses — the social drinking moment */
.flying-clink {
  width: 70px; height: 70px;
  background-image: url('https://api.iconify.design/fluent-emoji/clinking-glasses.svg');
  top: 55vh; left: -80px;
  animation: driftRight 28s linear infinite, bobUp 4s ease-in-out infinite alternate;
  animation-delay: 35s, 0s;
}
/* Smoking pipe (classy alternative) */
.flying-pipe {
  width: 64px; height: 64px;
  background-image: url('https://api.iconify.design/game-icons/pipe.svg?color=%2378350f');
  bottom: 32vh; left: -80px;
  animation: driftRight 34s linear infinite;
  animation-delay: 16s;
  transform: rotate(8deg);
}
/* Tobacco leaf tumbling */
.flying-leaf {
  width: 50px; height: 50px;
  background-image: url('https://api.iconify.design/game-icons/oak-leaf.svg?color=%2316a34a');
  top: -50px; left: 30vw;
  animation: tumbleDown 22s linear infinite;
  animation-delay: 5s;
}
/* Humidor / wooden box */
.flying-humidor {
  width: 60px; height: 60px;
  background-image: url('https://api.iconify.design/game-icons/wooden-crate.svg?color=%23451a03');
  top: 60vh; right: -80px;
  animation: flamingoFly 32s linear infinite;
  animation-delay: 11s;
}
/* Lit match — flies with a warm glow */
.flying-match {
  width: 50px; height: 50px;
  background-image: url('https://api.iconify.design/game-icons/match-tip.svg?color=%23dc2626');
  top: 38vh; right: -80px;
  animation: flamingoFly 28s linear infinite;
  animation-delay: 4s;
  filter: drop-shadow(0 0 12px rgba(252,211,77,0.6));
}
/* Ashtray with cigar */
.flying-ashtray {
  width: 64px; height: 64px;
  background-image: url('https://api.iconify.design/game-icons/ashes.svg?color=%2378716c');
  bottom: 22vh; left: -80px;
  animation: driftRight 36s linear infinite;
  animation-delay: 22s;
}
/* Gold seal / medal — vintage cigar brand crest feel */
.flying-seal {
  width: 54px; height: 54px;
  background-image: url('https://api.iconify.design/mdi/medal.svg?color=%23ca8a04');
  top: 8vh; left: -60px;
  animation: driftRight 40s linear infinite;
  animation-delay: 28s;
  filter: drop-shadow(0 4px 6px rgba(0,0,0,0.4)) drop-shadow(0 0 8px rgba(252,211,77,0.4));
}
/* Gentleman fixed in lower-left corner, releasing smoke */
.lounge-gentleman {
  width: 110px; height: 110px;
  background-image: url('https://api.iconify.design/fluent-emoji/man-in-tuxedo-medium-skin-tone.svg');
  bottom: 24px;
  left: 24px;
  opacity: 0.85;
  z-index: 1;
}
/* Smoke wisps rising from the gentleman — real smoke icon, soft white */
.smoke-wisp-1, .smoke-wisp-2, .smoke-wisp-3 {
  position: fixed;
  display: none;
  pointer-events: none;
  z-index: 1;
  width: 44px; height: 44px;
  bottom: 90px;
  left: 110px;
  background: url('https://api.iconify.design/mdi/smoke.svg?color=%23e7e5e4') no-repeat center / contain;
  opacity: 0;
  filter: blur(0.5px);
}
.smoke-wisp-1 { animation: smokeRise 4s linear infinite; }
.smoke-wisp-2 { animation: smokeRise 4.5s linear infinite; animation-delay: 1.3s; left: 130px; }
.smoke-wisp-3 { animation: smokeRise 5s linear infinite; animation-delay: 2.6s; left: 100px; }
@keyframes smokeRise {
  0%   { bottom: 90px;  opacity: 0;   transform: scale(0.4) translateX(0)   rotate(0deg); }
  15%  { opacity: 0.7; }
  50%  { opacity: 0.5;  transform: scale(1.0) translateX(18px) rotate(8deg); }
  100% { bottom: 50vh;  opacity: 0;   transform: scale(1.8) translateX(36px) rotate(-4deg); }
}

@media (max-width: 768px) {
  body[data-group-theme="cigar"] .group-themed-hero {
    padding: 24px 16px 200px;
    min-height: 360px;
  }
  body[data-group-theme="cigar"] .group-themed-hero > * { max-width: 100%; }
  body[data-group-theme="cigar"] .group-themed-hero::before {
    right: 50%; top: auto; bottom: 12px;
    transform: translateX(50%) rotate(-2deg);
    width: 150px; height: 150px;
  }
  .lounge-gentleman { width: 80px; height: 80px; bottom: 12px; left: 12px; }
  .smoke-wisp-1, .smoke-wisp-2, .smoke-wisp-3 { display: none !important; }
}

/* ─── Golf (country clubs / leagues) ─── */
body[data-group-theme="golf"] {
  --theme-primary: #15803d;
  --theme-primary-dark: #166534;
  --theme-accent: #ca8a04;
  --theme-bg: #f0fdf4;
}
body[data-group-theme="golf"] .group-themed-hero {
  background: linear-gradient(135deg, #166534 0%, #15803d 50%, #84cc16 100%);
  color: white;
  padding: 32px 24px; border-radius: 12px;
}
body[data-group-theme="golf"] .btn-theme { background: #15803d; color: #fff; border: none; }
body[data-group-theme="golf"] .badge-theme { background: #15803d; color: #fff; }

/* ─── Hide all floating sprites when user opts out ─── */
body.animations-off .flying-parrot,
body.animations-off .flying-margarita,
body.animations-off .flying-pinacolada,
body.animations-off .flying-flamingo,
body.animations-off .flying-hibiscus,
body.animations-off .flying-beer,
body.animations-off .flying-beach,
body.animations-off .flying-coconut,
body.animations-off .flying-sun,
body.animations-off .flying-cigar,
body.animations-off .flying-whiskey,
body.animations-off .flying-bourbon,
body.animations-off .flying-decanter,
body.animations-off .flying-clink,
body.animations-off .flying-pipe,
body.animations-off .flying-leaf,
body.animations-off .flying-humidor,
body.animations-off .flying-match,
body.animations-off .flying-ashtray,
body.animations-off .flying-seal,
body.animations-off .lounge-gentleman,
body.animations-off .smoke-wisp-1,
body.animations-off .smoke-wisp-2,
body.animations-off .smoke-wisp-3,
body.animations-off .flying-flower,
body.animations-off .flying-butterfly,
body.animations-off .flying-watering-can,
body.animations-off .flying-bee,
body.animations-off .flying-book,
body.animations-off .flying-coffee,
body.animations-off .flying-glasses,
body.animations-off .flying-pen,
body.animations-off .flying-football,
body.animations-off .flying-trophy,
body.animations-off .flying-medal-sport,
body.animations-off .flying-whistle { display: none !important; }
body.animations-off::before, body.animations-off::after { display: none !important; }

/* ─── Garden / Floral (garden clubs, flower societies) ─── */
body[data-group-theme="garden"] {
  --theme-primary: #16a34a;
  --theme-primary-dark: #15803d;
  --theme-accent: #ec4899;
}
body[data-group-theme="garden"] .group-themed-hero {
  background: linear-gradient(135deg, #15803d 0%, #84cc16 50%, #fbcfe8 100%);
  color: white; padding: 32px 24px; border-radius: 12px; position: relative; overflow: hidden;
}
body[data-group-theme="garden"] .flying-flower,
body[data-group-theme="garden"] .flying-butterfly,
body[data-group-theme="garden"] .flying-watering-can,
body[data-group-theme="garden"] .flying-bee,
body[data-group-theme="garden"] .flying-leaf { display: block; }
.flying-flower {
  position: fixed; pointer-events: none; z-index: 9998; display: none;
  width: 50px; height: 50px;
  background: url('https://api.iconify.design/fluent-emoji/sunflower.svg') no-repeat center / contain;
  top: -50px; left: 25vw;
  animation: tumbleDown 18s linear infinite;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,0.2));
}
.flying-butterfly {
  position: fixed; pointer-events: none; z-index: 9998; display: none;
  width: 56px; height: 56px;
  background: url('https://api.iconify.design/fluent-emoji/butterfly.svg') no-repeat center / contain;
  bottom: 30vh; left: -80px;
  animation: parrotFly 22s linear infinite, parrotFlap 0.6s ease-in-out infinite alternate;
  opacity: 0;
}
.flying-watering-can {
  position: fixed; pointer-events: none; z-index: 9998; display: none;
  width: 60px; height: 60px;
  background: url('https://api.iconify.design/game-icons/watering-can.svg?color=%2316a34a') no-repeat center / contain;
  top: 20vh; right: -80px;
  animation: flamingoFly 28s linear infinite;
  animation-delay: 5s;
  opacity: 0;
}
.flying-bee {
  position: fixed; pointer-events: none; z-index: 9998; display: none;
  width: 44px; height: 44px;
  background: url('https://api.iconify.design/fluent-emoji/honeybee.svg') no-repeat center / contain;
  top: 50vh; left: -60px;
  animation: driftRight 24s linear infinite, bobUp 2s ease-in-out infinite alternate;
  animation-delay: 10s, 0s;
}

/* ─── Book / Library (book clubs, reading circles) ─── */
body[data-group-theme="book"] {
  --theme-primary: #92400e;
  --theme-primary-dark: #78350f;
  --theme-accent: #fbbf24;
}
body[data-group-theme="book"] .group-themed-hero {
  background: linear-gradient(135deg, #451a03 0%, #92400e 50%, #fbbf24 100%);
  color: white; padding: 32px 24px; border-radius: 12px; position: relative; overflow: hidden;
}
body[data-group-theme="book"] .flying-book,
body[data-group-theme="book"] .flying-coffee,
body[data-group-theme="book"] .flying-glasses,
body[data-group-theme="book"] .flying-pen { display: block; }
.flying-book {
  position: fixed; pointer-events: none; z-index: 9998; display: none;
  width: 60px; height: 60px;
  background: url('https://api.iconify.design/fluent-emoji/open-book.svg') no-repeat center / contain;
  bottom: 20vh; left: -80px;
  animation: driftRight 28s linear infinite;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,0.2));
}
.flying-coffee {
  position: fixed; pointer-events: none; z-index: 9998; display: none;
  width: 56px; height: 56px;
  background: url('https://api.iconify.design/fluent-emoji/hot-beverage.svg') no-repeat center / contain;
  top: 30vh; right: -80px;
  animation: flamingoFly 26s linear infinite, bobUp 4s ease-in-out infinite alternate;
  animation-delay: 6s, 0s;
}
.flying-glasses {
  position: fixed; pointer-events: none; z-index: 9998; display: none;
  width: 50px; height: 50px;
  background: url('https://api.iconify.design/fluent-emoji/glasses.svg') no-repeat center / contain;
  top: 60vh; left: -60px;
  animation: driftRight 32s linear infinite;
  animation-delay: 12s;
}
.flying-pen {
  position: fixed; pointer-events: none; z-index: 9998; display: none;
  width: 50px; height: 50px;
  background: url('https://api.iconify.design/fluent-emoji/fountain-pen.svg') no-repeat center / contain;
  top: -50px; left: 60vw;
  animation: tumbleDown 20s linear infinite;
  animation-delay: 8s;
}

/* ─── Sports / Athletic (pickleball, tennis, etc.) ─── */
body[data-group-theme="sports"] {
  --theme-primary: #ea580c;
  --theme-primary-dark: #c2410c;
  --theme-accent: #facc15;
}
body[data-group-theme="sports"] .group-themed-hero {
  background: linear-gradient(135deg, #ea580c 0%, #facc15 100%);
  color: white; padding: 32px 24px; border-radius: 12px; position: relative; overflow: hidden;
}
body[data-group-theme="sports"] .flying-football,
body[data-group-theme="sports"] .flying-trophy,
body[data-group-theme="sports"] .flying-medal-sport,
body[data-group-theme="sports"] .flying-whistle { display: block; }
.flying-football {
  position: fixed; pointer-events: none; z-index: 9998; display: none;
  width: 60px; height: 60px;
  background: url('https://api.iconify.design/fluent-emoji/tennis.svg') no-repeat center / contain;
  bottom: 18vh; left: -80px;
  animation: driftRight 22s linear infinite, bobUp 1.5s ease-in-out infinite alternate;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,0.2));
}
.flying-trophy {
  position: fixed; pointer-events: none; z-index: 9998; display: none;
  width: 60px; height: 60px;
  background: url('https://api.iconify.design/fluent-emoji/trophy.svg') no-repeat center / contain;
  top: 25vh; right: -80px;
  animation: flamingoFly 30s linear infinite;
  animation-delay: 5s;
}
.flying-medal-sport {
  position: fixed; pointer-events: none; z-index: 9998; display: none;
  width: 50px; height: 50px;
  background: url('https://api.iconify.design/fluent-emoji/sports-medal.svg') no-repeat center / contain;
  top: 60vh; left: -60px;
  animation: driftRight 28s linear infinite;
  animation-delay: 10s;
}
.flying-whistle {
  position: fixed; pointer-events: none; z-index: 9998; display: none;
  width: 50px; height: 50px;
  background: url('https://api.iconify.design/material-symbols/sports.svg?color=%23ea580c') no-repeat center / contain;
  top: -50px; left: 50vw;
  animation: tumbleDown 24s linear infinite;
  animation-delay: 14s;
}

/* ─── Games (cards, dice, board games, bunco, bingo, mah-jongg) ─── */
body[data-group-theme="games"] {
  --theme-primary: #14532d;
  --theme-primary-dark: #052e16;
  --theme-accent: #fbbf24;
}
body[data-group-theme="games"] .group-themed-hero {
  background: linear-gradient(135deg, #052e16 0%, #14532d 50%, #d97706 100%);
  color: white; padding: 32px 24px; border-radius: 12px; position: relative; overflow: hidden;
  /* Subtle felt-card-table texture via repeating gradient */
}
body[data-group-theme="games"] .group-themed-hero::before {
  content: '';
  position: absolute;
  right: 6%; top: 50%;
  transform: translateY(-50%) rotate(-12deg);
  width: 200px; height: 200px;
  background: url('https://api.iconify.design/fluent-emoji/playing-card-black-joker.svg') no-repeat center / contain;
  filter: drop-shadow(0 8px 20px rgba(0,0,0,0.5));
  opacity: 0.95;
  z-index: 1;
}
body[data-group-theme="games"] .flying-die-1,
body[data-group-theme="games"] .flying-die-2,
body[data-group-theme="games"] .flying-spade,
body[data-group-theme="games"] .flying-heart,
body[data-group-theme="games"] .flying-diamond,
body[data-group-theme="games"] .flying-club,
body[data-group-theme="games"] .flying-poker-chip,
body[data-group-theme="games"] .flying-joker { display: block; }

.flying-die-1, .flying-die-2, .flying-spade, .flying-heart, .flying-diamond, .flying-club, .flying-poker-chip, .flying-joker {
  position: fixed; pointer-events: none; z-index: 9998; display: none;
  background-repeat: no-repeat; background-position: center; background-size: contain;
  opacity: 0; filter: drop-shadow(0 4px 8px rgba(0,0,0,0.3));
}
.flying-die-1 {
  width: 56px; height: 56px;
  background-image: url('https://api.iconify.design/fluent-emoji/game-die.svg');
  bottom: 18vh; left: -80px;
  animation: driftRight 22s linear infinite, dieTumble 1.2s linear infinite;
}
.flying-die-2 {
  width: 50px; height: 50px;
  background-image: url('https://api.iconify.design/fluent-emoji/game-die.svg');
  top: 30vh; right: -80px;
  animation: flamingoFly 28s linear infinite, dieTumble 1.6s linear infinite;
  animation-delay: 8s, 0s;
}
.flying-spade {
  width: 42px; height: 42px;
  background-image: url('https://api.iconify.design/fluent-emoji/spade-suit.svg');
  top: -50px; left: 25vw;
  animation: tumbleDown 18s linear infinite;
  animation-delay: 3s;
}
.flying-heart {
  width: 42px; height: 42px;
  background-image: url('https://api.iconify.design/fluent-emoji/heart-suit.svg');
  top: -50px; left: 50vw;
  animation: tumbleDown 20s linear infinite;
  animation-delay: 7s;
}
.flying-diamond {
  width: 42px; height: 42px;
  background-image: url('https://api.iconify.design/fluent-emoji/diamond-suit.svg');
  top: -50px; left: 75vw;
  animation: tumbleDown 22s linear infinite;
  animation-delay: 11s;
}
.flying-club {
  width: 42px; height: 42px;
  background-image: url('https://api.iconify.design/fluent-emoji/club-suit.svg');
  top: -50px; left: 10vw;
  animation: tumbleDown 24s linear infinite;
  animation-delay: 15s;
}
.flying-poker-chip {
  width: 60px; height: 60px;
  background-image: url('https://api.iconify.design/game-icons/poker-hand.svg?color=%23fbbf24');
  bottom: 35vh; right: -80px;
  animation: flamingoFly 30s linear infinite;
  animation-delay: 13s;
}
.flying-joker {
  width: 64px; height: 64px;
  background-image: url('https://api.iconify.design/fluent-emoji/joker.svg');
  top: 60vh; left: -80px;
  animation: driftRight 32s linear infinite, bobUp 3s ease-in-out infinite alternate;
  animation-delay: 18s, 0s;
}
@keyframes dieTumble {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
body.animations-off .flying-die-1,
body.animations-off .flying-die-2,
body.animations-off .flying-spade,
body.animations-off .flying-heart,
body.animations-off .flying-diamond,
body.animations-off .flying-club,
body.animations-off .flying-poker-chip,
body.animations-off .flying-joker { display: none !important; }

/* ─── Theatre / Drama (theatre groups, drama clubs) ─── */
body[data-group-theme="theatre"] {
  --theme-primary: #7c2d12;
  --theme-primary-dark: #4a1207;
  --theme-accent: #facc15;
}
body[data-group-theme="theatre"] .group-themed-hero {
  background: linear-gradient(135deg, #4a044e 0%, #7c2d12 50%, #facc15 100%);
  color: white; padding: 32px 24px; border-radius: 12px; position: relative; overflow: hidden;
}
body[data-group-theme="theatre"] .flying-masks,
body[data-group-theme="theatre"] .flying-curtain,
body[data-group-theme="theatre"] .flying-mic,
body[data-group-theme="theatre"] .flying-popcorn,
body[data-group-theme="theatre"] .flying-ticket-stub { display: block; }
.flying-masks, .flying-curtain, .flying-mic, .flying-popcorn, .flying-ticket-stub {
  position: fixed; pointer-events: none; z-index: 9998; display: none;
  background-repeat: no-repeat; background-position: center; background-size: contain;
  opacity: 0; filter: drop-shadow(0 4px 8px rgba(0,0,0,0.3));
}
.flying-masks {
  width: 64px; height: 64px;
  background-image: url('https://api.iconify.design/fluent-emoji/performing-arts.svg');
  bottom: 20vh; left: -80px;
  animation: driftRight 26s linear infinite;
}
.flying-curtain {
  width: 56px; height: 56px;
  background-image: url('https://api.iconify.design/material-symbols/theater-comedy.svg?color=%23facc15');
  top: 30vh; right: -80px;
  animation: flamingoFly 28s linear infinite;
  animation-delay: 7s;
}
.flying-mic {
  width: 50px; height: 50px;
  background-image: url('https://api.iconify.design/fluent-emoji/microphone.svg');
  top: -50px; left: 40vw;
  animation: tumbleDown 22s linear infinite;
  animation-delay: 4s;
}
.flying-popcorn {
  width: 60px; height: 60px;
  background-image: url('https://api.iconify.design/fluent-emoji/popcorn.svg');
  bottom: 35vh; right: -80px;
  animation: flamingoFly 24s linear infinite, bobUp 3s ease-in-out infinite alternate;
  animation-delay: 12s, 0s;
}
.flying-ticket-stub {
  width: 56px; height: 56px;
  background-image: url('https://api.iconify.design/fluent-emoji/ticket.svg');
  top: 60vh; left: -80px;
  animation: driftRight 30s linear infinite;
  animation-delay: 18s;
  transform: rotate(-12deg);
}

/* ─── Jazz / Music (jazz clubs, choirs, bands) ─── */
body[data-group-theme="jazz"] {
  --theme-primary: #1e3a8a;
  --theme-primary-dark: #1e1b4b;
  --theme-accent: #fbbf24;
}
body[data-group-theme="jazz"] .group-themed-hero {
  background: linear-gradient(135deg, #1e1b4b 0%, #1e3a8a 50%, #fbbf24 100%);
  color: white; padding: 32px 24px; border-radius: 12px; position: relative; overflow: hidden;
}
body[data-group-theme="jazz"] .flying-sax,
body[data-group-theme="jazz"] .flying-trumpet,
body[data-group-theme="jazz"] .flying-notes,
body[data-group-theme="jazz"] .flying-vinyl,
body[data-group-theme="jazz"] .flying-guitar,
body[data-group-theme="jazz"] .flying-piano { display: block; }
.flying-sax, .flying-trumpet, .flying-notes, .flying-vinyl, .flying-guitar, .flying-piano {
  position: fixed; pointer-events: none; z-index: 9998; display: none;
  background-repeat: no-repeat; background-position: center; background-size: contain;
  opacity: 0; filter: drop-shadow(0 4px 8px rgba(0,0,0,0.3));
}
.flying-sax {
  width: 64px; height: 64px;
  background-image: url('https://api.iconify.design/fluent-emoji/saxophone.svg');
  bottom: 22vh; left: -80px;
  animation: driftRight 28s linear infinite;
}
.flying-trumpet {
  width: 60px; height: 60px;
  background-image: url('https://api.iconify.design/fluent-emoji/trumpet.svg');
  top: 25vh; right: -80px;
  animation: flamingoFly 26s linear infinite;
  animation-delay: 6s;
}
.flying-notes {
  width: 44px; height: 44px;
  background-image: url('https://api.iconify.design/fluent-emoji/musical-notes.svg');
  bottom: 50vh; left: -60px;
  animation: driftRight 22s linear infinite, bobUp 2s ease-in-out infinite alternate;
  animation-delay: 3s, 0s;
}
.flying-vinyl {
  width: 56px; height: 56px;
  background-image: url('https://api.iconify.design/fluent-emoji/dvd.svg');
  top: -50px; left: 50vw;
  animation: tumbleDown 18s linear infinite;
  animation-delay: 8s;
}
.flying-guitar {
  width: 64px; height: 64px;
  background-image: url('https://api.iconify.design/fluent-emoji/guitar.svg');
  top: 55vh; right: -80px;
  animation: flamingoFly 32s linear infinite;
  animation-delay: 14s;
}
.flying-piano {
  width: 52px; height: 52px;
  background-image: url('https://api.iconify.design/fluent-emoji/musical-keyboard.svg');
  top: 12vh; left: -60px;
  animation: driftRight 34s linear infinite;
  animation-delay: 20s;
}

/* Add theatre + jazz to the off-state hide list */
body.animations-off .flying-masks,
body.animations-off .flying-curtain,
body.animations-off .flying-mic,
body.animations-off .flying-popcorn,
body.animations-off .flying-ticket-stub,
body.animations-off .flying-sax,
body.animations-off .flying-trumpet,
body.animations-off .flying-notes,
body.animations-off .flying-vinyl,
body.animations-off .flying-guitar,
body.animations-off .flying-piano { display: none !important; }

/* ─── Default fallback ─── */
.group-themed-hero {
  background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%);
  color: white;
  padding: 32px 24px;
  border-radius: 12px;
}
.group-themed-hero h2 { color: #fff; font-weight: 800; margin: 0 0 6px; }
.group-themed-hero .tagline { color: rgba(255,255,255,0.85); font-size: 1.05rem; }
.group-themed-hero .motto { color: rgba(255,255,255,0.7); font-style: italic; font-size: 0.9rem; margin-top: 8px; }
.btn-theme { background: #3b82f6; color: #fff; border: none; padding: 8px 18px; border-radius: 6px; font-weight: 600; }
.btn-theme:hover { filter: brightness(1.08); color: #fff; }
.badge-theme { background: #3b82f6; color: #fff; padding: 4px 10px; border-radius: 99px; font-size: 0.75rem; font-weight: 700; }
.theme-divider { height: 3px; background: #e5e7eb; border: none; border-radius: 2px; margin: 16px 0; }

/* Sponsor cards */
.sponsor-card {
  border: 1px solid #e5e7eb; border-radius: 10px;
  padding: 14px; text-align: center; transition: transform 0.15s, box-shadow 0.15s;
  background: #fff; height: 100%;
}
.sponsor-card:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.08); }
.sponsor-card img { max-height: 60px; max-width: 100%; object-fit: contain; margin-bottom: 8px; }

/* Affiliate cards */
.affiliate-card {
  border: 1px solid #e5e7eb; border-radius: 8px;
  padding: 12px 14px; background: #fafafa;
}

/* Member badge */
.paid-member-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 12px; border-radius: 99px;
  background: linear-gradient(135deg, #fbbf24, #f59e0b);
  color: #78350f; font-weight: 700; font-size: 0.8rem;
}