import { Toaster } from "@/components/ui/toaster";
import { Toaster as Sonner } from "@/components/ui/sonner";
import { TooltipProvider } from "@/components/ui/tooltip";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { BrowserRouter, Routes, Route } from "react-router-dom";
import Dashboard from "./pages/Dashboard";
import OrdersList from "./pages/OrdersList";
import OrderDetails from "./pages/OrderDetails";
import NotFound from "./pages/NotFound";
import MundoLanding from "./pages/MundoLanding";

const queryClient = new QueryClient();

const App = () => (
  <QueryClientProvider client={queryClient}>
    <TooltipProvider>
      <Toaster />
      <Sonner />
      <BrowserRouter>
        <Routes>
          <Route path="/" element={<Dashboard />} />
          <Route path="/orders" element={<OrdersList />} />
          <Route path="/orders/:id" element={<OrderDetails />} />
          <Route path="/mundo-sports" element={<MundoLanding />} />
          {/* ADD ALL CUSTOM ROUTES ABOVE THE CATCH-ALL "*" ROUTE */}
          <Route path="*" element={<NotFound />} />
        </Routes>
      </BrowserRouter>
    </TooltipProvider>
  </QueryClientProvider>
);

export default App;
@@ -76,26 +76,207 @@
    --destructive: 0 62.8% 30.6%;
    --destructive-foreground: 210 40% 98%;

    --border: 217.2 32.6% 17.5%;
    --input: 217.2 32.6% 17.5%;
    --ring: 212.7 26.8% 83.9%;
    --sidebar-background: 240 5.9% 10%;
    --sidebar-foreground: 240 4.8% 95.9%;
    --sidebar-primary: 224.3 76.3% 48%;
    --sidebar-primary-foreground: 0 0% 100%;
    --sidebar-accent: 240 3.7% 15.9%;
    --sidebar-accent-foreground: 240 4.8% 95.9%;
    --sidebar-border: 240 3.7% 15.9%;
    --sidebar-ring: 217.2 91.2% 59.8%;
  }
}

@layer base {
  * {
    @apply border-border;
  }

  body {
    @apply bg-background text-foreground;
  }
}
}
.mundo-page {
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: #0f172a;
  background: #f8fafc;
}

.mundo-container {
  width: min(1100px, 92%);
  margin: 0 auto;
}

.mundo-hero {
  background: radial-gradient(circle at top, #1e3a8a 0%, #0b1220 52%, #020617 100%);
  color: #f8fafc;
  padding: 72px 0;
}

.mundo-tag {
  display: inline-block;
  background: rgba(56, 189, 248, 0.16);
  color: #7dd3fc;
  border: 1px solid rgba(125, 211, 252, 0.4);
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 0.86rem;
  font-weight: 600;
  margin-bottom: 14px;
}

.mundo-hero h1 {
  font-size: clamp(2rem, 5vw, 3.4rem);
  line-height: 1.08;
  margin-bottom: 16px;
}

.mundo-hero p {
  color: #cbd5e1;
  font-size: 1.05rem;
  max-width: 800px;
}

.mundo-hero-cta {
  margin-top: 28px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.mundo-btn {
  text-decoration: none;
  font-weight: 700;
  border-radius: 10px;
  padding: 12px 20px;
  transition: 0.2s ease;
}

.mundo-btn-primary {
  background: #22c55e;
  color: #06230f;
}

.mundo-btn-primary:hover {
  background: #16a34a;
  color: #ecfdf5;
}

.mundo-btn-secondary {
  border: 1px solid rgba(226, 232, 240, 0.45);
  color: #e2e8f0;
}

.mundo-btn-secondary:hover {
  background: rgba(226, 232, 240, 0.1);
}

.mundo-btn-lg {
  font-size: 1.05rem;
  padding: 14px 28px;
}

.mundo-benefits-inline {
  list-style: none;
  padding: 0;
  margin: 22px 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  color: #93c5fd;
  font-weight: 600;
}

.mundo-section {
  padding: 58px 0;
}

.mundo-section-alt {
  background: #e2e8f0;
}

.mundo-section h2 {
  font-size: clamp(1.5rem, 4vw, 2.15rem);
  margin-bottom: 8px;
}

.mundo-subtitle {
  color: #334155;
  margin-bottom: 20px;
}

.mundo-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.mundo-card {
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 12px;
  padding: 20px;
}

.mundo-card ul {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 8px;
}

.mundo-card h3 {
  margin-top: 0;
}

.mundo-card-highlight {
  border-color: #0ea5e9;
  box-shadow: 0 8px 24px rgba(14, 165, 233, 0.15);
}

.mundo-comparison {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.mundo-comparison div {
  background: #fff;
  border-radius: 12px;
  border: 1px solid #cbd5e1;
  padding: 16px;
}

.mundo-comparison p {
  margin-bottom: 0;
  color: #0f172a;
  font-weight: 700;
}

.mundo-kits {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.mundo-differentials {
  margin: 0;
  padding-left: 20px;
  display: grid;
  gap: 10px;
}

.mundo-conversion {
  background: linear-gradient(135deg, #0f172a, #1d4ed8);
  color: #f8fafc;
  padding: 68px 0;
}

.mundo-conversion p {
  color: #cbd5e1;
  max-width: 760px;
  margin-bottom: 22px;
}
const brandUrl = "https://www.mundodofutsal.com.br/marcas/mundo";

const impactColors = ["Branco/Azul", "Azul Claro/Marinho", "Preto/Grafite", "Edições especiais"];
const infinityColors = ["Branco/Laranja", "Azul/Off-White", "Neon/Preto", "Combinações urbanas"];
const primeColors = ["Branco/Azul royal", "Marinho/Mostarda", "Preto/Dourado", "Minimal premium"];

const MundoLanding = () => {
  return (
    <main className="mundo-page">
      <section className="mundo-hero">
        <div className="mundo-container">
          <span className="mundo-tag">Linha Mundo ? Futsal Performance</span>
          <h1>Seu jogo começa pelos pés. Sua evolução começa com Mundo.</h1>
          <p>
            Se você vive o futsal de verdade, sabe: cada giro, cada corte e cada finalização depende do que está no seu pé.
            A linha Mundo foi criada para quem quer subir de nível com equilíbrio real entre tecnologia, qualidade e custo-benefício.
          </p>

          <div className="mundo-hero-cta">
            <a href={brandUrl} target="_blank" rel="noreferrer" className="mundo-btn mundo-btn-primary">
              Escolher meu modelo agora
            </a>
            <a href="#comparativo" className="mundo-btn mundo-btn-secondary">
              Comparar os modelos
            </a>
          </div>

          <ul className="mundo-benefits-inline">
            <li>Frete grátis*</li>
            <li>Parcelamento facilitado</li>
            <li>Desconto no Pix</li>
          </ul>
        </div>
      </section>

      <section className="mundo-section">
        <div className="mundo-container">
          <h2>Mundo Impact</h2>
          <p className="mundo-subtitle">Controle, resistência e estabilidade para quem joga no limite.</p>
          <div className="mundo-grid">
            <div className="mundo-card">
              <ul>
                <li>Cabedal em couro para toque firme e maior domínio de bola.</li>
                <li>Reforço de biqueira para suportar jogadas intensas e contato constante.</li>
                <li>Solado com alta aderência para arrancadas e mudanças bruscas com segurança.</li>
                <li>Estrutura robusta e durável para rotina pesada de treinos e jogos.</li>
              </ul>
            </div>
            <div className="mundo-card mundo-card-highlight">
              <h3>Para quem é?</h3>
              <p>
                Ideal para jogadores de jogo físico, marcação forte e muita disputa por espaço. Se você imprime intensidade do
                primeiro ao último minuto, o Impact foi feito para acompanhar seu ritmo.
              </p>
              <h3>Variações de cores e estilos</h3>
              <p>{impactColors.join(" ? ")}</p>
            </div>
          </div>
        </div>
      </section>

      <section className="mundo-section mundo-section-alt">
        <div className="mundo-container">
          <h2>Mundo Infinity</h2>
          <p className="mundo-subtitle">Leveza e agilidade para quem acelera o jogo.</p>
          <div className="mundo-grid">
            <div className="mundo-card">
              <ul>
                <li>Construção mais leve da linha para movimentos rápidos e naturais.</li>
                <li>Alta respirabilidade para manter conforto mesmo em partidas intensas.</li>
                <li>Encaixe confortável que reduz fadiga ao longo da quadra inteira.</li>
                <li>Resposta rápida a cada pisada para transições explosivas.</li>
              </ul>
            </div>
            <div className="mundo-card mundo-card-highlight">
              <h3>Para quem é?</h3>
              <p>
                Perfeito para atletas velozes, com movimentação constante, jogo de transição e aceleração curta. Para quem vive
                no 1x1 e muda o jogo com velocidade.
              </p>
              <h3>Variações de cores e estilos</h3>
              <p>{infinityColors.join(" ? ")}</p>
            </div>
          </div>
        </div>
      </section>

      <section className="mundo-section">
        <div className="mundo-container">
          <h2>Mundo Prime</h2>
          <p className="mundo-subtitle">O clássico premium para quem joga com técnica e precisão.</p>
          <div className="mundo-grid">
            <div className="mundo-card">
              <ul>
                <li>Cabedal em couro de alta qualidade com toque refinado na bola.</li>
                <li>Conforto interno superior para encaixe seguro durante todo o jogo.</li>
                <li>Base estável para passes, domínio orientado e finalização precisa.</li>
                <li>Design premium com construção clássica e acabamento de alto nível.</li>
              </ul>
            </div>
            <div className="mundo-card mundo-card-highlight">
              <h3>Para quem é?</h3>
              <p>
                Ideal para jogadores técnicos que priorizam leitura de jogo, controle e precisão nos detalhes. Para quem decide
                no toque certo.
              </p>
              <h3>Variações de cores e estilos</h3>
              <p>{primeColors.join(" ? ")}</p>
            </div>
          </div>
        </div>
      </section>

      <section id="comparativo" className="mundo-section mundo-section-alt">
        <div className="mundo-container">
          <h2>Qual Mundo combina com seu estilo de jogo?</h2>
          <div className="mundo-comparison">
            <div>
              <h3>Controle + resistência</h3>
              <p>Mundo Impact</p>
            </div>
            <div>
              <h3>Velocidade + agilidade</h3>
              <p>Mundo Infinity</p>
            </div>
            <div>
              <h3>Conforto premium + precisão</h3>
              <p>Mundo Prime</p>
            </div>
          </div>
        </div>
      </section>

      <section className="mundo-section">
        <div className="mundo-container">
          <h2>Combinações ideais para potencializar seu jogo</h2>
          <div className="mundo-kits">
            <article className="mundo-card">
              <h3>Kit Performance</h3>
              <p>Tênis Mundo + meia esportiva + bola oficial de futsal.</p>
            </article>
            <article className="mundo-card">
              <h3>Kit Treino Intenso</h3>
              <p>Tênis Mundo + caneleira + mochila esportiva + garrafa térmica.</p>
            </article>
            <article className="mundo-card">
              <h3>Kit Jogo Completo</h3>
              <p>Tênis Mundo + meia de compressão + acessórios para recuperação pós-jogo.</p>
            </article>
          </div>
        </div>
      </section>

      <section className="mundo-section mundo-section-alt">
        <div className="mundo-container">
          <h2>Por que escolher Mundo?</h2>
          <ul className="mundo-differentials">
            <li>Materiais de alta qualidade pensados para a realidade das quadras brasileiras.</li>
            <li>Marca com foco real em futsal, desenvolvida para o ritmo do jogo indoor.</li>
            <li>Excelente custo-benefício: performance de alto nível sem estourar o orçamento.</li>
            <li>Confiabilidade para treinar e competir com segurança, estabilidade e conforto.</li>
          </ul>
        </div>
      </section>

      <section className="mundo-conversion">
        <div className="mundo-container">
          <h2>Estoque limitado nas numerações mais procuradas.</h2>
          <p>
            Garanta seu modelo com condições especiais: frete grátis*, parcelamento facilitado e desconto no Pix.
            Não deixe para depois ? os tamanhos mais vendidos acabam rápido.
          </p>
          <a href={brandUrl} target="_blank" rel="noreferrer" className="mundo-btn mundo-btn-primary mundo-btn-lg">
            Quero meu Mundo agora
          </a>
        </div>
      </section>
    </main>
  );
};

export default MundoLanding;
<!-- Landing page Mundo para uso na Tray -->
<section class="mundo-lp">
  <style>
    .mundo-lp {font-family: Inter,Arial,sans-serif;color:#0f172a;background:#f8fafc}
    .mundo-lp .container{width:min(1100px,92%);margin:0 auto}
    .mundo-lp .hero{background:radial-gradient(circle at top,#1e3a8a 0%,#0b1220 52%,#020617 100%);color:#f8fafc;padding:72px 0}
    .mundo-lp .tag{display:inline-block;background:rgba(56,189,248,.16);color:#7dd3fc;border:1px solid rgba(125,211,252,.4);border-radius:999px;padding:6px 12px;font-size:.86rem;font-weight:600;margin-bottom:14px}
    .mundo-lp h1{font-size:clamp(2rem,5vw,3.3rem);line-height:1.08;margin:0 0 14px}
    .mundo-lp h2{font-size:clamp(1.45rem,4vw,2.1rem);margin:0 0 10px}
    .mundo-lp p{line-height:1.6}
    .mundo-lp .hero p{color:#cbd5e1;max-width:780px}
    .mundo-lp .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
    .mundo-lp .btn{display:inline-block;text-decoration:none;font-weight:700;border-radius:10px;padding:12px 20px;transition:.2s}
    .mundo-lp .btn-primary{background:#22c55e;color:#06230f}
    .mundo-lp .btn-primary:hover{background:#16a34a;color:#ecfdf5}
    .mundo-lp .btn-outline{border:1px solid rgba(226,232,240,.45);color:#e2e8f0}
    .mundo-lp .benefits{list-style:none;padding:0;margin:18px 0 0;display:flex;flex-wrap:wrap;gap:14px;color:#93c5fd;font-weight:600}
    .mundo-lp .section{padding:56px 0}
    .mundo-lp .alt{background:#e2e8f0}
    .mundo-lp .grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
    .mundo-lp .card{background:#fff;border:1px solid #cbd5e1;border-radius:12px;padding:20px}
    .mundo-lp .highlight{border-color:#0ea5e9;box-shadow:0 8px 24px rgba(14,165,233,.15)}
    .mundo-lp ul{padding-left:18px;display:grid;gap:8px}
    .mundo-lp .compare{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
    .mundo-lp .compare .card p{margin:0;font-weight:700}
    .mundo-lp .convert{background:linear-gradient(135deg,#0f172a,#1d4ed8);color:#f8fafc;padding:68px 0}
    .mundo-lp .convert p{color:#cbd5e1;max-width:760px}
  </style>

  <div class="hero">
    <div class="container">
      <span class="tag">Linha Mundo ? Futsal Performance</span>
      <h1>Seu jogo começa pelos pés. Sua evolução começa com Mundo.</h1>
      <p>Se você vive o futsal de verdade, sabe: cada giro, cada corte e cada finalização depende do que está no seu pé. A linha Mundo foi criada para quem quer subir de nível com equilíbrio real entre tecnologia, qualidade e custo-benefício.</p>
      <div class="cta">
        <a class="btn btn-primary" href="https://www.mundodofutsal.com.br/marcas/mundo">Escolher meu modelo agora</a>
        <a class="btn btn-outline" href="#comparativo-mundo">Comparar os modelos</a>
      </div>
      <ul class="benefits"><li>Frete grátis*</li><li>Parcelamento facilitado</li><li>Desconto no Pix</li></ul>
    </div>
  </div>

  <div class="section"><div class="container"><h2>Mundo Impact</h2><p>Controle, resistência e estabilidade para quem joga no limite.</p><div class="grid"><article class="card"><ul><li>Cabedal em couro para toque firme e maior domínio de bola.</li><li>Reforço de biqueira para suportar jogadas intensas e contato constante.</li><li>Solado com alta aderência para arrancadas e mudanças bruscas com segurança.</li><li>Estrutura robusta e durável para rotina pesada de treinos e jogos.</li></ul></article><article class="card highlight"><h3>Para quem é?</h3><p>Ideal para jogadores de jogo físico, marcação forte e muita disputa por espaço.</p><h3>Cores e estilos</h3><p>Branco/Azul ? Azul Claro/Marinho ? Preto/Grafite ? Edições especiais</p></article></div></div></div>

  <div class="section alt"><div class="container"><h2>Mundo Infinity</h2><p>Leveza e agilidade para quem acelera o jogo.</p><div class="grid"><article class="card"><ul><li>Construção mais leve da linha para movimentos rápidos e naturais.</li><li>Alta respirabilidade para manter conforto mesmo em partidas intensas.</li><li>Encaixe confortável que reduz fadiga ao longo da quadra inteira.</li><li>Resposta rápida a cada pisada para transições explosivas.</li></ul></article><article class="card highlight"><h3>Para quem é?</h3><p>Perfeito para atletas velozes, com movimentação constante e jogo de transição.</p><h3>Cores e estilos</h3><p>Branco/Laranja ? Azul/Off-White ? Neon/Preto ? Combinações urbanas</p></article></div></div></div>

  <div class="section"><div class="container"><h2>Mundo Prime</h2><p>O clássico premium para quem joga com técnica e precisão.</p><div class="grid"><article class="card"><ul><li>Cabedal em couro de alta qualidade com toque refinado na bola.</li><li>Conforto interno superior para encaixe seguro durante todo o jogo.</li><li>Base estável para passes, domínio orientado e finalização precisa.</li><li>Design premium com construção clássica e acabamento de alto nível.</li></ul></article><article class="card highlight"><h3>Para quem é?</h3><p>Ideal para jogadores técnicos que priorizam leitura de jogo, controle e precisão.</p><h3>Cores e estilos</h3><p>Branco/Azul royal ? Marinho/Mostarda ? Preto/Dourado ? Minimal premium</p></article></div></div></div>

  <div id="comparativo-mundo" class="section alt"><div class="container"><h2>Qual Mundo combina com seu estilo de jogo?</h2><div class="compare"><article class="card"><h3>Controle + resistência</h3><p>Mundo Impact</p></article><article class="card"><h3>Velocidade + agilidade</h3><p>Mundo Infinity</p></article><article class="card"><h3>Conforto premium + precisão</h3><p>Mundo Prime</p></article></div></div></div>

  <div class="section"><div class="container"><h2>Combinações ideais</h2><div class="compare"><article class="card"><h3>Kit Performance</h3><p>Tênis Mundo + meia esportiva + bola de futsal.</p></article><article class="card"><h3>Kit Treino Intenso</h3><p>Tênis Mundo + caneleira + mochila + garrafa.</p></article><article class="card"><h3>Kit Jogo Completo</h3><p>Tênis Mundo + meia de compressão + acessórios.</p></article></div></div></div>

  <div class="section alt"><div class="container"><h2>Diferenciais da marca Mundo</h2><ul><li>Materiais de alta qualidade para a realidade das quadras brasileiras.</li><li>Foco real em futsal, pensado para o ritmo do jogo indoor.</li><li>Excelente custo-benefício: performance de alto nível sem estourar o orçamento.</li><li>Confiabilidade para treinar e competir com segurança e estabilidade.</li></ul></div></div>

  <div class="convert"><div class="container"><h2>Estoque limitado nas numerações mais procuradas.</h2><p>Garanta seu modelo com condições especiais: frete grátis*, parcelamento facilitado e desconto no Pix. Não deixe para depois ? os tamanhos mais vendidos acabam rápido.</p><a class="btn btn-primary" href="https://www.mundodofutsal.com.br/marcas/mundo">Quero meu Mundo agora</a></div></div>
</section>