/* HAP audio player, "brona" skin (players 1 /worship/ and 2 /audio-arhivs/), redrawn with palette tokens so it
   follows the site colour switch without a per-mode block. "body" and the double player class beat the plugin's
   .hap-brona-light rules, the !important ones too. The plugin marks the loaded song with hap-playlist-item-disabled
   and puts hap-playlist-item-selected on the row under the mouse. The play state has no class: the pause button
   gets an inline display:block while a song plays, so :has() reads that. */
body .hap-music-player.hap-brona{
  --sa-ink:var(--global-palette3);
  --sa-text:var(--global-palette4);
  --sa-accent:var(--global-palette1);
  --sa-accent-deep:var(--global-palette2);
  --sa-on-accent:var(--global-palette9);
  --sa-line:color-mix(in srgb, var(--global-palette3) 12%, transparent);
  --sa-track:color-mix(in srgb, var(--global-palette3) 14%, transparent);
  --sa-hover:color-mix(in srgb, var(--global-palette1) 9%, transparent);
  --sa-selected:color-mix(in srgb, var(--global-palette1) 15%, transparent);
  --sa-sun:rgba(244,140,32,.5)}

/* Now playing: cover, title, seek bar */
body .hap-music-player.hap-brona .hap-player-outer{background:transparent}
body .hap-music-player.hap-brona .hap-player-holder{padding:0;gap:2rem;align-items:center}
body .hap-music-player.hap-brona .hap-player-right{overflow:visible}
body .hap-music-player.hap-brona .hap-player-thumb-wrapper{width:200px;height:200px;border-radius:24px;
  box-shadow:0 26px 56px -22px var(--sa-sun),0 0 0 1px var(--sa-line)}
body .hap-music-player.hap-brona .hap-player-thumb{border-radius:24px !important}
body .hap-music-player.hap-brona .hap-center-elements{margin-left:0}
body .hap-music-player.hap-brona .hap-player-title{font-family:var(--global-heading-font-family, inherit);font-size:1.75rem;
  line-height:1.2;font-weight:700;letter-spacing:-.01em;color:var(--sa-ink);margin-bottom:.35rem}
body .hap-music-player.hap-brona .hap-player-artist{font-size:.95rem;color:var(--sa-text)}
body .hap-music-player.hap-brona .hap-seekbar-wrap{margin-top:1.5rem}
body .hap-music-player.hap-brona :is(.hap-media-time-current,.hap-media-time-total){color:var(--sa-text) !important;
  font-size:.8125rem !important;font-variant-numeric:tabular-nums}
body .hap-music-player.hap-brona .hap-seekbar{height:20px}
body .hap-music-player.hap-brona .hap-progress-bg{height:6px;transform:translateY(-50%);border-radius:99px;background:var(--sa-track)}
body .hap-music-player.hap-brona .hap-load-level{border-radius:99px;background:var(--sa-track)}
body .hap-music-player.hap-brona .hap-progress-level{border-radius:99px;background:linear-gradient(90deg,var(--sa-accent-deep),var(--sa-accent))}
body .hap-music-player.hap-brona .hap-progress-level::after{content:"";position:absolute;right:-7px;top:50%;width:14px;height:14px;
  margin-top:-7px;border-radius:50%;background:var(--sa-accent);box-shadow:0 2px 8px -2px rgba(13,9,18,.5)}

/* Controls: back 10 s, previous, play, next, forward 10 s, volume; shuffle, loop, list, pop-out on the right */
body .hap-music-player.hap-brona .hap-controls{margin-top:1rem;align-items:center}
body .hap-music-player.hap-brona :is(.hap-controls-left,.hap-controls-right){display:flex;align-items:center}
body .hap-music-player.hap-brona .hap-skip-backward{order:-1}
body .hap-music-player.hap-brona .hap-contr-btn:not(.hap-volume-wrap){float:none;width:44px;height:44px;border-radius:50%;
  transition:background-color .15s ease-out}
body .hap-music-player.hap-brona .hap-contr-btn:not(.hap-volume-wrap):hover{background:var(--sa-hover)}
body .hap-music-player.hap-brona .hap-volume-wrap{float:none;height:44px}
body .hap-music-player.hap-brona :is(.hap-contr-btn i,.hap-contr-btn svg){color:var(--sa-text)}
body .hap-music-player.hap-brona :is(.hap-btn:hover i,.hap-contr-btn:hover > i,.hap-contr-btn-hover i){color:var(--sa-accent)}
body .hap-music-player.hap-brona .hap-contr-btn.hap-playback-toggle{width:60px;height:60px;margin:0 .4rem;background:var(--sa-accent);
  box-shadow:0 12px 26px -12px var(--sa-accent)}
body .hap-music-player.hap-brona .hap-contr-btn.hap-playback-toggle:hover{background:var(--sa-accent-deep)}
body .hap-music-player.hap-brona .hap-playback-toggle i{color:var(--sa-on-accent) !important;font-size:34px}
body .hap-music-player.hap-brona .hap-volume-bg{top:21px;height:4px;border-radius:99px;background:var(--sa-track)}
body .hap-music-player.hap-brona .hap-volume-level{border-radius:99px;background:var(--sa-accent)}
body .hap-music-player.hap-brona .hap-tooltip{border-radius:8px;background:var(--sa-ink);color:var(--global-palette9) !important;box-shadow:none}
body .hap-music-player.hap-brona .hap-search-filter{background:transparent !important;color:var(--sa-text) !important;
  border-bottom-color:var(--sa-track) !important}
body .hap-music-player.hap-brona .hap-search-filter::placeholder{color:var(--sa-text)}

/* Song list. Every song has the same artist, shown above, so the rows drop it (font-size:0 hides the " - " text
   node between the title and artist elements). */
body .hap-music-player.hap-brona .hap-playlist-holder{margin-top:1.75rem;border-top:1px solid var(--sa-line)}
body .hap-music-player.hap-brona .hap-playlist-inner{padding:.75rem 0 0;min-height:0}
body .hap-music-player.hap-brona .hap-playlist-item{border-top:0;border-radius:14px;transition:background-color .15s ease-out}
body .hap-music-player.hap-brona :is(.hap-playlist-item:hover,.hap-playlist-item.hap-playlist-item-selected){background:var(--sa-hover)}
body .hap-music-player.hap-brona .hap-playlist-item.hap-playlist-item-disabled{background:var(--sa-selected)}
body .hap-music-player.hap-brona .hap-playlist-title-wrap{font-size:0;color:var(--sa-ink)}
body .hap-music-player.hap-brona :is(.hap-playlist-title-num,.hap-playlist-title){display:inline;font-size:1rem}
body .hap-music-player.hap-brona .hap-playlist-title-num{color:var(--sa-text);font-variant-numeric:tabular-nums}
body .hap-music-player.hap-brona .hap-playlist-artist{display:none}
body .hap-music-player.hap-brona .hap-playlist-item-selected .hap-playlist-title-wrap{color:var(--sa-ink)}
body .hap-music-player.hap-brona .hap-playlist-item-disabled .hap-playlist-title{font-weight:700}
body .hap-music-player.hap-brona .hap-playlist-duration{font-size:.875rem;color:var(--sa-text);font-variant-numeric:tabular-nums}
body .hap-music-player.hap-brona .hap-stats :is(i,svg,span){color:var(--sa-text) !important}
body .hap-music-player.hap-brona .hap-stat-icon:hover :is(i,svg,span){color:var(--sa-accent) !important}
body .hap-music-player.hap-brona .hap-stats i{font-size:20px}
body .hap-music-player.hap-brona .hap-stat-icon{min-height:24px;display:inline-flex;align-items:center}
body .hap-music-player.hap-brona .hap-stats span{font-size:.8125rem;font-variant-numeric:tabular-nums}

/* The current song's cover turns into equalizer bars, which move while it plays */
body .hap-music-player.hap-brona .hap-playlist-thumb{position:relative;overflow:hidden}
body .hap-music-player.hap-brona .hap-playlist-item-disabled .hap-playlist-thumb::after{content:"";position:absolute;inset:0;
  border-radius:inherit;background:
    linear-gradient(#fff,#fff) left calc(50% - 7px) bottom 12px / 4px 9px no-repeat,
    linear-gradient(#fff,#fff) center bottom 12px / 4px 16px no-repeat,
    linear-gradient(#fff,#fff) left calc(50% + 7px) bottom 12px / 4px 12px no-repeat,
    rgba(30,16,45,.6)}
@keyframes sataudio-eq{
  0%,100%{background-size:4px 9px,4px 16px,4px 12px}
  25%{background-size:4px 16px,4px 8px,4px 18px}
  50%{background-size:4px 12px,4px 18px,4px 7px}
  75%{background-size:4px 18px,4px 11px,4px 15px}}
@keyframes sataudio-breathe{
  0%,100%{transform:scale(1);box-shadow:0 26px 56px -22px var(--sa-sun),0 0 0 1px var(--sa-line)}
  50%{transform:scale(1.03);box-shadow:0 32px 78px -16px var(--sa-sun),0 0 0 1px var(--sa-line)}}
@keyframes sataudio-pulse{
  0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--global-palette1) 45%, transparent)}
  100%{box-shadow:0 0 0 18px transparent}}
@media (prefers-reduced-motion:no-preference){
  body .hap-music-player.hap-brona:has(.hap-btn-pause[style*="block"]) .hap-playlist-item-disabled .hap-playlist-thumb::after{
    animation:sataudio-eq 1.1s ease-in-out infinite}
  body .hap-music-player.hap-brona:has(.hap-btn-pause[style*="block"]) .hap-player-thumb-wrapper{animation:sataudio-breathe 5s ease-in-out infinite}
  body .hap-music-player.hap-brona:has(.hap-btn-pause[style*="block"]) .hap-contr-btn.hap-playback-toggle{animation:sataudio-pulse 2.2s ease-out infinite}}

/* Weekly top list ([apmap_get_stats] on /audio-arhivs/): a palette card instead of the plugin's white box with a blue
   uppercase bar */
body .hap-stat-wrap{margin-top:1.5rem;padding:1.25rem 1.5rem;border-radius:20px;background:var(--global-palette8);
  border:1px solid color-mix(in srgb, var(--global-palette3) 10%, transparent)}
body .hap-stat-wrap .hap-stat-wrap-header{margin-bottom:.5rem;text-align:left;text-transform:none;background:transparent;
  color:var(--global-palette3);font-family:var(--global-heading-font-family, inherit);font-size:1.25rem;font-weight:700}
body .hap-stat-wrap .hap-stat-item-thumb img{border-radius:8px}
body .hap-stat-wrap .hap-stat-item-title a{color:var(--global-palette3)}
body .hap-stat-wrap .hap-stat-item-play-count{color:var(--global-palette4)}

/* Narrow players (the plugin adds hap-breakpoint-650/-550 by the player's width): cover on top, everything centred,
   the transport in one row and the toggles under it. Phones have volume keys. */
body .hap-music-player.hap-brona.hap-breakpoint-650 .hap-player-holder{gap:1.25rem}
body .hap-music-player.hap-brona.hap-breakpoint-650 .hap-player-thumb-wrapper{width:min(240px,72%);height:auto;padding-top:0;aspect-ratio:1}
body .hap-music-player.hap-brona.hap-breakpoint-650 .hap-player-right{width:100%}
body .hap-music-player.hap-brona.hap-breakpoint-650 .hap-center-elements{margin-top:0}
body .hap-music-player.hap-brona.hap-breakpoint-650 .hap-info{text-align:center}
body .hap-music-player.hap-brona.hap-breakpoint-650 .hap-player-title{font-size:1.5rem}
body .hap-music-player.hap-brona.hap-breakpoint-650 .hap-controls{flex-direction:column;gap:.25rem}
body .hap-music-player.hap-brona.hap-breakpoint-650 :is(.hap-controls-left,.hap-controls-right){justify-content:center}
body .hap-music-player.hap-brona.hap-breakpoint-650 .hap-playlist-inner{padding:.75rem 0 0}
body .hap-music-player.hap-brona.hap-breakpoint-550 .hap-volume-wrap{display:none}

/* Worship page rows (snapshots/2026-10-05-inner-pages/worship.py). The hero gets the cover's sun rising behind its
   curve and the player card; static colours like the rest of the violet hero. Kadence puts row padding on
   .kt-row-column-wrap, so the card draws there and this file owns its padding and margins. */
.single-content .kb-row-layout-wrap.sataudio-hero::after{content:"";position:absolute;left:50%;top:100%;width:min(1000px,160%);
  aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(255,166,64,.5),rgba(255,140,40,.16) 50%,transparent)}
.single-content .sataudio-hero > .kt-row-column-wrap{position:relative;z-index:1}
.single-content .kb-row-layout-wrap.sataudio-card{position:relative;z-index:2;margin-top:-4rem;background:transparent}
.single-content .kb-row-layout-wrap.sataudio-card > .kt-row-column-wrap{margin:0 .75rem;padding:1.25rem;border-radius:24px;background:var(--global-palette8);
  border:1px solid color-mix(in srgb, var(--global-palette3) 10%, transparent);box-shadow:0 30px 60px -32px rgba(13,9,18,.6)}
.single-content .sataudio-note{max-width:640px;margin:0 auto;text-align:center;font-size:1.0625rem;line-height:1.75;color:var(--global-palette4)}
.single-content .sataudio-note::before{content:"";display:block;width:44px;height:22px;margin:0 auto 1.25rem;border-radius:44px 44px 0 0;
  background:linear-gradient(180deg,#f7a33a,#ee7f1c)}
@media (min-width:768px){
  .single-content .kb-row-layout-wrap.sataudio-card > .kt-row-column-wrap{max-width:min(1060px, calc(100% - 4rem));margin:0 auto;
    padding:2.25rem 2.5rem;border-radius:32px}
  .single-content .sataudio-note{font-size:1.125rem}}
