/**
 * Mobile CSS Index
 * Arquivo principal que importa todos os módulos CSS mobile
 * @version 2.0.0
 */

/* ===== IMPORTAÇÕES DOS MÓDULOS ===== */
/* Importar primeiro as variáveis */
@import url('./variables.css');

/* Depois os estilos base */
@import url('./base.css');

/* Componentes específicos */
@import url('./buttons.css');
@import url('./components-extended.css');
@import url('./loading.css');

/* Layout e responsividade */
@import url('./layout.css');
@import url('./components.css');
@import url('./responsive.css');
@import url('./carousel.css');
@import url('./categories.css');

/* ===== RESET E NORMALIZAÇÃO ===== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

*::before,
*::after {
    box-sizing: border-box;
}

/* ===== ESTILOS COMPLEMENTARES ===== */

/* Garantir que classes do Tailwind funcionem corretamente */
.line-clamp-1 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.line-clamp-2 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.scrollbar-hide::-webkit-scrollbar {
    display: none;
}

/* Garantir que backdrop-blur funcione */
.backdrop-blur-sm {
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.backdrop-blur {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* Garantir que transform e transition funcionem */
.group:hover .group-hover\:scale-110 {
    transform: scale(1.1);
}

.group:hover .group-hover\:translate-x-1 {
    transform: translateX(0.25rem);
}

.group:hover .group-hover\:text-blue-700 {
    color: rgb(29 78 216);
}

.hover\:-translate-y-2:hover {
    transform: translateY(-0.5rem);
}