/*
  Theme Name: Starscream
  Theme URI:  https://thebeartraxs.com
  Author:     Eric Kowalewski
  Author URI: https://thebeartraxs.com
  Description: A lightweight, customizable WooCommerce theme built specifically for The Bear Traxs customers using our custom merch dropshipping subscription plans.
  Version: 1.4.32
  Requires at least: 6.0
  Tested up to: 6.6
  Requires PHP: 7.4
  Update URI: https://github.com/emkowale/starscream
*/

/* ====== GLOBAL SPACING (light touch) ====== */
h1,
.woocommerce-result-count,
.woocommerce-ordering,
.single-product .product,
.woocommerce-page .entry-header {
  margin-top: 20px;
  margin-left: 20px;
  margin-right: 20px;
}
main {
  margin-top: 20px;
  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: 20px;
}

@media (max-width: 768px){
  main {
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
  }
  h1,
  .woocommerce-result-count,
  .woocommerce-ordering,
  .single-product .product,
  .woocommerce-page .entry-header {
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
  }
}

/* ====== ORDERING SELECT (cosmetic only) ====== */
.woocommerce .woocommerce-ordering select {
  background-color: #f3f3f3;
  padding: 8px 12px;
  border-radius: 5px;
  border: 1px solid #ccc;
  font-size: 16px;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='15,50 70,100 125,50' stroke='%23666' stroke-width='20' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 12px;
  padding-right: 30px;
}

/* ====== MISC HIDES (leave Woo defaults alone otherwise) ====== */
header .woocommerce-breadcrumb,
.product_meta,
#secondary { display: none !important; }

/* ====== HERO (full-bleed video, no letterboxing) ====== */
.btx-hero{
  position: relative;
  margin: 0 0 0px;
  width: 100vw;
  max-width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  overflow: hidden;
}

.btx-hero-embed{
  position: relative;
  width: 100%;
  height: 100vh; /* adjust 60–100vh to taste */
  overflow: hidden;
}

/* Cover technique for iframes (object-fit alternative) */
.btx-hero-embed iframe{
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100vw;      /* base size */
  height: 56.25vw;   /* 100vw * 9/16 */
  min-width: 177.78vh; /* 100vh * 16/9 */
  min-height: 100vh;
  transform: translate(-50%, -50%);
  border: 0;
}

/* Phones: go back to simple 16:9 so it isn’t too tall */
@media (max-width: 767.98px){
  .btx-hero-embed{ height: auto; }
  .btx-hero-embed iframe{
    position: static;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    transform: none;
  }
}

/* Prevent sideways scroll from the 100vw breakout */
html, body { overflow-x: hidden; }
body {margin: 0px;}
#primary {margin: 10px;}

/* ====== PRODUCT CARDS (lean; let Woo control columns) ====== */
.woocommerce ul.products li.product{
  text-align: center;
  font-family: var(--header-footer-font);
}

/* Media tile — change aspect ratio if you switch Customizer crop later */
.btx-card-media{
  position: relative;
  aspect-ratio: var(--btx-thumb-aspect, 5 / 7); /* driven by Woo settings */
  background: #f7f7f7;
  border-radius: 8px;
  overflow: hidden;
}

/* Honor WooCommerce “Uncropped” */
.btx-uncropped-thumbs .btx-card-media{ aspect-ratio: auto; }

.btx-card-img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

/* Title then price — three rows total: image → title → price */
.btx-card-title{
  font-size: 1.05rem;
  line-height: 1.35;
  margin: 14px 0 6px;
}
.btx-card-title a{ text-decoration: none; }

.btx-card-price{
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 2px;
}

/* Hide Woo's default loop anchor wrapper if present (we use our own link) */
.btx-product-card .woocommerce-loop-product__link{ display: none; }

/* TI Wishlist: heart badge in the image corner (keeps plugin behavior) */
.btx-wishlist{
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 3;
}
.btx-wishlist .tinvwl_add_to_wishlist_button{
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 38px; height: 38px;
  border-radius: 50%;
  background: rgba(0,0,0,.55);
  color: #fff !important;
  border: 0;
  transition: transform .15s ease, background .15s ease;
}
.btx-wishlist .tinvwl_add_to_wishlist_button:hover{
  background: rgba(0,0,0,.7);
  transform: scale(1.06);
}

/* If TI inserts any other loop buttons, hide them to avoid duplicates */
ul.products .tinvwl_add_to_wishlist_button:not(.tinvwl-loop-add-to-wishlist){ display: none; }

.btx-wishlist a { display:none}

/* Remove unwanted right margin on wishlist icon */
ul.products li.product .tinvwl_add_to_wishlist_button,
.woocommerce-page ul.products li.product .tinvwl_add_to_wishlist_button {
    margin-right: 0 !important;
}

/* --- TI Wishlist: kill the side-margin and make the heart red --- */

/* Make the heart itself red (both pseudo-icon and inline icon node) 
.woocommerce ul.products li.product a.tinvwl_add_to_wishlist_button.tinvwl-icon-heart:before,
.woocommerce ul.products li.product button.tinvwl_add_to_wishlist_button.tinvwl-icon-heart:before,
.woocommerce ul.products li.product .tinvwl_add_to_wishlist_button .tinvwl-icon-heart {
  color: #d33 !important;    
  margin-right: 0px !important;
}
 */

/* --- TI Wishlist button: icon-only, centered, white --- */

/* Hide the "Add to wishlist" text */
.woocommerce ul.products li.product a.tinvwl_add_to_wishlist_button,
.woocommerce ul.products li.product button.tinvwl_add_to_wishlist_button {
  font-size: 0 !important; /* hides the text but keeps the icon */
  line-height: 0 !important;
}

/* Reset the icon size */
.woocommerce ul.products li.product a.tinvwl_add_to_wishlist_button:before,
.woocommerce ul.products li.product button.tinvwl_add_to_wishlist_button:before {
  font-size: 18px !important; /* adjust to taste */
  line-height: 1 !important;
}

/* Make the heart white 
.woocommerce ul.products li.product a.tinvwl_add_to_wishlist_button.tinvwl-icon-heart:before,
.woocommerce ul.products li.product .tinvwl_add_to_wishlist_button .tinvwl-icon-heart {
  color: #fff !important;
}
*/
/* Circle container styling & center alignment */
.woocommerce ul.products li.product a.tinvwl_add_to_wishlist_button,
.woocommerce ul.products li.product button.tinvwl_add_to_wishlist_button {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.55);
  margin: 0 !important;
  padding: 0 !important;
}

/* Hover effect */
.woocommerce ul.products li.product a.tinvwl_add_to_wishlist_button:hover,
.woocommerce ul.products li.product button.tinvwl_add_to_wishlist_button:hover {
  background: rgba(0, 0, 0, 0.7);
  transform: scale(1.05);
}

/* Solid red heart (on wishlist) — add white border */
.tinvwl-product-in-list .tinvwl_add_to_wishlist_button.tinvwl-icon-heart:before {
    color: red !important;
    border: 2px solid white;
    border-radius: 50%;
    padding: 2px;
}

/* Outlined heart (not on wishlist) — make solid white */
.tinvwl_add_to_wishlist_button.tinvwl-icon-heart:before {
    color: white !important;
    font-weight: 900; /* makes it fully solid */
}

/* Remove "Add to wishlist" text but keep the icon */
.tinvwl_add_to_wishlist_button span {
    display: none !important;
}


/* ===== TI Wishlist — Shop grid heart badges (clean) ===== */

/* Button container: centered icon in a circle + no side margin */
.woocommerce ul.products li.product .tinvwl_add_to_wishlist_button,
.woocommerce-page ul.products li.product .tinvwl_add_to_wishlist_button{
  display: grid !important;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(0,0,0,.55);
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}
.woocommerce ul.products li.product .tinvwl_add_to_wishlist_button:hover{
  background: rgba(0,0,0,.7);
  transform: scale(1.05);
}

/* Hide "Add to wishlist" text/tooltip; icon only */
.woocommerce ul.products li.product .tinvwl_add_to_wishlist_button span,
.woocommerce ul.products li.product .tinvwl_add_to_wishlist_button .tinvwl-tooltip{
  display: none !important;
}

/* DEFAULT (not in wishlist): solid WHITE heart */
.woocommerce ul.products li.product .tinvwl_add_to_wishlist_button.tinvwl-icon-heart:before{
  color: #fff !important;
  font-size: 18px !important;
  -webkit-text-stroke: 0 !important;
  margin: 0 !important;
}

/* ACTIVE (in wishlist): solid RED heart with WHITE outline */
.woocommerce ul.products li.product .tinvwl-product-in-list.tinvwl_add_to_wishlist_button.tinvwl-icon-heart:before,
.woocommerce ul.products li.tinvwl-product-in-list .tinvwl_add_to_wishlist_button.tinvwl-icon-heart:before{
  color: #d33 !important;
  -webkit-text-stroke: 2px #fff !important;  /* white border */
  text-stroke: 2px #fff !important;          /* fallback */
}

/* ===== Global Site Font (use Customizer "Header & Footer Font") ===== */
/* Assumes the theme already sets --header-footer-font on :root */
:root{
  --btx-site-font: var(--header-footer-font, Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif);
}

/* Apply to all body text, headings, forms, and Woo elements */
html, body,
h1, h2, h3, h4, h5, h6,
.site-title, .site-description,
nav, .menu, .sub-menu,
.widget, .entry-title, .entry-content, .entry-meta,
button, input, select, textarea,
.woocommerce, .woocommerce-page,
.woocommerce *:not(i[class*="fa"], .dashicons, .tinvwl_add_to_wishlist_button:before) {
  font-family: var(--btx-site-font) !important;
}

/* ============ Cart & Checkout: force theme font ============ */
.woocommerce-cart,
.woocommerce-cart *:not(i[class*="fa"], .dashicons) {
  font-family: var(--header-footer-font, Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif) !important;
}

/* (You’ll likely want this for Checkout too) */
.woocommerce-checkout,
.woocommerce-checkout *:not(i[class*="fa"], .dashicons) {
  font-family: var(--header-footer-font, Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif) !important;
}

/* Cart polish */
.woocommerce-cart .shop_table th,
.woocommerce-cart .shop_table td { padding: 14px 12px; }

/* Cart buttons (do NOT set width here) */
.woocommerce-cart .button,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  background: var(--btx-accent, #ffc107) !important;
  color: var(--btx-header-footer-text, #111) !important;
  border-radius: 10px;
  padding: 12px 18px;
}

/* Coupon button only → 100px width */
/*.woocommerce-cart .coupon .button {
  width: 100px !important;
  min-width: 100px !important;
}*/

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
  filter: brightness(0.95);
}

/* =========================
   WooCommerce – Global UI
   ========================= */

/* Fallbacks if theme vars aren't present yet */
:root {
  --btx-accent: #ffc107;             /* your global accent color fallback */
  --btx-accent-text: #111;           /* text on accent buttons */
  --btx-radius: 12px;
}

/* Use the global site font on Woo screens (keeps icons intact) */
.woocommerce,
.woocommerce *:not(i[class*="fa"], .dashicons, .dashicons-before::before) {
  font-family: var(--header-footer-font, "Oswald", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif) !important;
}

/* 1) SITE-WIDE BUTTONS (Cart, Checkout, Product, My Account, etc.) */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce .checkout-button,
.woocommerce .single_add_to_cart_button,
.woocommerce .wc-proceed-to-checkout a.checkout-button {
  background: var(--btx-accent) !important;
  color: var(--btx-accent-text) !important;
  border: 0 !important;
  border-radius: var(--btx-radius) !important;
  padding: 12px 18px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 0 rgba(0,0,0,.08);
  transition: transform .12s ease, filter .12s ease;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce .checkout-button:hover,
.woocommerce .single_add_to_cart_button:hover,
.woocommerce .wc-proceed-to-checkout a.checkout-button:hover {
  filter: brightness(0.95);
  transform: translateY(-1px);
}
.woocommerce a.button:disabled,
.woocommerce button.button:disabled,
.woocommerce input.button:disabled { opacity: .6 !important; cursor: not-allowed !important; }

/* 2) CART: Coupon button width & input cosmetics */
/*.woocommerce-cart .coupon .button { width: 100px !important; min-width: 100px !important; }
.woocommerce-cart .coupon .input-text {
  height: 40px; padding: 8px 12px; border-radius: var(--btx-radius); border: 1px solid #ccc;
}*/

input#coupon_code {
  float: none;
  width: 100px;
}

/* 3 & 5) MY ACCOUNT: left menu as buttons + global font (already applied above) */
.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: 10px;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: block;
  background: var(--btx-accent);
  color: var(--btx-accent-text);
  border-radius: var(--btx-radius);
  padding: 10px 14px;
  font-weight: 600; text-decoration: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover { filter: brightness(0.92); }

/* 6 & 7) PRODUCT PAGE: buttons already styled globally + ensure font (covered above) */

/* 8) PRODUCT PAGE: nicer selects (variations) & other Woo selects */
.single-product .variations select,
.woocommerce-cart .shop_table select,
.woocommerce-checkout select,
.woocommerce-account select {
  appearance: none; -webkit-appearance: none; -moz-appearance: none;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: var(--btx-radius);
  padding: 10px 36px 10px 12px;
  font-size: 16px; line-height: 1.2;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 14px;
}
.single-product .variations select:focus,
.woocommerce select:focus {
  outline: 2px solid var(--btx-accent);
  border-color: var(--btx-accent);
}

/* 10) CHECKOUT: center content + space buttons */
.woocommerce-checkout .woocommerce { max-width: 1100px; margin-left: auto; margin-right: auto; }
.woocommerce-cart .woocommerce { max-width: 1100px; margin-left: auto; margin-right: auto; }
.woocommerce-checkout #payment .place-order {
  display: flex; gap: 12px; align-items: center; justify-content: flex-end;
}
.woocommerce-checkout a.button.wc-backward { margin-right: 12px !important; }

/* ===== Quantity field – match dropdown look (product, cart, checkout) ===== */
.single-product form.cart .quantity .qty,
.woocommerce-cart .shop_table .quantity .qty,
.woocommerce-checkout .shop_table .quantity .qty,
.woocommerce .quantity .qty {
  appearance: textfield;
  -moz-appearance: textfield;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: var(--btx-radius, 12px);
  padding: 10px 12px;             /* same vertical padding as selects */
  line-height: 1.2;
  font-size: 16px;
  font-family: var(--header-footer-font, "Oswald", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif) !important;
  width: 80px !important;          /* override Woo default 3.631em */
  text-align: center;
}

/* Focus state to match selects */
.single-product form.cart .quantity .qty:focus,
.woocommerce-cart .shop_table .quantity .qty:focus,
.woocommerce-checkout .shop_table .quantity .qty:focus {
  outline: 2px solid var(--btx-accent, #ffc107);
  border-color: var(--btx-accent, #ffc107);
}

/* Hide default number spinners for a cleaner look (keeps keyboard/arrow keys) */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type="number"] { -moz-appearance: textfield; }

/* ===== Product page — force global site font (keep icons intact) ===== */
.single-product .site-main,
.single-product div.product,
.single-product div.product *:not(i[class*="fa"], .dashicons, .dashicons-before::before) {
  font-family: var(--header-footer-font, "Oswald", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif) !important;
}

/* Title, price, tabs, form labels—belt & suspenders */
.single-product h1.product_title,
.single-product .price,
.single-product .woocommerce-Price-amount,
.single-product .woocommerce-variation-price,
.single-product .woocommerce-tabs,
.single-product .entry-summary,
.single-product form.cart label,
.single-product .variations label {
  font-family: var(--header-footer-font, "Oswald", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif) !important;
}

/* ===== Checkout layout + buttons ===== */

/* Center the checkout content in the viewing area */
.woocommerce-checkout .woocommerce {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px;
}

/* Use global font on checkout (keeps icons intact) */
.woocommerce-checkout,
.woocommerce-checkout *:not(i[class*="fa"], .dashicons, .dashicons-before::before) {
  font-family: var(--header-footer-font, "Oswald", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif) !important;
}

/* Bottom buttons: apply global button style + spacing */
.woocommerce-checkout #place_order,
.woocommerce-checkout a.button.wc-backward {
  background: var(--btx-accent, #ffc107) !important;
  color: var(--btx-accent-text, #111) !important;
  border: 0 !important;
  border-radius: var(--btx-radius, 12px) !important;
  padding: 12px 18px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 0 rgba(0,0,0,.08);
  transition: transform .12s ease, filter .12s ease;
}
.woocommerce-checkout #place_order:hover,
.woocommerce-checkout a.button.wc-backward:hover {
  filter: brightness(0.95);
  transform: translateY(-1px);
}

/* Put space between "Return to cart" and "Place order" */
.woocommerce-checkout #payment .place-order {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 14px; /* controls spacing between the two buttons */
}

/* Optional: ensure the cart/checkout tables don't stretch too wide */
.woocommerce-checkout .shop_table {
  border-radius: 10px;
  overflow: hidden;
}

/* === Checkout: center content (classic + blocks) === */
body.woocommerce-checkout .entry-content > .woocommerce,
body.woocommerce-checkout .site-main .woocommerce,
body.woocommerce-checkout .wc-block-checkout {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 20px !important;
}

/* === Global button look on checkout (classic) === */
body.woocommerce-checkout a.button,
body.woocommerce-checkout button.button,
body.woocommerce-checkout input.button,
body.woocommerce-checkout #place_order {
  background: var(--btx-accent, #ffc107) !important;
  color: var(--btx-accent-text, #111) !important;
  border: 0 !important;
  border-radius: var(--btx-radius, 12px) !important;
  padding: 12px 18px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 0 rgba(0,0,0,.08);
  transition: transform .12s ease, filter .12s ease;
}
body.woocommerce-checkout a.button:hover,
body.woocommerce-checkout button.button:hover,
body.woocommerce-checkout input.button:hover,
body.woocommerce-checkout #place_order:hover {
  filter: brightness(0.95);
  transform: translateY(-1px);
}

/* === Space between "Return to cart" and "Place order" (classic) === */
body.woocommerce-checkout .place-order {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 16px !important;              /* <-- spacing between the two buttons */
}
body.woocommerce-checkout a.button.wc-backward { margin-right: 0 !important; }

/* === Woo Blocks checkout equivalents === */
.wc-block-checkout__actions,
.wc-block-components-checkout-place-order-button {
  display: flex !important;
  gap: 16px !important;
  justify-content: flex-end !important;
}
.wc-block-components-button__button,
.wc-block-components-checkout-place-order-button .components-button {
  background: var(--btx-accent, #ffc107) !important;
  color: var(--btx-accent-text, #111) !important;
  border-radius: var(--btx-radius, 12px) !important;
  padding: 12px 18px !important;
  font-weight: 600 !important;
  border: 0 !important;
}
.wc-block-components-button__button:hover,
.wc-block-components-checkout-place-order-button .components-button:hover {
  filter: brightness(0.95);
  transform: translateY(-1px);
}

/* (Optional) center the Cart page container similarly */
body.woocommerce-cart .entry-content > .woocommerce,
body.woocommerce-cart .site-main .woocommerce,
body.woocommerce-cart .wc-block-cart {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 20px !important;
}
/* === CHECKOUT — center content, global buttons, spacing (max specificity) === */

/* Center wrapper (classic templates) */
body.woocommerce-checkout .entry-content > .woocommerce,
body.woocommerce-checkout .site-main > .woocommerce,
body.woocommerce-checkout .content-area > .woocommerce,
body.woocommerce-checkout .woocommerce,
body.woocommerce-cart .woocommerce {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
  float: none !important;
}

/* Center wrapper (Woo Blocks checkout) */
body.woocommerce-checkout .wc-block-checkout,
body.woocommerce-cart .wc-block-cart {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
}

/* Apply global button look on checkout (classic) */
body.woocommerce-checkout a.button,
body.woocommerce-checkout button.button,
body.woocommerce-checkout input.button,
body.woocommerce-checkout #place_order {
  background: var(--btx-accent, #ffc107) !important;
  color: var(--btx-accent-text, #111) !important;
  border: 0 !important;
  border-radius: var(--btx-radius, 12px) !important;
  padding: 12px 18px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 0 rgba(0,0,0,.08);
  transition: transform .12s ease, filter .12s ease;
}
body.woocommerce-checkout a.button:hover,
body.woocommerce-checkout button.button:hover,
body.woocommerce-checkout input.button:hover,
body.woocommerce-checkout #place_order:hover {
  filter: brightness(0.95);
  transform: translateY(-1px);
}

/* Space between Return-to-cart and Place-order (classic) */
body.woocommerce-checkout #payment .place-order {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 18px !important;  /* <-- adjust spacing here */
}
body.woocommerce-checkout a.button.wc-backward { margin-right: 0 !important; }

/* Woo Blocks equivalents */
.wc-block-checkout__actions,
.wc-block-components-checkout-place-order-button {
  display: flex !important;
  gap: 18px !important;
  justify-content: flex-end !important;
}
.wc-block-components-button__button,
.wc-block-components-checkout-place-order-button .components-button {
  background: var(--btx-accent, #ffc107) !important;
  color: var(--btx-accent-text, #111) !important;
  border-radius: var(--btx-radius, 12px) !important;
  padding: 12px 18px !important;
  font-weight: 600 !important;
  border: 0 !important;
}
.wc-block-components-button__button:hover,
.wc-block-components-checkout-place-order-button .components-button:hover {
  filter: brightness(0.95);
  transform: translateY(-1px);
}

/* === Woo Blocks Checkout — center content, style buttons, add spacing === */

/* Center the whole Blocks checkout area */
body.woocommerce-checkout .wp-block-woocommerce-checkout,
body.woocommerce-checkout .wc-block-checkout,
body.woocommerce-checkout .wc-block-components-sidebar-layout,
body.woocommerce-checkout .wc-block-components-main,
body.woocommerce-checkout form.wc-block-components-form {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
}

/* Global button look for Blocks (Place order + Return to cart) */
body.woocommerce-checkout .wc-block-checkout .wp-element-button,
body.woocommerce-checkout .wc-block-checkout button.components-button,
body.woocommerce-checkout .wc-block-checkout .wc-block-components-button__button,
body.woocommerce-checkout [data-block-name="woocommerce/checkout"] .wp-element-button,
body.woocommerce-checkout [data-block-name="woocommerce/checkout"] button.components-button,
body.woocommerce-checkout .components-button.is-primary {
  background: var(--btx-accent, #ffc107) !important;
  color: var(--btx-accent-text, #111) !important;
  border: 0 !important;
  border-radius: var(--btx-radius, 12px) !important;
  padding: 12px 18px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 0 rgba(0,0,0,.08);
  transition: transform .12s ease, filter .12s ease;
}
body.woocommerce-checkout .wc-block-checkout .wp-element-button:hover,
body.woocommerce-checkout .wc-block-checkout button.components-button:hover,
body.woocommerce-checkout .wc-block-checkout .wc-block-components-button__button:hover,
body.woocommerce-checkout [data-block-name="woocommerce/checkout"] .wp-element-button:hover,
body.woocommerce-checkout [data-block-name="woocommerce/checkout"] button.components-button:hover,
body.woocommerce-checkout .components-button.is-primary:hover {
  filter: brightness(0.95);
  transform: translateY(-1px);
}

/* Put space between Return-to-cart and Place order (Blocks containers) */
body.woocommerce-checkout .wc-block-checkout__actions,
body.woocommerce-checkout .wc-block-components-checkout-place-order-button,
body.woocommerce-checkout .wp-block-woocommerce-checkout-place-order-block {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 18px !important;  /* adjust spacing here */
}

/* ===== Mobile shop grid: 1 column, full width, centered ===== */
@media (max-width: 767px) {
  /* Force a single-column grid */
  .woocommerce ul.products {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    padding-left: 12px;
    padding-right: 12px;
  }

  /* Each product fills the width + centered content */
  .woocommerce ul.products li.product {
    width: 100% !important;
    margin: 0 auto !important;
    float: none !important;            /* kill older float layouts */
    text-align: center !important;
  }

  /* Media box takes full width (override any max-width caps) */
  .woocommerce ul.products li.product .btx-card-media {
    width: 100% !important;
    max-width: 100% !important;        /* override desktop limit */
    margin-left: auto; 
    margin-right: auto;
  }

  /* If your theme uses the default Woo image wrapper instead of .btx-card-media */
  .woocommerce ul.products li.product .woocommerce-LoopProduct-link img {
    width: 100% !important;
    height: auto !important;
    display: block;
    margin: 0 auto;
  }

  /* Slightly larger text on mobile so cards feel “bigger” */
  .btx-card-title { font-size: 1.2rem !important; }
  .btx-card-price { font-size: 1.05rem !important; }
}

/* Logo sizing */
.site-logo .custom-logo { width:100px; height:auto; }
.site-logo .custom-logo-link { display:inline-block; line-height:0; }