.elementor-5814965 .elementor-element.elementor-element-7f05044:not(.elementor-motion-effects-element-type-background), .elementor-5814965 .elementor-element.elementor-element-7f05044 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F2F2F2;}.elementor-5814965 .elementor-element.elementor-element-7f05044 > .elementor-background-overlay{background-color:var( --e-global-color-77bfe3f2 );opacity:0.56;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-5814965 .elementor-element.elementor-element-7f05044{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;padding:2% 5% 2% 5%;}.elementor-5814965 .elementor-element.elementor-element-3937d3f > .elementor-element-populated{margin:0% 10% 0% 0%;--e-column-margin-right:10%;--e-column-margin-left:0%;}.elementor-5814965 .elementor-element.elementor-element-deba685 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:16px;}.elementor-widget-theme-archive-title .elementor-heading-title{color:var( --e-global-color-primary );}.elementor-5814965 .elementor-element.elementor-element-3108b9a > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-5814965 .elementor-element.elementor-element-3108b9a .elementor-heading-title{color:var( --e-global-color-6466b6a9 );}.elementor-5814965 .elementor-element.elementor-element-7e9d996{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-5814965 .elementor-element.elementor-element-dcdde7c .elementor-button{background-color:#FFFFFF;fill:#0D232D;color:#0D232D;border-style:solid;border-color:#0D232D;}.elementor-5814965 .elementor-element.elementor-element-dcdde7c{width:var( --container-widget-width, 50% );max-width:50%;--container-widget-width:50%;--container-widget-flex-grow:0;}.elementor-5814965 .elementor-element.elementor-element-dcdde7c > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-5814965 .elementor-element.elementor-element-1506cd5{--grid-columns:4;--grid-row-gap:10px;--grid-column-gap:10px;}.elementor-5814965 .elementor-element.elementor-element-1506cd5 .elementor-loop-container{grid-auto-rows:1fr;}.elementor-5814965 .elementor-element.elementor-element-1506cd5 .e-loop-item > .elementor-section, .elementor-5814965 .elementor-element.elementor-element-1506cd5 .e-loop-item > .elementor-section > .elementor-container, .elementor-5814965 .elementor-element.elementor-element-1506cd5 .e-loop-item > .e-con, .elementor-5814965 .elementor-element.elementor-element-1506cd5 .e-loop-item .elementor-section-wrap  > .e-con{height:100%;}.elementor-widget-divider{--divider-color:var( --e-global-color-secondary );}.elementor-widget-divider .elementor-divider__text{color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon{color:var( --e-global-color-secondary );border-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-secondary );}.elementor-5814965 .elementor-element.elementor-element-943160f{--divider-border-style:solid;--divider-color:#DDD6CC;--divider-border-width:1px;}.elementor-5814965 .elementor-element.elementor-element-943160f .elementor-divider-separator{width:100%;}.elementor-5814965 .elementor-element.elementor-element-943160f .elementor-divider{padding-block-start:15px;padding-block-end:15px;}.woocommerce .elementor-5814965 .elementor-element.elementor-element-6c3e8d4 .term-description{font-family:"IBM Plex Sans", Sans-serif;font-size:16px;}@media(max-width:1024px){.elementor-5814965 .elementor-element.elementor-element-7f05044{padding:5% 5% 5% 5%;}.elementor-5814965 .elementor-element.elementor-element-deba685 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:16px;}.elementor-5814965 .elementor-element.elementor-element-7e9d996{--justify-content:center;--gap:16px 16px;--row-gap:16px;--column-gap:16px;--flex-wrap:wrap;}.elementor-5814965 .elementor-element.elementor-element-dcdde7c{--container-widget-width:calc(50% - 8px);--container-widget-flex-grow:0;width:var( --container-widget-width, calc(50% - 8px) );max-width:calc(50% - 8px);}.elementor-5814965 .elementor-element.elementor-element-dcdde7c .elementor-button{padding:8px 8px 8px 8px;}.elementor-5814965 .elementor-element.elementor-element-0b66e42{width:var( --container-widget-width, calc(50% - 8px) );max-width:calc(50% - 8px);--container-widget-width:calc(50% - 8px);--container-widget-flex-grow:0;}.elementor-5814965 .elementor-element.elementor-element-081812c{width:100%;max-width:100%;}.elementor-5814965 .elementor-element.elementor-element-1506cd5{--grid-columns:2;}}@media(max-width:767px){.elementor-5814965 .elementor-element.elementor-element-7f05044{padding:5% 5% 5% 5%;}.elementor-5814965 .elementor-element.elementor-element-deba685 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:8px;}.elementor-5814965 .elementor-element.elementor-element-deba685 > .elementor-element-populated{padding:0px 0px 0px 0px;}.elementor-5814965 .elementor-element.elementor-element-1506cd5{--grid-columns:2;}.woocommerce .elementor-5814965 .elementor-element.elementor-element-6c3e8d4 .term-description{font-size:14px;}}@media(min-width:768px){.elementor-5814965 .elementor-element.elementor-element-3937d3f{width:25%;}.elementor-5814965 .elementor-element.elementor-element-deba685{width:75%;}}@media(max-width:1024px) and (min-width:768px){.elementor-5814965 .elementor-element.elementor-element-3937d3f{width:100%;}.elementor-5814965 .elementor-element.elementor-element-deba685{width:100%;}}/* Start custom CSS *//* ==========================================================================
   Trombly's: category navigation buttons ([tt_subcategories])
   Goes in: Custom CSS of the "Category Archive 2026" template.
   Brand colours (--tt-ink, --tt-gold, --tt-white) come from the notices CSS.
   ========================================================================== */

.tt-subcats {
  --tt-line: #DDD6CC;
  position: relative;
  margin: 0 0 28px;
}

/* Scroll arrow: hidden unless the phone layout needs it (see below).
   "body .tt-subcats" keeps the site's global button style (gold, square) off it. */
body .tt-subcats .tt-subcats__next {
  display: none;
  position: absolute;
  top: 50%;
  right: 0;
  z-index: 2;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin: 0;
  padding: 0;
  transform: translateY(-50%);
  background: var(--tt-ink, #0D232D);
  border: 0;
  border-radius: 50%;
  color: var(--tt-white, #FFFFFF);
  box-shadow: 0 2px 6px rgba(13, 35, 45, 0.25);
  cursor: pointer;
}

body .tt-subcats .tt-subcats__next:hover,
body .tt-subcats .tt-subcats__next:focus,
body .tt-subcats .tt-subcats__next:active {
  background: var(--tt-green, #3A4C3D);
  color: var(--tt-white, #FFFFFF);
}

body .tt-subcats .tt-subcats__next svg {
  display: block;
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
}

.tt-subcats__list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.tt-subcats__list > li {
  margin: 0;
  padding: 0;
}

.tt-subcats__chip {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 56px;
  padding: 5px 18px 5px 5px;
  background: var(--tt-white, #FFFFFF);
  border: 1px solid var(--tt-line);
  color: var(--tt-ink, #0D232D);
  font-family: "Roboto Condensed", "Arial Narrow", Arial, sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.15;
  text-decoration: none;
  transition: border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

/* Buttons without a category image, and the "All Reels" button */
.tt-subcats__chip--text,
.tt-subcats__chip--all {
  padding-left: 18px;
}

.tt-subcats__img {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #FFFFFF;
}

.tt-subcats__img img {
  width: 100%;
  height: 100%;
  margin: 0;
  object-fit: contain;
}

.tt-subcats__name {
  white-space: nowrap;
}

.tt-subcats__chip:hover {
  border-color: var(--tt-ink, #0D232D);
  color: var(--tt-ink, #0D232D);
}

.tt-subcats__chip:focus-visible {
  outline: 2px solid var(--tt-gold, #DC9814);
  outline-offset: 2px;
}

/* The category you're on (sibling view) */
.tt-subcats__chip.is-active,
.tt-subcats__chip.is-active:hover {
  background: var(--tt-ink, #0D232D);
  border-color: var(--tt-ink, #0D232D);
  color: var(--tt-white, #FFFFFF);
}

/* Phones: one row that scrolls sideways; the cut-off last button shows there's more */
@media (max-width: 767px) {
  /* Spacing on phones comes from the column's gap setting in Elementor */
  .tt-subcats {
    margin-bottom: 0;
  }

  .tt-subcats__list {
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2px;
  }

  .tt-subcats__list::-webkit-scrollbar {
    display: none;
  }

  .tt-subcats__list > li {
    flex: 0 0 auto;
    scroll-snap-align: start;
  }

  /* Fade the right edge so it's obvious the row continues.
     The script removes it once the row is scrolled to the end. */
  .tt-subcats:not(.is-at-end) .tt-subcats__list {
    -webkit-mask-image: linear-gradient(to right, #000 75%, transparent);
    mask-image: linear-gradient(to right, #000 75%, transparent);
  }

  /* Arrow button over the fade; tapping it scrolls the row */
  body .tt-subcats.has-more:not(.is-at-end) .tt-subcats__next {
    display: flex;
  }

  /* Extra room after the last button so it can scroll fully out of the fade */
  .tt-subcats__list > li:last-child {
    padding-right: 64px;
  }

  .tt-subcats__chip {
    min-height: 48px;
    font-size: 15px;
  }

  .tt-subcats__img {
    flex-basis: 36px;
    width: 36px;
    height: 36px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .tt-subcats__chip {
    transition: none;
  }
}


/* ==========================================================================
   Selected filters ([facetwp selections="true"])
   "body" is added to each body.elementor-page-5814965 so these rules beat FacetWP's own
   stylesheet, which loads after this CSS.
   ========================================================================== */

/* Hide the whole widget when nothing is selected, so it leaves no empty gap */
.elementor-widget-shortcode:has(.facetwp-selections):not(:has(.facetwp-selections li)) {
  display: none;
}

body .facetwp-selections ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

body .facetwp-selections li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0;
  font-family: "Roboto Condensed", "Arial Narrow", Arial, sans-serif;
  font-size: 15px;
  line-height: 1.2;
}

body .facetwp-selections .facetwp-selection-label {
  color: #666666;
}

/* Each selected value is a tag; clicking it removes that filter */
body .facetwp-selections .facetwp-selection-value {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  margin: 0;
  padding: 0 12px;
  background: var(--tt-white, #FFFFFF);
  background-image: none; /* removes FacetWP's own x image */
  border: 1px solid var(--tt-ink, #0D232D);
  color: var(--tt-ink, #0D232D);
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}

body .facetwp-selections .facetwp-selection-value::after {
  content: "\00D7";
  font-size: 18px;
  font-weight: 400;
  line-height: 1;
}

body .facetwp-selections .facetwp-selection-value:hover {
  background-color: var(--tt-ink, #0D232D);
  color: var(--tt-white, #FFFFFF);
}

body .facetwp-selections .facetwp-selection-value:focus-visible {
  outline: 2px solid var(--tt-gold, #DC9814);
  outline-offset: 2px;
}


/* ==========================================================================
   "Clear Filters" in the sidebar: readable link instead of faint grey text
   ========================================================================== */

body .updated-filters .facetwp-facet-reset button.facetwp-reset {
  padding: 0;
  background: none;
  border: 0;
  opacity: 1;
  color: var(--tt-ink, #0D232D);
  font-family: "Roboto Condensed", "Arial Narrow", Arial, sans-serif;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

body .updated-filters .facetwp-facet-reset button.facetwp-reset:hover {
  color: var(--tt-green, #3A4C3D);
}


/* ==========================================================================
   Product cards: hide WooCommerce's "View cart" link after an add.
   The cart drawer opens instead, so the link only shifts the card.
   ========================================================================== */

.default-product-card a.added_to_cart {
  display: none;
}


/* ==========================================================================
   Toolbar on tablets and phones: Filters button and Sort by match in height.
   The Filters button needs the CSS class "tt-filter-toggle"
   (Elementor: Advanced > CSS Classes).
   ========================================================================== */

@media (max-width: 1024px) {
  body .tt-filter-toggle .elementor-widget-container .elementor-button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 44px;
    padding-top: 0;
    padding-bottom: 0;
    border-width: 1px;
  }

  body .facetwp-type-sort select {
    width: 100%;
    min-height: 44px;
  }
}


/* ==========================================================================
   Tablets and phones: even spacing in the right-hand column.
   The template's top level is an old-style section and columns, so the
   gaps come from per-widget margins rather than a container gap.
   These rules replace all of them with one 16px rhythm.
   deba685 = right-hand column, 7e9d996 = toolbar row,
   dcdde7c = Filters button, 0b66e42 = Sort by, 081812c = result count.
   (Desktop is untouched.)
   ========================================================================== */

@media (max-width: 1024px) {
  /* One 16px gap after each section of the column */
  body .elementor-column.elementor-element.elementor-element-deba685 > .elementor-widget-wrap > .elementor-element {
    margin-top: 0;
    margin-bottom: 16px;
  }

  body .elementor-column.elementor-element.elementor-element-deba685 > .elementor-widget-wrap > .elementor-element > .elementor-widget-container {
    margin: 0;
  }

  body .elementor-column.elementor-element.elementor-element-deba685 > .elementor-widget-wrap > .elementor-element:last-child {
    margin-bottom: 0;
  }

  /* Shortcode widgets with nothing to show take no space (and leave no gap) */
  body .elementor-column.elementor-element.elementor-element-deba685 .elementor-widget-shortcode:has(> .elementor-widget-container > .elementor-shortcode:empty) {
    display: none;
  }

  /* Toolbar: Filters and Sort by side by side, count on its own line below */
  body .e-con.elementor-element.elementor-element-7e9d996 {
    --flex-wrap: wrap;
    --align-items: center;
    --gap: 12px 12px;
    --row-gap: 12px;
    --column-gap: 12px;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
  }

  body .e-con.elementor-element.elementor-element-7e9d996 > .elementor-element {
    margin: 0;
  }

  body .e-con.elementor-element.elementor-element-7e9d996 > .elementor-element > .elementor-widget-container {
    margin: 0;
  }

  /* FacetWP adds a bottom margin to every facet, which pushed Sort by up */
  body .e-con.elementor-element.elementor-element-7e9d996 .facetwp-facet {
    margin: 0;
  }

  body .e-con.elementor-element.elementor-element-7e9d996 > .elementor-element.elementor-element-dcdde7c,
  body .e-con.elementor-element.elementor-element-7e9d996 > .elementor-element.elementor-element-0b66e42 {
    --container-widget-width: calc(50% - 6px);
    flex: 0 0 calc(50% - 6px);
    width: calc(50% - 6px);
    max-width: calc(50% - 6px);
  }

  body .e-con.elementor-element.elementor-element-7e9d996 > .elementor-element.elementor-element-081812c {
    --container-widget-width: 100%;
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
  }
}/* End custom CSS */