/* Zaloo AI — Dynamic Island conversation experience */
.zl-chat-root{width:min(760px,calc(100vw - 34px));margin:18px auto 0;position:relative;z-index:2;perspective:1200px}
.zl-island-wrap{display:flex;justify-content:center;align-items:center;min-height:56px}
.zl-island{width:238px;min-height:54px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:#080808;color:#fff;box-shadow:0 12px 34px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;cursor:pointer;transform:translateZ(0);transition:width .72s cubic-bezier(.2,.9,.2,1),min-height .72s cubic-bezier(.2,.9,.2,1),border-radius .62s cubic-bezier(.2,.9,.2,1),background .45s ease,box-shadow .55s ease,transform .55s cubic-bezier(.2,.9,.2,1);will-change:width,min-height,filter,transform}
.zl-island:before{content:"";position:absolute;inset:-100%;pointer-events:none;background:conic-gradient(from 0deg,transparent 0 35%,rgba(255,255,255,.16) 45%,transparent 56% 100%);filter:blur(20px);opacity:.36;animation:zl-orbit 11s linear infinite}
@keyframes zl-orbit{to{transform:rotate(360deg)}}
.zl-island-label{position:relative;z-index:1;font-size:12px;font-weight:650;letter-spacing:.1px;color:#fff;transition:opacity .25s ease,filter .35s ease,transform .4s ease}
.zl-island:hover:not(.is-open){transform:translateY(-2px);box-shadow:0 16px 38px rgba(0,0,0,.24)}
.zl-island.is-open{width:min(620px,100%);min-height:106px;border-radius:27px;justify-content:stretch;align-items:stretch;padding:12px 14px;background:rgba(9,9,10,.88);backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%);box-shadow:0 22px 60px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.12);cursor:default;animation:zl-island-arrive .7s cubic-bezier(.2,.9,.2,1) both}
@keyframes zl-island-arrive{0%{filter:blur(8px);transform:scale(.94)}65%{filter:blur(1px);transform:scale(1.012)}100%{filter:blur(0);transform:scale(1)}}
.zl-island.is-open .zl-island-label{position:absolute;opacity:0;filter:blur(9px);transform:translateY(-8px) scale(.94);pointer-events:none}
.zl-island-form{position:relative;z-index:2;display:flex;flex-direction:column;gap:9px;width:100%;opacity:0;filter:blur(10px);transform:translateY(8px) scale(.985);pointer-events:none;transition:opacity .32s ease,filter .42s ease,transform .42s cubic-bezier(.2,.8,.2,1)}
.zl-island.is-open .zl-island-form{opacity:1;filter:blur(0);transform:translateY(0) scale(1);pointer-events:auto;transition-delay:.12s}
.zl-island-textarea{display:block;width:100%;min-height:43px;max-height:110px;resize:none;border:0;outline:0;background:transparent;color:#fff;font:inherit;font-size:14px;line-height:1.5;padding:2px 3px;overflow-y:auto}
.zl-island-textarea::placeholder{color:rgba(255,255,255,.56)}
.zl-island-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}
.zl-island-hint{margin-right:auto;color:rgba(255,255,255,.42);font-size:9px;letter-spacing:.15px}
.zl-send{width:34px;height:34px;border:0;border-radius:50%;display:grid;place-items:center;background:#fff;color:#080808;cursor:pointer;transition:transform .22s ease,opacity .2s ease,background .2s ease}
.zl-send:hover{transform:scale(1.08)}.zl-send:active{transform:scale(.94)}.zl-send:disabled{opacity:.4;cursor:wait}
.zl-send svg{width:17px;height:17px}
.zl-close-intro{width:30px;height:30px;border:0;border-radius:50%;background:rgba(255,255,255,.1);color:#fff;cursor:pointer;font-size:15px}
.zl-chat-stage{display:none;opacity:0;filter:blur(14px);transform:translateY(16px) scale(.985);transition:opacity .55s ease,filter .7s ease,transform .65s cubic-bezier(.2,.8,.2,1)}
.zl-chat-stage.is-visible{display:flex;flex-direction:column;opacity:1;filter:blur(0);transform:translateY(0) scale(1)}
.zl-chat-top{display:flex;align-items:center;gap:10px;padding:7px 2px 13px;border-bottom:1px solid rgba(30,30,30,.08)}
.zl-chat-mark{width:31px;height:31px;border-radius:11px;background:#090909;color:#fff;display:grid;place-items:center;font-size:11px;font-weight:800;letter-spacing:-.5px;box-shadow:0 5px 14px rgba(0,0,0,.14)}
.zl-chat-topcopy{flex:1;min-width:0}.zl-chat-topcopy strong{display:block;font-size:12px;font-weight:700;color:var(--text,#25231f)}.zl-chat-topcopy span{display:block;margin-top:2px;font-size:9px;color:var(--muted,#999187)}
.zl-chat-new{width:30px;height:30px;border:1px solid rgba(30,30,30,.1);border-radius:50%;background:rgba(255,255,255,.72);color:#555;cursor:pointer;font-size:16px}
.zl-chat-messages{width:100%;max-height:min(48vh,480px);min-height:110px;overflow-y:auto;display:flex;flex-direction:column;gap:13px;padding:19px 3px 16px;scroll-behavior:smooth;overscroll-behavior:contain}
.zl-chat-message{max-width:min(88%,620px);padding:12px 15px;border-radius:18px;font-size:13px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere;opacity:0;filter:blur(12px);transform:translateY(9px) scale(.985);animation:zl-message-in .65s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes zl-message-in{to{opacity:1;filter:blur(0);transform:translateY(0) scale(1)}}
.zl-chat-message.user{align-self:flex-end;background:#090909;color:#fff;border-bottom-right-radius:6px;box-shadow:0 7px 20px rgba(0,0,0,.11)}
.zl-chat-message.assistant{align-self:flex-start;background:rgba(255,255,255,.78);border:1px solid rgba(20,20,20,.06);color:var(--text,#28251f);border-bottom-left-radius:6px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.zl-chat-message.error{background:#fff0ed;color:#943d32}
.zl-typing{align-self:flex-start;display:flex;align-items:center;gap:5px;padding:13px 15px;border-radius:18px;background:rgba(255,255,255,.75);opacity:0;filter:blur(8px);animation:zl-message-in .35s ease forwards}
.zl-typing i{width:5px;height:5px;border-radius:50%;background:#777;animation:zl-dot 1s ease-in-out infinite}.zl-typing i:nth-child(2){animation-delay:.14s}.zl-typing i:nth-child(3){animation-delay:.28s}
@keyframes zl-dot{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-4px);opacity:1}}
.zl-chat-status{min-height:15px;padding:0 3px 8px;font-size:9px;color:var(--muted,#999187)}
.zl-chat-dock{display:flex;align-items:flex-end;gap:9px;padding:10px;border:1px solid rgba(20,20,20,.1);border-radius:23px;background:rgba(255,255,255,.74);box-shadow:0 12px 35px rgba(0,0,0,.08);backdrop-filter:blur(20px) saturate(140%);-webkit-backdrop-filter:blur(20px) saturate(140%);transition:box-shadow .25s ease,border-color .25s ease}
.zl-chat-dock:focus-within{border-color:rgba(20,20,20,.24);box-shadow:0 15px 40px rgba(0,0,0,.12)}
.zl-chat-dock textarea{flex:1;min-width:0;min-height:35px;max-height:100px;resize:none;border:0;outline:0;background:transparent;color:var(--text,#25231f);font:inherit;font-size:13px;line-height:1.5;padding:7px 3px}
.zl-chat-dock textarea::placeholder{color:var(--muted,#999187)}
.zl-chat-dock .zl-send{width:36px;height:36px;background:#090909;color:#fff;flex:0 0 auto}
.zl-chat-error{font-size:11px;color:#a14338;padding:2px 3px 8px}
.zl-intro{transition:opacity .45s ease,filter .6s ease,transform .6s cubic-bezier(.2,.8,.2,1);transform-origin:center top}
.zl-intro.zl-intro-leave{opacity:0;filter:blur(18px);transform:translateY(-15px) scale(.97);pointer-events:none}
.zl-chat-root.zl-chat-mode{margin-top:clamp(14px,3vh,28px)}
body.dark-theme .zl-chat-topcopy strong{color:#f4f1ec}body.dark-theme .zl-chat-top{border-color:#ffffff20}body.dark-theme .zl-chat-new{background:#242424;color:#eee;border-color:#ffffff20}body.dark-theme .zl-chat-message.assistant{background:rgba(35,35,35,.8);border-color:#ffffff15;color:#f1f1f1}body.dark-theme .zl-chat-dock{background:rgba(30,30,30,.78);border-color:#ffffff20}body.dark-theme .zl-chat-dock textarea{color:#fff}body.dark-theme .zl-typing{background:#292929}body.dark-theme .zl-typing i{background:#ddd}
@media(max-width:600px){.zl-chat-root{width:calc(100vw - 28px);margin-top:16px}.zl-island{width:226px;min-height:52px}.zl-island.is-open{width:100%;min-height:104px;border-radius:24px;padding:11px 12px}.zl-chat-messages{max-height:calc(100dvh - 330px);min-height:100px;padding:15px 1px}.zl-chat-message{max-width:94%;font-size:12px}.zl-chat-dock{border-radius:20px}.zl-chat-root.zl-chat-mode{margin-top:10px}}
@media(prefers-reduced-motion:reduce){.zl-island,.zl-island:before,.zl-island-form,.zl-chat-stage,.zl-chat-message,.zl-typing,.zl-intro{animation:none!important;transition-duration:.01ms!important}.zl-chat-message{opacity:1;filter:none;transform:none}}


/* Premium Dynamic Island refinement — visible on first load */
#zalooChatRoot.zl-chat-root{display:block!important;visibility:visible!important;opacity:1!important;width:min(820px,calc(100vw - 32px));margin:24px auto 0;position:relative;z-index:20;isolation:isolate}
#zalooChatRoot .zl-island-wrap{min-height:74px;padding:8px 0;overflow:visible}
#zalooChatRoot .zl-island{width:276px;min-height:58px;border:1px solid rgba(255,255,255,.17);border-radius:999px;background:linear-gradient(145deg,#080808 0%,#171719 100%);box-shadow:0 16px 42px rgba(0,0,0,.22),0 2px 8px rgba(0,0,0,.12),inset 0 1px 0 rgba(255,255,255,.13);outline:none}
#zalooChatRoot .zl-island-label{font-size:12px;font-weight:650;letter-spacing:.12px;text-align:center;padding:0 17px}
#zalooChatRoot .zl-island:not(.is-open):focus-visible{box-shadow:0 0 0 4px rgba(120,120,120,.15),0 16px 42px rgba(0,0,0,.22)}
#zalooChatRoot .zl-island.is-open{width:min(650px,100%);min-height:116px;border-radius:32px;padding:15px 17px;background:rgba(12,12,14,.91);border-color:rgba(255,255,255,.2);backdrop-filter:blur(30px) saturate(165%);-webkit-backdrop-filter:blur(30px) saturate(165%);box-shadow:0 28px 80px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.16),0 0 0 1px rgba(255,255,255,.035)}
#zalooChatRoot .zl-island.is-open:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.075),transparent 42%,rgba(255,255,255,.025));}
#zalooChatRoot .zl-island-form{gap:10px}
#zalooChatRoot .zl-island-textarea{font-size:14px;min-height:45px}
#zalooChatRoot .zl-island-hint{font-size:9px;letter-spacing:.18px}
#zalooChatRoot .zl-send{width:36px;height:36px;box-shadow:0 4px 14px rgba(0,0,0,.2)}
#zalooChatRoot .zl-chat-stage{transform-origin:top center}
#zalooChatRoot .zl-chat-stage.is-visible{animation:zl-stage-reveal .78s cubic-bezier(.2,.8,.2,1) both}
@keyframes zl-stage-reveal{0%{opacity:0;filter:blur(18px);transform:translateY(20px) scale(.985)}65%{opacity:1;filter:blur(2px);transform:translateY(2px) scale(1.002)}100%{opacity:1;filter:blur(0);transform:translateY(0) scale(1)}}
#zalooChatRoot .zl-chat-dock{animation:zl-dock-reveal .72s .12s cubic-bezier(.2,.8,.2,1) both}
@keyframes zl-dock-reveal{0%{opacity:0;filter:blur(14px);transform:translateY(13px) scale(.985)}100%{opacity:1;filter:blur(0);transform:translateY(0) scale(1)}}
#zalooChatRoot .zl-chat-message.assistant{animation-duration:.82s}
@media(max-width:600px){#zalooChatRoot.zl-chat-root{width:calc(100vw - 28px);margin-top:18px}#zalooChatRoot .zl-island{width:min(276px,92vw);min-height:56px}#zalooChatRoot .zl-island.is-open{width:100%;min-height:112px;border-radius:29px;padding:13px 14px}}


/* FIX VISIBILIDAD: Dynamic Island siempre visible debajo de las recomendaciones */
#zalooChatRoot.zl-chat-root {
  display:flex !important;
  flex:0 0 auto !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-start !important;
  align-self:stretch !important;
  width:100% !important;
  max-width:760px !important;
  min-height:76px !important;
  margin:18px auto 0 !important;
  padding:0 8px 8px !important;
  position:relative !important;
  z-index:30 !important;
  visibility:visible !important;
  opacity:1 !important;
  overflow:visible !important;
}
#zalooChatRoot .zl-island-wrap {
  display:flex !important;
  width:100% !important;
  min-height:76px !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:visible !important;
}
#zalooChatRoot .zl-island {
  display:flex !important;
  flex:0 0 auto !important;
  width:min(292px, calc(100vw - 52px)) !important;
  min-height:60px !important;
  background:#050505 !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.2) !important;
  box-shadow:0 15px 38px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.14) !important;
  opacity:1 !important;
  visibility:visible !important;
}
#zalooChatRoot .zl-island-label { color:#fff !important; }
#zalooChatRoot .zl-island.is-open {
  width:min(650px, 100%) !important;
  min-height:118px !important;
  background:#080808 !important;
  border-radius:30px !important;
}
#zalooChatRoot .zl-island-form { width:100% !important; }
#zalooChatRoot .zl-chat-stage { width:100% !important; }
@media(max-width:600px) {
  #zalooChatRoot.zl-chat-root { width:100% !important; margin-top:14px !important; padding-left:0 !important; padding-right:0 !important; }
  #zalooChatRoot .zl-island-wrap { min-height:68px !important; }
  #zalooChatRoot .zl-island { width:min(292px, calc(100vw - 44px)) !important; }
  #zalooChatRoot .zl-island.is-open { width:100% !important; min-height:112px !important; }
}

/* Isla de escritura — etiqueta centrada y tipografía ligera */
.zl-island { justify-content:center !important; }
.zl-island-label { width:100%;text-align:center;font-size:11px !important;font-weight:500 !important;letter-spacing:.18px !important; }
.zl-island:not(.is-open) { width:220px !important;min-height:48px !important; }
.zl-island-wrap { min-height:50px !important; }