/* Manager360 / OpenExO — fonte canônica dos tokens */

  .landing-page,
  :root {
    /* Primitivos oficiais; não usar como status sem validação de contraste. */
    --brand-purple: 247.84091 72.13115% 47.84314%;
    --brand-blue: 193.88235 100.00000% 50.00000%;
    --brand-yellow: 35.43307 88.81119% 71.96078%;
    --brand-coral: 358.30986 100.00000% 72.15686%;
    --brand-gray-dark: 0 0% 33.33333%;
    --brand-gray-medium: 0 0% 63.13725%;
    --brand-gray-light: 0 0% 98.03922%;
    --brand-white: 0 0% 100%;
    --brand-whatsapp: 142.41379 70.16129% 48.62745%; /* #25D366 */
    --brand-whatsapp-foreground: 222 47% 11%;

    /* Paleta estendida de produto: base, texto e superfícies por família. */
    --palette-violet: 262.12291 83.25581% 57.84314%; /* #7C3AED */
    --palette-violet-foreground: 0.00000 0.00000% 100.00000%; /* #FFFFFF */
    --palette-violet-soft: 262.10526 90.47619% 95.88235%; /* #F2EBFE */
    --palette-violet-soft-foreground: 263.35570 69.30233% 42.15686%; /* #5B21B6 */
    --palette-indigo: 228.14371 69.87448% 53.13725%; /* #3455DB */
    --palette-indigo-foreground: 0.00000 0.00000% 100.00000%; /* #FFFFFF */
    --palette-indigo-soft: 228.75000 80.00000% 96.07843%; /* #EDF0FD */
    --palette-indigo-soft-foreground: 228.62069 57.42574% 39.60784%; /* #2B419F */
    --palette-sky: 195.08772 100.00000% 66.47059%; /* #54D4FF */
    --palette-sky-foreground: 199.59184 57.64706% 16.66667%; /* #123343 */
    --palette-sky-soft: 197.14286 100.00000% 95.88235%; /* #EAF9FF */
    --palette-sky-soft-foreground: 194.75410 88.40580% 27.05882%; /* #086482 */
    --palette-apricot: 26.28571 85.36585% 75.88235%; /* #F6BB8D */
    --palette-apricot-foreground: 24.25532 51.64835% 17.84314%; /* #452916 */
    --palette-apricot-soft: 25.00000 100.00000% 95.29412%; /* #FFF1E7 */
    --palette-apricot-soft-foreground: 22.77778 64.28571% 32.94118%; /* #8A471E */
    --palette-lavender: 254.80519 81.05263% 81.37255%; /* #BCA9F6 */
    --palette-lavender-foreground: 256.27119 47.96748% 24.11765%; /* #30205B */
    --palette-lavender-soft: 257.64706 100.00000% 96.66667%; /* #F3EEFF */
    --palette-lavender-soft-foreground: 263.03030 48.29268% 40.19608%; /* #5B3598 */
    --palette-amber: 35.46961 84.18605% 57.84314%; /* #EEA439 */
    --palette-amber-foreground: 35.17241 78.37838% 14.50980%; /* #422A08 */
    --palette-amber-soft: 37.50000 100.00000% 93.72549%; /* #FFF3DF */
    --palette-amber-soft-foreground: 34.91803 84.72222% 28.23529%; /* #85520B */
    --palette-rose: 344.69799 58.89328% 49.60784%; /* #C9345A */
    --palette-rose-foreground: 0.00000 0.00000% 100.00000%; /* #FFFFFF */
    --palette-rose-soft: 342.35294 80.95238% 95.88235%; /* #FDECF1 */
    --palette-rose-soft-foreground: 343.20000 62.18905% 39.41176%; /* #A32649 */
    --palette-orchid: 281.33333 57.93991% 54.31373%; /* #A447CE */
    --palette-orchid-foreground: 0.00000 0.00000% 100.00000%; /* #FFFFFF */
    --palette-orchid-soft: 280.00000 71.42857% 95.88235%; /* #F7EDFC */
    --palette-orchid-soft-foreground: 281.68421 48.71795% 38.23529%; /* #743291 */

    /* Surfaces */
    --background: 0.00000 0.00000% 98.03922%;          /* #FAFAFA */
    --foreground: 222 47% 11%;           /* #111827 */

    --card: 0 0% 100%;
    --card-foreground: 222 47% 11%;

    --popover: 0 0% 100%;
    --popover-foreground: 222 47% 11%;

    --surface: 0.00000 0.00000% 98.03922%;
    --surface-elevated: 0 0% 100%;

    /* Brand */
    --primary: 247.84091 72.13115% 47.84314%;              /* Roxo OpenExO */
    --primary-foreground: 0 0% 100%;
    --primary-glow: 246 70% 60%;

    --ai: 193.88235 100.00000% 50.00000%;                   /* Azul oficial */
    --ai-foreground: 222 47% 11%;
    --ai-soft: 194 100% 95%;

    /* Conversas: roxo oficial e branco em ambos os temas. */
    --message-outgoing: var(--brand-purple);
    --message-outgoing-foreground: var(--brand-white);

    /* Secondary / Muted */
    --secondary: 230 40% 96%;
    --secondary-foreground: 222 47% 11%;

    --muted: 230 40% 96%;
    --muted-foreground: 0.00000 0.00000% 39.21569%;      /* #646464: adaptação para texto */

    --accent: 246 70% 96%;
    --accent-foreground: 247.84091 72.13115% 47.84314%;

    /* Estados */
    --destructive: var(--brand-coral);
    --destructive-action: 354.47853 68.20084% 53.13725%;
    --destructive-action-hover: 354.47853 68.20084% 47%;
    --destructive-action-foreground: 0 0% 100%;
    --destructive-text: 353.79310 67.44186% 42.15686%; /* Leitura acessível em superfícies claras */
    --destructive-foreground: 220 30% 14%;
    --destructive-soft: 359 100% 96%;

    --success: 151.42857 90.00000% 27.45098%;
    --success-icon: 141.31579 67.25664% 44.31373%;
    --success-foreground: 0 0% 100%;
    --success-soft: 152 60% 95%;

    --warning: 35.43307 88.81119% 71.96078%;               /* Amarelo quente */
    --warning-foreground: 30 50% 18%;
    --warning-soft: 40 68% 95%;
    --warning-text: 30 75% 27%;

    --info: 193.67089 100.00000% 30.98039%;
    --info-foreground: 0 0% 100%;
    --info-soft: 194 100% 95%;

    /* Linhas e foco */
    --border: 240 12% 94%;               /* Separação suave entre superfícies */
    --input: var(--border);
    --ring: 247.84091 72.13115% 47.84314%;

    /* Geometria — rounded squares OpenExo */
    --radius: 10px;                      /* default (inputs/botões) */
    --radius-card: 14px;
    --radius-button: 10px;
    --radius-input: 10px;
    --radius-sm: 7px;
    --radius-xs: 5px;

    /* Sombras suaves premium */
    --shadow-xs: 0 1px 2px 0 hsl(230 30% 20% / 0.04);
    --shadow-sm: 0 2px 6px -2px hsl(230 30% 20% / 0.06), 0 1px 2px hsl(230 30% 20% / 0.04);
    --shadow-card: 0 4px 16px -6px hsl(230 30% 20% / 0.08), 0 1px 2px hsl(230 30% 20% / 0.04);
    --shadow-popover: 0 12px 32px -8px hsl(230 30% 20% / 0.16), 0 2px 4px hsl(230 30% 20% / 0.04);

    /* Gradientes da marca */
    --gradient-brand: linear-gradient(135deg, hsl(247.84091 72.13115% 47.84314%), hsl(193.88235 100.00000% 50.00000%));
    --gradient-brand-soft: linear-gradient(135deg, hsl(246 70% 96%), hsl(210 90% 96%));

    /* Sidebar */
    --sidebar-background: 0 0% 100%;
    --sidebar-foreground: 220 13% 28%;
    --sidebar-primary: 247.84091 72.13115% 47.84314%;
    --sidebar-primary-foreground: 0 0% 100%;
    --sidebar-accent: 246 70% 96%;
    --sidebar-accent-foreground: 247.84091 72.13115% 47.84314%;
    --sidebar-border: 240 17% 94%;
    --sidebar-ring: 247.84091 72.13115% 47.84314%;

    /* Charts */
    --chart-1: 247.84091 72.13115% 47.84314%;
    --chart-2: var(--brand-blue);
    --chart-3: 149.67742 67.88321% 26.86275%;
    --chart-4: 35.43307 88.81119% 71.96078%;
    --chart-5: var(--brand-coral);
    --chart-6: var(--muted-foreground);
    --chart-1-foreground: var(--brand-white);
    --chart-6-foreground: var(--brand-white);
    --chart-label-foreground: var(--foreground);
    --chart-line-2: var(--info);
    --chart-line-4: var(--warning-text);
    --chart-line-5: var(--destructive-text);

    /* Landing — OpenExo brand extras */
    --brand-mint: 160 75% 42%;
    --brand-mint-foreground: 0 0% 100%;
    --gradient-hero: radial-gradient(1200px 600px at 80% -10%, hsl(247.84091 72.13115% 47.84314% / 0.18), transparent 60%), radial-gradient(900px 500px at -10% 10%, hsl(193.88235 100.00000% 50.00000% / 0.25), transparent 55%), linear-gradient(180deg, hsl(0.00000 0.00000% 98.03922%), hsl(230 60% 97%));
    --gradient-cta: linear-gradient(135deg, hsl(247.84091 72.13115% 47.84314%), hsl(258 80% 60%) 55%, hsl(193.67089 100.00000% 30.98039%));
    --shadow-elevated: 0 30px 80px -30px hsl(247.84091 72.13115% 47.84314% / 0.35), 0 12px 32px -12px hsl(230 30% 20% / 0.12);

    /* Density tokens — OpenExo Operating System */
    --space-xs: 8px;
    --space-sm: 12px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;
    --row-h: 64px;
    --metric-h: 84px;
    --header-h: 64px;
    --filter-h: 32px;
    --container-max: 1400px;
    --container-px: 24px;
  }

  .dark {
    /* Superfícies da paleta estendida no tema escuro. Bases herdadas de :root. */
    --palette-violet-soft: 262.28571 33.98058% 20.19608%; /* #2F2245 */
    --palette-violet-soft-foreground: 263.82353 100.00000% 86.66667%; /* #D6BBFF */
    --palette-indigo-soft: 222.43902 39.04762% 20.58824%; /* #202C49 */
    --palette-indigo-soft-foreground: 225.88235 100.00000% 86.66667%; /* #BBCBFF */
    --palette-sky-soft: 196.50000 45.45455% 17.25490%; /* #183540 */
    --palette-sky-soft-foreground: 195.36585 100.00000% 83.92157%; /* #ADEAFF */
    --palette-apricot-soft: 20.68966 29.29293% 19.41176%; /* #402D23 */
    --palette-apricot-soft-foreground: 26.49351 100.00000% 84.90196%; /* #FFD4B2 */
    --palette-lavender-soft: 258.62069 28.71287% 19.80392%; /* #2D2441 */
    --palette-lavender-soft-foreground: 258.54545 100.00000% 89.21569%; /* #D9C8FF */
    --palette-amber-soft: 33.52941 36.95652% 18.03922%; /* #3F301D */
    --palette-amber-soft-foreground: 36.42857 100.00000% 78.03922%; /* #FFD38F */
    --palette-rose-soft: 331.03448 29.29293% 19.41176%; /* #402331 */
    --palette-rose-soft-foreground: 341.66667 100.00000% 85.88235%; /* #FFB7CD */
    --palette-orchid-soft: 283.44828 30.52632% 18.62745%; /* #36213E */
    --palette-orchid-soft-foreground: 285.55556 72.97297% 85.49020%; /* #E8BFF5 */

    --background: 220 12% 10%;            /* Grafite neutro: separação por luminosidade */
    --foreground: 210 12% 94%;

    --card: 220 10% 14%;
    --card-foreground: 210 12% 94%;

    --popover: 220 9% 17%;
    --popover-foreground: 210 12% 94%;

    --surface: 220 12% 10%;
    --surface-elevated: 220 9% 17%;

    --primary: 248 65% 72%;
    --primary-foreground: 220 12% 10%;
    --primary-glow: 248 65% 78%;

    --ai: 194 78% 65%;
    --ai-foreground: 220 12% 10%;
    --ai-soft: 200 20% 19%;

    --secondary: 220 8% 20%;
    --secondary-foreground: 210 12% 94%;

    --muted: 220 8% 20%;
    --muted-foreground: 220 8% 72%;

    --accent: 220 8% 22%;
    --accent-foreground: 248 65% 82%;

    --destructive: var(--brand-coral);
    --destructive-action: 354.47853 68.20084% 53.13725%;
    --destructive-action-hover: 354.47853 68.20084% 47%;
    --destructive-action-foreground: 0 0% 100%;
    --destructive-text: 358 100% 78%;
    --destructive-foreground: 220 12% 10%;
    --destructive-soft: 359 18% 20%;

    --success: 152 68% 62%;
    --success-icon: 141.31579 67.25664% 44.31373%;
    --success-foreground: 220 12% 10%;
    --success-soft: 152 16% 19%;

    --warning: 36 75% 72%;
    --warning-foreground: 30 50% 12%;
    --warning-soft: 36 18% 21%;
    --warning-text: 40 68% 80%;

    --info: 194 78% 65%;
    --info-foreground: 220 12% 10%;
    --info-soft: 200 20% 19%;

    --border: 220 8% 22%;
    --input: var(--border);
    --ring: 248 65% 72%;

    --shadow-xs: 0 1px 2px 0 hsl(0 0% 0% / 0.12);
    --shadow-sm: 0 2px 6px -2px hsl(0 0% 0% / 0.18), 0 1px 2px hsl(0 0% 0% / 0.12);
    --shadow-card: 0 4px 16px -6px hsl(0 0% 0% / 0.22), 0 1px 2px hsl(0 0% 0% / 0.12);
    --shadow-popover: 0 12px 32px -8px hsl(0 0% 0% / 0.125), 0 2px 4px hsl(0 0% 0% / 0.12);

    --gradient-brand: linear-gradient(135deg, hsl(248 65% 72%), hsl(194 78% 65%));
    --gradient-brand-soft: linear-gradient(135deg, hsl(220 8% 22%), hsl(200 20% 19%));

    --sidebar-background: 220 11% 12%;
    --sidebar-foreground: 210 10% 86%;
    --sidebar-primary: var(--brand-purple);
    --sidebar-primary-foreground: var(--brand-white);
    --sidebar-accent: 220 8% 22%;
    --sidebar-accent-foreground: 248 65% 82%;
    --sidebar-border: 220 8% 20%;
    --sidebar-ring: 248 65% 72%;

    --chart-1-foreground: var(--background);
    --chart-6-foreground: var(--background);
    --chart-label-foreground: var(--background);
    --chart-1: 248 65% 72%;
    --chart-2: 194 78% 65%;
    --chart-3: 152 45% 62%;
    --chart-4: 36 75% 72%;
    --chart-5: 359 75% 72%;
  }

/* Ícones verdes usam a referência do produto; texto mantém seu token acessível. */
.text-success-icon, svg.text-success, .text-success svg {
  color: hsl(var(--success-icon));
}

/* Operational charts: labels and feedback never inherit low-contrast series colors. */
.m360-chart .recharts-cartesian-axis-tick text,
.m360-chart .recharts-polar-angle-axis-tick text,
.m360-chart .recharts-polar-radius-axis-tick text {
  fill: hsl(var(--muted-foreground));
  font-family: Lato, system-ui, sans-serif;
  font-size: 12px;
}
.m360-chart .recharts-cartesian-grid line,
.m360-chart .recharts-polar-grid path { stroke: hsl(var(--border)); }
.m360-chart .recharts-cartesian-axis-line,
.m360-chart .recharts-cartesian-axis-tick-line { stroke: hsl(var(--border)); }
.m360-chart .recharts-default-tooltip {
  background: hsl(var(--popover)) !important;
  color: hsl(var(--popover-foreground)) !important;
  border: 1px solid hsl(var(--border)) !important;
  border-radius: var(--radius);
  box-shadow: var(--shadow-popover);
  font-family: Lato, system-ui, sans-serif;
  font-size: 13px;
}
.m360-chart .recharts-tooltip-label,
.m360-chart .recharts-tooltip-item,
.m360-chart .recharts-legend-item-text { color: hsl(var(--foreground)) !important; }
.m360-chart .recharts-legend-wrapper { font-family: Lato, system-ui, sans-serif; font-size: 12px; }

@media (max-width: 639px) {
  .toaster[data-sonner-toaster] { max-width: calc(100vw - 32px); }
}