/* =========================================================================
   MEGAYUNTAS — Asistente virtual · Accesibilidad · Temas festivos
   ========================================================================= */

/* ---------- Asistente virtual ---------- */
.chat { position: fixed; right: 20px; bottom: 20px; z-index: 250; font-size: 15px; }
.chat__launcher { position: relative; width: 64px; height: 64px; border: 0; border-radius: 22px; cursor: pointer; display: grid; place-items: center;
  color: #fff; background: linear-gradient(140deg, var(--teal), var(--teal-700)); box-shadow: 0 14px 30px -10px rgba(44, 114, 122, .8);
  animation: chatIn .7s var(--ease) .6s both, chatFloat 4s ease-in-out 1.3s infinite; transition: transform .25s var(--ease), border-radius .3s; }
.chat__launcher:hover { transform: scale(1.06) rotate(-4deg); }
.chat__launcher .bot-svg { width: 42px; height: 42px; }
.chat__ring { position: absolute; inset: -6px; border-radius: 26px; border: 2px solid var(--teal-300); opacity: 0; animation: ring 2.6s ease-out 2s infinite; }
@keyframes chatIn { from { opacity: 0; transform: translateY(30px) scale(.6); } }
@keyframes chatFloat { 50% { transform: translateY(-5px); } }
@keyframes ring { 0% { opacity: .9; transform: scale(.9); } 100% { opacity: 0; transform: scale(1.35); } }
.chat.is-open .chat__launcher { border-radius: 50%; animation: none; }
.chat.is-open .chat__ring, .chat.is-open .chat__tip { display: none; }
.bot-svg { color: #fff; }
.bot-svg__light { fill: var(--coral); animation: blinkLight 1.8s ease-in-out infinite; }
.bot-svg__eyes { transform-origin: 32px 30px; animation: blink 5s infinite; }
@keyframes blinkLight { 50% { fill: #ffd2c4; } }
@keyframes blink { 0%, 92%, 100% { transform: scaleY(1); } 95% { transform: scaleY(.1); } }
.chat__tip { position: absolute; right: 76px; bottom: 14px; white-space: nowrap; padding: .6rem .9rem; border-radius: 14px 14px 4px 14px; background: #fff; color: var(--ink);
  font-size: .85rem; box-shadow: var(--shadow); opacity: 0; transform: translateX(10px); pointer-events: none; transition: .4s var(--ease); }
.chat__tip b { color: var(--coral-600); }
.chat.show-tip .chat__tip { opacity: 1; transform: none; }

.chat__panel { position: absolute; right: 0; bottom: 80px; width: min(400px, calc(100vw - 24px)); height: min(620px, calc(100vh - 120px)); display: flex; flex-direction: column;
  background: #fff; border-radius: 22px; overflow: hidden; box-shadow: 0 30px 70px -20px rgba(11, 42, 47, .45), 0 0 0 1px rgba(11, 42, 47, .06);
  transform-origin: 100% 100%; animation: panelIn .45s var(--ease); }
.chat__panel[hidden] { display: none; }
@keyframes panelIn { from { opacity: 0; transform: translateY(16px) scale(.92); } }
.chat__head { display: flex; align-items: center; gap: .75rem; padding: .95rem 1rem; color: #fff; background: linear-gradient(120deg, var(--ink), var(--teal-700)); }
.chat__head b { display: block; font-size: .98rem; }
.chat__head small { font-size: .74rem; color: #b6dde1; display: flex; align-items: center; gap: .35rem; }
.chat__head > div { flex: 1; min-width: 0; }
.chat__avatar { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 14px; background: rgba(255, 255, 255, .12); flex: none; }
.chat__avatar .bot-svg { width: 32px; height: 32px; }
.chat__dot { width: 8px; height: 8px; border-radius: 50%; background: #6ee7a8; box-shadow: 0 0 0 3px rgba(110, 231, 168, .25); }
.chat__icon { width: 34px; height: 34px; border: 0; border-radius: 10px; background: rgba(255, 255, 255, .1); color: #fff; cursor: pointer; }
.chat__icon:hover { background: rgba(255, 255, 255, .22); }
.chat__log { flex: 1; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: .8rem; background: linear-gradient(#f6fafa, #fff); scroll-behavior: smooth; }
.msg { max-width: 88%; padding: .7rem .9rem; border-radius: 16px; line-height: 1.5; font-size: .92rem; animation: msgIn .35s var(--ease); overflow-wrap: anywhere; }
@keyframes msgIn { from { opacity: 0; transform: translateY(8px); } }
.msg--user { align-self: flex-end; background: var(--coral); color: #fff; border-bottom-right-radius: 4px; }
.msg--bot { align-self: flex-start; background: #fff; color: var(--text); border-bottom-left-radius: 4px; box-shadow: 0 0 0 1px var(--line), 0 4px 12px -8px rgba(11, 42, 47, .3); }
.msg--bot p { margin: 0 0 .5rem; } .msg--bot p:last-child { margin: 0; }
.msg--bot ul, .msg--bot ol { margin: .3rem 0 .5rem; padding-left: 1.15rem; }
.msg--bot li { margin: .15rem 0; }
.msg--bot a { color: var(--teal-700); font-weight: 600; text-decoration: underline; text-decoration-color: var(--teal-300); text-underline-offset: 2px; }
.msg--bot strong { color: var(--ink); }
.msg__tag { display: inline-flex; align-items: center; gap: .3rem; margin-top: .45rem; font-size: .68rem; color: var(--muted); }
.msg--error { background: #fdeee9; color: #8a3520; box-shadow: none; }
.typing { align-self: flex-start; display: flex; gap: 5px; padding: .85rem 1rem; border-radius: 16px; background: #fff; box-shadow: 0 0 0 1px var(--line); }
.typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--teal); animation: dot 1.2s infinite; }
.typing i:nth-child(2) { animation-delay: .15s; } .typing i:nth-child(3) { animation-delay: .3s; }
@keyframes dot { 0%, 60%, 100% { transform: translateY(0); opacity: .4; } 30% { transform: translateY(-5px); opacity: 1; } }
.srcs { display: grid; gap: .45rem; align-self: stretch; animation: msgIn .4s var(--ease); }
.srcs__label { font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.src { display: grid; grid-template-columns: 54px 1fr auto; gap: .65rem; align-items: center; padding: .45rem; border-radius: 12px; background: #fff; color: var(--ink);
  box-shadow: 0 0 0 1px var(--line); transition: transform .2s var(--ease), box-shadow .2s; }
.src:hover { transform: translateX(3px); box-shadow: 0 0 0 1px var(--teal-300); color: var(--ink); }
.src img { width: 54px; height: 42px; object-fit: cover; object-position: top; border-radius: 8px; background: var(--teal-50); }
.src--producto img { object-fit: contain; background: #fff; }
.src b { display: block; font-size: .8rem; line-height: 1.3; }
.src small { font-size: .7rem; color: var(--muted); }
.src .fa { color: var(--teal-300); }
.chat__sug { display: flex; gap: .4rem; flex-wrap: wrap; padding: 0 1rem .6rem; }
.chat__sug:empty { display: none; }
.chat__sug button { border: 0; cursor: pointer; font: inherit; font-size: .78rem; padding: .4rem .75rem; border-radius: 999px; background: var(--teal-50); color: var(--teal-700); box-shadow: inset 0 0 0 1px var(--teal-100); transition: .2s; }
.chat__sug button:hover { background: var(--teal); color: #fff; }
.chat__form { display: flex; align-items: flex-end; gap: .5rem; padding: .7rem .8rem; border-top: 1px solid var(--line); }
.chat__form textarea { flex: 1; resize: none; max-height: 110px; padding: .7rem .9rem; border-radius: 14px; border: 1.5px solid var(--line); font: inherit; font-size: .92rem; line-height: 1.4; }
.chat__form textarea:focus { outline: none; border-color: var(--teal); box-shadow: 0 0 0 3px rgba(81, 168, 177, .15); }
.chat__form button { width: 44px; height: 44px; border: 0; border-radius: 14px; cursor: pointer; background: var(--coral); color: #fff; flex: none; transition: transform .2s var(--ease); }
.chat__form button:hover { transform: scale(1.06); }
.chat__form button:disabled { opacity: .5; }
.chat__foot { display: block; padding: 0 1rem .7rem; font-size: .7rem; color: var(--muted); text-align: center; }
.to-top { bottom: 96px; }

/* ---------- Accesibilidad ---------- */
.a11y__btn { position: fixed; left: 20px; bottom: 20px; z-index: 250; width: 52px; height: 52px; border: 0; border-radius: 50%; cursor: pointer; display: grid; place-items: center;
  color: #fff; background: #1f4fa3; box-shadow: 0 10px 24px -8px rgba(31, 79, 163, .7); transition: transform .25s var(--ease); }
.a11y__btn svg { width: 30px; height: 30px; }
.a11y__btn:hover { transform: scale(1.08); }
.a11y__panel { position: fixed; left: 20px; bottom: 84px; z-index: 260; width: min(360px, calc(100vw - 24px)); max-height: calc(100vh - 110px); overflow: auto; padding: 1.1rem;
  background: #fff; border-radius: 20px; box-shadow: 0 30px 70px -20px rgba(11, 42, 47, .45), 0 0 0 1px rgba(11, 42, 47, .08); animation: panelIn .35s var(--ease); transform-origin: 0 100%; color: #10282c; }
.a11y__panel[hidden] { display: none; }
.a11y__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: .8rem; }
.a11y__head h2 { font-size: 1.1rem; margin: 0; color: #10282c; }
.a11y__close { width: 36px; height: 36px; border: 0; border-radius: 10px; background: #eef2f7; cursor: pointer; font-size: 1.3rem; }
.a11y__size { display: flex; justify-content: space-between; align-items: center; gap: .6rem; padding: .7rem .8rem; border-radius: 14px; background: #f1f5fb; margin-bottom: .8rem; font-weight: 600; font-size: .9rem; }
.a11y__size div { display: flex; align-items: center; gap: .4rem; }
.a11y__size button { width: 38px; height: 34px; border: 0; border-radius: 10px; background: #1f4fa3; color: #fff; font-weight: 700; cursor: pointer; }
.a11y__size output { min-width: 3.2em; text-align: center; font-weight: 700; }
.a11y__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; }
.a11y__opt { display: flex; flex-direction: column; align-items: center; gap: .35rem; padding: .75rem .3rem; border: 0; border-radius: 14px; cursor: pointer; background: #f1f5fb; color: #10282c;
  font: inherit; font-size: .74rem; font-weight: 600; line-height: 1.2; text-align: center; transition: background .2s, box-shadow .2s; }
.a11y__opt .fa { font-size: 1.15rem; color: #1f4fa3; }
.a11y__opt:hover { background: #e3ebf8; }
.a11y__opt[aria-pressed="true"] { background: #1f4fa3; color: #fff; box-shadow: 0 6px 14px -6px rgba(31, 79, 163, .8); }
.a11y__opt[aria-pressed="true"] .fa { color: #fff; }
.a11y__tts, .a11y__reset { display: flex; align-items: center; justify-content: center; gap: .5rem; width: 100%; margin-top: .7rem; padding: .7rem; border: 0; border-radius: 12px; cursor: pointer; font: inherit; font-weight: 700; font-size: .88rem; }
.a11y__tts { background: var(--teal); color: #fff; }
.a11y__tts[aria-pressed="true"] { background: var(--coral); }
.a11y__reset { background: #eef2f7; color: #10282c; }
.a11y__hint { font-size: .74rem; color: #4b5f63; margin: .5rem 0 0; }
.a11y-guide { position: fixed; left: 0; right: 0; height: 44px; z-index: 240; pointer-events: none; display: none;
  box-shadow: 0 0 0 100vmax rgba(0, 0, 0, .45); border-top: 3px solid #ffbf47; border-bottom: 3px solid #ffbf47; }
html.a11y-guide .a11y-guide { display: block; }

/* Efectos de accesibilidad (clases en <html>) */
html.a11y-zoom { font-size: calc(100% * var(--a11y-scale, 1)); }
html.a11y-zoom body { font-size: calc(16px * var(--a11y-scale, 1)); }
html.a11y-f :is(main, .footer, .nav) { filter: contrast(var(--a11y-c, 1)) grayscale(var(--a11y-g, 0)) invert(var(--a11y-i, 0)) hue-rotate(var(--a11y-h, 0deg)); }
html.a11y-contrast { --a11y-c: 1.45; --muted: #24383c; --text: #000; }
html.a11y-gray { --a11y-g: 1; }
html.a11y-invert { --a11y-i: 1; --a11y-h: 180deg; }
html.a11y-invert :is(main, .footer, .nav) :is(img, video, iframe, canvas) { filter: invert(1) hue-rotate(180deg); }
html.a11y-links :is(main, .footer) a { text-decoration: underline !important; text-underline-offset: 3px; outline: 2px solid #ffbf47; outline-offset: 1px; background: #fff7d6 !important; color: #0a1f6b !important; }
html.a11y-font body, html.a11y-font body *:not(.fa):not([class*="fa-"]) { font-family: Verdana, Tahoma, 'Segoe UI', Arial, sans-serif !important; }
html.a11y-spacing main :is(p, li, dd, blockquote, span, a, td) { line-height: 1.95 !important; letter-spacing: .05em !important; word-spacing: .14em !important; }
html.a11y-noanim *, html.a11y-noanim *::before, html.a11y-noanim *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
html.a11y-noanim .hero__canvas, html.a11y-noanim .fest-canvas { display: none; }
html.a11y-cursor, html.a11y-cursor * { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24'%3E%3Cpath d='M4 2l15 11.5-6.6.9 3.9 7.4-2.9 1.4-3.8-7.5L4 20z' fill='%23000' stroke='%23fff' stroke-width='1.4'/%3E%3C/svg%3E") 6 4, auto !important; }
html.a11y-noimg :is(main, .footer) :is(img, picture, video, canvas, .hero__blob) { visibility: hidden !important; }
html.a11y-focus *:focus, html.a11y-focus *:focus-visible { outline: 4px solid #ffbf47 !important; outline-offset: 3px !important; box-shadow: 0 0 0 7px #10282c !important; }
html.a11y-titles main :is(h1, h2, h3) { background: #fff7d6 !important; color: #0a1f6b !important; outline: 2px dashed #1f4fa3; outline-offset: 4px; }
.tts-reading { background: #fff2a8 !important; color: #000 !important; }

/* ---------- Temas festivos ---------- */
.fest { position: fixed; left: 0; right: 0; top: 0; z-index: 101; pointer-events: none; transition: top .35s var(--ease); }
.nav.is-solid ~ .fest { top: 0; }
.fest-canvas { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 90; pointer-events: none; }
/* Navidad: guirnalda de luces */
.fest__lights { display: flex; justify-content: space-between; margin: 0; padding: 0 1%; list-style: none; height: 30px; overflow: hidden; }
.fest__lights::before { content: ''; position: absolute; left: 0; right: 0; top: 4px; height: 14px; border-bottom: 2px solid #1d4d2f; border-radius: 0 0 50% 50% / 0 0 100% 100%; }
.fest__lights li { position: relative; top: 12px; width: 10px; height: 16px; border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%; background: #e8866c; box-shadow: 0 2px 12px 2px rgba(232, 134, 108, .9); animation: bulb 1.6s ease-in-out infinite; }
.fest__lights li::before { content: ''; position: absolute; top: -5px; left: 2px; width: 6px; height: 5px; border-radius: 2px; background: #3b4b3f; }
.fest__lights li:nth-child(4n+2) { background: #f6d365; box-shadow: 0 2px 12px 2px rgba(246, 211, 101, .9); animation-delay: .4s; }
.fest__lights li:nth-child(4n+3) { background: #6fd3a5; box-shadow: 0 2px 12px 2px rgba(111, 211, 165, .9); animation-delay: .8s; }
.fest__lights li:nth-child(4n) { background: #8ccbd2; box-shadow: 0 2px 12px 2px rgba(140, 203, 210, .9); animation-delay: 1.2s; }
.fest__lights li:nth-child(odd) { top: 16px; }
@keyframes bulb { 50% { opacity: .35; box-shadow: none; } }
/* Fiestas Patrias: banderines */
.fest__bunting { display: flex; justify-content: space-between; margin: 0; padding: 0; list-style: none; height: 34px; overflow: hidden; }
.fest__bunting::before { content: ''; position: absolute; left: 0; right: 0; top: 2px; height: 2px; background: rgba(120, 30, 30, .6); }
.fest__bunting li { width: 26px; height: 30px; margin-top: 3px; clip-path: polygon(0 0, 100% 0, 50% 100%); background: #d91023; transform-origin: 50% 0; animation: sway 3s ease-in-out infinite; }
.fest__bunting li:nth-child(even) { background: #fff; filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .25)); animation-delay: -1.5s; }
@keyframes sway { 50% { transform: rotate(6deg); } }
/* Año Nuevo: línea dorada brillante */
.fest__gold { height: 4px; background: linear-gradient(90deg, #b8860b, #ffd700, #fff6c2, #ffd700, #b8860b); background-size: 200% 100%; animation: shine 3s linear infinite; }
body.tema-anionuevo .hero h1, body.tema-anionuevo .page-hero h1 { text-shadow: 0 0 24px rgba(255, 215, 0, .35); }
body.tema-navidad .nav__logo img, body.tema-fiestaspatrias .nav__logo img { margin-top: 6px; }

/* Tarjeta de saludo */
.greet { position: fixed; left: 50%; bottom: 22px; z-index: 245; display: flex; align-items: center; gap: .9rem; width: min(520px, calc(100vw - 180px)); padding: .9rem 1rem .9rem 1.1rem;
  border-radius: 18px; color: #fff; box-shadow: 0 24px 50px -18px rgba(0, 0, 0, .55); transform: translateX(-50%); animation: greetIn .8s var(--ease) 1s both; }
.greet[hidden] { display: none; }
.greet b { display: block; font-size: 1.05rem; }
.greet span { font-size: .85rem; opacity: .92; line-height: 1.4; }
.greet__icon { font-size: 2rem; line-height: 1; flex: none; animation: wiggle 2.4s ease-in-out infinite; }
.greet__close { margin-left: auto; align-self: flex-start; width: 30px; height: 30px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .2); color: #fff; cursor: pointer; font-size: 1.2rem; flex: none; }
.greet--navidad { background: linear-gradient(120deg, #14532d, #1d6b3d 50%, #b91c1c); }
.greet--anionuevo { background: linear-gradient(120deg, #0b2a2f, #1c1c3a 50%, #6b4e00); box-shadow: 0 0 0 1px rgba(255, 215, 0, .4), 0 24px 50px -18px rgba(0, 0, 0, .6); }
.greet--anionuevo b { color: #ffd700; }
.greet--fiestaspatrias { background: linear-gradient(120deg, #a30d1b, #d91023 60%, #e84a57); }
@keyframes greetIn { from { opacity: 0; transform: translate(-50%, 40px) scale(.95); } }
@keyframes wiggle { 0%, 100% { transform: rotate(0); } 15% { transform: rotate(-10deg); } 30% { transform: rotate(8deg); } 45% { transform: rotate(0); } }
.flag { display: flex; width: 44px; height: 30px; border-radius: 3px; overflow: hidden; box-shadow: 0 2px 6px rgba(0, 0, 0, .3); animation: wave 2.2s ease-in-out infinite; transform-origin: 0 50%; }
.flag i { flex: 1; background: #d91023; }
.flag i:nth-child(2) { background: #fff; }
@keyframes wave { 50% { transform: perspective(80px) rotateY(-14deg) skewY(-3deg); } }

@media (max-width: 640px) {
  .chat { right: 12px; bottom: 12px; }
  .chat__panel { position: fixed; inset: 0; width: 100%; height: 100%; border-radius: 0; bottom: 0; }
  .chat__tip { display: none; }
  .a11y__btn { left: 12px; bottom: 12px; width: 48px; height: 48px; }
  .a11y__panel { left: 12px; bottom: 70px; }
  .greet { width: calc(100vw - 24px); bottom: 76px; }
  .to-top { bottom: 84px; right: 12px; }
  .fest__lights li:nth-child(n+20), .fest__bunting li:nth-child(n+16) { display: none; }
}
@media (prefers-reduced-motion: reduce) { .fest-canvas { display: none; } }
@media print { .chat, .a11y, .fest, .fest-canvas, .greet { display: none !important; } }