/*
 * Band Site theme — the Tie-Dye style (bandsite_6, custom_735).
 *
 * Jay, for Lovin' Dead: "a cross between the modern you did and a
 * psychedelic color scheme … more fun", then of the mockups: "B2. I don't
 * want childish but still want fun."
 *
 * Only for a band site whose Style is Tie-Dye (body.band-site--style-tiedye);
 * every other band site, Wicked included, never matches a rule here. The
 * colours are the band site's own settings: the accent plus four rainbow
 * colours (--bs-accent2…5). Original motifs only: a swirl, rainbow lines,
 * colour washes.
 *
 * Motion is slow and optional: Settings → Look → "let the swirl and the
 * rainbow lines move" (off adds body.band-site--still), and chrome.css stops
 * it for anyone whose device asks for reduced motion.
 */

.band-site--style-tiedye {
  --td-rainbow: linear-gradient(90deg, var(--bs-accent), var(--bs-accent2), var(--bs-accent4), var(--bs-accent3), var(--bs-accent5), var(--bs-accent));
  --td-ring: conic-gradient(from 200deg, var(--bs-accent), var(--bs-accent2), var(--bs-accent4), var(--bs-accent3), var(--bs-accent5), var(--bs-accent));
  --td-ink: color-mix(in srgb, var(--bs-bg) 88%, #000);
  --td-round: 16px;
}
body.band-site--style-tiedye {
  background:
    radial-gradient(40rem 30rem at 100% 0%, color-mix(in srgb, var(--bs-accent3) 12%, transparent), transparent 70%),
    radial-gradient(40rem 34rem at 0% 55%, color-mix(in srgb, var(--bs-accent) 11%, transparent), transparent 70%),
    radial-gradient(36rem 30rem at 100% 100%, color-mix(in srgb, var(--bs-accent2) 10%, transparent), transparent 70%),
    var(--bs-bg);
}
@keyframes td-slide { to { background-position: 200% 0; } }
@keyframes td-spin { to { rotate: 360deg; } }
body.band-site--still.band-site--style-tiedye *,
body.band-site--still.band-site--style-tiedye *::before,
body.band-site--still.band-site--style-tiedye *::after { animation: none !important; }

/* ── header ── */
.band-site--style-tiedye .site-header { background: color-mix(in srgb, var(--bs-bg) 80%, transparent); border-bottom: 0; }
.band-site--style-tiedye .site-header::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--td-rainbow); background-size: 200% 100%; animation: td-slide 12s linear infinite; }
.band-site--style-tiedye .site-name {
  font-family: var(--bs-serif); font-style: italic; font-weight: 700; text-transform: none; letter-spacing: -.01em; font-size: 1.9rem;
  background: var(--td-rainbow); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: td-slide 14s linear infinite; padding-right: .08em;
}
.band-site--style-tiedye .logo-link:hover .site-name { color: transparent; filter: brightness(1.15); }
.band-site--style-tiedye .nav-wrapper a { text-transform: none; letter-spacing: .02em; font-size: .95rem; }
.band-site--style-tiedye .nav-wrapper a::after { background: var(--td-rainbow); border-radius: 2px; }
.band-site--style-tiedye .header-social a:hover { color: var(--bs-accent3); }
.band-site--style-tiedye .mobile-menu-toggle span { background: var(--bs-accent); }
@media (max-width: 1024px) {
  .band-site--style-tiedye .nav-wrapper a { font-size: .85rem; letter-spacing: .01em; }
}
@media (max-width: 768px) {
  .band-site--style-tiedye .site-name { font-size: 1.6rem; letter-spacing: -.01em; }
  .band-site--style-tiedye .nav-wrapper { background: var(--bs-card); border-left: 0; }
  .band-site--style-tiedye .nav-wrapper::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: linear-gradient(180deg, var(--bs-accent), var(--bs-accent2), var(--bs-accent4), var(--bs-accent3), var(--bs-accent5)); }
  .band-site--style-tiedye .nav-wrapper a { font-size: 1.05rem; }
}
@media (max-width: 480px) {
  .band-site--style-tiedye .site-name { font-size: 1.45rem; letter-spacing: -.01em; }
}

/* ── the home page lead, without a photo: the big slow swirl ── */
.band-site--style-tiedye .bs-hero--type { position: relative; overflow: hidden; isolation: isolate; background: transparent; border-bottom: 0;
  padding-top: clamp(3rem, 7vw, 5rem); padding-bottom: clamp(3rem, 7vw, 5rem); }
.band-site--style-tiedye .bs-hero--type::before {
  content: ""; position: absolute; z-index: -1; width: min(90vw, 1000px); aspect-ratio: 1; left: 45%; top: 50%; translate: 0 -50%; border-radius: 50%;
  background:
    radial-gradient(circle at 50% 50%, var(--bs-bg) 0 7%, transparent 7.5%),
    repeating-conic-gradient(from 0deg, var(--bs-accent) 0 30deg, var(--bs-accent2) 30deg 60deg, var(--bs-accent4) 60deg 90deg, var(--bs-accent3) 90deg 120deg, var(--bs-accent5) 120deg 150deg, var(--bs-accent) 150deg 180deg);
  filter: blur(30px) saturate(1.3); opacity: .85;
  -webkit-mask: radial-gradient(circle, #000 35%, transparent 70%); mask: radial-gradient(circle, #000 35%, transparent 70%);
  animation: td-spin 80s linear infinite;
}
.band-site--style-tiedye .bs-hero__title { font-family: var(--bs-serif); font-weight: 600; letter-spacing: -.02em; }
.band-site--style-tiedye .bs-hero--type .bs-hero__title { font-size: clamp(2.1rem, 4.8vw, 3.5rem); line-height: 1.04; max-width: 16ch; text-shadow: 0 2px 30px color-mix(in srgb, var(--bs-bg) 70%, transparent); }
.band-site--style-tiedye .bs-hero--type .bs-hero__title::after { height: 4px; width: 96px; border-radius: 3px; background: var(--td-rainbow); }
.band-site--style-tiedye .bs-hero__sub { font-family: var(--bs-serif); }
@media (max-width: 640px) {
  .band-site--style-tiedye .bs-hero--type::before { width: 120vw; left: 30%; opacity: .7; }
}

/* ── the home page lead with the band photo: edge to edge, a rainbow line
      along its foot, the words over a soft shade in the band's own dark ── */
.band-site--style-tiedye .bs-hero--image { position: relative; isolation: isolate;
  background:
    radial-gradient(70% 90% at 0% 100%, color-mix(in srgb, var(--bs-accent) 22%, transparent), transparent 60%),
    linear-gradient(180deg, transparent 30%, color-mix(in srgb, var(--bs-bg) 88%, transparent) 100%),
    var(--bs-hero) center / cover no-repeat; }
.band-site--style-tiedye .bs-hero--image::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--td-rainbow); background-size: 200% 100%; animation: td-slide 12s linear infinite; }
.band-site--style-tiedye .bs-hero--image .bs-hero__title { text-shadow: 0 2px 18px rgba(0, 0, 0, .65); }

/* ── page titles: the band's name as a small colour pill over the title ── */
.band-site--style-tiedye .bt-title::after { height: 4px; width: 96px; border-radius: 3px; background: var(--td-rainbow); }
.band-site--style-tiedye .bt-title__kicker { display: table; padding: .32rem .65rem; border-radius: 999px; background: color-mix(in srgb, var(--bs-accent4) 16%, transparent); color: var(--bs-accent4); letter-spacing: .14em; font-size: .68rem; }
.band-site--style-tiedye .bt-title .page-title { font-family: var(--bs-serif); font-weight: 600; letter-spacing: -.02em; }

/* ── section headings: the small label as a pill ── */
.band-site--style-tiedye .bs-h2 { font-family: var(--bs-serif); font-weight: 600; letter-spacing: -.01em; }
.band-site--style-tiedye .bs-h3 { font-family: var(--bs-serif); font-weight: 600; }
.band-site--style-tiedye .bs-h2__kicker { display: table; padding: .3rem .6rem; border-radius: 999px; background: color-mix(in srgb, var(--bs-accent4) 16%, transparent); color: var(--bs-accent4); letter-spacing: .14em; margin-bottom: .7rem; }
.band-site--style-tiedye .bs-home__about .bs-h2__kicker { background: color-mix(in srgb, var(--bs-accent3) 16%, transparent); color: var(--bs-accent3); }

/* ── buttons: rainbow pills; the quieter one outlined ── */
.band-site--style-tiedye .bs-btn,
.band-site--style-tiedye input[type="submit"], .band-site--style-tiedye button.button, .band-site--style-tiedye .button, .band-site--style-tiedye .form-submit {
  border: 0; border-radius: 999px; padding: .6rem 1.3rem; background: var(--td-rainbow); background-size: 200% 100%; color: var(--td-ink) !important;
  text-transform: none; letter-spacing: .02em; font-size: .92rem; font-weight: 600; transition: background-position .6s ease, transform .2s ease;
}
.band-site--style-tiedye .bs-btn:hover,
.band-site--style-tiedye input[type="submit"]:hover, .band-site--style-tiedye button.button:hover, .band-site--style-tiedye .button:hover, .band-site--style-tiedye .form-submit:hover {
  background: var(--td-rainbow); background-size: 200% 100%; background-position: 60% 0; color: var(--td-ink) !important; transform: translateY(-1px);
}
.band-site--style-tiedye .bs-btn--ghost,
.band-site--style-tiedye .bs-btn--ghost:hover { background: color-mix(in srgb, var(--bs-bg) 55%, transparent); color: var(--bs-text) !important; box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--bs-text) 55%, transparent); }
.band-site--style-tiedye .bs-btn--ghost:hover { box-shadow: inset 0 0 0 1.5px var(--bs-accent3); }

/* ── shows: each in its own colour ── */
.band-site--style-tiedye .bs-card { --hue: var(--bs-accent); }
.band-site--style-tiedye .bs-card:nth-child(4n+2) { --hue: var(--bs-accent2); }
.band-site--style-tiedye .bs-card:nth-child(4n+3) { --hue: var(--bs-accent3); }
.band-site--style-tiedye .bs-card:nth-child(4n) { --hue: var(--bs-accent4); }
.band-site--style-tiedye .bs-card__when { color: var(--hue); letter-spacing: .1em; }
.band-site--style-tiedye .bs-card__title { font-family: var(--bs-serif); font-weight: 600; }
.band-site--style-tiedye .bs-card__setlist summary { color: var(--hue); }
.band-site--style-tiedye .bs-tag--postponed, .band-site--style-tiedye .bs-tag--rescheduled { color: var(--bs-accent2); border-radius: 999px; padding: .25rem .55rem; }
.band-site--style-tiedye .bs-tag--cancelled { border-radius: 999px; padding: .25rem .55rem; }

/* rows: a tinted card each, the date in a rainbow ring */
.band-site--style-tiedye .bs-cards--rows { gap: .8rem; }
.band-site--style-tiedye .bs-cards--rows .bs-card {
  grid-template-columns: 84px minmax(0, 1fr) auto; padding: .9rem 1.1rem .9rem .9rem; position: relative; overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--hue) 35%, var(--bs-border)); border-radius: var(--td-round);
  background: color-mix(in srgb, var(--hue) 9%, var(--bs-card)); transition: transform .2s ease, border-color .2s ease;
}
.band-site--style-tiedye .bs-cards--rows .bs-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--hue); }
.band-site--style-tiedye .bs-cards--rows .bs-card:hover { transform: translateY(-2px); border-color: var(--hue); }
.band-site--style-tiedye .bs-cards--rows .bs-card__poster { width: 84px; height: 112px; }
.band-site--style-tiedye .bs-cards--rows .bs-card--noposter .bs-card__poster { height: 84px; }
.band-site--style-tiedye .bs-card__poster img { border-radius: 10px; }
.band-site--style-tiedye .bs-cards--rows .bs-card__stand { position: relative; border: 0; border-radius: 50%; background: var(--td-ring); }
.band-site--style-tiedye .bs-cards--rows .bs-card__stand::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--bs-card); }
.band-site--style-tiedye .bs-card__stand > * { position: relative; z-index: 1; }
.band-site--style-tiedye .bs-card__stand-m { color: var(--hue); }
.band-site--style-tiedye .bs-cards--rows .bs-card__stand-d { font-family: var(--bs-serif); font-weight: 700; font-size: 1.7rem; line-height: 1; }
.band-site--style-tiedye .bs-cards--rows .bs-card__stand-y { display: none; }
@media (max-width: 640px) {
  .band-site--style-tiedye .bs-cards--rows .bs-card { grid-template-columns: 64px minmax(0, 1fr); padding: .8rem .9rem .9rem .8rem; }
  .band-site--style-tiedye .bs-cards--rows .bs-card__poster { width: 64px; height: 86px; }
  .band-site--style-tiedye .bs-cards--rows .bs-card--noposter .bs-card__poster { height: 64px; }
  .band-site--style-tiedye .bs-cards--rows .bs-card__stand-d { font-size: 1.35rem; }
}

/* the poster wall: rounded posters, the date chip in the show's colour */
.band-site--style-tiedye .bs-cards--wall .bs-card__poster img { border-radius: 14px; }
.band-site--style-tiedye .bs-cards--wall .bs-card__chip { background: var(--hue); color: var(--td-ink); border-radius: 10px; }
.band-site--style-tiedye .bs-cards--wall .bs-card__stand { position: relative; border: 0; border-radius: 14px; background: var(--td-ring); }
.band-site--style-tiedye .bs-cards--wall .bs-card__stand::after { content: ""; position: absolute; inset: 3px; border-radius: 12px;
  background: linear-gradient(160deg, color-mix(in srgb, var(--hue) 14%, var(--bs-card)), var(--bs-bg)); }
.band-site--style-tiedye .bs-cards--wall .bs-card__stand-d { font-family: var(--bs-serif); font-weight: 700; }
.band-site--style-tiedye .bs-cards--wall .bs-card__stand-y { color: var(--hue); }
.band-site--style-tiedye .bs-cards--wall .bs-card__poster:hover { transform: translateY(-3px) rotate(-.6deg); }
.band-site--style-tiedye .bs-cards--wall .bs-btn { padding: .42rem .85rem; font-size: .8rem; }
@media (max-width: 640px) {
  .band-site--style-tiedye .bs-cards--wall .bs-card__act { gap: .35rem; }
  .band-site--style-tiedye .bs-cards--wall .bs-btn { padding: .36rem .62rem; font-size: .74rem; }
}

/* ── one show ── */
.band-site--style-tiedye .bs-show__poster img { border: 0; border-radius: 18px; box-shadow: 0 0 60px -12px color-mix(in srgb, var(--bs-accent) 45%, transparent), 0 0 90px -24px color-mix(in srgb, var(--bs-accent3) 45%, transparent); }
.band-site--style-tiedye .bs-facts dt { color: var(--bs-accent3); }
.band-site--style-tiedye .bs-alert { border-radius: 12px; }
.band-site--style-tiedye .bs-alert--soft { border-color: var(--bs-accent2); background: color-mix(in srgb, var(--bs-accent2) 8%, transparent); }

/* ── text ── */
.band-site--style-tiedye .bs-prose blockquote, .band-site--style-tiedye blockquote { border-left: 3px solid var(--bs-accent5); }
.band-site--style-tiedye .bs-prose img, .band-site--style-tiedye .bs-photo img, .band-site--style-tiedye .bs-video, .band-site--style-tiedye .bs-gallery a { border-radius: 14px; }
.band-site--style-tiedye .bs-downloads a::before { color: var(--bs-accent4); }

/* ── forms: contact, booking, the mailing list ── */
.band-site--style-tiedye .bs-form { position: relative; overflow: hidden; border-radius: 20px; }
.band-site--style-tiedye .bs-form::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--td-rainbow); }
.band-site--style-tiedye input[type="text"], .band-site--style-tiedye input[type="email"], .band-site--style-tiedye input[type="tel"], .band-site--style-tiedye input[type="url"],
.band-site--style-tiedye input[type="number"], .band-site--style-tiedye input[type="date"], .band-site--style-tiedye input[type="time"], .band-site--style-tiedye input[type="search"],
.band-site--style-tiedye select, .band-site--style-tiedye textarea { border-radius: 12px !important; }
.band-site--style-tiedye input:focus, .band-site--style-tiedye select:focus, .band-site--style-tiedye textarea:focus { border-color: var(--bs-accent3) !important; box-shadow: 0 0 0 2px color-mix(in srgb, var(--bs-accent3) 35%, transparent); }
.band-site--style-tiedye fieldset { border-radius: 14px; }
.band-site--style-tiedye .bs-signup-form {
  border-radius: 20px !important; border-top: 1px solid var(--bs-border) !important; position: relative; overflow: hidden;
  box-shadow: 0 0 60px -10px color-mix(in srgb, var(--bs-accent) 45%, transparent), 0 0 90px -20px color-mix(in srgb, var(--bs-accent3) 45%, transparent);
}
.band-site--style-tiedye .bs-signup-form::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--td-rainbow); }
.band-site--style-tiedye .bs-signup-form .mr-signup-heading { font-weight: 600; }
.band-site--style-tiedye .bs-signup-form .mr-signup-submit { border-radius: 999px !important; text-transform: none !important; letter-spacing: .02em !important; color: var(--td-ink) !important;
  background: var(--td-rainbow) !important; background-size: 200% 100% !important; }
.band-site--style-tiedye .bs-signup-form .mr-signup-submit:hover { background-position: 60% 0 !important; }
.band-site--style-tiedye .bs-signup-form input:focus { border-color: var(--bs-accent3) !important; }

/* ── status messages, pager, edit links ── */
.band-site--style-tiedye .messages, .band-site--style-tiedye [data-drupal-messages] > div { border-radius: 12px; }
.band-site--style-tiedye .pager__item a, .band-site--style-tiedye .pager__item.is-active { border-radius: 999px; }
.band-site--style-tiedye .pager__item.is-active { border-color: var(--bs-accent3); color: var(--bs-accent3); }
.band-site--style-tiedye .bandsite-edit a { border-radius: 999px; }

/* ── the mailing-list bar: a slow rainbow ── */
.band-site--style-tiedye .mailing-list-banner { background: var(--td-rainbow); background-size: 200% 100%; animation: td-slide 20s linear infinite; }
.band-site--style-tiedye .mailing-list-text { color: var(--td-ink); text-transform: none; letter-spacing: .02em; font-family: var(--bs-serif); font-weight: 700; font-size: 1.3rem; }
.band-site--style-tiedye .mailing-list-btn { border-radius: 999px; background: var(--td-ink); color: var(--bs-text); text-transform: none; letter-spacing: .02em; }
.band-site--style-tiedye .mailing-list-btn:hover { background: #000; color: var(--bs-text); }

/* ── footer ── */
.band-site--style-tiedye .site-footer { border-top: 1px solid var(--bs-border);
  background: radial-gradient(30rem 14rem at 50% 0%, color-mix(in srgb, var(--bs-accent) 14%, transparent), transparent 70%), color-mix(in srgb, var(--bs-bg) 70%, #000); }
.band-site--style-tiedye .mailing-list-banner + .site-footer { border-top: 0; }
.band-site--style-tiedye .footer-tagline { font-family: var(--bs-serif); color: var(--bs-muted); }
.band-site--style-tiedye .social-link:hover, .band-site--style-tiedye .social-link:focus-visible { background: var(--bs-accent3); border-color: var(--bs-accent3); color: var(--td-ink); }
.band-site--style-tiedye :focus-visible { outline-color: var(--bs-accent3); }