/* =========================================================
   Foiling Freaks "card" styling for WooCommerce product grids
   (matches your shop.css card look)
   ========================================================= */

/* --- Product grid layout (Shop + Category archives) --- */

.woocommerce ul.products {
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 34px;
  align-items: stretch;
  justify-items: stretch;
  margin-top: 20px;
  margin-bottom: 34px;
}

.woocommerce-error a,
.woocommerce-error a:visited {
  color: #fff !important;
  font-weight: 800 !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.woocommerce-error a:hover,
.woocommerce-error a:focus-visible {
  color: #fff !important;
  text-decoration-thickness: 2px;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after {
  content: none !important;
  display: none !important;
}

.woocommerce-message,
.woocommerce-info {
  background: #45c7c2 !important;
  border-left-color: #000 !important;
  color: #000 !important;
}

.woocommerce-message a,
.woocommerce-info a,
.woocommerce-message .button,
.woocommerce-info .button {
  color: #000 !important;
  border-color: #000 !important;
  background: rgba(255,255,255,0.35) !important;
  text-shadow: none !important;
}

@media (max-width: 1399px) {
  .woocommerce ul.products {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1049px) {
  .woocommerce ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 699px) {
  .woocommerce ul.products {
    grid-template-columns: repeat(1, minmax(0, 1fr));
    margin-bottom: 24px;
  }
}

.woocommerce ul.products li.product,
.woocommerce ul.products li.product-category {
  width: 100% !important;  
  max-width: 400px;        
  height: 100%;            
  display: flex;           
  flex-direction: column;  
  text-align: center;      
  border: 1px solid rgba(0,0,0,0.10);
  border-radius: 18px;
  overflow: hidden;
  padding: 14px;
  margin: 0;
  background: transparent;
  float: none !important;
  clear: none !important;
  box-sizing: border-box;  
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link,
.woocommerce ul.products li.product a.woocommerce-loop-product__link,
.woocommerce ul.products li.product-category a {
  display: block;
  text-decoration: none;
}

.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product-category a img {
  display: block;
  width: 100%;
  max-width: 300px;
  height: auto;
  margin: 0 auto;
  border-radius: 14px;
  aspect-ratio: 1 / 1;
  object-fit: contain;
}

@media (max-width: 699px) {
  .woocommerce ul.products li.product,
  .woocommerce ul.products li.product-category {
    border-radius: 16px;
    max-width: 360px;
  }
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product-category h2.woocommerce-loop-category__title {
  margin: 14px 0 6px 0;
  line-height: 1.1;
  text-align: center;
  padding: 0;
  color: var(--ff-nav-green, #abca4a);
  font-family: PrimaryExtraBoldFont, Arial, sans-serif;
  letter-spacing: .03em;
  font-size: clamp(18px, 1.4vw, 24px);
}

.woocommerce ul.products li.product a:hover .woocommerce-loop-product__title,
.woocommerce ul.products li.product-category a:hover h2.woocommerce-loop-category__title {
  color: var(--ff-nav-orange, #f38109);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.woocommerce ul.products li.product .ff-woo-desc {
  padding-top: 10px;
  margin: 0 0 6px 0;
  text-align: center;
  font-family: PrimaryMediumFont, Arial, sans-serif;
  letter-spacing: .02em;
  line-height: 1.35;
  font-size: clamp(14px, 1.05vw, 16px);
  color: #0b0f14;
}

.woocommerce ul.products li.product .price {
  display: block;
  text-align: center;
  margin-top: 8px;
  margin-bottom: 12px;
}

.woocommerce ul.products li.product .button {
  display: block;
  margin-top: auto;
  margin-bottom: 0;
  width: 100%;     
  text-align: center;
}

.woocommerce ul.products li.product a.button,
.woocommerce ul.products li.product a.button:visited {
  font-family: PrimaryExtraBoldFont2, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; /* ADDED */
  font-weight: 800;          
  letter-spacing: 0.2em;     
  text-transform: uppercase; 
  line-height: 1.25;         

  background: rgba(77,166,216,0.28); 
  border: 1px solid rgba(0,0,0,0.15);
  border-radius: 12px;             
  padding: 10px 12px;              

  color: var(--ff-nav-green, #abca4a);
  text-decoration: none;         
  box-shadow: none;              

  text-shadow:                   
    -1px -1px 0 #000,
     0px -1px 0 #000,
     1px -1px 0 #000,
    -1px  0px 0 #000,
     1px  0px 0 #000,
    -1px  1px 0 #000,
     0px  1px 0 #000,
     1px  1px 0 #000,
    -1px -1px 0 #000,
     0px -1px 0 #000,
     1px -1px 0 #000,
    -1px  0px 0 #000,
     1px  0px 0 #000,
    -1px  1px 0 #000,
     0px  1px 0 #000,
     1px  1px 0 #000;

  transition: transform 120ms ease, background-color 120ms ease, color 120ms ease; /* ADDED */
}

.woocommerce ul.products li.product a.button:hover,
.woocommerce ul.products li.product a.button:focus-visible {
  color: var(--ff-nav-orange, #f38109);
  background: rgba(77,166,216,0.40);   
  transform: translateY(-1px);         
  outline: none;                       
}

/* =========================================================
   Mobile header menu panel alignment on Woo/WP pages
   Theme/wp.css was overriding the "fixed top-right" behavior.
   ========================================================= */

@media (max-width: 720px) {

  body#cssbody.woocommerce header.ff-site-header .header-inner,
  body#cssbody.woocommerce-page header.ff-site-header .header-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
  }

  body#cssbody.woocommerce header.ff-site-header .nav-toggle-btn,
  body#cssbody.woocommerce-page header.ff-site-header .nav-toggle-btn {
    margin-left: auto !important;
  }

  body#cssbody.woocommerce header.ff-site-header nav.ff-site-nav,
  body#cssbody.woocommerce-page header.ff-site-header nav.ff-site-nav {
    display: none !important;
    position: fixed !important;
    top: 50px !important;
    right: var(--ff-pad-x, 15px) !important;
    left: auto !important;

    width: auto !important;
    min-width: min(78vw, 320px) !important;
    max-width: 320px !important;

    margin-left: 0 !important;
    transform: none !important;
    z-index: 9999999 !important;

    flex-direction: column !important;
    align-items: stretch !important;
    gap: 6px !important;
  }

  body#cssbody.woocommerce header.ff-site-header #nav-toggle:checked ~ nav.ff-site-nav,
  body#cssbody.woocommerce-page header.ff-site-header #nav-toggle:checked ~ nav.ff-site-nav {
    display: flex !important;
  }
}

/* =========================================================
   "View cart" (added-to-cart notice) font + cart icon
   ========================================================= */

.woocommerce a.added_to_cart.wc-forward,
.woocommerce-page a.added_to_cart.wc-forward,
.woocommerce-message a.button.wc-forward,
.woocommerce-message a.wc-forward {
  font-family: PrimaryExtraBoldFont2, PrimaryExtraBoldFont, PrimaryMediumFont, PrimaryFont, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em;     
  text-transform: uppercase;  
  position: relative;         
  padding-left: 45px !important;
}

.woocommerce a.added_to_cart.wc-forward::before,
.woocommerce-page a.added_to_cart.wc-forward::before,
.woocommerce-message a.button.wc-forward::before,
.woocommerce-message a.wc-forward::before {
  content: "";         
  position: absolute;  
  left: 12px;          
  top: calc(50% - 3px);            
  transform: translateY(-50%);   
  width: 24px;                   
  height: 24px;                  
  background: url("/img/shoppingcart.png") no-repeat center / contain;
  pointer-events: none;    
}

/* =========================================================
   "View cart" / "Continue shopping" button box styling
   (match the light-blue rounded card buttons)
   ========================================================= */

.woocommerce a.added_to_cart.wc-forward,
.woocommerce-page a.added_to_cart.wc-forward,
.woocommerce-message a.button.wc-forward,
.woocommerce-message a.wc-forward,
.woocommerce-message a.button.wc-backward,
.woocommerce-info a.button.wc-backward {
  background: #cfe8f7 !important;                 
  border: 1px solid rgba(0,0,0,0.35) !important;  
  border-radius: 12px !important;                 
  box-shadow: none !important;
  text-decoration: none !important;
  padding-top: 10px !important;                   
  padding-right: 14px !important;                 
  padding-bottom: 10px !important;                
  display: inline-flex !important;                
  align-items: center !important;                 
  opacity: 1 !important;                          
}

.woocommerce a.added_to_cart.wc-forward,
.woocommerce-page a.added_to_cart.wc-forward,
.woocommerce-message a.button.wc-forward,
.woocommerce-message a.wc-forward {
  padding-left: 45px !important;
}

.woocommerce a.added_to_cart.wc-forward:hover,
.woocommerce-page a.added_to_cart.wc-forward:hover,
.woocommerce-message a.button.wc-forward:hover,
.woocommerce-message a.wc-forward:hover,
.woocommerce-message a.button.wc-backward:hover,
.woocommerce-info a.button.wc-backward:hover,
.woocommerce a.added_to_cart.wc-forward:focus-visible,
.woocommerce-page a.added_to_cart.wc-forward:focus-visible,
.woocommerce-message a.button.wc-forward:focus-visible,
.woocommerce-message a.wc-forward:focus-visible {
  background: #b9dcf3 !important;
}

/* =========================================================
Notice-bar buttons text (wc-forward / wc-backward)
Force green + 1px stroke + orange hover (no black text)
========================================================= */

.woocommerce-message a.button.wc-forward,
.woocommerce-message a.wc-forward,
.woocommerce-message a.button.wc-backward,
.woocommerce-info a.button.wc-backward,
.woocommerce a.added_to_cart.wc-forward,
.woocommerce-page a.added_to_cart.wc-forward {
  color: var(--ff-nav-green, #abca4a) !important;
  text-shadow:                                   
    -1px -1px 0 #000,
     0px -1px 0 #000,
     1px -1px 0 #000,
    -1px  0px 0 #000,
     1px  0px 0 #000,
    -1px  1px 0 #000,
     0px  1px 0 #000,
     1px  1px 0 #000 !important;
  text-decoration: none !important;
}

.woocommerce-message a.button.wc-forward:hover,
.woocommerce-message a.wc-forward:hover,
.woocommerce-message a.button.wc-backward:hover,
.woocommerce-info a.button.wc-backward:hover,
.woocommerce a.added_to_cart.wc-forward:hover,
.woocommerce-page a.added_to_cart.wc-forward:hover,
.woocommerce-message a.button.wc-forward:focus-visible,
.woocommerce-message a.wc-forward:focus-visible,
.woocommerce a.added_to_cart.wc-forward:focus-visible,
.woocommerce-page a.added_to_cart.wc-forward:focus-visible {
  color: var(--ff-nav-orange, #f38109) !important;
}

.woocommerce-message a.button.wc-forward::after,
.woocommerce-message a.wc-forward::after,
.woocommerce a.added_to_cart.wc-forward::after,
.woocommerce-page a.added_to_cart.wc-forward::after {
  color: inherit !important;
  text-shadow: inherit !important;
}

/* =========================================================
   Mobile: move "View cart" under the added-to-cart message
   ========================================================= */

@media (max-width: 1049px) {

  .woocommerce-message {
    display: flex !important; 
    flex-direction: column !important;  
    align-items: flex-start !important; 
    gap: 10px !important;               
  }

  .woocommerce-message a.button.wc-forward,
  .woocommerce-message a.wc-forward {
    float: none !important;   
    align-self: flex-start !important; 
    margin: 0 !important;              
    white-space: nowrap;               
  }
}

/* =========================================================
   Global Search buttons: match FF rounded light-blue SuperWater style
   ========================================================= */

/* Target common WP + Woo search submit controls */
.woocommerce-product-search button,
.woocommerce-product-search input[type="submit"],
.widget_product_search button,
.widget_product_search input[type="submit"],
.search-form button,
.search-form input[type="submit"],
.wp-block-search button,
.wp-block-search input[type="submit"],
form[role="search"] button,
form[role="search"] input[type="submit"] {
  font-family: PrimaryExtraBoldFont2, PrimaryExtraBoldFont, PrimaryMediumFont, PrimaryFont, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  line-height: 1.25 !important;

  background: #cfe8f7 !important;
  border: 1px solid rgba(0,0,0,0.35) !important;
  border-radius: 12px !important;
  padding: 10px 14px !important;

  color: var(--ff-nav-green, #abca4a) !important;
  text-shadow:
    -1px -1px 0 #000,
     0px -1px 0 #000,
     1px -1px 0 #000,
    -1px  0px 0 #000,
     1px  0px 0 #000,
    -1px  1px 0 #000,
     0px  1px 0 #000,
     1px  1px 0 #000 !important;

  box-shadow: none !important;
  text-decoration: none !important;
  cursor: pointer !important;
  opacity: 1 !important;
}

/* Hover/focus rollover */
.woocommerce-product-search button:hover,
.woocommerce-product-search input[type="submit"]:hover,
.widget_product_search button:hover,
.widget_product_search input[type="submit"]:hover,
.search-form button:hover,
.search-form input[type="submit"]:hover,
.wp-block-search button:hover,
.wp-block-search input[type="submit"]:hover,
form[role="search"] button:hover,
form[role="search"] input[type="submit"]:hover,
.woocommerce-product-search button:focus-visible,
.woocommerce-product-search input[type="submit"]:focus-visible,
.widget_product_search button:focus-visible,
.widget_product_search input[type="submit"]:focus-visible,
.search-form button:focus-visible,
.search-form input[type="submit"]:focus-visible,
.wp-block-search button:focus-visible,
.wp-block-search input[type="submit"]:focus-visible,
form[role="search"] button:focus-visible,
form[role="search"] input[type="submit"]:focus-visible {
  color: var(--ff-nav-orange, #f38109) !important;
  background: #b9dcf3 !important;
  outline: none !important;
}


/* =========================================================
Search label text color ("Search" above input)
========================================================= */

.widget_product_search .widget-title,
.widget_search .widget-title,
.wp-block-search__label,
.woocommerce-product-search label,
.woocommerce-product-search label span,
label[for*="woocommerce-product-search-field"],
label[for*="search"] {
  color: #2b5673 !important;
}

/* =========================================================
   Cart page — hide the specific search block widget (#block-2)
   ========================================================= */

body.woocommerce-cart #block-2.widget_block.widget_search {
  display: none !important;
}

body.woocommerce-cart .widget_block.widget_search {
  display: none !important;
}

/* =========================================================
   Single product price color
   ========================================================= */
   
body.woocommerce.single-product div.product p.price,
body.woocommerce.single-product div.product span.price,
body.woocommerce.single-product div.product .price,
body.woocommerce.single-product div.product p.price span.amount,
body.woocommerce.single-product div.product span.price span.amount {
  color: #1b6e9a !important;
}

/* =========================================================
   Single product: hide SKU line (parent + variation SKU)
   ========================================================= */

body.woocommerce.single-product .product_meta .sku_wrapper,
body.woocommerce.single-product .product_meta span.sku,
body.woocommerce.single-product .product_meta .sku {
  display: none !important;
}

/* =========================================================
   Single product: fade Add to Cart until required options chosen
   (Woo disables the button for variable products until selections made)
   ========================================================= */

body.woocommerce.single-product form.variations_form button.single_add_to_cart_button:disabled,
body.woocommerce.single-product form.variations_form button.single_add_to_cart_button.disabled,
body.woocommerce.single-product form.variations_form .single_add_to_cart_button:disabled,
body.woocommerce.single-product form.variations_form .single_add_to_cart_button.disabled {
  opacity: 0.35 !important; 
  filter: grayscale(0.35) !important;
  cursor: not-allowed !important;    
  transform: none !important;        
  pointer-events: none !important;   
}

body.woocommerce.single-product form.variations_form button.single_add_to_cart_button:disabled:hover,
body.woocommerce.single-product form.variations_form button.single_add_to_cart_button.disabled:hover,
body.woocommerce.single-product form.variations_form .single_add_to_cart_button:disabled:hover,
body.woocommerce.single-product form.variations_form .single_add_to_cart_button.disabled:hover {
  background: #cfe8f7 !important;
  color: var(--ff-nav-green, #abca4a) !important;
}

/* =========================================================
   Cart "Estimated total" text color (Woo Blocks + classic)
   ========================================================= */

/* Woo Blocks cart totals label/value */
body.woocommerce-cart .wc-block-components-totals-item__label,
body.woocommerce-cart .wc-block-components-totals-item__value,
body.woocommerce-cart .wc-block-components-totals-item__value .amount,
body.woocommerce-cart .wc-block-components-totals-item--total .wc-block-components-totals-item__label,
body.woocommerce-cart .wc-block-components-totals-item--total .wc-block-components-totals-item__value {
  color: #1b6e9a !important;
}

/* Classic cart totals fallback (if present anywhere) */
body.woocommerce-cart .cart_totals,
body.woocommerce-cart .cart_totals .order-total th,
body.woocommerce-cart .cart_totals .order-total td,
body.woocommerce-cart .cart_totals .order-total .amount {
  color: #1b6e9a !important;
}

/* =========================================================
   Cart "Proceed to checkout" button styling (Blocks + classic)
   ========================================================= */

/* Woo Blocks primary checkout button */
body.woocommerce-cart .wc-block-cart__submit-container .wc-block-components-button,
body.woocommerce-cart .wc-block-cart__submit-container a.wc-block-components-button,
body.woocommerce-cart .wc-block-cart__submit-container button.wc-block-components-button,
body.woocommerce-cart .wp-block-woocommerce-cart .wc-block-components-button {
  font-family: PrimaryExtraBoldFont2, PrimaryExtraBoldFont, PrimaryMediumFont, PrimaryFont, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  line-height: 1.25 !important;

  background: #cfe8f7 !important;
  border: 1px solid rgba(0,0,0,0.35) !important;
  border-radius: 12px !important;

  color: var(--ff-nav-green, #abca4a) !important;
  text-shadow:
    -1px -1px 0 #000,
     0px -1px 0 #000,
     1px -1px 0 #000,
    -1px  0px 0 #000,
     1px  0px 0 #000,
    -1px  1px 0 #000,
     0px  1px 0 #000,
     1px  1px 0 #000 !important;

  box-shadow: none !important;
  text-decoration: none !important;
  opacity: 1 !important;
}

/* Woo Blocks hover */
body.woocommerce-cart .wc-block-cart__submit-container .wc-block-components-button:hover,
body.woocommerce-cart .wc-block-cart__submit-container .wc-block-components-button:focus-visible {
  background: #b9dcf3 !important;
  color: var(--ff-nav-orange, #f38109) !important;
  outline: none !important;
  text-decoration: none !important;
}

/* Classic checkout button fallback */
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:visited {
  font-family: PrimaryExtraBoldFont2, PrimaryExtraBoldFont, PrimaryMediumFont, PrimaryFont, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  line-height: 1.25 !important;

  background: #cfe8f7 !important;
  border: 1px solid rgba(0,0,0,0.35) !important;
  border-radius: 12px !important;

  color: var(--ff-nav-green, #abca4a) !important;
  text-shadow:
    -1px -1px 0 #000,
     0px -1px 0 #000,
     1px -1px 0 #000,
    -1px  0px 0 #000,
     1px  0px 0 #000,
    -1px  1px 0 #000,
     0px  1px 0 #000,
     1px  1px 0 #000 !important;

  box-shadow: none !important;
  text-decoration: none !important;
  opacity: 1 !important;
}

body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:focus-visible {
  background: #b9dcf3 !important;
  color: var(--ff-nav-orange, #f38109) !important;
  outline: none !important;
  text-decoration: none !important;
}

/* =========================================================
   Cart: tighten bottom whitespace (after widgets removed)
   ========================================================= */
body.woocommerce-cart #content,
body.woocommerce-cart .site-content,
body.woocommerce-cart .content-area {
  padding-bottom: 0 !important; 
  margin-bottom: 0 !important;  
}

body.woocommerce-cart .widget-area {
  padding-bottom: 0 !important; 
  margin-bottom: 0 !important;  
}

body.woocommerce-cart .woocommerce,
body.woocommerce-cart .woocommerce-cart-form,
body.woocommerce-cart .cart-collaterals {
  margin-bottom: 10px !important;
  padding-bottom: 0 !important; 
}

/* =========================================================
   Empty cart page: replace frown icon with /img/EmptyCart.png
   + style "New in store" product buttons
   ========================================================= */

/* --- A) Replace the Storefront/woo notice icon with your image --- */
body.woocommerce-cart-empty p.cart-empty.woocommerce-info,
body.woocommerce-cart-empty .wc-empty-cart-message .woocommerce-info {
  padding-left: 0 !important;          /* remove space reserved for icon */
  text-align: center !important;
}

body.woocommerce-cart-empty p.cart-empty.woocommerce-info::before,
body.woocommerce-cart-empty .wc-empty-cart-message .woocommerce-info::before {
  content: "" !important;
  display: block !important;
  position: static !important;          /* cancel theme absolute icon positioning */
  width: min(250px, 90vw) !important;
  aspect-ratio: 250 / 200;
  height: auto !important;
  margin: 0 auto 14px !important;
  background: url("/img/EmptyCart.png") no-repeat center / contain !important;
  font-family: inherit !important;      /* prevent icon-font glyphs */
}

/* (Extra coverage if your cart uses Woo Blocks markup) */
body.woocommerce-cart-empty .wc-block-cart__empty-cart__icon {
  display: none !important;
}
body.woocommerce-cart-empty .wc-block-cart__empty-cart__title::before {
  content: "" !important;
  display: block !important;
  width: min(250px, 90vw) !important;
  aspect-ratio: 250 / 200;
  height: auto !important;
  margin: 0 auto 14px !important;
  background: url("/img/EmptyCart.png") no-repeat center / contain !important;
}

/* --- B) Empty cart "New in store" product buttons: match FF button style --- */
body.woocommerce-cart-empty .wc-block-grid__product-add-to-cart a,
body.woocommerce-cart-empty .wc-block-grid__product-add-to-cart a:visited,
body.woocommerce-cart-empty .wc-block-grid__product-add-to-cart .wp-block-button__link,
body.woocommerce-cart-empty .wc-block-grid__product-add-to-cart .wp-block-button__link:visited,
body.woocommerce-cart-empty ul.products li.product a.button,
body.woocommerce-cart-empty ul.products li.product a.button:visited {
  font-family: PrimaryExtraBoldFont2, PrimaryExtraBoldFont, PrimaryMediumFont, PrimaryFont, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  line-height: 1.25 !important;

  background: #cfe8f7 !important;
  border: 1px solid rgba(0,0,0,0.35) !important;
  border-radius: 12px !important;
  padding: 10px 14px !important;

  color: var(--ff-nav-green, #abca4a) !important;
  text-shadow:
    -1px -1px 0 #000,
     0px -1px 0 #000,
     1px -1px 0 #000,
    -1px  0px 0 #000,
     1px  0px 0 #000,
    -1px  1px 0 #000,
     0px  1px 0 #000,
     1px  1px 0 #000 !important;

  box-shadow: none !important;
  text-decoration: none !important;
  cursor: pointer !important;
  opacity: 1 !important;
}

body.woocommerce-cart-empty .wc-block-grid__product-add-to-cart a:hover,
body.woocommerce-cart-empty .wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
body.woocommerce-cart-empty ul.products li.product a.button:hover,
body.woocommerce-cart-empty .wc-block-grid__product-add-to-cart a:focus-visible,
body.woocommerce-cart-empty .wc-block-grid__product-add-to-cart .wp-block-button__link:focus-visible,
body.woocommerce-cart-empty ul.products li.product a.button:focus-visible {
  color: var(--ff-nav-orange, #f38109) !important;
  background: #b9dcf3 !important;
  outline: none !important;
}

/* =========================================================
   Empty cart page - show ONE EmptyCart image only
   Keep the Woo Blocks icon slot (::before) and hide any extra duplicates
   ========================================================= */

/* Use Woo Blocks icon slot, but make it your PNG (no masking) */
body.woocommerce-cart .wc-block-cart__empty-cart__title.with-empty-cart-icon::before{
  content:"" !important;
  display:block !important;
  width:250px !important;
  height:250px !important;
  margin: 0 auto 14px auto !important;

  background: url("/img/EmptyCart.png") no-repeat center / contain !important;

  /* IMPORTANT: disable the frowny-face mask so it's not "cut out" */
  -webkit-mask: none !important;
  mask: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

/* In case something else is also using ::after to inject an image */
body.woocommerce-cart .wc-block-cart__empty-cart__title.with-empty-cart-icon::after{
  content:none !important;
  display:none !important;
}

/* Hide ANY extra injected EmptyCart image in the DOM (anywhere on cart page) */
body.woocommerce-cart img[src*="emptycart" i]{
  display:none !important;
}

/* =========================================================
   CART (Blocks): Estimated total color (label + value)
   ========================================================= */

body.woocommerce-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
body.woocommerce-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
body.woocommerce-cart .wc-block-components-totals-footer-item {
  color: #1b6e9a !important;
}

/* =========================================================
   CHECKOUT: Order Summary + Total line color (Blocks + Classic)
   ========================================================= */

/* Woo Blocks checkout sidebar heading */
body.woocommerce-checkout .wc-block-components-order-summary__title,
body.woocommerce-checkout .wc-block-components-order-summary__button-text {
  color: #1b6e9a !important;
}

/* Woo Blocks totals "Total" row */
body.woocommerce-checkout .wc-block-components-totals-item--total .wc-block-components-totals-item__label,
body.woocommerce-checkout .wc-block-components-totals-item--total .wc-block-components-totals-item__value {
  color: #1b6e9a !important;
}

/* Classic checkout fallbacks */
body.woocommerce-checkout #order_review_heading,
body.woocommerce-checkout .shop_table tfoot .order-total th,
body.woocommerce-checkout .shop_table tfoot .order-total td {
  color: #1b6e9a !important;
}

/* =========================================================
   CART + CHECKOUT: SuperWater button styling
   - Cart: Proceed to checkout (Blocks)
   - Checkout: Place order (Blocks + Classic)
   ========================================================= */

body.woocommerce-cart .wc-block-cart__submit-button,
body.woocommerce-cart .wp-block-woocommerce-proceed-to-checkout-block a,
body.woocommerce-checkout .wc-block-components-checkout-place-order-button,
body.woocommerce-checkout #place_order,
body.woocommerce-checkout button#place_order {
  font-family: PrimaryExtraBoldFont2, PrimaryExtraBoldFont, PrimaryMediumFont, PrimaryFont, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  line-height: 1.25 !important;

  background: #cfe8f7 !important;
  border: 1px solid rgba(0,0,0,0.35) !important;
  border-radius: 12px !important;

  padding: 12px 16px !important;

  color: var(--ff-nav-green, #abca4a) !important;
  text-shadow:
    -1px -1px 0 #000,
     0px -1px 0 #000,
     1px -1px 0 #000,
    -1px  0px 0 #000,
     1px  0px 0 #000,
    -1px  1px 0 #000,
     0px  1px 0 #000,
     1px  1px 0 #000 !important;

  box-shadow: none !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

body.woocommerce-cart .wc-block-cart__submit-button:hover,
body.woocommerce-cart .wp-block-woocommerce-proceed-to-checkout-block a:hover,
body.woocommerce-checkout .wc-block-components-checkout-place-order-button:hover,
body.woocommerce-checkout #place_order:hover,
body.woocommerce-checkout button#place_order:hover,
body.woocommerce-cart .wc-block-cart__submit-button:focus-visible,
body.woocommerce-checkout .wc-block-components-checkout-place-order-button:focus-visible,
body.woocommerce-checkout #place_order:focus-visible {
  color: var(--ff-nav-orange, #f38109) !important;
  background: #b9dcf3 !important;
  outline: none !important;
}

/* =========================================================
   CHECKOUT: tighten whitespace after removing search block
   ========================================================= */

body.woocommerce-checkout .site-content,
body.woocommerce-checkout .content-area,
body.woocommerce-checkout .site-main,
body.woocommerce-checkout .entry-content {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Blocks checkout wrapper */
body.woocommerce-checkout .wp-block-woocommerce-checkout,
body.woocommerce-checkout .wc-block-checkout {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Remove “last element” bottom margins that create big gaps */
body.woocommerce-checkout .entry-content > :last-child,
body.woocommerce-checkout .wp-block-woocommerce-checkout > :last-child,
body.woocommerce-checkout .wc-block-checkout > :last-child {
  margin-bottom: 0 !important;
}

/* If the sidebar column is keeping extra space */
body.woocommerce-checkout .wc-block-checkout__sidebar,
body.woocommerce-checkout .wc-block-components-sidebar {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* =========================================================
   CHECKOUT: Order Summary + Total lines force BLUE (Blocks)
   ========================================================= */

body.woocommerce-checkout .wc-block-components-order-summary__title,
body.woocommerce-checkout .wc-block-components-order-summary__title *,
body.woocommerce-checkout .wc-block-components-order-summary__button-text {
  color: #1b6e9a !important;
  opacity: 1 !important;
}

/* “Total” row on Blocks checkout (this is often the one staying grey) */
body.woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
body.woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
body.woocommerce-checkout .wc-block-components-totals-item--total .wc-block-components-totals-item__label,
body.woocommerce-checkout .wc-block-components-totals-item--total .wc-block-components-totals-item__value {
  color: #1b6e9a !important;
  opacity: 1 !important;
}

/* =========================================================
   CHECKOUT: Place Order button 3x bigger + FF button styling
   ========================================================= */

body.woocommerce-checkout .wc-block-components-checkout-place-order-button,
body.woocommerce-checkout #place_order,
body.woocommerce-checkout button#place_order {
  font-size: 200% !important;           /* 3x bigger */
  padding: 18px 22px !important;        /* keep it proportionate */

  font-family: PrimaryExtraBoldFont2, PrimaryExtraBoldFont, PrimaryMediumFont, PrimaryFont, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase !important;
  line-height: 1.05 !important;

  background: #cfe8f7 !important;
  border: 1px solid rgba(0,0,0,0.35) !important;
  border-radius: 12px !important;

  color: var(--ff-nav-green, #abca4a) !important;
  text-shadow:
    -1px -1px 0 #000,
     0px -1px 0 #000,
     1px -1px 0 #000,
    -1px  0px 0 #000,
     1px  0px 0 #000,
    -1px  1px 0 #000,
     0px  1px 0 #000,
     1px  1px 0 #000 !important;

  box-shadow: none !important;
  text-decoration: none !important;
  opacity: 1 !important;
}

body.woocommerce-checkout .wc-block-components-checkout-place-order-button:hover,
body.woocommerce-checkout #place_order:hover,
body.woocommerce-checkout button#place_order:hover,
body.woocommerce-checkout .wc-block-components-checkout-place-order-button:focus-visible,
body.woocommerce-checkout #place_order:focus-visible {
  color: var(--ff-nav-orange, #f38109) !important;
  background: #b9dcf3 !important;
  outline: none !important;
}

/* =========================================================
   Social proof toast (category + product pages)
   ========================================================= */

.ff-toast-wrap {
  position: fixed;
  left: 18px;
  bottom: 18px;
  z-index: 999999;
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-width: min(92vw, 420px);
}

.ff-toast {
  display: grid;
  grid-template-columns: 56px 1fr 22px;
  gap: 10px;
  align-items: center;

  background: rgba(0,0,0,0.90);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 16px;
  padding: 10px 12px;
  box-shadow: 0 10px 26px rgba(0,0,0,0.35);

  opacity: 0;
  transform: translateY(10px);
  transition: opacity 180ms ease, transform 180ms ease;
}

.ff-toast.is-on {
  opacity: 1;
  transform: translateY(0);
}

.ff-toast-img {
  width: 56px;
  height: 56px;
  border-radius: 14px;
  object-fit: cover;
  display: block;
  border: 1px solid rgba(255,255,255,0.10);
}

.ff-toast-text {
  min-width: 0;
}

.ff-toast-line {
  font-family: PrimaryMediumFont, Arial, sans-serif;
  letter-spacing: .02em;
  line-height: 1.15;
  font-size: 14px;
  color: rgba(255,255,255,0.92);
  margin-bottom: 6px;
}

.ff-toast-loc {
  font-weight: 800;
}

.ff-toast-link {
  display: inline-block;
  font-family: PrimaryExtraBoldFont2, PrimaryExtraBoldFont, Arial, sans-serif;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;

  color: var(--ff-nav-green, #abca4a);
  text-decoration: none !important;

  text-shadow:
    -1px -1px 0 #000,
     0px -1px 0 #000,
     1px -1px 0 #000,
    -1px  0px 0 #000,
     1px  0px 0 #000,
    -1px  1px 0 #000,
     0px  1px 0 #000,
     1px  1px 0 #000 !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.ff-toast-link:hover,
.ff-toast-link:focus-visible {
  color: var(--ff-nav-orange, #f38109);
  outline: none;
}

.ff-toast-x {
  appearance: none;
  border: 0;
  background: transparent;
  color: rgba(255,255,255,0.85);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  padding: 0;
  margin: 0;
}

.ff-toast-x:hover {
  color: #fff;
}

@media (max-width: 520px) {
  .ff-toast-wrap{ left: 12px; bottom: 12px; }
  .ff-toast{ grid-template-columns: 48px 1fr 22px; }
  .ff-toast-img{ width: 48px; height: 48px; border-radius: 12px; }
}

/* =========================================================
   Social proof toast tweaks (category + product pages)
   - Dark blue background (#124a65) (instead of navy/black)
   - Ensure close glyph renders consistently
   - Give transparent product images a white backing
   ========================================================= */

.ff-toast {
  background: #147ab8 !important;
}

.ff-toast-x {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
}

/* Toast product image: give transparent PNG/WebP a solid white backing */
.ff-toast-img {
  background: #fff !important;
  border-radius: 10px !important;
}

/* =========================================================
   FF FIX: Woo product + category/tag pages should indent like site pages
   (normal pages use #maincontent { padding-left/right: 15px; })
   ========================================================= */

body#cssbody.woocommerce.single-product main.site-main,
body#cssbody.woocommerce.post-type-archive-product main.site-main,
body#cssbody.woocommerce.tax-product_cat main.site-main,
body#cssbody.woocommerce.tax-product_tag main.site-main {
  padding-left: 15px;
  padding-right: 15px;
  box-sizing: border-box;
}

/* FF FIX: add breathing room between the breadcrumb and the first title line */
body#cssbody.woocommerce.single-product #breadcrumb,
body#cssbody.woocommerce.post-type-archive-product #breadcrumb,
body#cssbody.woocommerce.tax-product_cat #breadcrumb,
body#cssbody.woocommerce.tax-product_tag #breadcrumb {
  margin-bottom: 14px;
}

/* =========================================================
   FF ADD: Always-on "View cart" button placement (under breadcrumb)
   ========================================================= */

.ff-always-cart-wrap {
  padding-left: 15px;
  padding-right: 15px;
  box-sizing: border-box;
  margin: 10px 0 26px 0;
  display: flex;
  justify-content: flex-start;
}

@media (max-width: 699px) {
  .ff-always-cart-wrap{
    justify-content: flex-start; 
  }
}

/* =========================================================
   FF ADD: Always-on View Cart button - remove theme "arrow"
   ========================================================= */
.ff-always-cart-wrap a.ff-always-cart::after{
  content: "" !important;
  display: none !important;
}

/* =========================================================
   EMPTY CART: "New in store" (Woo block: woocommerce/product-new)
   Match Foiling Freaks card grid styling used on shop archives
   ========================================================= */

/* Grid container */
.wc-block-product-new ul.wc-block-grid__products{
  width: 100% !important;
  max-width: 1600px !important;
  margin: 20px auto 34px !important;
  padding: 0 !important;
  list-style: none !important;

  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 34px !important;

  align-items: stretch !important;
  justify-items: stretch !important;
}

/* Responsive columns (match your archive grid breakpoints) */
@media (max-width: 1399px){
  .wc-block-product-new ul.wc-block-grid__products{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 1049px){
  .wc-block-product-new ul.wc-block-grid__products{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 699px){
  .wc-block-product-new ul.wc-block-grid__products{
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    margin-bottom: 24px !important;
  }
}

/* Card item */
.wc-block-product-new li.wc-block-grid__product{
  width: 100% !important;
  max-width: 400px !important;
  height: 100% !important;

  display: flex !important;
  flex-direction: column !important;
  text-align: center !important;

  border: 1px solid rgba(0,0,0,0.10) !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  padding: 14px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  background: transparent !important;
}

@media (max-width: 699px){
  .wc-block-product-new li.wc-block-grid__product{
    border-radius: 16px !important;
    max-width: 360px !important;
  }
}

/* Link + image (match archive cards) */
.wc-block-product-new a.wc-block-grid__product-link{
  display: block !important;
  text-decoration: none !important;
}

.wc-block-product-new .wc-block-grid__product-image img{
  display: block !important;
  width: 100% !important;
  max-width: 300px !important;
  height: auto !important;
  margin: 0 auto !important;
  border-radius: 14px !important;
  aspect-ratio: 1 / 1;
  object-fit: contain;
}

/* Title styling (match archive cards) */
.wc-block-product-new .wc-block-grid__product-title{
  margin: 14px 0 6px 0 !important;
  line-height: 1.1 !important;
  text-align: center !important;
  padding: 0 !important;

  color: var(--ff-nav-green, #abca4a) !important;
  font-family: PrimaryExtraBoldFont, Arial, sans-serif !important;
  letter-spacing: .03em !important;
  font-size: clamp(18px, 1.4vw, 24px) !important;
}

.wc-block-product-new a.wc-block-grid__product-link:hover .wc-block-grid__product-title{
  color: var(--ff-nav-orange, #f38109) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* Price spacing (match archive cards) */
.wc-block-product-new .wc-block-grid__product-price.price{
  display: block !important;
  text-align: center !important;
  margin-top: 8px !important;
  margin-bottom: 12px !important;
}

/* Button at bottom (equal-height cards) */
.wc-block-product-new .wc-block-grid__product-add-to-cart{
  margin-top: auto !important;
}

/* =========================================================
   "New in store" (Product New block): style Select options button
   Match FF SuperWater button styling used elsewhere
   ========================================================= */

.wc-block-product-new .wc-block-grid__product-add-to-cart .wp-block-button__link,
.wc-block-product-new .wc-block-grid__product-add-to-cart .wp-block-button__link:visited,
.wc-block-product-new .wc-block-grid__product-add-to-cart a.add_to_cart_button,
.wc-block-product-new .wc-block-grid__product-add-to-cart a.add_to_cart_button:visited {
  font-family: PrimaryExtraBoldFont2, PrimaryExtraBoldFont, PrimaryMediumFont, PrimaryFont, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  line-height: 1.25 !important;

  background: #cfe8f7 !important;
  border: 1px solid rgba(0,0,0,0.35) !important;
  border-radius: 12px !important;
  padding: 10px 14px !important;

  color: var(--ff-nav-green, #abca4a) !important;
  text-shadow:
    -1px -1px 0 #000,
     0px -1px 0 #000,
     1px -1px 0 #000,
    -1px  0px 0 #000,
     1px  0px 0 #000,
    -1px  1px 0 #000,
     0px  1px 0 #000,
     1px  1px 0 #000 !important;

  box-shadow: none !important;
  text-decoration: none !important;
  cursor: pointer !important;
  opacity: 1 !important;
}

.wc-block-product-new .wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.wc-block-product-new .wc-block-grid__product-add-to-cart a.add_to_cart_button:hover,
.wc-block-product-new .wc-block-grid__product-add-to-cart .wp-block-button__link:focus-visible,
.wc-block-product-new .wc-block-grid__product-add-to-cart a.add_to_cart_button:focus-visible {
  color: var(--ff-nav-orange, #f38109) !important;
  background: #b9dcf3 !important;
  outline: none !important;
}

/* =========================================================
   Checkout: "Return to cart" link -> style like FF buttons
   ========================================================= */

.woocommerce-checkout .wc-block-components-checkout-return-to-cart-button,
.woocommerce-checkout .wc-block-components-checkout-return-to-cart-button:visited{
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;

  font-family: PrimaryExtraBoldFont2, PrimaryExtraBoldFont, PrimaryMediumFont, PrimaryFont, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  line-height: 1.25 !important;

  background: #cfe8f7 !important;
  border: 1px solid rgba(0,0,0,0.35) !important;
  border-radius: 12px !important;
  padding: 10px 14px !important;

  color: var(--ff-nav-green, #abca4a) !important;
  text-shadow:
    -1px -1px 0 #000,
     0px -1px 0 #000,
     1px -1px 0 #000,
    -1px  0px 0 #000,
     1px  0px 0 #000,
    -1px  1px 0 #000,
     0px  1px 0 #000,
     1px  1px 0 #000 !important;

  box-shadow: none !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

/* Hover/Focus */
.woocommerce-checkout .wc-block-components-checkout-return-to-cart-button:hover,
.woocommerce-checkout .wc-block-components-checkout-return-to-cart-button:focus-visible{
  color: var(--ff-nav-orange, #f38109) !important;
  background: #b9dcf3 !important;
  outline: none !important;
}

/* Make the arrow icon match (Woo uses currentColor on the svg in most builds) */
.woocommerce-checkout .wc-block-components-checkout-return-to-cart-button svg{
  width: 18px !important;
  height: 18px !important;
  flex: 0 0 auto !important;
}

/* Remove the back arrow icon/character before "Return to cart" */
.woocommerce-checkout .wc-block-components-checkout-return-to-cart-button svg{
  display: none !important;
}

.woocommerce-checkout .wc-block-components-checkout-return-to-cart-button::before{
  content: none !important;
  display: none !important;
}

/* Nut Buster 3000 mug CTA */
.ff-mug-cta {
  margin: 10px 0 0 0;
}

.ff-mug-cta-img{
  display: inline-block;
  width: 100%;
  height: auto;
  max-width: 150px;
  vertical-align: middle;
  margin-right: 10px;
}

.ff-mug-cta-link {
  text-decoration: underline;
}

.ff-cart-checkout-note{
  margin: 0 0 10px 0;
}

/* Nut Buster stage rows: 2-column layout with 300x200 image slot */
.ff-nb-stage-row {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  column-gap: 18px;
  align-items: start;
  margin: 18px 0;
}

.ff-nb-stage-imgcol {
  width: 300px;
}

.ff-nb-stage-img {
  display: block;
  width: 300px;
  height: 200px;
  object-fit: cover;
  border-radius: 10px;
}

.ff-nb-stage-textcol h3 {
  margin-top: 0;
}

@media (max-width: 720px) {
  .ff-nb-stage-row{
    grid-template-columns: 1fr;
    row-gap: 12px;
  }

  .ff-nb-stage-imgcol {
    width: auto;
  }

  .ff-nb-stage-img {
    width: 100%;
    height: auto;
    max-width: 420px;
  }
}