/* Catálogo (loja e categorias). Rodada 3, pacote P8 (10/10/2026): título em EB Garamond (R16), chips de 44 px (R11),
   contagem e ordenação na barra dos chips (protótipo de categorias), barra fixa só no computador (≥ 960 px), cartão igual ao da home
   e paginação com texto. Esta folha carrega antes do site.css: as regras começam por "main.fcf-catalog" para ganhar dele. */

/* Título e descrição */
main.fcf-catalog .c-top{padding-block:4px 16px}
main.fcf-catalog .c-top h1{font-family:"EB Garamond",Georgia,"Times New Roman",serif;font-weight:500;font-size:34px;line-height:1.05;letter-spacing:-.01em;color:var(--ink);margin:4px 0 8px;max-width:none;text-wrap:balance;overflow-wrap:anywhere}
main.fcf-catalog .c-top p{margin:0;max-width:62ch;font-size:15.5px;line-height:1.5;color:var(--muted);text-wrap:pretty}

/* Barra: chips + contagem e ordenação. No celular (e até 959 px) rola com a página; fixa a partir de 960 px. */
main.fcf-catalog .c-bar{position:static;background:var(--pagebg);padding-block:4px 12px;border-bottom:1px solid var(--line);margin-bottom:20px}
main.fcf-catalog .chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;scroll-padding-inline:24px;padding:4px;margin:0 -4px}
main.fcf-catalog .chips::-webkit-scrollbar{display:none}
main.fcf-catalog .chips a{flex:none;display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1.5px solid var(--line);border-radius:999px;background:var(--panel);color:var(--ink);font-size:14px;line-height:1.2;text-decoration:none;white-space:nowrap}
main.fcf-catalog .chips a:hover{border-color:var(--accent)}
main.fcf-catalog .chips a[aria-current]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
main.fcf-catalog .chips a[aria-current]:focus-visible{outline-color:var(--ink)}
main.fcf-catalog .c-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 12px;margin-top:8px}
main.fcf-catalog .c-row .woocommerce-notices-wrapper{flex-basis:100%}
main.fcf-catalog .c-row .woocommerce-notices-wrapper:empty{display:none}
main.fcf-catalog .c-row .woocommerce-result-count{float:none;flex:1 1 0;min-width:0;display:flex;align-items:center;min-height:44px;margin:0;font-size:13.5px;line-height:1.35;color:var(--muted)}
main.fcf-catalog .c-row .woocommerce-ordering{float:none;flex:none;max-width:60%;margin:0}
main.fcf-catalog .c-row .woocommerce-ordering select{display:block;max-width:100%;min-height:44px;padding:0 10px;border:1.5px solid var(--line);border-radius:12px;background-color:var(--panel);color:var(--ink);font-size:14px;cursor:pointer}
main.fcf-catalog .c-row .woocommerce-ordering select:hover{border-color:var(--accent)}
main.fcf-catalog .c-row .woocommerce-ordering select:focus-visible{border-color:var(--accent);outline:2px solid var(--accent);outline-offset:1px}

/* Cartão: o mesmo da home (home.css, rodada 2). Em cartão estreito, Pix e 6x em duas linhas; senão, uma linha com " · ". */
main.fcf-catalog .card{container-type:inline-size}
main.fcf-catalog .card .inst{display:block;margin-top:-4px;font-size:12.5px;line-height:1.45;color:var(--muted);font-variant-numeric:tabular-nums}
main.fcf-catalog .card .inst b{font-weight:600;color:var(--ink)}
@container (max-width:250px){main.fcf-catalog .card .inst-pix,main.fcf-catalog .card .inst-card{display:block}main.fcf-catalog .card .inst-sep{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}}
main.fcf-catalog .c-grid{padding-bottom:32px}

/* Paginação: "Anterior" / números / "Próxima", alvos de 44 px */
main.fcf-catalog nav.woocommerce-pagination{margin:0 0 40px;text-align:center}
main.fcf-catalog nav.woocommerce-pagination ul.page-numbers{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0;padding:0;border:0;white-space:normal}
main.fcf-catalog nav.woocommerce-pagination ul.page-numbers li{float:none;display:block;border:0;overflow:visible}
main.fcf-catalog nav.woocommerce-pagination ul.page-numbers li .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 14px;border:1.5px solid var(--line);border-radius:999px;background:var(--panel);color:var(--ink);font-size:14px;font-weight:500;line-height:1;text-decoration:none}
main.fcf-catalog nav.woocommerce-pagination ul.page-numbers li a.page-numbers:hover{border-color:var(--accent);background:var(--panel);color:var(--ink)}
main.fcf-catalog nav.woocommerce-pagination ul.page-numbers li .page-numbers.current{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
main.fcf-catalog nav.woocommerce-pagination ul.page-numbers li .page-numbers.dots{border-color:transparent;background:none;min-width:24px;padding:0}

/* Categoria sem produtos (woocommerce_no_products_found) e "Não achou o que procura?" */
main.fcf-catalog .woocommerce-no-products-found .woocommerce-info{margin:0 0 24px;padding:4px 0 0;border:0;background:none;color:var(--ink);font-size:15.5px;line-height:1.5}
main.fcf-catalog .woocommerce-no-products-found .woocommerce-info::before{content:none}
main.fcf-catalog .c-help{display:flex;gap:12px 16px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--wall);border-radius:4px;padding:18px 20px;margin:8px 0 0}
main.fcf-catalog .c-help p{margin:0;font-size:14px;line-height:1.45;color:var(--muted)}
main.fcf-catalog .c-help strong{display:block;font-size:15.5px;font-weight:600;color:var(--ink)}
main.fcf-catalog .c-help .btn{min-height:44px;font-weight:600}

@media (min-width:900px){
  main.fcf-catalog .c-top{padding-bottom:20px}
  main.fcf-catalog .c-top h1{font-size:46px}
  main.fcf-catalog .c-top p{font-size:17px}
  /* Computador: todos os chips à vista (quebram para uma 2ª linha se a loja tiver mais categorias), sem rolagem escondida. */
  main.fcf-catalog .chips{flex-wrap:wrap;overflow:visible;gap:6px}
  main.fcf-catalog .chips a{padding:0 12px}
  main.fcf-catalog .c-bar{padding-top:8px;margin-bottom:28px}
  main.fcf-catalog .c-help{padding:22px 24px}
}
/* Barra fixa só a partir de 960 px (revisão, P8-A1): entre 900 e 959 px o menu do cabeçalho quebra em 2 linhas (77 px)
   e cobriria a barra. Com o cabeçalho numa linha, ele mede 69 px e a barra encosta nele (top 68 px). */
@media (min-width:960px){
  /* fundo da barra até as bordas da tela (sem a sombra dos cartões aparecendo nas laterais) */
  main.fcf-catalog .c-bar{position:sticky;top:68px;z-index:10;box-shadow:0 0 0 100vmax var(--pagebg);clip-path:inset(0 -100vmax)}
  body.admin-bar main.fcf-catalog .c-bar{top:100px}
  /* foco por teclado nunca escondido atrás do cabeçalho + barra fixos (WCAG 2.4.11); cobre a barra com 2 linhas de chips */
  html{scroll-padding-top:270px}
}
/* Com um aviso do WooCommerce na barra (ex.: produto adicionado), a barra deixa de ser fixa. */
main.fcf-catalog .c-bar:has(.woocommerce-notices-wrapper > *){position:static}