/* Decorative message themes. The canvas, text colors and layout stay owner-controlled. */
.chat-shell[data-bubble-theme="pink-hearts"]{--bubble-base:#2f1a32;--bubble-highlight:#49213c;--bubble-edge:#ff93c847;--bubble-pattern:url('./patterns/pink-hearts.svg')}
.chat-shell[data-bubble-theme="cats"]{--bubble-base:#28222f;--bubble-highlight:#423245;--bubble-edge:#dcb9ff4d;--bubble-pattern:url('./patterns/cats.svg')}
.chat-shell[data-bubble-theme="neon"]{--bubble-base:#19192f;--bubble-highlight:#2f2056;--bubble-edge:#a997ff5c;--bubble-pattern:url('./patterns/neon.svg')}
.chat-shell[data-bubble-theme="ice"]{--bubble-base:#142a3b;--bubble-highlight:#15394e;--bubble-edge:#74d7ff5c;--bubble-pattern:url('./patterns/ice.svg')}
.chat-shell[data-bubble-theme="ember"]{--bubble-base:#302029;--bubble-highlight:#482d22;--bubble-edge:#ffae7452;--bubble-pattern:url('./patterns/ember.svg')}
.chat-shell[data-bubble-theme="mint"]{--bubble-base:#182c2d;--bubble-highlight:#173f37;--bubble-edge:#8ce9bc52;--bubble-pattern:url('./patterns/mint.svg')}
.chat-shell[data-bubble-theme="royal"]{--bubble-base:#292630;--bubble-highlight:#42361d;--bubble-edge:#f4d38a70;--bubble-pattern:url('./patterns/royal.svg')}
.chat-shell[data-bubble-theme="sakura"]{--bubble-base:#302533;--bubble-highlight:#493141;--bubble-edge:#ffc4dd57;--bubble-pattern:url('./patterns/sakura.svg')}
.chat-shell[data-bubble-theme="clouds"]{--bubble-base:#202e46;--bubble-highlight:#293e57;--bubble-edge:#accbff5c;--bubble-pattern:url('./patterns/clouds.svg')}
.chat-shell[data-bubble-theme="stars"]{--bubble-base:#1b2239;--bubble-highlight:#2e2e5d;--bubble-edge:#c6bdff5e;--bubble-pattern:url('./patterns/stars.svg')}
.chat-shell[data-bubble-theme]:not([data-bubble-theme="none"]):not([data-layout="compact"]) .chat-message{
  background-color:var(--bubble-base,#28222f);
  background-image:var(--bubble-pattern,none),linear-gradient(120deg,var(--bubble-highlight,#423245),var(--bubble-base,#28222f));
  background-repeat:no-repeat;
  background-size:104px auto,cover;
  background-position:left 7px center,center;
  border:1px solid var(--bubble-edge,#dcb9ff4d);
  box-shadow:inset 0 1px 0 #ffffff09,0 3px 12px #00000015;
}
@media(max-width:300px){
  .chat-shell[data-bubble-theme]:not([data-bubble-theme="none"]):not([data-layout="compact"]) .chat-message{background-size:72px auto,cover;background-position:left 3px center,center}
}