/* Sharing the Moment FIXED101 — independent selected-theme background scenes. */
/*
  The working invite shell MUST NOT use the invitation artwork as scenery.
  --stm-theme-backdrop is supplied only by the selected theme family.
  Historical --stm-art-backdrop may still exist for palette analysis/compatibility,
  but this layer deliberately never references it.
*/
body[data-stm-working-theme][data-stm-artwork="1"] .event-panel.active,
body[data-stm-working-theme] .event-panel.active{
  position:relative!important;
  isolation:isolate!important;
  background:var(--stm-job-surface2)!important;
}
body[data-stm-working-theme][data-stm-artwork="1"] .event-panel.active:before,
body[data-stm-working-theme] .event-panel.active:before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:0!important;
  inset:0!important;
  width:auto!important;
  height:auto!important;
  pointer-events:none!important;
  opacity:1!important;
  background-image:
    linear-gradient(90deg,
      color-mix(in srgb,var(--stm-job-surface2) 16%,transparent) 0%,
      color-mix(in srgb,var(--stm-job-surface2) 23%,transparent) 18%,
      color-mix(in srgb,var(--stm-job-surface2) 58%,transparent) 34%,
      color-mix(in srgb,var(--stm-job-surface2) 86%,transparent) 44%,
      color-mix(in srgb,var(--stm-job-surface2) 91%,transparent) 50%,
      color-mix(in srgb,var(--stm-job-surface2) 86%,transparent) 56%,
      color-mix(in srgb,var(--stm-job-surface2) 58%,transparent) 66%,
      color-mix(in srgb,var(--stm-job-surface2) 23%,transparent) 82%,
      color-mix(in srgb,var(--stm-job-surface2) 16%,transparent) 100%),
    var(--stm-theme-backdrop,none)!important;
  background-repeat:no-repeat,no-repeat!important;
  background-size:100% 100%,cover!important;
  background-position:center,center!important;
  filter:saturate(.98) contrast(.98) brightness(1.01)!important;
  transform:none!important;
  mask-image:none!important;
}
body[data-stm-working-theme][data-stm-artwork="1"] .event-panel.active:after,
body[data-stm-working-theme] .event-panel.active:after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:1!important;
  inset:0!important;
  pointer-events:none!important;
  background:
    radial-gradient(ellipse at 50% 36%,color-mix(in srgb,var(--stm-job-surface) 58%,transparent) 0 17%,transparent 48%),
    linear-gradient(180deg,color-mix(in srgb,var(--stm-job-surface2) 5%,transparent),color-mix(in srgb,var(--stm-job-surface2) 16%,transparent))!important;
}
body[data-stm-working-theme][data-stm-artwork="1"] .event-panel.active>*,
body[data-stm-working-theme] .event-panel.active>*{position:relative!important;z-index:3!important}

/* Forest / woodland uses an independent photographic forest scene, not invitation pixels. */
body[data-stm-working-theme="woodland"][data-stm-artwork="1"] .event-panel.active:before,
body[data-stm-working-theme="woodland"] .event-panel.active:before{
  background-image:
    linear-gradient(90deg,
      rgba(247,242,226,.12) 0%,rgba(247,242,226,.20) 17%,rgba(247,242,226,.55) 35%,
      rgba(247,242,226,.86) 44%,rgba(247,242,226,.91) 50%,rgba(247,242,226,.86) 56%,
      rgba(247,242,226,.55) 65%,rgba(247,242,226,.20) 83%,rgba(247,242,226,.12) 100%),
    var(--stm-theme-backdrop,none)!important;
  background-size:100% 100%,cover!important;
  background-position:center,center 48%!important;
  filter:saturate(1.03) contrast(.99) brightness(1.01)!important;
}
body[data-stm-working-theme="woodland"][data-stm-artwork="1"] .event-panel.active:after,
body[data-stm-working-theme="woodland"] .event-panel.active:after{
  background:
    radial-gradient(ellipse at 50% 34%,rgba(255,250,240,.38) 0 16%,rgba(255,250,240,.12) 43%,transparent 62%),
    linear-gradient(180deg,rgba(255,250,240,.03),rgba(239,232,209,.12))!important;
}

/* Theme families without a dedicated raster asset keep a themed scenic fallback; never use invitation art. */
body[data-stm-working-theme="gothic"] .event-panel.active:before{background-image:radial-gradient(circle at 50% 10%,rgba(176,138,100,.16),transparent 34%),radial-gradient(circle at 10% 80%,rgba(103,28,49,.26),transparent 34%),linear-gradient(180deg,#171116,#26161d)!important}
body[data-stm-working-theme="celestial"] .event-panel.active:before{background-image:radial-gradient(circle at 16% 20%,rgba(255,255,255,.7) 0 1px,transparent 2px),radial-gradient(circle at 74% 28%,rgba(255,255,255,.55) 0 1px,transparent 2px),radial-gradient(circle at 84% 76%,rgba(198,167,98,.36),transparent 18%),linear-gradient(180deg,#11182b,#18233a)!important;background-size:90px 90px,130px 130px,100% 100%,100% 100%!important}
body[data-stm-working-theme="coastal"] .event-panel.active:before{background-image:linear-gradient(180deg,#dfeff3 0 45%,#c9e0df 46% 58%,#eadfc5 59% 100%)!important}
body[data-stm-working-theme="boho"] .event-panel.active:before,body[data-stm-working-theme="floral"] .event-panel.active:before,body[data-stm-working-theme="safari"] .event-panel.active:before,body[data-stm-working-theme="western"] .event-panel.active:before,body[data-stm-working-theme="playful"] .event-panel.active:before,body[data-stm-working-theme="luxe"] .event-panel.active:before,body[data-stm-working-theme="sports"] .event-panel.active:before,body[data-stm-working-theme="heritage"] .event-panel.active:before,body[data-stm-working-theme="minimal"] .event-panel.active:before,body[data-stm-working-theme="neutral"] .event-panel.active:before{background-image:linear-gradient(135deg,color-mix(in srgb,var(--stm-job-surface2) 92%,var(--stm-job-secondary)),var(--stm-job-surface),color-mix(in srgb,var(--stm-job-surface2) 88%,var(--stm-job-accent)))!important}

/* Interaction firewall: decorative scenery is never clickable. */
body[data-stm-working-theme] .event-panel:before,
body[data-stm-working-theme] .event-panel:after{pointer-events:none!important}
body[data-stm-working-theme] .event-nav,
body[data-stm-working-theme] .event-button,
body[data-stm-working-theme] button,
body[data-stm-working-theme] a,
body[data-stm-working-theme] input,
body[data-stm-working-theme] select,
body[data-stm-working-theme] textarea{position:relative;z-index:auto;pointer-events:auto!important}

/* Controls/cards keep readable opaque surfaces over any scenery. */
body[data-stm-working-theme] .custom-invitation-companion94,
body[data-stm-working-theme] .content-card{background:linear-gradient(165deg,color-mix(in srgb,var(--stm-job-surface) 96%,white),color-mix(in srgb,var(--stm-job-surface2) 94%,var(--stm-job-surface)))!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}

/* Mobile: retain the selected-theme scene but heavily calm it for touch/readability. */
@media(max-width:919px){
  body[data-stm-working-theme][data-stm-artwork="1"] .event-panel.active:before,
  body[data-stm-working-theme] .event-panel.active:before{
    background-image:linear-gradient(color-mix(in srgb,var(--stm-job-surface2) 78%,transparent),color-mix(in srgb,var(--stm-job-surface2) 88%,transparent)),var(--stm-theme-backdrop,none)!important;
    background-size:cover!important;
    background-position:center 42%!important;
    filter:saturate(.9) brightness(1.04)!important;
  }
  body[data-stm-working-theme][data-stm-artwork="1"] .event-panel.active:after,
  body[data-stm-working-theme] .event-panel.active:after{background:linear-gradient(180deg,color-mix(in srgb,var(--stm-job-surface2) 50%,transparent),color-mix(in srgb,var(--stm-job-surface2) 78%,transparent))!important}
}
