/* ============================================================ AGENT BUILDER — Light theme Ativa com . Redefine os tokens de cor e sobrescreve os valores escuros fixos (fundos navy, vidro branco translúcido, chips, texto branco). O tema dark segue idêntico quando o atributo não está presente. Decisões: consoles/dashboards/shield/flow-builder viram vidro claro com sombra suave. As miniaturas de blog (.art-thumb) e a capa do e-book (.tk-cover) permanecem escuras/coloridas — são "imagens" intencionais que contrastam bem sobre o fundo claro. ============================================================ */ /* ---------------- TOKENS ---------------- */ html[data-theme="light"]{ --ab-secondary: #e9ecf2; /* off-white / cinza muito claro (fundo) */ --ab-body-bg: #e9ecf2; --ab-heading: #0b1220; /* navy escuro para títulos e texto forte */ --ab-fg: #101828; /* corpo de texto */ --ab-fg-muted: #515a6b; /* secundário */ --ab-fg-dim: #8a93a3; /* placeholder / dim */ --ab-fg-on-light: #414047; --ab-surface-1: #dfe6f4; --ab-surface-2: #eef1f7; --ab-surface-3: #e4e9f3; --ab-glass: rgba(255,255,255,0.70); --ab-glass-strong: rgba(255,255,255,0.85); --ab-border: rgba(12,20,38,0.10); --ab-border-strong: rgba(12,20,38,0.17); --ab-divider-color: #d9dde7; --ab-shadow-card: 0 1px 2px rgba(16,24,40,0.05), 0 22px 48px -26px rgba(16,24,40,0.32); --ab-shadow-glass: 0 6px 24px -8px rgba(16,24,40,0.16); --ab-glow-ring: 0 0 0 1px rgba(41,106,237,0.30), 0 0 22px rgba(41,106,237,0.18); --ab-ambient: radial-gradient(40% 40% at 25% 40%, rgba(41,106,237,0.07) 0%, rgba(233,236,242,0) 70%), radial-gradient(45% 45% at 80% 55%, rgba(41,106,237,0.06) 0%, rgba(233,236,242,0) 70%); /* helpers só do tema claro */ --l-card: #ffffff; --l-chip: #eef1f8; --l-tint: #f2f6fe; /* painel/CTA com leve azul */ --l-canvas:#f4f6fb; /* fundo de canvas/console */ --l-bar: #f5f7fb; /* barras de janela/console */ } /* ---------------- BASE ---------------- */ [data-theme="light"] body{color:var(--ab-fg);background:var(--ab-secondary)} /* logo: alterna versão clara/escura */ [data-theme="light"] .logo-dark{display:none} [data-theme="light"] .logo-light{display:block} [data-theme="light"] .hdr .hdr-logo .logo-dark{display:none} [data-theme="light"] .hdr .hdr-logo .logo-light{display:block} /* ================= HEADER / NAV / DRAWER ================= */ [data-theme="light"] .hdr.stuck{background:rgba(255,255,255,0.72);border-bottom:1px solid var(--ab-border)} [data-theme="light"] .menu a, [data-theme="light"] .menu-trigger{background:#fff;color:var(--ab-heading);border-color:var(--ab-border)} [data-theme="light"] .burger{background:#fff;color:var(--ab-heading);border-color:var(--ab-border)} [data-theme="light"] .burger svg path{stroke:var(--ab-heading)} [data-theme="light"] .drawer-bg{background:rgba(18,24,40,0.40)} [data-theme="light"] .drawer-panel{background:#fff;border-left-color:var(--ab-border)} [data-theme="light"] .drawer-panel a{color:var(--ab-heading);border-bottom-color:var(--ab-border)} [data-theme="light"] .drawer-close{background:#fff;color:var(--ab-heading);border-color:var(--ab-border)} [data-theme="light"] .drawer-group{border-bottom-color:var(--ab-border)} [data-theme="light"] .drawer-group-trigger{color:var(--ab-heading)} [data-theme="light"] .submenu{background:rgba(255,255,255,0.96);border-color:var(--ab-border)} [data-theme="light"] .submenu a{color:var(--ab-fg-muted)} [data-theme="light"] .submenu a:hover, [data-theme="light"] .submenu a.active{background:rgba(41,106,237,0.12);color:var(--ab-heading)} /* ================= BOTÕES ================= */ [data-theme="light"] .ghost-btn{background:#fff;color:var(--ab-heading);border-color:var(--ab-border-strong)} [data-theme="light"] .ghost-btn:hover{color:var(--ab-primary);border-color:var(--ab-primary)} [data-theme="light"] .blog-more button{background:#fff;color:var(--ab-heading);border-color:var(--ab-border-strong)} [data-theme="light"] .blog-more button:hover{color:var(--ab-primary);border-color:var(--ab-primary)} [data-theme="light"] .ty-ghost:hover{color:var(--ab-heading);border-color:var(--ab-border-strong)} [data-theme="light"] .tk-ghost{color:var(--ab-heading)} [data-theme="light"] .tk-tag{color:var(--ab-fg-muted);background:#fff} /* Toggle de tema */ [data-theme="light"] .theme-toggle{background:#fff;color:var(--ab-heading);border-color:var(--ab-border)} [data-theme="light"] .theme-toggle:hover{border-color:var(--ab-primary);color:var(--ab-primary)} /* ================= TEXTO (branco fixo -> escuro) ================= */ [data-theme="light"] .eyebrow, [data-theme="light"] .title, [data-theme="light"] .brandstrip span, [data-theme="light"] .feat-card h3, [data-theme="light"] .intg-tile, [data-theme="light"] .dollar, [data-theme="light"] .tcard .q, [data-theme="light"] .acc-btn, [data-theme="light"] .hero-sub strong, [data-theme="light"] .ac-prompt .txt, [data-theme="light"] .ac-label, [data-theme="light"] .impact h2, [data-theme="light"] .impact-turn, [data-theme="light"] .cap-item .ci-t, [data-theme="light"] .flow-body h4, [data-theme="light"] .op-card h4, [data-theme="light"] .op-lead h3, [data-theme="light"] .gov-list li, [data-theme="light"] .obs-metric .mv, [data-theme="light"] .obs-log .m, [data-theme="light"] .diff-card h4, [data-theme="light"] .final-band h2, [data-theme="light"] .agendar-copy h2, [data-theme="light"] .step-num, [data-theme="light"] .flow-num, [data-theme="light"] .socials a, [data-theme="light"] .plan-tag, /* plataforma */ [data-theme="light"] .pf-hero h1, [data-theme="light"] .pf-hero .pf-sub strong, [data-theme="light"] .pf-strip p strong, [data-theme="light"] .pf-win-main .mh, [data-theme="light"] .pf-agent .an, [data-theme="light"] .pf-mod h4, [data-theme="light"] .pf-step h4, [data-theme="light"] .pf-step .sn, [data-theme="light"] .pf-arch h4, [data-theme="light"] .pf-intel h4, [data-theme="light"] .pf-faq-q, [data-theme="light"] .pf-win-side li.on, /* governança */ [data-theme="light"] .gov-hero h1, [data-theme="light"] .gov-h2, [data-theme="light"] .gov-body strong, [data-theme="light"] .gov-thesis h2, [data-theme="light"] .gd-card h4, [data-theme="light"] .gov-act h4, [data-theme="light"] .gov-sev .lv, [data-theme="light"] .gov-gate-head .gt, [data-theme="light"] .gov-gate-list li, [data-theme="light"] .gov-role h4, [data-theme="light"] .gov-ev .evrule, [data-theme="light"] .gov-faq-q, /* observabilidade */ [data-theme="light"] .ob-hero h1, [data-theme="light"] .ob-sub strong, [data-theme="light"] .ob-kpi .kv, [data-theme="light"] .ob-metric .mv, [data-theme="light"] .ob-metric h4, [data-theme="light"] .ob-trace-head .tt, [data-theme="light"] .ob-tr .trname, [data-theme="light"] .ob-tr .trval b, [data-theme="light"] .ob-cost-top .cv, [data-theme="light"] .ob-gr .gn, [data-theme="light"] .ob-role h4, [data-theme="light"] .ob-faq-q, /* serviços */ [data-theme="light"] .sv-hero h1, [data-theme="light"] .sv-sub strong, [data-theme="light"] .sv-rail-list .s, [data-theme="light"] .sv-rail-list .n, [data-theme="light"] .sv-step h4, [data-theme="light"] .sv-step .sn, [data-theme="light"] .sv-ben h4, [data-theme="light"] .sv-faq-q, /* artigos / blog */ [data-theme="light"] .feat-body h2, [data-theme="light"] .blog-rule h3, [data-theme="light"] .art-card-body h4, [data-theme="light"] .mat-body h2, /* artigo (post) */ [data-theme="light"] .post-title, [data-theme="light"] .post-byline .who, [data-theme="light"] .post-body h2, [data-theme="light"] .post-body strong, [data-theme="light"] .post-body table thead th, [data-theme="light"] .post-body table tbody td:first-child, [data-theme="light"] .post-body table strong, [data-theme="light"] .post-body h3, [data-theme="light"] .post-faq h2, [data-theme="light"] .faq-q, [data-theme="light"] .tldr strong, /* obrigado */ [data-theme="light"] .ty-lede strong, [data-theme="light"] .ty-next-head h2, [data-theme="light"] .ty-card h3, [data-theme="light"] .ty-steps-head h2, [data-theme="light"] .ty-step h3, [data-theme="light"] .ty-mat-body h3, /* otimizacao / lockin */ [data-theme="light"] .tk-hero h1, [data-theme="light"] .tk-hero-sub strong, [data-theme="light"] .tk-head h2, [data-theme="light"] .tk-anat-card p strong, [data-theme="light"] .tk-lev-main h3, [data-theme="light"] .tk-metric .mv, [data-theme="light"] .tk-metric .mv .ratio, [data-theme="light"] .tk-who-card h3, [data-theme="light"] .tk-form-copy h2, [data-theme="light"] .tk-form-mini .mini-t, [data-theme="light"] .tk-faq-q, [data-theme="light"] .tk-cta-strip h3, [data-theme="light"] .lk-window-copy h2, [data-theme="light"] .lk-window-copy p strong, [data-theme="light"] .lk-chap-card h3{color:var(--ab-heading)} /* texto "soft" (cinza-claro em fundo escuro) -> corpo escuro */ [data-theme="light"] .flow-side li, [data-theme="light"] .fnode .nbody, [data-theme="light"] .agendar-points li, [data-theme="light"] .gov-risk p, [data-theme="light"] .gov-role li, [data-theme="light"] .ob-role li, [data-theme="light"] .ob-cost-split li, [data-theme="light"] .tk-form-points li, [data-theme="light"] .tldr li{color:var(--ab-fg)} /* watermark gigante do rodapé */ [data-theme="light"] .foot-big{color:var(--ab-heading)} /* rodapé nav hover */ [data-theme="light"] .foot-nav a:hover{color:var(--ab-heading)} [data-theme="light"] .post-crumb a:hover{color:var(--ab-heading)} /* ================= CARDS / SUPERFÍCIES ================= */ [data-theme="light"] .feat-card, [data-theme="light"] .intg-tile, [data-theme="light"] .price-card, [data-theme="light"] .tcard, [data-theme="light"] .acc, [data-theme="light"] .op-card, [data-theme="light"] .diff-card, [data-theme="light"] .cap-item, [data-theme="light"] .htag, [data-theme="light"] .neg-chip, [data-theme="light"] .step, [data-theme="light"] .pf-pillar, [data-theme="light"] .pf-mod, [data-theme="light"] .pf-arch, [data-theme="light"] .pf-intel, [data-theme="light"] .pf-agent, [data-theme="light"] .gd-card, [data-theme="light"] .gov-act, [data-theme="light"] .gov-cfg, [data-theme="light"] .gov-risk, [data-theme="light"] .gov-role, [data-theme="light"] .gov-scope .sc, [data-theme="light"] .ob-metric, [data-theme="light"] .ob-kpi, [data-theme="light"] .ob-chart, [data-theme="light"] .ob-gr, [data-theme="light"] .ob-role, [data-theme="light"] .sv-card, [data-theme="light"] .sv-ben, [data-theme="light"] .tk-who-card, [data-theme="light"] .tk-anat-card, [data-theme="light"] .lk-chap-card, [data-theme="light"] .art-card, [data-theme="light"] .ty-card, [data-theme="light"] .ty-step, [data-theme="light"] .ty-mat-card, [data-theme="light"] .tk-faq-item, [data-theme="light"] .tk-lev, [data-theme="light"] .blog-filter, [data-theme="light"] .tk-form-mini, [data-theme="light"] .post-body ol li{background:var(--l-card);border-color:var(--ab-border)} /* leve elevação em cards de destaque via hover */ [data-theme="light"] .feat-card:hover, [data-theme="light"] .op-card:hover, [data-theme="light"] .diff-card:hover, [data-theme="light"] .pf-pillar:hover, [data-theme="light"] .pf-mod:hover, [data-theme="light"] .pf-arch:hover, [data-theme="light"] .gd-card:hover, [data-theme="light"] .ob-metric:hover, [data-theme="light"] .sv-card:hover, [data-theme="light"] .art-card:hover, [data-theme="light"] .ty-card:hover{box-shadow:var(--ab-shadow-card)} /* chips de ícone quadrados (fundo navy -> claro) */ [data-theme="light"] .step-num, [data-theme="light"] .flow-num, [data-theme="light"] .op-ic, [data-theme="light"] .diff-ic, [data-theme="light"] .price-icon, [data-theme="light"] .pf-mod .mi, [data-theme="light"] .pf-step .sn, [data-theme="light"] .pf-mono, [data-theme="light"] .gd-ic, [data-theme="light"] .gov-role .ri, [data-theme="light"] .ob-role .ri, [data-theme="light"] .sv-card .si, [data-theme="light"] .sv-step .sn, [data-theme="light"] .sv-rail-list .n, [data-theme="light"] .socials a, [data-theme="light"] .plan-tag, [data-theme="light"] .ac-ic, [data-theme="light"] .ac-sys{background:var(--l-chip);border-color:var(--ab-divider-color)} /* dots de "traffic light" das janelas */ [data-theme="light"] .obs-bar .tl i, [data-theme="light"] .pf-win-bar .tl i, [data-theme="light"] .ob-dash-bar .tl i, [data-theme="light"] .gov-feed-bar .tl i, [data-theme="light"] .flow-bar .tl i{background:#cdd4e0} /* ================= PAINÉIS DE VIDRO / JANELAS (base navy -> branco) ================= */ [data-theme="light"] .agentcon, [data-theme="light"] .chat, [data-theme="light"] .obs-panel, [data-theme="light"] .pf-win, [data-theme="light"] .ob-dash, [data-theme="light"] .gov-gate, [data-theme="light"] .gov-feed, [data-theme="light"] .ob-trace, [data-theme="light"] .ob-cost, [data-theme="light"] .sv-rail, [data-theme="light"] .reassure-card, [data-theme="light"] .feat-article, [data-theme="light"] .mat-card, [data-theme="light"] .flow-window{background:var(--l-card);border-color:var(--ab-border-strong);box-shadow:var(--ab-shadow-card)} [data-theme="light"] .mat-card:hover, [data-theme="light"] .feat-article:hover{border-color:var(--ab-border-strong)} /* barras internas de janela/console */ [data-theme="light"] .pf-win-bar, [data-theme="light"] .ob-dash-bar, [data-theme="light"] .flow-bar{background:var(--l-bar)} [data-theme="light"] .ac-head, [data-theme="light"] .ac-foot, [data-theme="light"] .obs-bar, [data-theme="light"] .obs-metric, [data-theme="light"] .obs-log, [data-theme="light"] .obs-chart .ct, [data-theme="light"] .gov-gate-head, [data-theme="light"] .gov-gate-foot, [data-theme="light"] .gov-feed-bar, [data-theme="light"] .ob-trace-head{border-color:var(--ab-border)} [data-theme="light"] .pf-win-side, [data-theme="light"] .flow-side{background:var(--l-bar);border-right-color:var(--ab-border)} [data-theme="light"] .pf-win-side li.on{background:rgba(41,106,237,0.10)} /* separadores de linha internos (eram rgba branco .05) */ [data-theme="light"] .obs-log .row, [data-theme="light"] .gov-ev, [data-theme="light"] .gov-gate-list li{border-bottom-color:var(--ab-border)} /* pequenos elementos de console */ [data-theme="light"] .ob-tr .tdot{background:#fff} [data-theme="light"] .ob-bars .bar.lite{background:linear-gradient(180deg,#c3ccdf,rgba(195,204,223,0.35))} [data-theme="light"] .fnode .nbody{border-top-color:var(--ab-border)} [data-theme="light"] .fnode{background:rgba(255,255,255,0.96);border-color:var(--ab-border-strong);box-shadow:var(--ab-shadow-card)} /* feature/role em destaque com tint azul */ [data-theme="light"] .gov-role.feat, [data-theme="light"] .ob-role.feat{background:var(--l-tint);border-color:var(--ab-border-strong)} /* ================= PAINÉIS/CTA GRANDES COM BASE NAVY ================= */ [data-theme="light"] .final-band, [data-theme="light"] .cta-band, [data-theme="light"] .gov-panel, [data-theme="light"] .tk-metrics, [data-theme="light"] .tk-cta-strip{ background:radial-gradient(120% 150% at 50% 0%,rgba(41,106,237,0.12),rgba(242,246,254,0) 60%),var(--l-tint); border-color:var(--ab-border-strong); } [data-theme="light"] .final-band::before, [data-theme="light"] .tk-metrics::before{opacity:0.05} /* cards "lead" com gradiente azul sobre branco */ [data-theme="light"] .op-lead, [data-theme="light"] .pf-mod.lead, [data-theme="light"] .gd-card.lead{background:linear-gradient(135deg,rgba(41,106,237,0.12),var(--l-card))} /* ================= HERO BG (imagem escura glossy) ================= */ [data-theme="light"] .hero-bg{opacity:0.10 !important} /* ================= FLOW BUILDER (canvas) ================= */ [data-theme="light"] .flow-canvas{background-color:var(--l-canvas);background-image:radial-gradient(rgba(12,20,38,0.10) 1.3px,transparent 1.3px)} [data-theme="light"] .flow-links .link-base{stroke:rgba(12,20,38,0.18)} /* ================= ARTIGO / PROSE ================= */ [data-theme="light"] .tldr{background:radial-gradient(120% 130% at 0% 0%,rgba(41,106,237,0.10),var(--l-card) 60%);border-color:var(--ab-border-strong)} [data-theme="light"] .post-refs li::before{background:var(--l-chip);border-color:var(--ab-border)} [data-theme="light"] .post-body table thead th{background:rgba(41,106,237,0.10)} /* ================= CHAT WIDGET (kit) ================= */ [data-theme="light"] .bubble.bot, [data-theme="light"] .typing, [data-theme="light"] .chip, [data-theme="light"] .chat-input input, [data-theme="light"] .news input{background:var(--l-chip);color:var(--ab-fg)} [data-theme="light"] .news{background:#fff;border-color:var(--ab-border-strong)} /* ================= FORMULÁRIOS (RD Station) — claro ================= */ [data-theme="light"] .agendar-formwrap, [data-theme="light"] .tk-formwrap{background:#fff;border-color:var(--ab-border-strong)} [data-theme="light"] .agendar-formwrap input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]), [data-theme="light"] .agendar-formwrap select, [data-theme="light"] .agendar-formwrap textarea, [data-theme="light"] .tk-formwrap input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]), [data-theme="light"] .tk-formwrap select, [data-theme="light"] .tk-formwrap textarea{background:#fff !important;border:1px solid var(--ab-border-strong) !important;color:var(--ab-heading) !important} [data-theme="light"] .agendar-formwrap .select2-choice, [data-theme="light"] .agendar-formwrap .select2-container .select2-choice, [data-theme="light"] .agendar-formwrap .select2-container, [data-theme="light"] .agendar-formwrap .iti__flag-container, [data-theme="light"] .agendar-formwrap .iti__selected-flag, [data-theme="light"] .tk-formwrap .select2-choice, [data-theme="light"] .tk-formwrap .select2-container .select2-choice, [data-theme="light"] .tk-formwrap .select2-container, [data-theme="light"] .tk-formwrap .iti__flag-container, [data-theme="light"] .tk-formwrap .iti__selected-flag{background:#fff !important;border:1px solid var(--ab-border-strong) !important;color:var(--ab-heading) !important} [data-theme="light"] .agendar-formwrap .select2-choice abbr, [data-theme="light"] .agendar-formwrap .select2-arrow b, [data-theme="light"] .tk-formwrap .select2-choice abbr, [data-theme="light"] .tk-formwrap .select2-arrow b{filter:none !important} [data-theme="light"] .agendar-formwrap .rd-form, [data-theme="light"] .tk-formwrap .rd-form, [data-theme="light"] .agendar-formwrap form, [data-theme="light"] .tk-formwrap form{color:var(--ab-fg)}