/* =============================================================
 *  base/tokens.css
 *  Extraído automaticamente de index.php.
 *  NÃO editar manualmente até remover o script de split.
 * ============================================================= */

    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    :root {
      --bg:          #eef1fb;
      --panel:       #ffffff;
      --surface:     #f4f6fd;
      --surface-2:   #eaedfa;
      --border:      #dde3f5;
      --border-2:    #c8d0ee;
      --accent:      #20a078;
      --accent-h:    #178060;
      --accent-soft: #e8f7f2;
      --accent-glow: rgba(32,160,120,.22);
      --text:        #1a1e3a;
      --text-2:      #5b6380;
      --text-3:      #9fa8c8;
      --green:       #10b981;
      --green-soft:  #ecfdf5;
      --yellow:      #f59e0b;
      --yellow-soft: #fffbeb;
      --red:         #ef4444;
      --red-soft:    #fef2f2;
      --bub-me:      #20a078;
      --bub-me-t:    #ffffff;
      --bub-them:    #f0f3ff;
      --bub-them-t:  #1a1e3a;
      --radius:      12px;
      --radius-sm:   8px;
      --radius-xs:   6px;
      --sidebar:     480px;
      --header:      62px;
      --font:        'Nunito', sans-serif;
      --sh-sm:  0 1px 4px rgba(30,34,80,.07);
      --sh-md:  0 4px 16px rgba(30,34,80,.09);
      --sh-lg:  0 8px 32px rgba(30,34,80,.12);
      /* Lista de conversas (com tema claro, estilo “lista de chats”) */
      --list-hover:  #f5f6f6;
      --list-active: #ebeefa;
      --list-green:  #20a078;
      /* Capacitor 8 SystemBars injeta --safe-area-inset-* na WebView Android; env() costuma ser 0. iOS/PWA: env() preenche. */
      --zori-safe-top: max(env(safe-area-inset-top, 0px), var(--safe-area-inset-top, 0px));
      --zori-safe-bottom: max(env(safe-area-inset-bottom, 0px), var(--safe-area-inset-bottom, 0px));
      --zori-safe-left: max(env(safe-area-inset-left, 0px), var(--safe-area-inset-left, 0px));
      --zori-safe-right: max(env(safe-area-inset-right, 0px), var(--safe-area-inset-right, 0px));
    }

    html { height: 100%; -webkit-text-size-adjust: 100%; overflow: hidden; }
    body { height: 100%; overflow: hidden; font-family: var(--font); background: var(--bg); color: var(--text); -webkit-font-smoothing: antialiased; }
    input, textarea, button { font-family: var(--font); }
    * { scrollbar-width: thin; scrollbar-color: var(--border-2) transparent; }
    ::-webkit-scrollbar { width: 4px; }
    ::-webkit-scrollbar-track { background: transparent; }
    ::-webkit-scrollbar-thumb { background: var(--border-2); border-radius: 4px; }