/* Exact extraction from CRM globals.css. Load before portable.css. */
:root {
  color-scheme: dark;

  /* ----- Cores base da marca ----- */
  --color-void:          #050505;
  --color-orange:        #FF5A00;
  --color-orange-hover:  #FF8C40;
  --color-orange-press:  #F04E00;
  --color-orange-deep:   #CC4800;
  --color-white:         #FDFDFD;
  --color-carbon-900:    #1A1A1A;
  --color-carbon-800:    #222222;
  --color-carbon-700:    #292929;
  --color-carbon-600:    #333333;

  /* Superfícies da escala de preto escuro */
  --black-900:  #050505;
  --black-800:  #0A0A0A;

  /* ----- Kit de login premium Funnel Labs (padrão hub ferramentas) ----- */
  --color-panel:         #101014;
  --color-carbon-1:      #131316;
  --color-carbon-2:      #1a1a1f;
  --color-carbon-3:      #232329;
  --color-border:        rgba(253, 253, 253, 0.08);
  --color-border-strong: rgba(253, 253, 253, 0.14);
  --color-subtle:        #4a4a4f;
  --color-muted:         #8b8b93;
  --color-soft:          rgba(253, 253, 253, 0.62);
  --color-crisp:         #fdfdfd;
  --color-laser:         #ff5a00;
  --color-laser-2:       #ff8c40;
  --color-laser-hover:   #e64e00;
  --color-danger:        #e53e3e;
  --ease-out-expo:       cubic-bezier(0.16, 1, 0.3, 1);

  /* ----- Superfícies (dark default) ----- */
  --surface-0:   #050505;   /* Fundo geral da app */
  --surface-1:   #0A0A0A;   /* Sidebar, painéis laterais */
  --surface-2:   #0C0C0C;   /* Ponto base do card gradiente */
  --surface-3:   #141414;   /* Inputs, botão workspace switcher, linhas hover */
  --surface-4:   #1A1A1A;   /* Hover de inputs, botões secondary */
  --surface-5:   #222222;   /* Active/pressed, scrollbar thumb, KBD */
  --sidebar-bg:  linear-gradient(180deg, rgba(16,16,16,0.95), rgba(9,9,9,0.97));
  --topbar-bg:   rgba(11,11,11,0.60);
  --overlay-bg:  radial-gradient(800px 500px at 50% 30%, rgba(255,90,0,0.04), transparent 70%), rgba(0,0,0,0.72);
  --glass-bg:    rgba(10,10,10,0.85);
  --bottom-nav-bg: rgba(10,10,10,0.92);
  --scrollbar-thumb: #222222;

  /* Fundo do thread (inbox) — separado das surfaces por ser quase-void */
  --thread-bg:   #070707;
  --thread-dot:  rgba(253,253,253,0.025);

  /* Gradiente canônico de card */
  --card-gradient: linear-gradient(180deg, #101010, #0C0C0C);

  /* ----- Tinta (texto) ----- */
  --ink-1:  #FDFDFD;                     /* Texto primário, títulos */
  --ink-2:  rgba(253,253,253,0.82);      /* Texto de destaque secundário */
  --ink-3:  rgba(253,253,253,0.55);      /* Descrições de página, subtítulos */
  --ink-4:  rgba(253,253,253,0.40);      /* Labels mono, muted */
  --ink-5:  rgba(253,253,253,0.30);      /* Separadores de breadcrumb, timestamps */
  --ink-6:  rgba(253,253,253,0.26);      /* Section labels sidebar (eyebrow fraco) */

  /* ----- Accent: Laser Orange ----- */
  --accent:        #FF5A00;
  --accent-hover:  #FF8C40;
  --accent-press:  #F04E00;
  --accent-deep:   #CC4800;
  --accent-soft:   rgba(255,90,0,0.14);
  --accent-quiet:  rgba(255,90,0,0.08);
  --accent-glow:   0 0 18px -6px rgba(255,90,0,0.6);
  --accent-ink:    #0E0E0E;

  /* Botão primário */
  --btn-primary-gradient: linear-gradient(180deg, #FF8C40 0%, #FF5A00 45%, #F04E00 100%);
  --shadow-btn-primary: 0 1px 0 rgba(255,255,255,0.25) inset, 0 8px 24px -8px rgba(255,90,0,0.55);
  --shadow-btn-primary-hover: 0 1px 0 rgba(255,255,255,0.30) inset, 0 12px 30px -8px rgba(255,90,0,0.70);

  /* ----- Hairlines / bordas ----- */
  --hair-1:         rgba(253,253,253,0.06);   /* Bordas padrão de cards, separações */
  --hair-2:         rgba(253,253,253,0.08);   /* Inputs, tabelas (thead) */
  --hair-3:         rgba(253,253,253,0.10);   /* Inputs sem foco, botões secondary */
  --hair-4:         rgba(253,253,253,0.16);   /* Hover states */
  --hair-accent:    rgba(255,90,0,0.20);      /* Borda de item ativo na sidebar */
  --hair-accent-strong: rgba(255,90,0,0.35); /* Provider IA selecionado */
  --scrim:          rgba(0,0,0,0.65);

  /* ----- Status semântico ----- */
  --ok:           #22c55e;
  --ok-soft:      rgba(34,197,94,0.12);
  --warn:         #f59e0b;
  --warn-soft:    rgba(245,158,11,0.12);
  --danger:       #ef4444;
  --danger-soft:  rgba(239,68,68,0.10);
  --info:         #3b82f6;
  --info-soft:    rgba(59,130,246,0.12);
  --channel-ig:   #e1306c;
  --channel-wa:   #22c55e;

  /* ----- Raios de borda — escala completa conforme spec ----- */
  --r-1:    4px;    /* KBD, label tags pequenas, separador */
  --r-2:    6px;    /* Botão de colapso sidebar, ícone de canal pequeno */
  --r-3:    8px;    /* Inputs, botões padrão, avatares quadrados, logo workspace */
  --r-4:    9px;    /* Botão de envio, cards de conversa */
  --r-5:    10px;   /* Ícone de canal na config, ícone de documento */
  --r-6:    11px;   /* Cards de automação, itens de canal na config */
  --r-7:    12px;   /* Cards de KPI, container de lista kanban */
  --r-8:    13px;   /* Cards principais (conteúdo) — máximo para cards de conteúdo */
  --r-9:    14px;   /* Container do formulário de login */
  --r-10:   15px;   /* Banner de status do Assistente IA — máximo absoluto */
  --r-pill: 999px;  /* Pills, badges, toggles, filtros de tab */

  /* ----- Sombras — escala de elevação ----- */
  --shadow-1:  0 1px 0 rgba(255,255,255,0.05) inset;
  --shadow-2:  0 30px 70px -28px rgba(0,0,0,0.85);
  --shadow-float: 0 12px 28px -16px rgba(0,0,0,0.8);
  --glow-accent:  0 0 18px -6px rgba(255,90,0,0.6);
  --glow-logo:    drop-shadow(0 0 14px rgba(255,90,0,0.45));

  --elev-0:     none;
  --elev-1:     0 1px 0 rgba(255,255,255,0.04) inset, 0 0 0 1px var(--hair-1);
  --elev-2:     0 1px 0 rgba(255,255,255,0.05) inset, 0 0 0 1px var(--hair-1), 0 8px 24px -8px rgba(0,0,0,0.5);
  --elev-3:     0 1px 0 rgba(255,255,255,0.06) inset, 0 0 0 1px var(--hair-2), 0 16px 40px -12px rgba(0,0,0,0.65);
  --elev-float: 0 1px 0 rgba(255,255,255,0.07) inset, 0 0 0 1px var(--hair-2), 0 28px 72px -16px rgba(0,0,0,0.8);

  /* ----- Movimento ----- */
  --ease-out:    cubic-bezier(.16,1,.3,1);
  --ease-in-out: cubic-bezier(.65,0,.35,1);
  --ease-ui:     ease;
  --dur-1: 0.15s;   /* hover rápido */
  --dur-2: 0.20s;   /* border, box-shadow, toggle */
  --dur-3: 0.25s;   /* sidebar collapse */
  --dur-anim: 0.35s; /* animações de entrada de tela */

  /* ----- Tipografia ----- */
  /* Valores de fallback enquanto as fontes carregam via next/font */
  --font-display: 'Playfair Display', ui-serif, Georgia, serif;
  --font-body:    'Inter', ui-sans-serif, system-ui, sans-serif;
  --font-mono:    'IBM Plex Mono', ui-monospace, 'Courier New', monospace;

  /* ----- Layout ----- */
  --sidebar-w:           248px;
  --sidebar-w-collapsed: 72px;
  --topbar-h:            58px;
  --bottom-nav-h:        64px;

  /* ----- Safe areas mobile ----- */
  --safe-top:    env(safe-area-inset-top, 0px);
  --safe-right:  env(safe-area-inset-right, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left:   env(safe-area-inset-left, 0px);

  /* ----- Grid milimétrico (padrão auth) ----- */
  --grid-dot-color: rgba(253,253,253,0.05);
  --grid-dot-size:  1px;
  --grid-gap:       26px;

  /* ----- Densidade de espaçamento ----- */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  40px;
  --space-2xl: 64px;

  /* ----- Bolhas de mensagem (inbox) ----- */
  --bubble-out-bg:     rgba(255,90,0,0.16);
  --bubble-out-border: rgba(255,90,0,0.24);
  --bubble-out-text:   var(--ink-1);
}

:root.theme-light {
  color-scheme: light;

  --surface-0:   #F6F3EF;
  --surface-1:   #FFFDF9;
  --surface-2:   #FFFFFF;
  --surface-3:   #F2EEE8;
  --surface-4:   #EAE4DC;
  --surface-5:   #DED6CC;
  --sidebar-bg:  linear-gradient(180deg, rgba(255,253,249,0.96), rgba(246,243,239,0.98));
  --topbar-bg:   rgba(255,253,249,0.72);
  --overlay-bg:  radial-gradient(800px 500px at 50% 30%, rgba(255,90,0,0.08), transparent 70%), rgba(30,24,18,0.22);
  --glass-bg:    rgba(255,253,249,0.88);
  --bottom-nav-bg: rgba(255,253,249,0.94);
  --scrollbar-thumb: #C8BDB1;

  --card-gradient: linear-gradient(180deg, #FFFFFF, #F8F5F0);

  --ink-1:  #1B1713;
  --ink-2:  rgba(27,23,19,0.82);
  --ink-3:  rgba(27,23,19,0.64);
  --ink-4:  rgba(27,23,19,0.48);
  --ink-5:  rgba(27,23,19,0.36);
  --ink-6:  rgba(27,23,19,0.30);

  --accent-soft:   rgba(255,90,0,0.13);
  --accent-quiet:  rgba(255,90,0,0.08);
  --accent-ink:    #1B120B;

  --hair-1:         rgba(44,36,28,0.08);
  --hair-2:         rgba(44,36,28,0.11);
  --hair-3:         rgba(44,36,28,0.14);
  --hair-4:         rgba(44,36,28,0.20);
  --hair-accent:    rgba(255,90,0,0.26);
  --hair-accent-strong: rgba(255,90,0,0.42);
  --scrim:          rgba(23,18,14,0.35);

  --shadow-1:  0 1px 0 rgba(255,255,255,0.85) inset;
  --shadow-2:  0 30px 70px -30px rgba(58,44,31,0.28);
  --shadow-float: 0 16px 34px -20px rgba(58,44,31,0.34);

  --elev-1:     0 1px 0 rgba(255,255,255,0.85) inset, 0 0 0 1px var(--hair-1);
  --elev-2:     0 1px 0 rgba(255,255,255,0.9) inset, 0 0 0 1px var(--hair-1), 0 8px 24px -14px rgba(58,44,31,0.26);
  --elev-3:     0 1px 0 rgba(255,255,255,0.92) inset, 0 0 0 1px var(--hair-2), 0 16px 40px -18px rgba(58,44,31,0.32);
  --elev-float: 0 1px 0 rgba(255,255,255,0.94) inset, 0 0 0 1px var(--hair-2), 0 28px 72px -28px rgba(58,44,31,0.36);

  --grid-dot-color: rgba(44,36,28,0.08);

  --thread-bg:   #ECE6DD;
  --thread-dot:  rgba(44,36,28,0.05);

  --bubble-out-bg:     rgba(255,90,0,0.14);
  --bubble-out-border: rgba(255,90,0,0.26);
  --bubble-out-text:   var(--ink-1);
}

:root.theme-light .auth-force-dark {
  color-scheme: dark;
  --surface-0: #050505; --surface-1: #0A0A0A; --surface-2: #0C0C0C;
  --surface-3: #141414; --surface-4: #1A1A1A; --surface-5: #222222;
  --card-gradient: linear-gradient(180deg, #101010, #0C0C0C);
  --ink-1: #FDFDFD;
  --ink-2: rgba(253,253,253,0.82); --ink-3: rgba(253,253,253,0.55);
  --ink-4: rgba(253,253,253,0.40); --ink-5: rgba(253,253,253,0.30);
  --ink-6: rgba(253,253,253,0.26);
  --hair-1: rgba(253,253,253,0.06); --hair-2: rgba(253,253,253,0.08);
  --hair-3: rgba(253,253,253,0.10); --hair-4: rgba(253,253,253,0.16);
  --glass-bg: rgba(10,10,10,0.85); --scrim: rgba(0,0,0,0.65);
  --grid-dot-color: rgba(253,253,253,0.05);
  --thread-bg: #070707; --thread-dot: rgba(253,253,253,0.025);
}