/* Store Theme Overrides - aplica melhorias leves e não invasivas
   Compatível com templates 'ecommerce' (Ogani) e 'ecommerce_one_tech' (OneTech)
*/

:root {
  /* Paleta alinhada à logo GN Soluções Tecnologia */
  --store-primary: var(--color-default, #2f7dba); /* azul GN */
  --store-button: var(--store-primary);
  --store-radius: 12px;
  --store-secondary: #8ce646; /* verde TECNOLOGIA */
  --store-accent2: #11c5d9; /* turquesa do ícone */
  --store-text: #111;
  --store-muted: #6b7280; /* cinza moderno */
  --store-surface: #f7f7f7;
}

html { scroll-behavior: smooth; }

/* Botões principais */
.primary-btn,
.btn-primary,
.product__details__btns .primary-btn {
  min-height: 40px;
  padding: 8px 16px;
  border-radius: var(--store-radius);
  background: var(--store-button, var(--store-primary));
  border-color: var(--store-button, var(--store-primary));
  color: #fff;
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

.primary-btn:hover,
.btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
  filter: brightness(1.05);
}

/* Cartões de produto e itens vistos */
.product__item,
.viewed_item,
.deals_item,
.product__details__text {
  border-radius: var(--store-radius);
}

.product__item,
.viewed_item,
.deals_item {
  transition: box-shadow .2s ease, transform .2s ease;
}

.product__item:hover,
.viewed_item:hover,
.deals_item:hover {
  box-shadow: 0 6px 20px rgba(0,0,0,.12);
  transform: translateY(-2px);
}

/* Preço em destaque utiliza a cor do tema */
.product__details__price,
.viewed_price,
.deals_item_price_a {
  color: var(--store-primary);
}

.product__details__price span,
.deals_item_price_a span {
  color: var(--store-muted);
}

/* Links de categorias mais legíveis */
.categories__item h5 a,
.char_title {
  color: #111;
}

/* Chips de categorias e filtros modernos */
.sidebar_categories li a,
.shop_sorting span,
.shop_sorting ul li .sorting_text,
.blog__sidebar__item ul li a {
  border-radius: 999px;
  padding: 6px 12px;
  background: rgba(0,0,0,.04);
  transition: background .15s ease, color .15s ease;
}

.sidebar_categories li a:hover,
.blog__sidebar__item ul li a:hover {
  background: var(--store-primary);
  color: #fff;
}

/* Interações de navegação com cor do tema */
.header__menu ul li a:hover,
.brands_nav i:hover {
  color: var(--store-primary);
}

/* Barra de categorias e seção de busca com visual pill */
.search,
.header_search_container,
.header__search {
  background: var(--store-surface);
  border-radius: var(--store-radius);
  padding: 8px 12px;
}

.header_search_input,
.search_input,
.header__search input[type="text"] {
  border: none !important;
  background: transparent;
}

.header_search_button,
.search_button,
.header__search button {
  border-radius: 999px;
  background: var(--store-primary);
  border-color: var(--store-primary);
}

/* Cabeçalho mais moderno e sticky */
.header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: #fff !important; /* força fundo claro no cabeçalho */
  backdrop-filter: saturate(1.2) blur(0px);
  position: sticky;
}

/* Barra de destaque animada sutil sob o cabeçalho */
.header::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 100%;
  height: 3px;
  background: linear-gradient(90deg, var(--store-primary), var(--store-secondary), var(--store-primary));
  background-size: 200% 100%;
  animation: headerAccent 12s linear infinite;
  opacity: .35;
}
.header,
.main_nav,
.top_bar {
  box-shadow: 0 2px 10px rgba(0,0,0,.06);
}

.main_nav,
.top_bar {
  background: #fff !important; /* evita herdar cor de fundo escura */
}

/* Força fundo claro em áreas do header caso tema use preto */
.header_main,
.header__top,
.header__menu,
.header_top,
.header_main_item,
.logo_container {
  background: #fff !important; /* garante branco em todas as áreas do header */
}

/* Correção extra: remove qualquer fundo escuro atrás da logo */
.header__logo,
.header__logo a,
.header__logo img {
  background: transparent !important;
  transition: filter .25s ease, transform .25s ease;
}
.header__logo img:hover{
  filter: drop-shadow(0 6px 14px rgba(0,0,0,.12)) saturate(1.05) brightness(1.05);
  transform: translateY(-1px);
}

/* Navegação com sublinhado animado ao passar o mouse */
.header__menu ul li a{ position: relative; }
.header__menu ul li a::after{
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -6px;
  height: 2px;
  background: var(--store-primary);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .25s ease;
}
.header__menu ul li a:hover::after,
.header__menu ul li.active a::after{ transform: scaleX(1); }

/* Badge do carrinho com leve pulsação */
.header__cart ul li a span{
  transform-origin: center;
  animation: cartPulse 3s ease-in-out infinite;
}

/* Anima o ícone de categorias ao focar/hover */
.hero__categories__all i{ transition: transform .25s ease; }
.hero__categories__all:hover i{ transform: rotate(90deg); }

/* Keyframes das animações sutis */
@keyframes headerAccent{
  0%{ background-position: 0% 50%; }
  50%{ background-position: 100% 50%; }
  100%{ background-position: 0% 50%; }
}
@keyframes cartPulse{
  0%,100%{ transform: scale(1); }
  50%{ transform: scale(1.12); }
}

/* Respeito a acessibilidade: reduz movimento quando preferido */
@media (prefers-reduced-motion: reduce){
  .header::after,
  .header__cart ul li a span{
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
  }
  .header__logo img,
  .header__menu ul li a::after,
  .hero__categories__all i{
    transition-duration: 0.001ms !important;
  }
}

.main_nav_content .cat_menu_container,
.categories__text,
.cat_menu_title {
  color: var(--store-text);
}

.cat_menu_container .cat_menu li:hover,
.cat_menu_container .cat_menu li.active {
  background: rgba(0,0,0,.05);
}

/* Imagens com melhor preenchimento */
.product__details__pic img,
.product__item__pic img,
.viewed_image img,
.deals_image img {
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: calc(var(--store-radius) - 2px);
}

/* Botão primário no herói */
.hero__text .primary-btn,
a.primary-btn {
  background: var(--store-primary);
  border-color: var(--store-primary);
}

/* Cabeçalho com separação sutil */
.header .top_bar,
.header .main_nav {
  border-bottom: 1px solid rgba(0,0,0,.06);
}

.shop_product_count { font-weight: 600; }

/* Badges de "Novo" com cor do tema */
.badge-new,
.item_new {
  background: var(--store-primary) !important;
}

/* Preço antigo com menor destaque */
.price-old,
.viewed_price span {
  opacity: .7;
}

/* Rodapé com linha superior leve */
footer,
.footer {
  border-top: 1px solid rgba(0,0,0,.06);
}

/* Ícones e textos no topo com melhor contraste */
.header_user a,
.header_user i,
.header_user span { color: var(--store-text); }

.header_user .count { background: var(--store-secondary); color: #fff; }

/* Inputs e selects com foco moderno */
.form-control,
.nice-select,
input[type="text"],
input[type="email"],
input[type="number"],
input[type="password"],
textarea {
  border-radius: var(--store-radius);
  border-color: rgba(0,0,0,.15);
  transition: box-shadow .15s ease, border-color .15s ease;
}

.form-control:focus,
.nice-select.open,
input:focus,
textarea:focus {
  border-color: var(--store-primary);
  box-shadow: 0 0 0 3px rgba(14,140,228,.15);
  outline: none;
}
/* Botão flutuante WhatsApp */
.wa-fab { 
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 2000;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #25D366;
  color: #fff;
  border-radius: 999px;
  padding: 10px 14px;
  box-shadow: 0 8px 24px rgba(0,0,0,.2);
  text-decoration: none;
  font-weight: 600;
}
.wa-fab:hover { filter: brightness(1.05); transform: translateY(-1px); }
.wa-fab i { font-size: 20px; }
.wa-fab .wa-label { display: none; }
@media (min-width: 992px) { .wa-fab .wa-label { display: inline; } }

/* Overlay sutil para banners (melhor leitura) */
.hero__item::before,
.banner_background::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0,0,0,.38) 0%, rgba(0,0,0,.12) 40%, rgba(0,0,0,0) 70%);
  border-radius: inherit;
}
.header.header--glass .top_bar,
.header.header--glass .header_main,
.header.header--glass + .main_nav,
.header.header--glass ~ .main_nav
{
  background: rgba(255,255,255,0.92) !important;
  backdrop-filter: saturate(140%) blur(8px);
}
.header.header--glass .cat_menu_container{
  background: var(--store-primary, #0e8ce4);
}
.header.header--glass .main_nav_content{
  border-top: solid 1px rgba(0,0,0,0.06);
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
}

/* Sticky header behavior when enabled */
.header.header--sticky .main_nav{
  position: sticky;
  top: 0;
  z-index: 1000;
}
.header.header--sticky .top_bar{ position: relative; }

/* Search bar refinements to reduce excess spacing */
.header_main .header_search_input{
  height: 40px;
  line-height: 40px;
  border-radius: calc(var(--store-radius) - 4px);
}
.header_main{ padding-top: 8px; padding-bottom: 8px; }

/* Ogani: campo e botão de busca arredondados */
.hero__search__form form{
  overflow: hidden;
  border-radius: var(--store-radius);
  box-shadow: 0 6px 20px rgba(0,0,0,.06);
}
.hero__search__form form input{
  border-radius: var(--store-radius) 0 0 var(--store-radius);
  border: 1px solid rgba(0,0,0,.06);
}
.hero__search__form form button{
  border-radius: 0 var(--store-radius) var(--store-radius) 0;
  background: var(--store-button, var(--store-primary));
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
  transition: transform .08s ease, box-shadow .2s ease, opacity .2s ease;
}
.hero__search__form form button:hover{
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,0,0,.12);
  opacity: .96;
}

/* OneTech Home hero light section defaults */
.hero-lite{ background: var(--store-bg, #fff); }
.hero-lite .primary-btn{
  background: var(--store-primary);
  border-color: var(--store-primary);
  color: #fff;
}

/* Rounded layout improvements */
.top_bar,
.header_main,
.main_nav_content,
.cat_menu_container{
  border-radius: var(--store-radius);
}
.cat_menu_container,
.cat_menu{
  border-radius: var(--store-radius);
  overflow: hidden;
}
.main_nav{
  border-radius: var(--store-radius);
}

.categories__item,
.blog_post,
.product__item,
.viewed_item,
.deals_item,
.hero__item{
  border-radius: var(--store-radius);
  overflow: hidden;
}

/* Menus e dropdowns arredondados */
.dropdown-menu,
.standard_dropdown li ul,
.cat_menu li ul,
.main_nav_dropdown li ul{
  border-radius: var(--store-radius);
  overflow: hidden;
  box-shadow: 0 10px 24px rgba(0,0,0,.12);
  border: 1px solid rgba(0,0,0,.06);
}

/* Modais mais suaves e arredondados */
.modal-content{
  border-radius: calc(var(--store-radius) + 4px);
  overflow: hidden;
  box-shadow: 0 12px 32px rgba(0,0,0,.18);
}
.modal-header,
.modal-footer{
  background: var(--store-bg, #fff);
  border-color: rgba(0,0,0,.06);
}

/* Background-image fallback visual */
.set-bg.bg-fallback{
  background-color: #f0f2f5;
  background-image: none !important;
}
