/* Main CSS - Importa todas as folhas de estilo dos componentes */
@import url('./reset.css');
@import url('./variables.css');
@import url('./header.css');
@import url('./home.css');   
@import url('./home-new.css');   
        /* Estilos da página inicial limpos e organizados */
@import url('./catalog.css');      /* Estilos específicos do catálogo */

@import url('./events-new.css');        /* Estilos específicos dos eventos */
@import url('./cart.css');
@import url('./notifications.css');
@import 'utilities.css';

/* Estilos Globais */
body {
  background-color: var(--light-color);
  font-family: var(--font-body);
}

/* Os estilos do rodapé agora estão em home-clean.css */

/* Classes Utilitárias */
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.loading-spinner {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 2px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  border-top-color: var(--primary-color);
  animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

/* Comportamento de Rolagem */
html {
  scroll-behavior: smooth;
}

/* Barra de Rolagem Personalizada */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: var(--light-color);
}

::-webkit-scrollbar-thumb {
  background: var(--border-color);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--primary-color);
}