/* ===================================================================================================================== TEMAS SELECIONÁVEIS do CRM (25/09/2026, pedido do Antonio: "os temas são para o CRM e para o WhatsApp"). O front é o bundle React original; as cores vêm de variáveis CSS (Tailwind/shadcn, em HSL "h s% l%") declaradas em :root. Cada bloco abaixo só sobrescreve essas variáveis quando ; sem o atributo, o visual atual continua intacto ("Clássico"). Mesmas 5 paletas do disparo de WhatsApp. A escolha fica no navegador da pessoa (localStorage). ===================================================================================================================== */ html[data-tema="grafite"]{--background:220 14% 96%;--foreground:222 20% 10%;--card:0 0% 100%;--card-foreground:222 20% 10%;--popover:0 0% 100%;--popover-foreground:222 20% 10%; --primary:218 11% 19%;--primary-foreground:0 0% 100%;--secondary:220 14% 91%;--secondary-foreground:222 20% 10%;--muted:220 14% 91%;--muted-foreground:220 9% 40%; --accent:218 11% 19%;--accent-foreground:0 0% 100%;--border:220 13% 86%;--input:220 13% 86%;--ring:218 11% 19%; --sidebar-background:220 12% 12%;--sidebar-foreground:220 14% 96%;--sidebar-primary:220 10% 70%;--sidebar-primary-foreground:220 12% 12%;--sidebar-accent:220 10% 20%;--sidebar-accent-foreground:220 14% 96%;--sidebar-border:220 10% 20%;--sidebar-ring:220 10% 70%; --gradient-primary:linear-gradient(135deg, hsl(218 11% 25%) 0%, hsl(218 11% 15%) 100%)} html[data-tema="verde"]{--background:150 25% 96%;--foreground:160 20% 10%;--primary:161 88% 33%;--primary-foreground:0 0% 100%;--accent:161 88% 33%;--accent-foreground:0 0% 100%;--ring:161 88% 33%; --secondary:150 20% 91%;--muted:150 20% 91%;--muted-foreground:160 10% 42%;--border:150 18% 85%;--input:150 18% 85%; --sidebar-background:162 40% 9%;--sidebar-foreground:150 25% 96%;--sidebar-primary:161 88% 40%;--sidebar-primary-foreground:0 0% 100%;--sidebar-accent:162 30% 16%;--sidebar-accent-foreground:150 25% 96%;--sidebar-border:162 30% 16%;--sidebar-ring:161 88% 40%; --gradient-primary:linear-gradient(135deg, hsl(161 88% 33%) 0%, hsl(161 88% 25%) 100%)} html[data-tema="marinho"]{--background:214 40% 97%;--foreground:215 40% 12%;--primary:215 51% 25%;--primary-foreground:0 0% 100%;--accent:215 51% 25%;--accent-foreground:0 0% 100%;--ring:215 51% 25%; --secondary:214 32% 91%;--muted:214 32% 91%;--muted-foreground:215 16% 42%;--border:214 28% 86%;--input:214 28% 86%; --sidebar-background:215 45% 12%;--sidebar-foreground:214 40% 97%;--sidebar-primary:213 60% 60%;--sidebar-primary-foreground:215 45% 12%;--sidebar-accent:215 35% 19%;--sidebar-accent-foreground:214 40% 97%;--sidebar-border:215 35% 19%;--sidebar-ring:213 60% 60%; --gradient-primary:linear-gradient(135deg, hsl(215 51% 30%) 0%, hsl(215 51% 20%) 100%)} html[data-tema="areia"]{--background:37 44% 94%;--foreground:30 22% 14%;--card:40 60% 99%;--card-foreground:30 22% 14%;--popover:40 60% 99%;--popover-foreground:30 22% 14%; --primary:29 60% 41%;--primary-foreground:0 0% 100%;--accent:29 60% 41%;--accent-foreground:0 0% 100%;--ring:29 60% 41%; --secondary:36 35% 90%;--secondary-foreground:30 22% 14%;--muted:36 35% 90%;--muted-foreground:30 12% 40%;--border:36 30% 84%;--input:36 30% 84%; --sidebar-background:30 25% 14%;--sidebar-foreground:37 44% 94%;--sidebar-primary:33 70% 62%;--sidebar-primary-foreground:30 25% 14%;--sidebar-accent:30 20% 21%;--sidebar-accent-foreground:37 44% 94%;--sidebar-border:30 20% 21%;--sidebar-ring:33 70% 62%; --gradient-primary:linear-gradient(135deg, hsl(29 60% 45%) 0%, hsl(29 60% 33%) 100%)} html[data-tema="noite"]{--background:216 19% 7%;--foreground:214 17% 92%;--card:215 18% 11%;--card-foreground:214 17% 92%;--popover:215 18% 11%;--popover-foreground:214 17% 92%; --primary:45 91% 53%;--primary-foreground:0 0% 10%;--secondary:215 16% 17%;--secondary-foreground:214 17% 92%;--muted:215 16% 17%;--muted-foreground:215 12% 62%; --accent:45 91% 53%;--accent-foreground:0 0% 10%;--border:215 16% 20%;--input:215 16% 20%;--ring:45 91% 53%; --sidebar-background:216 20% 5%;--sidebar-foreground:214 17% 92%;--sidebar-primary:45 91% 53%;--sidebar-primary-foreground:0 0% 10%;--sidebar-accent:215 16% 15%;--sidebar-accent-foreground:214 17% 92%;--sidebar-border:215 16% 15%;--sidebar-ring:45 91% 53%; --gradient-primary:linear-gradient(135deg, hsl(45 91% 53%) 0%, hsl(45 91% 43%) 100%);--shadow-md:0 4px 6px -1px rgb(0 0 0 / .5);--shadow-lg:0 10px 15px -3px rgb(0 0 0 / .6)} html[data-tema="noite"]{color-scheme:dark} /* botão flutuante "Tema" (canto inferior esquerdo) — injetado pelo configurar-front.js */ #tema-sel{position:fixed;left:14px;bottom:14px;z-index:99990;font:13px/1.2 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif} #tema-sel>button{border:1px solid rgba(0,0,0,.15);background:#fff;color:#222;border-radius:999px;padding:7px 12px;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.15)} #tema-sel .tema-menu{display:none;position:absolute;left:0;bottom:40px;background:#fff;border:1px solid rgba(0,0,0,.12);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.18);padding:6px;min-width:160px} #tema-sel .tema-menu button{display:block;width:100%;text-align:left;border:0;background:transparent;color:#222;padding:8px 10px;border-radius:7px;cursor:pointer;font:inherit} #tema-sel .tema-menu button:hover{background:#f1f3f5} #tema-sel .tema-menu button.on{font-weight:700;background:#eef2ff} html[data-tema="noite"] #tema-sel>button,html[data-tema="noite"] #tema-sel .tema-menu{background:#171B21;color:#E6E9EE;border-color:#2A313B} html[data-tema="noite"] #tema-sel .tema-menu button{color:#E6E9EE} html[data-tema="noite"] #tema-sel .tema-menu button:hover,html[data-tema="noite"] #tema-sel .tema-menu button.on{background:#232932} @media print{#tema-sel{display:none}}