:root{ --rc-safe-bottom: env(safe-area-inset-bottom, 0px); --rc-vh: 1vh; }
.rc{position:fixed;bottom:calc(16px + var(--rc-safe-bottom));z-index:999999;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
.rc-right{right:16px}.rc-left{left:16px}
.rc-bubble{width:56px;height:56px;border-radius:999px;border:0;cursor:pointer;box-shadow:0 10px 20px rgba(0,0,0,.18);background:#2f4ae1;color:#fff;font-size:22px;display:flex;align-items:center;justify-content:center;overflow:visible;position:relative;padding:0}
.rc-bubble-img{display:block !important;width:44px !important;height:44px !important;object-fit:contain !important;border-radius:50% !important;margin:0 !important;padding:0 !important;opacity:1 !important;visibility:visible !important;flex-shrink:0 !important}
.rc-bubble-icon{font-size:24px}

/* Painel usa flex para se adaptar à altura */
.rc-panel{width:360px;height:520px;background:#fff;border-radius:16px;box-shadow:0 20px 40px rgba(0,0,0,.18);overflow:hidden;position:absolute;bottom:72px;right:0;display:none;flex-direction:column}
.rc-open{display:flex}
.rc-left .rc-panel{left:0;right:auto}

.rc-header{color:#fff;padding:10px 12px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:1}
.rc-id{display:flex;gap:10px;align-items:center}
.rc-id img{width:36px;height:36px;border-radius:50%;object-fit:cover}
.rc-name{font-weight:700}
.rc-sub{font-size:12px;opacity:.85}
.rc-close{background:transparent;border:0;color:#fff;font-size:22px;cursor:pointer}

.rc-body{padding:12px;flex:1;overflow:auto;background:#f8fafc}
.rc-msg{padding:10px 12px;border-radius:12px;margin-bottom:8px;max-width:85%;line-height:1.4}
.rc-bot{background:#eef2ff;color:#111827}
.rc-user{background:#e5e7eb;margin-left:auto}

.rc-input{display:flex;gap:8px;padding:10px;border-top:1px solid #e5e7eb;position:sticky;bottom:0;background:#fff}
.rc-input input{flex:1;padding:12px;border-radius:10px;border:1px solid #cbd5e1;font-size:16px}
.rc-input button{color:#fff;border:0;padding:12px 14px;border-radius:10px;cursor:pointer}

.rc-links{margin:8px 0;display:flex;flex-direction:column;gap:6px}
.rc-suggest-title{font-size:12px;color:#334155;margin:8px 0 0 0}

.rc-consent{position:absolute;inset:0;background:rgba(0,0,0,.45);display:none;align-items:center;justify-content:center;padding:16px}
.rc-consent-box{background:#fff;border-radius:12px;max-width:90%;width:320px;padding:16px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.rc-consent-box h4{margin:0 0 8px 0}
.rc-consent-box p{font-size:14px;color:#334155}
.rc-consent-box .rc-accept{margin-top:10px;border:0;color:#fff;padding:10px 12px;border-radius:10px;cursor:pointer}

/* === Responsivo === */
@media (max-width: 768px){
  .rc-bubble{width:56px;height:56px}
  /* Painel em tela cheia com espaço fixo para barra de navegação */
  .rc-panel{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    width:100vw !important;
    height:100vh !important;
    max-width:100vw !important;
    max-height:100vh !important;
    border-radius:0 !important;
    margin:0 !important;
    transform:none !important;
    padding-bottom:60px !important;
    box-sizing:border-box !important;
    overflow:hidden !important
  }
  .rc-body{
    padding:12px;
    padding-bottom:100px !important;
    box-sizing:border-box !important
  }
  .rc-input{
    /* Input fixo no fundo com padding em todos os lados */
    display:flex !important;
    gap:8px !important;
    padding:12px !important;
    padding-bottom:60px !important;
    position:absolute !important;
    bottom:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    background:#fff !important;
    border-top:1px solid #e5e7eb !important;
    box-sizing:border-box !important
  }
  .rc-input input{
    flex:1 !important;
    min-width:0 !important;
    font-size:16px !important;
    padding:10px 12px !important;
    border-radius:10px !important;
    border:1px solid #cbd5e1 !important;
    box-sizing:border-box !important
  }
  .rc-input button{
    flex-shrink:0 !important;
    padding:10px 16px !important;
    border-radius:10px !important;
    white-space:nowrap !important;
    box-sizing:border-box !important
  }
}
@media (max-width: 480px){
  .rc-bubble{width:52px;height:52px;overflow:visible}
  .rc-bubble-img{display:block !important;width:40px !important;height:40px !important;object-fit:contain !important;opacity:1 !important;visibility:visible !important}
  .rc-header{padding:12px}
  .rc-name{font-size:16px}
  .rc-sub{font-size:12px}
  .rc-msg{max-width:90%}
}
