/* ===================== DESIGN FLAT GLOBAL ===================== */
/* Aplicado em todas as páginas do site */

/* Remover todas as sombras */
.shadow-sm,
.shadow-md,
.shadow-lg,
.shadow-xl,
.shadow-2xl,
.hover\:shadow-lg,
.hover\:shadow-2xl,
.hover\:shadow-xl {
    box-shadow: none !important;
}

/* Remover transformações no hover (exceto popup de busca) */
.hover\:-translate-y-2:not(.search-popup-container),
.hover\:-translate-y-0\.5:not(.search-popup-container),
.hover\:translate-y-0:not(.search-popup-container),
.transform:not(.search-popup-container),
.hover\:scale-110:not(.search-popup-container),
.group-hover\:scale-110:not(.search-popup-container) {
    transform: none !important;
}

/* Permitir transformações no popup de busca */
.search-popup-container {
    transform: translate(-50%, -50%) scale(0.95) !important;
}

.search-popup-container.show {
    transform: translate(-50%, -50%) scale(1) !important;
}

/* Remover rotações */
.transform\:-rotate-2,
.transform\:rotate-2 {
    transform: none !important;
}

/* Remover bordas arredondadas excessivas */
.rounded-2xl,
.rounded-xl,
.rounded-lg {
    border-radius: 0 !important;
}

.rounded-full {
    border-radius: 0 !important;
}

.rounded {
    border-radius: 0 !important;
}

/* Cards - design flat */
.card,
.card-flat,
.product-card > div,
.category-item-mobile,
.category-item-desktop {
    box-shadow: none !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 0 !important;
}

.card:hover,
.card-flat:hover,
.product-card:hover > div,
.category-item-mobile:hover,
.category-item-desktop:hover {
    box-shadow: none !important;
    transform: none !important;
    border-color: #d1d5db !important;
}

/* Botões - design flat */
button,
a[class*="bg-"],
.btn,
.btn-primary {
    box-shadow: none !important;
    border: 1px solid transparent !important;
}

button:hover,
a[class*="bg-"]:hover,
.btn:hover,
.btn-primary:hover {
    box-shadow: none !important;
    transform: none !important;
}

/* Botão WhatsApp - tamanho reduzido e texto em uma linha */
a[href*="wa.me"],
a.bg-green-500 {
    padding: 0.5rem 0.75rem !important;
    font-size: 0.75rem !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

a[href*="wa.me"] span,
a.bg-green-500 span {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

a[href*="wa.me"] svg,
a.bg-green-500 svg {
    flex-shrink: 0 !important;
    width: 14px !important;
    height: 14px !important;
}

/* Badges - flat */
.badge,
span[class*="badge"],
.package-badge,
.min-quantity-badge,
.unit-badge {
    box-shadow: none !important;
    border-radius: 0 !important;
    border: 1px solid transparent !important;
}

/* Remover gradientes (exceto banner) */
.bg-gradient-to-br:not(.hero-banner .bg-gradient-to-b),
.bg-gradient-to-r:not(.hero-banner .bg-gradient-to-b),
.bg-gradient-to-b:not(.hero-banner .bg-gradient-to-b) {
    background-image: none !important;
}

/* Páginas específicas */

/* Página de Categoria */
.category-container .product-card > div {
    border: 1px solid #e5e7eb !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

/* Página de Busca */
#search-results .product-card > div {
    border: 1px solid #e5e7eb !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

/* Página Sobre */
.about-section,
.about-card {
    box-shadow: none !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 0 !important;
}

/* Carrinho */
.cart-item,
.cart-card {
    box-shadow: none !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 0 !important;
}

/* Espaçamento menor */
section {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

@media (min-width: 768px) {
    section {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
}

/* Transições mínimas */
a,
button,
[role="button"],
.card,
.product-card {
    transition: background-color 0.15s ease, border-color 0.15s ease !important;
}

/* Garantir que links e botões sejam clicáveis */
a,
button,
[role="button"],
.product-card a,
.product-card button {
    pointer-events: auto !important;
    cursor: pointer !important;
}

/* Remover overlay de hover */
.group-hover\:bg-black\/5,
.bg-black\/0 {
    background: transparent !important;
}

/* Remover backdrop blur (exceto popup de busca) */
.backdrop-blur-sm:not(.search-popup-overlay) {
    backdrop-filter: none !important;
}

/* Popup de busca - manter funcionalidade */
#search-popup-overlay,
.search-popup-overlay {
    z-index: 9999999 !important;
    position: fixed !important;
}

/* Overlay só deve bloquear cliques quando estiver visível */
#search-popup-overlay:not(.show),
.search-popup-overlay:not(.show) {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

#search-popup-overlay.show,
.search-popup-overlay.show {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

#search-popup-container,
.search-popup-container {
    z-index: 10000000 !important;
    position: fixed !important;
}

/* Container só deve estar visível quando mostrar */
#search-popup-container:not(.show),
.search-popup-container:not(.show) {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

#search-popup-container.show,
.search-popup-container.show {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translate(-50%, -50%) scale(1) !important;
    pointer-events: auto !important;
    display: flex !important;
}

/* Garantir que elementos dentro do popup sejam clicáveis */
#search-popup-container.show *,
.search-popup-container.show * {
    pointer-events: auto !important;
}

/* Aplicar design flat no popup */
.search-popup-container {
    border-radius: 0 !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: none !important;
}

.search-popup-overlay {
    backdrop-filter: blur(4px) !important;
}