/* =====================================================================
   lumikit.css — ÚNICO CSS que as páginas carregam

   Este arquivo só faz duas coisas: declara as camadas e importa os
   arquivos na ordem certa. Nenhuma regra de estilo mora aqui.

   COMO FUNCIONAM AS CAMADAS (@layer)

   Regras de uma camada declarada DEPOIS vencem as de camadas anteriores,
   NÃO IMPORTA a especificidade do seletor. É o recurso do CSS feito para
   sites como este, onde o tema antigo tem seletores enormes:

       camada `site`:    .wrapper .content .btn.btn-primary { ... }
       camada `ajustes`: .btn { ... }              <- ESTA vence.

   Por isso a camada `ajustes` dispensa !important: qualquer regra escrita
   lá vale, com o seletor mais simples possível.

   POR QUE TUDO QUE JÁ EXISTIA ESTÁ NUMA CAMADA SÓ

   Dentro de uma mesma camada valem as regras de sempre (especificidade e
   ordem) — ou seja, colocar os 12 arquivos antigos juntos na camada `site`,
   na ordem em que sempre carregaram, reproduz EXATAMENTE o comportamento
   que o site tinha antes desta mudança. Zero risco de regressão.

   Separar o legado em mais camadas (vendor/tema/etc) só é seguro depois
   de remover os ~450 !important que ainda existem nos arquivos antigos,
   porque !important INVERTE a ordem das camadas. Fica como passo futuro.

   ATENÇÃO: regras com !important em qualquer arquivo antigo continuam
   vencendo as regras normais da camada `ajustes` (isso já era assim antes
   das camadas — !important sempre vence regra normal). A cada !important
   removido do legado, a camada `ajustes` fica mais poderosa.
   ===================================================================== */

@layer site, ajustes;

/* ---- camada site: tudo que já existia, na ordem de sempre ---- */
@import url("bootstrap.min.css") layer(site);
@import url("font-awesome.min.css") layer(site);
@import url("magnific-popup.css") layer(site);
@import url("owl.carousel.css") layer(site);
@import url("https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css") layer(site);
@import url("styles/ecommerce.css") layer(site);
@import url("styles/style.css") layer(site);
@import url("styles/skin-less.css") layer(site);
@import url("lumikit-cores.css") layer(site);
@import url("custom.css") layer(site);
@import url("mega-menu.css") layer(site);
@import url("lumikit-paginas.css") layer(site);

/* lumikit-ajustes.css fica no FIM da camada `site`, e não na camada
   `ajustes`, por um detalhe importante das camadas:

     para declarações NORMAIS, a camada declarada por último vence;
     para declarações com !important, a ordem se INVERTE — a camada
     declarada primeiro é que vence.

   Este arquivo (o antigo <style> do index.php) ainda carrega 56
   !important. Colocado na camada `ajustes`, esses !important passariam
   a PERDER para os 158 !important do style.css, e o cabeçalho e o
   rodapé voltariam ao visual do tema de 2013. No fim da camada `site`
   ele fica exatamente onde estava antes: por último, entre iguais.

   Conforme os !important daqui forem sendo removidos (um a um, testando),
   o arquivo pode migrar para a camada `ajustes`. */
@import url("lumikit-ajustes.css") layer(site);

/* ---- camada ajustes: vence tudo acima, sem !important ---- */
@import url("lumikit-raio.css") layer(ajustes);