@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700&display=swap');

body {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
}

/* Força os títulos das categorias a ficarem no topo, e os botões em linha abaixo */
.group, [class*="Group_group__"], div[class*="Group"] {
  flex-direction: column !important;
  align-items: stretch !important;
}

/* Ajusta o espaçamento do título da categoria */
.group > h2, 
.group > [class*="GroupTitle"], 
.group > [class*="group-title"], 
.group > div:first-child {
  margin-bottom: 12px !important;
  margin-right: 0px !important;
  width: 100% !important;
  text-align: left !important;
}

/* Transição suave para os cards e equalização de altura */
div:has(> .service), 
div:has(> .widget), 
div:has(> .bookmark) {
  height: 100% !important;
}

.service, .widget, .bookmark {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  height: 100% !important;
}

/* Efeito de Elevação e Glow Sutil no Hover */
.service:hover, .widget:hover, .bookmark:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 10px 20px -5px rgba(99, 102, 241, 0.2), 0 8px 8px -6px rgba(99, 102, 241, 0.2) !important;
}

/* Caixa de Busca */
.search-input, [class*="SearchInput"], input[type="search"] {
  border-radius: 12px !important;
  transition: all 0.2s ease !important;
}

.search-input:focus, [class*="SearchInput"]:focus, input[type="search"]:focus {
  border-color: #6366f1 !important;
  box-shadow: 0 0 12px rgba(99, 102, 241, 0.3) !important;
  outline: none !important;
}

/* Scrollbar Fina */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.15);
  border-radius: 9999px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.3);
}

/* Customização dos Títulos de Grupos */
h2, [class*="GroupTitle"], [class*="group-title"] {
  font-weight: 600 !important;
  letter-spacing: 0.025em !important;
  color: #f3f4f6 !important;
}
