/* Themify Customize Styling */
body {	
	background-repeat: repeat; 
}
#sidebar {	background-attachment: fixed;margin: auto; 
}
#headerwrap {	background: none;
	background-color: rgba(240,243,245,0.45);
	background-size: cover; 
}
#site-description {	display: none; 
}

/* Themify Custom CSS */
.boxed.products .product.product_cat-the-woman{
	background-color:#6D8D80;
}
.boxed.products .product.product_cat-keen-nature{
	background-color:#696D78;
}
.boxed.products .product.product_cat-baker-street{
	background-color:#E0DCD9;
}
div.product-content{
	background-color:#ffffff;
}
.body-overlay {
    z-index: 998;
}
body {
  /* This color creates the rich, warm vintage lookbook paper background tone */
  background-color: #f0f2f5; 
  
  /*The tiny texture image overlays perfectly on top of the warm color */
  background-image: url("https://moriarty.store/wp-content/uploads/2026/09/moriarty_tiny_gold_texture.webp");
  background-repeat: repeat;
  background-attachment: scroll;
}
/* Creates a sunken, hollow "pressed button" look for the main product image container */
.single-product .woocommerce-product-gallery, 
.single-product .product-images, 
.product-single__media-group {
    border: 1px solid #d1d1d1;    /* Subtle outer border line */
box-sizing: border-box;
    background-color: transparent;    /* Slightly darker background inside the hollow */
    padding: 15px;                /* Space inside the border wrapper */
    border-radius: 4px;                      /* Smooth corners */
    
    /* The key trick: Inner shadows that simulate recess and depth */
    box-shadow: inset 3px 3px 8px rgba(0, 0, 0, 0.2), 
                inset -3px -3px 8px rgba(255, 255, 255, 0.8);
}

/* Adjusts the actual image inside the hollow so it looks smaller and sitting inside */
.single-product .woocommerce-product-gallery img,
.single-product .product-images img {
    transform: scale(0.96);                  /* Scales image down slightly to reinforce depth */
    transition: transform 0.2s ease;
}
/* 1. Remove the theme's default white background from the skin container element */
.archive ul.products li.product .product-v2,.woocommerce .upsells.products li.product,
.product-category ul.products li.product .product-v2 {
    background: transparent;
    background-color: transparent;
    border: none;
    box-shadow: none;
}

/* 2. Wrap the entire card (Image + Info + Button) in a sunken, hollow frame */
.archive ul.products li.product,
.woocommerce .upsells.products li.product, 
.product-category ul.products li.product  {
    box-sizing: border-box;
    border: 1px solid #c8c8c8;
    padding: 16px;
    border-radius: 8px;
    
    /* Inset shadow configuration applied to the entire outer list box */
    box-shadow: inset 5px 5px 12px rgba(0, 0, 0, 0.08), 
                inset -5px -5px 12px rgba(255, 255, 255, 0.9);
}

/* 3. Clean up the internal layout blocks so they don't break the column width spacing */
.archive ul.products li.product figure[data-product-slider], 
.product-category ul.products li.product figure[data-product-slider] {
    margin-bottom: 12px;
    background: transparent;
    border: none;
    box-shadow: none;
}
/* 1. Force the grid row container to stretch all items in the same row to match the tallest one */
.archive ul.products,
.product-category ul.products, .woocommerce ul.products,
.product-category ul.products {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch; /* Crucial: stretches all card elements to equal row height */
}

/* 2. Configure the product card to adapt to its row height and use a column stack layout */
.archive ul.products li.product, .woocommerce .upsells.products ul.products .product, 
.product-category ul.products li.product {
    display: flex;
    flex-direction: column;
    height: auto; /* Lets the height be governed uniformly by the flex row wrapper */
}

/* 3. Make the internal structure expand to fill up any blank whitespace on shorter titles */
.archive ul.products li.product .product-v2,
.woocommerce .upsells.product ul.products .product,
.product-category ul.products li.product .product-v2 {
    display: flex;
    flex-direction: column;
    flex-grow: 1; /* Pushes the card content to fill the bottom of the card frame */
    height: 100%;
}

/* 4. Target the text container and force the action buttons to snap straight to the floor */
.archive ul.products li.product .product-content,
.woocommerce .upsells.products ul.products .product .product-content,
.product-category ul.products li.product .product-content {
    display: flex;
    flex-direction: column;
    flex-grow: 1; /* Pushes text fields apart so button areas line up horizontally */
}

.archive ul.products li.product .product-buttons,
.product-category ul.products li.product .product-buttons,
.archive ul.products li.product .add_to_cart_inline {
    margin-top: auto; /* Moves the button block down to align identically along the bottom edge */
    padding-top: 14px; /* Adds clean spacing beneath your pricing metrics */
}
/*CART! CART! CART!*/
/* Reset Select2 dropdown internal padding to prevent misalignment */
.select2-container .select2-selection--single
{
   height: auto;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: normal;

}