/* Imperio Chat | Burbujas propias de cada tema: forma, cola, borde, brillo y degradado de las enviadas.
   El color de fondo sigue saliendo de las variables del tema (y de Transparencias). La forma del tema rige con «Suave»;
   «Redondeada» y «Cuadrada» la sustituyen. Los degradados solo se pintan si la persona los tiene activados. */

/* Imperio Original: grafito con filete dorado a la izquierda; las tuyas, oro viejo con brillo superior */
:root[data-tema=imperioOriginal] #messages .message-row:not(.mine) .message-bubble:not(.burbuja-sticker):not(.burbuja-medio){border-left:3px solid #d4a64acc}
:root[data-tema=imperioOriginal] #messages .mine .message-bubble:not(.burbuja-sticker){border-color:#d4a64a73;box-shadow:inset 0 1px 0 #ffe3a026,0 6px 16px -10px #d4a64a99}
:root[data-tema=imperioOriginal][data-degradados=si] #messages .mine .message-bubble:not(.burbuja-sticker){background-image:linear-gradient(160deg,#3d2e14d9,#22190cd9)}

/* Medianoche: esquinas afiladas y borde eléctrico con resplandor azul */
:root[data-tema=medianoche][data-burbujas=suave]{--radius-message:10px;--radius-message-cola:2px}
:root[data-tema=medianoche] #messages .message-bubble:not(.burbuja-sticker){box-shadow:0 0 0 1px #2f6bff1f}
:root[data-tema=medianoche] #messages .mine .message-bubble:not(.burbuja-sticker){border-color:#3d7bff99;box-shadow:0 0 16px -4px #2563eb99,inset 0 0 10px #3d7bff1f}
:root[data-tema=medianoche][data-degradados=si] #messages .mine .message-bubble:not(.burbuja-sticker){background-image:linear-gradient(135deg,#1d3f8fcc,#0f2350cc)}

/* Esmeralda: gema facetada, con filo verde abajo en las recibidas y brillo interior en las tuyas */
:root[data-tema=esmeralda][data-burbujas=suave] #messages .message-row:not(.mine) .message-bubble:not(.burbuja-sticker){border-radius:2px 14px 2px 14px}
:root[data-tema=esmeralda][data-burbujas=suave] #messages .mine .message-bubble:not(.burbuja-sticker){border-radius:14px 2px 14px 2px}
:root[data-tema=esmeralda] #messages .message-row:not(.mine) .message-bubble:not(.burbuja-sticker):not(.burbuja-medio){border-bottom:2px solid #10b98199}
:root[data-tema=esmeralda] #messages .mine .message-bubble:not(.burbuja-sticker){border-color:#34d39973;box-shadow:inset 0 0 14px #10b9812e,0 4px 14px -10px #10b981aa}
:root[data-tema=esmeralda][data-degradados=si] #messages .mine .message-bubble:not(.burbuja-sticker){background-image:linear-gradient(150deg,#11533dd9,#0a2a20d9)}

/* Océano: gota redonda con la cola abajo y caída de agua en las tuyas */
:root[data-tema=oceano][data-burbujas=suave] #messages .message-row:not(.mine) .message-bubble:not(.burbuja-sticker){border-radius:20px 20px 20px 6px}
:root[data-tema=oceano][data-burbujas=suave] #messages .mine .message-bubble:not(.burbuja-sticker){border-radius:20px 20px 6px 20px}
:root[data-tema=oceano] #messages .message-bubble:not(.burbuja-sticker){border-color:#7dd3fc33}
:root[data-tema=oceano] #messages .mine .message-bubble:not(.burbuja-sticker){border-color:#7dd3fc59;box-shadow:0 8px 18px -12px #38bdf8cc}
:root[data-tema=oceano][data-degradados=si] #messages .mine .message-bubble:not(.burbuja-sticker){background-image:linear-gradient(180deg,#1d6a9ed9,#134a72d9)}

/* Neón: tubos de luz, cian para las recibidas y violeta para las tuyas */
:root[data-tema=neon] #messages .message-row:not(.mine) .message-bubble:not(.burbuja-sticker){border-color:#22d3ee8c;box-shadow:0 0 10px -2px #22d3ee73,inset 0 0 8px #22d3ee1f}
:root[data-tema=neon] #messages .mine .message-bubble:not(.burbuja-sticker){border-color:#a78bfa;box-shadow:0 0 12px -2px #8b5cf6b3,inset 0 0 10px #8b5cf633}
:root[data-tema=neon][data-degradados=si] #messages .mine .message-bubble:not(.burbuja-sticker){background-image:linear-gradient(135deg,#3b1f80b3,#1e1446b3)}

/* Rosa Imperial: pétalo con sombra rosada; las tuyas con ribete vino abajo */
:root[data-tema=rosaImperial][data-burbujas=suave]{--radius-message:18px;--radius-message-cola:6px}
:root[data-tema=rosaImperial] #messages .message-row:not(.mine) .message-bubble:not(.burbuja-sticker){box-shadow:0 4px 12px -7px #8c2f4559}
:root[data-tema=rosaImperial] #messages .mine .message-bubble:not(.burbuja-sticker):not(.burbuja-medio){border-bottom:2px solid #8c2f4566}
:root[data-tema=rosaImperial][data-degradados=si] #messages .mine .message-bubble:not(.burbuja-sticker){background-image:linear-gradient(160deg,#f7e0e4,#ecc6cd)}

/* Grafito: tarjetas planas y rectas, sin cola; las tuyas con barra plateada a la derecha */
:root[data-tema=grafito][data-burbujas=suave]{--radius-message:6px;--radius-message-cola:6px}
:root[data-tema=grafito] #messages .message-bubble:not(.burbuja-sticker){box-shadow:none}
:root[data-tema=grafito] #messages .mine .message-bubble:not(.burbuja-sticker):not(.burbuja-medio){border-right:3px solid #c0c7cf}

/* Aurora: cápsulas sin cola con halo morado y azul */
:root[data-tema=aurora][data-burbujas=suave]{--radius-message:22px;--radius-message-cola:22px}
:root[data-tema=aurora] #messages .message-row:not(.mine) .message-bubble:not(.burbuja-sticker){box-shadow:0 0 0 1px #c084fc26,0 8px 20px -14px #60a5fa}
:root[data-tema=aurora] #messages .mine .message-bubble:not(.burbuja-sticker){border-color:#c084fc66;box-shadow:0 8px 22px -10px #9333eab3}

/* Café: papel de cuaderno con borde punteado; las tuyas como nota pegada */
:root[data-tema=cafe][data-burbujas=suave]{--radius-message:10px;--radius-message-cola:2px}
:root[data-tema=cafe] #messages .message-row:not(.mine) .message-bubble:not(.burbuja-sticker):not(.burbuja-medio){border:1px dashed #b89a7a}
:root[data-tema=cafe] #messages .mine .message-bubble:not(.burbuja-sticker){border-color:#a0785066;box-shadow:0 2px 0 #a0785047}
:root[data-tema=cafe][data-degradados=si] #messages .mine .message-bubble:not(.burbuja-sticker){background-image:linear-gradient(180deg,#ecdcc6,#e0c7a6)}

/* Bosque: hoja, con las puntas en diagonal */
:root[data-tema=bosque][data-burbujas=suave] #messages .message-row:not(.mine) .message-bubble:not(.burbuja-sticker){border-radius:3px 18px 3px 18px}
:root[data-tema=bosque][data-burbujas=suave] #messages .mine .message-bubble:not(.burbuja-sticker){border-radius:18px 3px 18px 3px}
:root[data-tema=bosque] #messages .message-bubble:not(.burbuja-sticker){border-color:#a3b56b33}
:root[data-tema=bosque] #messages .mine .message-bubble:not(.burbuja-sticker){border-color:#a3b56b66;box-shadow:0 6px 16px -12px #8a9a3e}
:root[data-tema=bosque][data-degradados=si] #messages .mine .message-bubble:not(.burbuja-sticker){background-image:linear-gradient(160deg,#3d5528d9,#2c3d1fd9)}

/* Blanco Pro: limpio y corporativo, con sombra corta y sin bordes en las tuyas */
:root[data-tema=blancoPro][data-burbujas=suave]{--radius-message:12px;--radius-message-cola:3px}
:root[data-tema=blancoPro] #messages .message-row:not(.mine) .message-bubble:not(.burbuja-sticker){border-color:#e2e8f0;box-shadow:0 1px 2px #0f172a14,0 2px 8px -4px #0f172a14}
:root[data-tema=blancoPro] #messages .mine .message-bubble:not(.burbuja-sticker){border-color:transparent;box-shadow:0 1px 2px #1d4ed81f}

/* Fuego: brasa con filo naranja arriba; las tuyas arden de rojo a naranja */
:root[data-tema=fuego][data-burbujas=suave]{--radius-message:14px;--radius-message-cola:3px}
:root[data-tema=fuego] #messages .message-row:not(.mine) .message-bubble:not(.burbuja-sticker):not(.burbuja-medio){border-top:2px solid #f9731680}
:root[data-tema=fuego] #messages .mine .message-bubble:not(.burbuja-sticker){border-color:#f9731673;box-shadow:0 8px 18px -10px #f97316b3}
:root[data-tema=fuego][data-degradados=si] #messages .mine .message-bubble:not(.burbuja-sticker){background-image:linear-gradient(160deg,#6a1d12d9,#3b1510d9)}

/* Lavanda: nubes muy redondas con sombra violeta suave */
:root[data-tema=lavanda][data-burbujas=suave] #messages .message-row:not(.mine) .message-bubble:not(.burbuja-sticker){border-radius:22px 22px 22px 10px}
:root[data-tema=lavanda][data-burbujas=suave] #messages .mine .message-bubble:not(.burbuja-sticker){border-radius:22px 22px 10px 22px}
:root[data-tema=lavanda] #messages .message-bubble:not(.burbuja-sticker){box-shadow:0 5px 14px -9px #7c3aed59}
:root[data-tema=lavanda][data-degradados=si] #messages .mine .message-bubble:not(.burbuja-sticker){background-image:linear-gradient(135deg,#efe7fe,#dccdfa)}

/* Retro: cartel con contorno grueso y sombra desplazada, como de imprenta */
:root[data-tema=retro][data-burbujas=suave]{--radius-message:8px;--radius-message-cola:8px}
:root[data-tema=retro] #messages .message-bubble:not(.burbuja-sticker){border:2px solid #2a2416;box-shadow:3px 3px 0 #2f7d5b}
:root[data-tema=retro] #messages .mine .message-bubble:not(.burbuja-sticker){border-color:#2a2416;box-shadow:-3px 3px 0 #b5501a}

/* Imperio VIP: marco doble de champán con esquina recta, como una invitación */
:root[data-tema=imperioVip][data-burbujas=suave]{--radius-message:14px;--radius-message-cola:0px}
:root[data-tema=imperioVip] #messages .message-row:not(.mine) .message-bubble:not(.burbuja-sticker){border-color:#e6c88a40}
:root[data-tema=imperioVip] #messages .mine .message-bubble:not(.burbuja-sticker){border-color:#e6c88aa6;box-shadow:0 0 0 3px #e6c88a17,inset 0 1px 0 #fff3d433}
:root[data-tema=imperioVip][data-degradados=si] #messages .mine .message-bubble:not(.burbuja-sticker){background-image:linear-gradient(160deg,#302715e6,#15110ae6)}

/* Al mantener pulsado, el aviso de selección se ve por encima del brillo de cualquier tema */
:root[data-tema] #messages .message-bubble.presionando:not(.burbuja-sticker){box-shadow:0 0 0 3px var(--selection)!important}

/* Muestras de la pantalla Temas: cada tarjeta enseña la forma de burbuja de su tema */
.tema-tarjeta[data-muestra=imperioOriginal] .tm-recibida{border-left:2px solid #d4a64a}
.tema-tarjeta[data-muestra=medianoche] .tm-burbuja{border-radius:5px 1px 5px 5px}
.tema-tarjeta[data-muestra=medianoche] .tm-recibida{border-radius:1px 5px 5px 5px}
.tema-tarjeta[data-muestra=medianoche] .tm-enviada{box-shadow:0 0 6px #2563eb99}
.tema-tarjeta[data-muestra=esmeralda] .tm-recibida{border-radius:1px 8px 1px 8px;border-bottom:1px solid #10b981}
.tema-tarjeta[data-muestra=esmeralda] .tm-enviada{border-radius:8px 1px 8px 1px}
.tema-tarjeta[data-muestra=oceano] .tm-recibida{border-radius:10px 10px 10px 3px}
.tema-tarjeta[data-muestra=oceano] .tm-enviada{border-radius:10px 10px 3px 10px}
.tema-tarjeta[data-muestra=neon] .tm-recibida{box-shadow:0 0 0 1px #22d3ee,0 0 6px #22d3ee99}
.tema-tarjeta[data-muestra=neon] .tm-enviada{box-shadow:0 0 0 1px #a78bfa,0 0 6px #8b5cf6}
.tema-tarjeta[data-muestra=rosaImperial] .tm-enviada{border-bottom:1px solid #8c2f45}
.tema-tarjeta[data-muestra=grafito] .tm-burbuja{border-radius:3px}
.tema-tarjeta[data-muestra=grafito] .tm-enviada{border-right:2px solid #c0c7cf}
.tema-tarjeta[data-muestra=aurora] .tm-burbuja{border-radius:999px}
.tema-tarjeta[data-muestra=aurora] .tm-enviada{background:linear-gradient(135deg,#3a2470,#1e3a8a)}
.tema-tarjeta[data-muestra=cafe] .tm-recibida{outline:1px dashed #b89a7a;outline-offset:-1px}
.tema-tarjeta[data-muestra=bosque] .tm-recibida{border-radius:2px 9px 2px 9px}
.tema-tarjeta[data-muestra=bosque] .tm-enviada{border-radius:9px 2px 9px 2px}
.tema-tarjeta[data-muestra=blancoPro] .tm-recibida{box-shadow:0 1px 3px #0f172a33}
.tema-tarjeta[data-muestra=fuego] .tm-recibida{border-top:1px solid #f97316}
.tema-tarjeta[data-muestra=fuego] .tm-enviada{background:linear-gradient(160deg,#6a1d12,#3b1510)}
.tema-tarjeta[data-muestra=lavanda] .tm-recibida{border-radius:11px 11px 11px 5px}
.tema-tarjeta[data-muestra=lavanda] .tm-enviada{border-radius:11px 11px 5px 11px}
.tema-tarjeta[data-muestra=retro] .tm-burbuja{border-radius:4px;outline:1.5px solid #2a2416;outline-offset:-1.5px}
.tema-tarjeta[data-muestra=retro] .tm-recibida{box-shadow:2px 2px 0 #2f7d5b}
.tema-tarjeta[data-muestra=retro] .tm-enviada{box-shadow:-2px 2px 0 #b5501a}
.tema-tarjeta[data-muestra=imperioVip] .tm-burbuja{border-radius:0 7px 7px 7px}
.tema-tarjeta[data-muestra=imperioVip] .tm-enviada{border-radius:7px 0 7px 7px;box-shadow:0 0 0 1px #e6c88a,0 0 0 3px #e6c88a26}