/* ============================================================
   css/chatbot-gs.css
   CSS do widget de chat (gs-fab/gs-panel), externalizado do
   chatbot-gs.js para cumprir o CSP sem 'unsafe-inline' no style-src.
   Antes era injetado em runtime via document.createElement('style').
   ============================================================ */

    #gs-fab {
      position:fixed; bottom:1.5rem; right:1.5rem; z-index:9998;
      width:62px; height:75px;
      background:none; border:none; cursor:pointer;
      display:flex; align-items:center; justify-content:center;
      padding:0;
      opacity:0; pointer-events:none;
      transition: transform .25s, opacity .4s ease;
    }
    #gs-fab.fab-visible { opacity:1; pointer-events:all; }
    #gs-fab:hover { transform: scale(1.09); }
    #gs-fab .gs-badge {
      position:absolute; top:0px; right:-2px;
      background:#f97316; color:#fff; font-size:.62rem; font-weight:700;
      border-radius:99px; padding:.1rem .32rem; line-height:1.4;
      opacity:0; transition:opacity .2s;
    }
    #gs-fab .gs-badge.show { opacity:1; }

    /* --- Coruja SVG animada --- */
    .gs-owl-svg {
      display:block; overflow:visible;
      /* 3× drop-shadow branco com blur 2px cria contorno sólido visível em fundo escuro */
      filter: drop-shadow(0 0 2px white)
              drop-shadow(0 0 2px white)
              drop-shadow(0 4px 10px rgba(0,0,0,.45));
      animation: gsOwlGlow 3.5s ease-in-out infinite;
    }
    @keyframes gsOwlGlow {
      0%,100% { filter: drop-shadow(0 0 2px white) drop-shadow(0 0 2px white) drop-shadow(0 4px 10px rgba(0,0,0,.4)); }
      50%     { filter: drop-shadow(0 0 2px white) drop-shadow(0 0 2px white) drop-shadow(0 4px 16px rgba(39,188,234,.65)); }
    }
    .gs-owl-svg .gs-owl-body {
      animation: gsOwlBob 2.7s ease-in-out infinite;
      transform-origin: center bottom;
    }
    @keyframes gsOwlBob {
      0%,100% { transform: translateY(0px) rotate(0deg); }
      30%     { transform: translateY(-6px) rotate(-1.5deg); }
      70%     { transform: translateY(-4px) rotate(1.5deg); }
    }
    /* pálpebras — piscar */
    .gs-lid-l, .gs-lid-r {
      transform-box: fill-box;
      transform-origin: center top;
      animation: gsOwlBlink 4.8s ease-in-out infinite;
    }
    .gs-lid-r { animation-delay: .09s; }
    @keyframes gsOwlBlink {
      0%,90%,100% { transform: scaleY(0.02); }
      93%         { transform: scaleY(1); }
      97%         { transform: scaleY(0.02); }
    }
    /* header — coruja pequena */
    .gs-owl-mini {
      display:block; flex-shrink:0;
      animation: gsOwlBobSm 3s ease-in-out infinite;
    }
    @keyframes gsOwlBobSm {
      0%,100% { transform: translateY(0px); }
      50%     { transform: translateY(-3px); }
    }
    .gs-header img { display:none; }

    #gs-panel {
      position:fixed; bottom:5.5rem; right:1.5rem; z-index:9999;
      width:340px; max-width:calc(100vw - 2rem);
      background:#fff; border-radius:16px;
      box-shadow:0 8px 40px rgba(0,0,0,.18);
      display:flex; flex-direction:column; overflow:hidden;
      transform:translateY(20px) scale(.97); opacity:0;
      pointer-events:none;
      transition:transform .25s cubic-bezier(.4,0,.2,1), opacity .25s;
      max-height:75vh;
    }
    #gs-panel.open { transform:translateY(0) scale(1); opacity:1; pointer-events:all; }

    .gs-header {
      background:#27BCEA; color:#fff;
      padding:.8rem 1rem; display:flex; align-items:center; gap:.6rem;
    }
    .gs-header img { width:36px; height:36px; border-radius:50%; border:2px solid rgba(255,255,255,.4); }
    .gs-header-text { flex:1; }
    .gs-header-name { font-weight:700; font-size:.95rem; line-height:1.2; }
    .gs-header-sub  { font-size:.72rem; opacity:.85; }
    .gs-close { background:none; border:none; color:#fff; cursor:pointer; font-size:1.2rem; line-height:1; padding:.2rem; opacity:.8; }
    .gs-close:hover { opacity:1; }

    .gs-body {
      flex:1; overflow-y:auto; padding:1rem;
      display:flex; flex-direction:column; gap:.75rem;
      scroll-behavior:smooth;
    }
    .gs-bubble {
      max-width:90%; padding:.6rem .9rem; border-radius:12px;
      font-size:.84rem; line-height:1.55;
    }
    .gs-bubble.bot {
      background:#f0faff; color:#1e293b;
      border-bottom-left-radius:4px; align-self:flex-start;
    }
    .gs-bubble.bot a { color:#27BCEA; }
    .gs-opts { display:flex; flex-direction:column; gap:.4rem; }
    .gs-opt {
      background:#fff; border:1.5px solid #d1fae5; color:#27BCEA;
      border-radius:8px; padding:.5rem .75rem;
      font-size:.82rem; font-weight:600; cursor:pointer; text-align:left;
      transition:background .15s, border-color .15s;
    }
    .gs-opt:hover { background:#f0faff; border-color:#27BCEA; }
    .gs-link-btn {
      display:inline-block; background:#27BCEA; color:#fff !important;
      padding:.4rem .85rem; border-radius:8px; font-size:.8rem; font-weight:600;
      text-decoration:none; margin-top:.25rem;
      transition:background .15s;
    }
    .gs-link-btn:hover { background:#1a9bbf; }

    .gs-typing {
      display:flex; gap:4px; align-items:center;
      background:#f0faff; padding:.5rem .75rem; border-radius:12px;
      border-bottom-left-radius:4px; align-self:flex-start; width:50px;
    }
    .gs-dot {
      width:7px; height:7px; border-radius:50%; background:#27BCEA;
      animation:gs-bounce .9s infinite;
    }
    .gs-dot:nth-child(2) { animation-delay:.15s; }
    .gs-dot:nth-child(3) { animation-delay:.3s; }
    @keyframes gs-bounce {
      0%,60%,100% { transform:translateY(0); }
      30% { transform:translateY(-6px); }
    }
    .gs-input-area {
      display:flex; gap:.5rem; padding:.65rem .75rem;
      border-top:1px solid #e2e8f0; background:#fff;
    }
    .gs-input {
      flex:1; border:1.5px solid #cbd5e1; border-radius:8px;
      padding:.45rem .75rem; font-size:.83rem; font-family:inherit;
      outline:none; transition:border-color .15s;
      resize:none; height:38px; line-height:1.4;
    }
    .gs-input:focus { border-color:#27BCEA; }
    .gs-input::placeholder { color:#94a3b8; }
    .gs-send {
      background:#27BCEA; color:#fff; border:none; border-radius:8px;
      width:38px; height:38px; cursor:pointer; font-size:1rem;
      display:flex; align-items:center; justify-content:center;
      transition:background .15s; flex-shrink:0;
    }
    .gs-send:hover { background:#1a9bbf; }
    @media (max-width:400px) {
      #gs-panel { right:.75rem; bottom:5rem; width:calc(100vw - 1.5rem); }
    }