/* Catalog pages: the make hub and the product list (categories, shop, product search, tags).
   The desktop design is in inline styles on the markup; tablet and phone layout is in site.css (.ct-*, .br-*).
   This file styles what WooCommerce prints (sorting, result count, pagination, the category description)
   and the few pieces the live pages have that the static design did not. The product card is in card.css. */

/* ---------- text the store supplies ---------- */
.ct-intro p,.ct-about p,.br-lead p,.br-lead-m p{margin:0 0 .6em}
.ct-intro p:last-child,.ct-about p:last-child,.br-lead p:last-child,.br-lead-m p:last-child{margin-bottom:0}
.ct-intro .term-description,.br-lead .term-description{margin:0}
.ct-about--long :is(h2,h3,h4){margin:1em 0 .4em;font-family:'Barlow Condensed',Barlow,sans-serif;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:#003050;line-height:1.2}
.ct-about--long :is(h2,h3,h4):first-child{margin-top:0}
.ct-about--long img{max-width:100%;height:auto}
.ct-title,.br-h1{overflow-wrap:break-word}

/* ---------- toolbar: WooCommerce's sorting and result count ---------- */
.tg-theme .ct-sortform{float:none;margin:0}
.tg-theme .ct-showing .woocommerce-result-count{float:none;margin:0;font-size:inherit;color:inherit}
.ct-before:empty{display:none}
.ct-before .woocommerce-notices-wrapper:empty{display:none}
.ct-view a:focus-visible{outline-offset:-2px}
.ct-view a:not([aria-current]):hover{background:#E9EDF1!important}
.ct-sizes a:not([aria-current]):hover{border-color:#003050!important;background:#F4F6F8!important}
.ct-layout--wide .ct-results{flex-basis:100%!important}

/* active filters */
.ct-chip:hover{background:#DCE2E8!important}

/* ---------- filters ---------- */
.ct-check input{flex:0 0 auto;margin:0}
.ct-check{cursor:pointer}
.ct-opt .ct-box{flex:0 0 20px;width:20px;height:20px;border:2px solid #566574;border-radius:3px;background:#FFFFFF;box-sizing:border-box}
.ct-opt[aria-current] .ct-box{border-color:#003050;background:#003050 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center/14px no-repeat}
.ct-opt:hover .ct-box{border-color:#003050}
.ct-range input::placeholder{color:#8796A5}
.ct-make:hover{color:#FFFFFF!important}

/* The Filter button's number is printed by the server (site.css counts ticked boxes with a CSS counter for the static design). */
.ct-page .ct-count::after{content:none!important}
.ct-page .ct-layout .ct-filterbtn .ct-count{display:none!important}
html.tg-lock{overflow:hidden}
@media (max-width:1079px){
  .ct-page .ct-layout .ct-filterbtn svg{display:block!important}
  .ct-page .ct-layout .ct-filterbtn:not(.is-on){background:#FFFFFF!important;color:#003050!important}
  .ct-page .ct-layout .ct-filterbtn.is-on{background:#003050!important;color:#FFFFFF!important}
  .ct-page .ct-layout .ct-filterbtn.is-on svg{display:none!important}
  .ct-page .ct-layout .ct-filterbtn.is-on .ct-count{display:inline-flex!important;order:-1}
  .ct-opt{min-height:48px!important}
  .ct-opt .ct-box{flex-basis:22px;width:22px;height:22px}
  .ct-layout--wide{display:block!important}
}

/* Pagination is WooCommerce's markup, styled for every store page in woo.css. */

/* ---------- make hub ---------- */
.br-fit-hub:hover{background:#FFF8E6!important;color:#7A5200}
.br-bar .ct-sort-label{font-size:14px;color:#36454F}
#br-parts{scroll-margin-top:12px}
.br-pop-sec--only{padding-top:36px!important}

@media (max-width:1079px){
  .br-bar{margin-bottom:16px!important}
}
@media (max-width:699px){
  .ct-title{text-wrap:balance}
  /* the title under it says where you are: the trail ends at the parent */
  .ct-crumbs>[aria-current],.ct-crumbs>span[aria-hidden]:nth-last-child(2){display:none!important}
  .ct-active{margin:10px 0 2px!important}
  .ct-listwrap>.tg-cards{margin-top:12px}
  .ct-bar .ct-sortform{display:contents}
  .ct-showing{padding-top:2px}
  .ct-empty{padding:20px 16px!important}
  .ct-empty-btns>a{flex:1 1 100%}
  .br-bar{flex-direction:column;align-items:stretch!important;gap:10px!important}
  .br-bar-r{justify-content:space-between}
  .br-bar .ct-sort{display:flex!important;align-items:center;gap:8px;min-width:0}
  .br-bar .ct-sort-select{min-width:0;font-size:16px!important}
  .br-fit-hub{min-height:44px!important;white-space:normal!important}
}