Mostrar los errores de send-gift: el tema los dejaba invisibles

El botón «Mostrar regalos» parecía no hacer nada: setFormError se llamaba
bien, pero el tema deja `.alert-message` con display:none esperando que la
rellene y la revele el JS antiguo (jQuery), que ya no existe. La caja se
pintaba y no se veía. Se fuerza el display desde React, como el resto de
formularios.

De paso, `.modal-content` estaba definida en globals.css Y en theme.css.
Como theme.css se importa el último (a propósito, para ganarle al preflight
de Tailwind), ganaba él a igual especificidad y el bloque de globals.css era
código muerto: el modal de la tienda salía como hoja pegada al fondo con
borde gris en vez de tarjeta centrada dorada. Se acota a
`.modal-div .modal-content` para ganar por especificidad y no por orden.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

web-next/app/globals.css

@@ -635,7 +635,12 @@ textarea:focus {
   background: rgba(0, 0, 0, 0.6);
   display: flex; align-items: center; justify-content: center;
 }
-.modal-content {
+/* Acotada al overlay a propósito: el tema trae su propia `.modal-content`
+   (hoja pegada al fondo, borde gris) para un `.modal` que aquí ya no usa
+   nadie. Como theme.css se importa el último, a igual especificidad ganaba
+   él y este bloque no pintaba nada. `.modal-div .modal-content` (0,2,0) le
+   gana al (0,1,0) del tema sin depender del orden de carga. */
+.modal-div .modal-content {
   position: relative;
   background: #17110e;
   border: 2px solid #d79602;
@@ -643,6 +648,9 @@ textarea:focus {
   padding: 26px 30px;
   max-width: 90vw; min-width: 260px;
   text-align: center;
+  /* el tema las aplica vía su `.modal-content`; sin esto se cuelan */
+  left: auto; bottom: auto; width: auto;
+  margin: 0; transform: none; animation: none;
 }
 .modal-close {
   position: absolute; top: 6px; right: 12px;