/* ============================================================ VISUAL NOVO v3 "COMMAND CENTER" (teste opcional) - Sistema PAB - 17/09/2026 ------------------------------------------------------------ Camada SEPARADA do tema da Pamella e dos remendos do bundle. So vale com (sistemapab.com/?visual=novo liga; ?visual=padrao desliga). Desligado, nao muda um pixel. Direcao (skill ui-ux-pro-max, estilos "tech noir / HUD" + "data dense"): preto profundo, hairlines, acento LIMA eletrico + CIANO para dados, titulos em Exo (geometrica tech) em caixa alta, numeros em Roboto Mono, cantos de HUD nos cartoes. Nada de roxo, vidro ou azul #3b82f6. Alturas do topo, do chat e do CRM NAO mudam. ============================================================ */ /* [data-visual] repetido = prioridade (0,2,1): vence a camada de identidades, que e reinserida no fim do a cada 15 min pelo aplicar_tarefas.py */ html[data-visual="novo"][data-visual] { --bg: #07080C; --bg-soft: #0C0E14; --surface: #10131B; --surface-solid: #10131B; --surface-2: #161A24; --surface-3: #1D222E; --border: rgba(198, 255, 61, .16); --border-soft: rgba(255, 255, 255, .07); --text: #E9EDF3; --muted: #8B93A3; --gold: #C6FF3D; --gold-2: #D9FF7A; --gold-soft: #86B31B; --navy-900: #050609; --navy-800: #10131B; --navy-700: #16261B; /* bolha do atendente: verde-preto */ --navy-600: #1B2F22; --navy-400: #4C6A3A; --white: #FFFFFF; --danger: #FF4D6D; --success: #C6FF3D; --radius: 6px; --shadow: 0 0 0 1px rgba(255, 255, 255, .04); --shadow-lg: 0 0 0 1px rgba(198, 255, 61, .25), 0 0 32px rgba(198, 255, 61, .10); --glow-gold: 0 0 0 1px #C6FF3D, 0 0 18px rgba(198, 255, 61, .35); --chat-bg: #07080C; --col-bg: #0C0E14; --chip: #161A24; --active: #151C14; --bubble-them: #12161F; --bubble-us: #16261B; --nota-bg: #1A1706; --nota-border: #6B5A10; --nota-text: #F2D25A; --pab-azul: #22D3EE; --pab-azul-bg: rgba(34, 211, 238, .12); --pab-ciano: #22D3EE; --pab-ciano-bg: rgba(34, 211, 238, .12); --pab-ambar: #FFB020; --pab-ambar-bg: rgba(255, 176, 32, .13); --pab-roxo: #C6FF3D; --pab-roxo-bg: rgba(198, 255, 61, .12); --pab-verde: #C6FF3D; --pab-verde-bg: rgba(198, 255, 61, .12); --pab-vermelho: #FF4D6D; --pab-vermelho-bg: rgba(255, 77, 109, .13); --pab-cinza: #8B93A3; --pab-cinza-bg: rgba(139, 147, 163, .12); --pab-azul-forte: #22D3EE; --pab-verde-forte: #C6FF3D; --pab-rotulo: #A6AEBD; --pab-titulo: linear-gradient(180deg, #FFFFFF 0%, #C6FF3D 100%); --pab-campo: #0C0E14; --pab-chip: #161A24; --pab-chip-txt: #C6FF3D; --pab-chip-borda: rgba(198, 255, 61, .30); --m-chat: #22D3EE; --m-crm: #FFB020; --m-contatos: #22D3EE; --m-agenda: #C6FF3D; --m-intake: #FF7A45; --m-oper: #FF7A45; --m-proc: #FF7A45; --m-casos: #FF7A45; --m-inti: #FF4D6D; --m-contr: #FF4D6D; --m-tarefas: #FFB020; --m-assin: #FF7A45; --m-mkt: #FF5FA8; --m-fin: #C6FF3D; --m-users: #8B93A3; --m-portal: #22D3EE; --vn-display: "Exo", "Segoe UI", system-ui, sans-serif; --vn-body: "DM Sans", "Segoe UI", system-ui, sans-serif; --vn-mono: "Roboto Mono", ui-monospace, Consolas, monospace; /* a camada de identidades (tema_pab.css) le estas variaveis: apontamos para as nossas */ --id-display: "Exo", "Segoe UI", system-ui, sans-serif; --id-display-peso: 700; --id-body: "DM Sans", "Segoe UI", system-ui, sans-serif; --id-page: #07080C; --id-sidebar: #050609; --id-sidebar-img: none; --id-side-ink: #E9EDF3; --id-side-muted: #8B93A3; --id-side-rule: rgba(255, 255, 255, .08); --id-band: none; --id-btn: #C6FF3D; --id-btn-ink: #050609; --ids-azul: #22D3EE; --ids-petroleo: #22D3EE; --ids-ambar: #FFB020; --ids-verde: #C6FF3D; --ids-ameixa: #FF7A45; --ids-vermelho: #FF4D6D; --lime: #C6FF3D; --cyan: #22D3EE; color-scheme: dark; } /* ---------- base ---------- */ html[data-visual="novo"] body { font-family: var(--vn-body) !important; background: #07080C !important; background-image: linear-gradient(rgba(255, 255, 255, .025) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .025) 1px, transparent 1px) !important; background-size: 32px 32px, 32px 32px !important; color: var(--text); } html[data-visual="novo"] button, html[data-visual="novo"] input, html[data-visual="novo"] select, html[data-visual="novo"] textarea { font-family: var(--vn-body); } html[data-visual="novo"] h1, html[data-visual="novo"] h2, html[data-visual="novo"] h3 { font-family: var(--vn-display) !important; text-transform: uppercase; letter-spacing: .06em; } html[data-visual="novo"] ::selection { background: rgba(198, 255, 61, .30); } html[data-visual="novo"] *::-webkit-scrollbar-thumb { background: #262B37; } html[data-visual="novo"] *::-webkit-scrollbar-thumb:hover { background: #86B31B; } /* ---------- menu lateral: coluna preta com linha de energia ---------- */ html[data-visual="novo"] .sidebar { background: #050609 !important; color: #E9EDF3 !important; border-right: 1px solid rgba(198, 255, 61, .18) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } html[data-visual="novo"] .sidebar .ws { background: none !important; border: none !important; border-radius: 0 !important; margin: 0 0 8px !important; padding: 2px 4px 14px !important; border-bottom: 1px solid rgba(255, 255, 255, .08) !important; } html[data-visual="novo"] .sidebar .ws-mark { background: #0C0E14 !important; padding: 5px !important; width: 38px !important; height: 38px !important; border-radius: 4px !important; filter: none !important; box-shadow: inset 0 0 0 1px rgba(198, 255, 61, .55), 0 0 14px rgba(198, 255, 61, .18); } html[data-visual="novo"] .sidebar .ws-info b { background: none !important; background-image: none !important; -webkit-text-fill-color: #FFFFFF !important; color: #FFFFFF !important; font-family: var(--vn-display) !important; font-size: 14px !important; font-weight: 700 !important; letter-spacing: .10em !important; text-transform: uppercase; } html[data-visual="novo"] .sidebar .ws-info span { color: var(--lime) !important; letter-spacing: .18em !important; font-family: var(--vn-mono); font-size: 9px !important; } html[data-visual="novo"] .sidebar-toggle { border-color: rgba(255, 255, 255, .12) !important; background: transparent !important; color: var(--lime) !important; border-radius: 4px !important; } html[data-visual="novo"] .nav-sep { color: #5A6273 !important; opacity: 1; letter-spacing: .22em; font-size: 9.5px; font-family: var(--vn-mono); } html[data-visual="novo"] .nav-item { --m: #8B93A3; color: #A6AEBD !important; font-weight: 500 !important; background: transparent !important; box-shadow: none !important; border-radius: 4px !important; border-left: 2px solid transparent; transition: background .15s, color .15s; } html[data-visual="novo"] .nav-item .ico { width: 28px !important; height: 28px !important; border-radius: 4px !important; background: transparent; color: var(--m) !important; transform: none !important; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--m) 35%, transparent); } html[data-visual="novo"] .nav-item:hover { color: #FFFFFF !important; background: rgba(255, 255, 255, .04) !important; } html[data-visual="novo"] .nav-item.active { color: #FFFFFF !important; font-weight: 700 !important; background: linear-gradient(90deg, color-mix(in srgb, var(--m) 18%, transparent), transparent 80%) !important; box-shadow: none !important; border-left-color: var(--m); } html[data-visual="novo"] .nav-item.active::before, html[data-visual="novo"] .nav-item.active:before { display: none !important; } html[data-visual="novo"] .nav-item.active .ico { background: var(--m) !important; color: #050609 !important; box-shadow: 0 0 14px color-mix(in srgb, var(--m) 55%, transparent); } html[data-visual="novo"] .nav-item[href="/"] { --m: var(--lime); } html[data-visual="novo"] .nav-item[href="/chat"] { --m: var(--m-chat); } html[data-visual="novo"] .nav-item[href="/crm"] { --m: var(--m-crm); } html[data-visual="novo"] .nav-item[href="/contatos"] { --m: var(--m-contatos); } html[data-visual="novo"] .nav-item[href="/agenda"] { --m: var(--m-agenda); } html[data-visual="novo"] .nav-item[href="/intake"] { --m: var(--m-intake); } html[data-visual="novo"] .nav-item[href="/operacional"] { --m: var(--m-oper); } html[data-visual="novo"] .nav-item[href="/processos"] { --m: var(--m-proc); } html[data-visual="novo"] .nav-item[href="/casos"] { --m: var(--m-casos); } html[data-visual="novo"] .nav-item[href="/intimacoes"] { --m: var(--m-inti); } html[data-visual="novo"] .nav-item[href="/controladoria"] { --m: var(--m-contr); } html[data-visual="novo"] .nav-item[href="/tarefas"] { --m: var(--m-tarefas); } html[data-visual="novo"] .nav-item[href="/assinatura"] { --m: var(--m-assin); } html[data-visual="novo"] .nav-item[href="/marketing"] { --m: var(--m-mkt); } html[data-visual="novo"] .nav-item[href="/financeiro"] { --m: var(--m-fin); } html[data-visual="novo"] .nav-item[href="/usuarios"] { --m: var(--m-users); } html[data-visual="novo"] .nav-item[href*="portal"] { --m: var(--m-portal); } html[data-visual="novo"] .side-user { border-top: 1px solid rgba(255, 255, 255, .08) !important; } html[data-visual="novo"] .side-user .su-av { background: var(--lime) !important; color: #050609 !important; box-shadow: none !important; border-radius: 4px !important; font-family: var(--vn-display); } html[data-visual="novo"] .side-user .su-info b { color: #FFFFFF !important; } html[data-visual="novo"] .side-user .su-info span { color: #5A6273 !important; font-family: var(--vn-mono); font-size: 10px !important; } html[data-visual="novo"] .side-user .su-out { background: transparent !important; border-color: rgba(255, 255, 255, .12) !important; color: #A6AEBD !important; border-radius: 4px !important; } html[data-visual="novo"] .side-user .su-out:hover { color: var(--lime) !important; border-color: var(--lime) !important; } html[data-visual="novo"] .selo { border-top-color: rgba(255, 255, 255, .08) !important; } html[data-visual="novo"] .selo svg { opacity: .35; } html[data-visual="novo"] .selo .selo-cap { color: #5A6273 !important; } html[data-visual="novo"] .pab-tema-btn { display: none !important; } /* ---------- topo: preto, titulo Exo, data em mono (mesma altura) ---------- */ html[data-visual="novo"] .topbar { background: #07080C !important; border-bottom: 1px solid rgba(198, 255, 61, .18) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; position: relative; } html[data-visual="novo"] .topbar::after { content: ""; position: absolute; left: 32px; bottom: -1px; width: 120px; height: 2px; background: var(--lime); box-shadow: 0 0 12px rgba(198, 255, 61, .8); } html[data-visual="novo"] .topbar h1 { color: #FFFFFF; font-weight: 700; } html[data-visual="novo"] .topbar .tb-sub { color: var(--cyan) !important; text-transform: uppercase !important; font-family: var(--vn-mono); font-size: 11px !important; letter-spacing: .12em; } html[data-visual="novo"] .topbar .badge { background: transparent !important; color: var(--lime) !important; border: 1px solid rgba(198, 255, 61, .45) !important; border-radius: 3px !important; letter-spacing: .14em; text-transform: uppercase; font-family: var(--vn-mono); font-size: 10.5px !important; } /* ---------- Inicio: cartoes HUD com cor por modulo ---------- */ html[data-visual="novo"] .content > h2, html[data-visual="novo"] .content h2:first-of-type { font-size: 26px; font-weight: 700; color: #FFFFFF; } html[data-visual="novo"] .mod-card { --m: var(--cyan); background: #0C0E14 !important; border: 1px solid rgba(255, 255, 255, .08) !important; border-radius: 6px !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; overflow: visible !important; position: relative; transition: border-color .15s, box-shadow .15s, transform .15s; } /* cantos de HUD */ html[data-visual="novo"] .mod-card::before, html[data-visual="novo"] .mod-card::after { content: ""; position: absolute; width: 14px; height: 14px; pointer-events: none; display: block !important; background: none !important; border-radius: 0 !important; inset: auto; } html[data-visual="novo"] .mod-card::before { top: -1px; left: -1px; border-top: 2px solid var(--m); border-left: 2px solid var(--m); } html[data-visual="novo"] .mod-card::after { bottom: -1px; right: -1px; border-bottom: 2px solid var(--m); border-right: 2px solid var(--m); } html[data-visual="novo"] .mod-card:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--m) 55%, transparent) !important; box-shadow: 0 0 0 1px color-mix(in srgb, var(--m) 35%, transparent), 0 0 34px color-mix(in srgb, var(--m) 18%, transparent) !important; } html[data-visual="novo"] .mod-card h3 { font-family: var(--vn-display) !important; font-size: 15px !important; color: #FFFFFF; letter-spacing: .08em; } html[data-visual="novo"] .mod-card p { color: var(--muted) !important; } html[data-visual="novo"] .mod-card .m-ico { background: transparent !important; color: var(--m) !important; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--m) 45%, transparent) !important; border-radius: 4px !important; } html[data-visual="novo"] .mod-card .tag-lock { color: var(--m) !important; font-family: var(--vn-mono); letter-spacing: .1em; text-transform: uppercase; font-size: 10px; } html[data-visual="novo"] .mod-card.locked { opacity: .45; } html[data-visual="novo"] a.mod-card[href="/chat"] { --m: var(--m-chat); } html[data-visual="novo"] a.mod-card[href="/crm"] { --m: var(--m-crm); } html[data-visual="novo"] a.mod-card[href="/contatos"] { --m: var(--m-contatos); } html[data-visual="novo"] a.mod-card[href="/agenda"] { --m: var(--m-agenda); } html[data-visual="novo"] a.mod-card[href="/intake"], html[data-visual="novo"] a.mod-card[href="/operacional"], html[data-visual="novo"] a.mod-card[href="/processos"], html[data-visual="novo"] a.mod-card[href="/casos"], html[data-visual="novo"] a.mod-card[href="/assinatura"] { --m: var(--m-intake); } html[data-visual="novo"] a.mod-card[href="/intimacoes"], html[data-visual="novo"] a.mod-card[href="/controladoria"] { --m: var(--m-inti); } html[data-visual="novo"] a.mod-card[href="/tarefas"] { --m: var(--m-tarefas); } html[data-visual="novo"] a.mod-card[href="/marketing"] { --m: var(--m-mkt); } html[data-visual="novo"] a.mod-card[href="/financeiro"] { --m: var(--m-fin); } html[data-visual="novo"] a.mod-card[href="/usuarios"] { --m: var(--m-users); } html[data-visual="novo"] div.mod-card:nth-child(4n+1) { --m: var(--m-chat); } html[data-visual="novo"] div.mod-card:nth-child(4n+2) { --m: var(--m-crm); } html[data-visual="novo"] div.mod-card:nth-child(4n+3) { --m: var(--m-intake); } html[data-visual="novo"] div.mod-card:nth-child(4n+4) { --m: var(--m-fin); } /* ---------- paineis ---------- */ html[data-visual="novo"] .panel, html[data-visual="novo"] .card { background: #0C0E14 !important; border: 1px solid rgba(255, 255, 255, .08) !important; box-shadow: none !important; border-radius: 6px !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } html[data-visual="novo"] .panel h2, html[data-visual="novo"] .panel h3 { color: #FFFFFF; font-size: 14px; letter-spacing: .1em; } html[data-visual="novo"] .p-sub, html[data-visual="novo"] .muted { color: var(--muted) !important; } /* ---------- botoes e campos ---------- */ html[data-visual="novo"] .btn { background: #161A24; color: #E9EDF3; border-radius: 4px; box-shadow: none; font-weight: 700; border: 1px solid rgba(255, 255, 255, .10); letter-spacing: .02em; } html[data-visual="novo"] .btn:hover { background: #1D222E; border-color: rgba(198, 255, 61, .4); } html[data-visual="novo"] .btn-ghost { background: transparent; border: 1px solid rgba(255, 255, 255, .14); } html[data-visual="novo"] .btn-ghost:hover { background: rgba(198, 255, 61, .06) !important; border-color: var(--lime) !important; color: var(--lime); } html[data-visual="novo"] .btn-gold { background: var(--lime) !important; color: #050609 !important; box-shadow: 0 0 18px rgba(198, 255, 61, .25) !important; border-color: var(--lime); } html[data-visual="novo"] .btn-gold:hover { background: #D9FF7A !important; filter: none !important; } html[data-visual="novo"] .btn-danger { background: var(--danger); color: #FFFFFF; border-color: var(--danger); } html[data-visual="novo"] .field label { color: var(--cyan); text-transform: uppercase; letter-spacing: .12em; font-size: 10.5px; font-family: var(--vn-mono); } html[data-visual="novo"] input, html[data-visual="novo"] textarea, html[data-visual="novo"] select, html[data-visual="novo"] .ctrl-inp, html[data-visual="novo"] .field input, html[data-visual="novo"] .field select, html[data-visual="novo"] .field textarea { background: #0C0E14 !important; border-color: rgba(255, 255, 255, .12) !important; color: #E9EDF3 !important; border-radius: 4px; } html[data-visual="novo"] input::placeholder, html[data-visual="novo"] textarea::placeholder { color: #5A6273; } html[data-visual="novo"] input:focus, html[data-visual="novo"] textarea:focus, html[data-visual="novo"] select:focus, html[data-visual="novo"] .ctrl-inp:focus { outline: none; border-color: var(--lime) !important; box-shadow: 0 0 0 1px var(--lime), 0 0 16px rgba(198, 255, 61, .25) !important; } html[data-visual="novo"] .sel-lux { background-color: #0C0E14 !important; border: 1px solid rgba(255, 255, 255, .14) !important; color: var(--cyan) !important; border-radius: 4px; font-weight: 600; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2322D3EE' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important; } html[data-visual="novo"] .sel-lux:hover { border-color: var(--cyan) !important; box-shadow: none !important; } html[data-visual="novo"] .spin { border-color: rgba(255, 255, 255, .15) !important; border-top-color: var(--lime) !important; } html[data-visual="novo"] .option, html[data-visual="novo"] option { background: #10131B; color: #E9EDF3; } /* ---------- tabelas, etiquetas, alertas ---------- */ html[data-visual="novo"] th { color: var(--cyan); letter-spacing: .12em; font-family: var(--vn-mono); font-size: 10.5px; } html[data-visual="novo"] td { font-variant-numeric: tabular-nums; } html[data-visual="novo"] td, html[data-visual="novo"] th { border-color: rgba(255, 255, 255, .07); } html[data-visual="novo"] tr:hover { background: rgba(198, 255, 61, .04); } html[data-visual="novo"] .pill { border-radius: 3px; font-weight: 700; font-family: var(--vn-mono); font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; } html[data-visual="novo"] .pill.done { background: var(--pab-verde-bg); color: var(--lime); } html[data-visual="novo"] .pill.running { background: var(--pab-ambar-bg); color: var(--pab-ambar); } html[data-visual="novo"] .pill.error { background: var(--pab-vermelho-bg); color: var(--danger); } html[data-visual="novo"] .pill.pending { background: var(--pab-cinza-bg); color: var(--muted); } html[data-visual="novo"] .pill.admin { background: var(--lime); color: #050609; } html[data-visual="novo"] .pill.advogado { background: var(--pab-azul-bg); color: var(--cyan); } html[data-visual="novo"] .alert-error { background: var(--pab-vermelho-bg); color: #FFB3C1; border-color: rgba(255, 77, 109, .4); } html[data-visual="novo"] .alert-ok { background: var(--pab-verde-bg); color: var(--lime); border-color: rgba(198, 255, 61, .35); } html[data-visual="novo"] .ac-list { background: #10131B; border-color: rgba(255, 255, 255, .12); box-shadow: var(--shadow-lg); border-radius: 4px; } html[data-visual="novo"] .ac-item:hover { background: rgba(198, 255, 61, .06); } html[data-visual="novo"] .live-dot { background: var(--lime); box-shadow: 0 0 10px var(--lime); } html[data-visual="novo"] audio::-webkit-media-controls-panel { background: #161A24; } html[data-visual="novo"] audio::-webkit-media-controls-timeline { background: rgba(198, 255, 61, .25); } /* ---------- CRM: colunas HUD, cards com cor da etapa (so cor; tamanho igual) ---------- */ html[data-visual="novo"] div[style*="flex: 0 0 250px"] { background: #0C0E14 !important; border: 1px solid rgba(255, 255, 255, .08) !important; border-radius: 6px !important; } html[data-visual="novo"] div[style*="flex: 0 0 250px"] > div:first-child { border-bottom: 1px solid rgba(255, 255, 255, .07); } html[data-visual="novo"] div[style*="flex: 0 0 250px"] > div:first-child > span:first-child { box-shadow: 0 0 10px currentColor; } html[data-visual="novo"] div[style*="flex: 0 0 250px"] > div:first-child > span:nth-child(3) { background: transparent !important; color: var(--lime) !important; border: 1px solid rgba(198, 255, 61, .4) !important; border-radius: 3px !important; font-family: var(--vn-mono); font-weight: 700 !important; } html[data-visual="novo"] div[style*="flex: 0 0 250px"] [draggable="true"] { background: #10131B !important; border: 1px solid rgba(255, 255, 255, .09) !important; box-shadow: none !important; border-radius: 4px !important; border-left-width: 3px !important; } html[data-visual="novo"] div[style*="flex: 0 0 250px"] [draggable="true"]:hover { border-color: rgba(198, 255, 61, .45) !important; box-shadow: 0 0 22px rgba(198, 255, 61, .10) !important; } html[data-visual="novo"] div[style*="flex: 0 0 250px"] [draggable="true"] > div:first-child > div[style*="border-radius: 50%"] { background: #161A24 !important; color: var(--lime) !important; border-radius: 4px !important; box-shadow: inset 0 0 0 1px rgba(198, 255, 61, .35); } /* ---------- login ---------- */ html[data-visual="novo"] .login-form-side { background: #07080C; } html[data-visual="novo"] .login-card h2 { color: #FFFFFF; } /* ---------- selo do teste ---------- */ html[data-visual="novo"] #pab-visual-novo-selo { position: fixed; left: 50%; transform: translateX(-50%); bottom: 10px; z-index: 9998; font: 700 10.5px/1 var(--vn-mono); letter-spacing: .12em; text-transform: uppercase; padding: 8px 12px; border-radius: 3px; background: #050609; color: var(--lime); border: 1px solid rgba(198, 255, 61, .45); box-shadow: 0 0 18px rgba(198, 255, 61, .18); cursor: pointer; opacity: .9; } html[data-visual="novo"] #pab-visual-novo-selo:hover { opacity: 1; } html:not([data-visual="novo"]) #pab-visual-novo-selo { display: none !important; } @media (prefers-reduced-motion: reduce) { html[data-visual="novo"] .mod-card:hover { transform: none; } html[data-visual="novo"] * { transition: none !important; } }