/*
Theme Name: Salient Child Theme
Description: This is a custom child theme for Salient
Theme URI:   https://themeforest.net/item/salient-responsive-multipurpose-theme/4363266
Author: ThemeNectar
Author URI:  https://themeforest.net/user/themenectar
Template: salient
Version: 1.0
*/


.woocommerce .woocommerce-ordering {
	display:none;
}

body[data-header-resize="0"] .container-wrap, body[data-header-resize="0"] .project-title {
    padding-top: 0px;
}

.full-width-content>.woocommerce-products-header .term-description {
    padding: 0 8px;
}

.woocommerce .full-width-content .page-title, .woocommerce .full-width-content .woocommerce-result-count, body .full-width-content .woocommerce-breadcrumb {
	padding-bottom:0px !important;
}

.row .woocommerce-products-header .term-description p {
	padding-bottom:8px !important;
	font-size: 16px;
    line-height: 1.1;
}

@media only screen and (min-width: 1000px) {
    .container, body[data-header-format="left-header"] .container, .woocommerce-tabs .full-width-content .tab-container, .nectar-recent-posts-slider .flickity-page-dots, .post-area.standard-minimal.full-width-content .post .inner-wrap, .material #search-outer #search {
        max-width: 100% !important;
    }
	
	.main-content {
		padding-left:8px;
		padding-right:8px;
	}
}

.row .col h3, .row .col h4 {
    margin-bottom: 4px !important;
}

/* Hide default theme summary/right column output on desktop */
.single-product-summary {
    display: none !important;
  }

.woocommerce-Price-amount {
    color: black;
}

.single-product div.product h1.product_title, .nectar-shop-header .page-title {
    font-size: 30px !important;
    line-height: 30px !important;
}

.woocommerce div.product form.cart .variations select {
	border:solid 1px black;
}


.woocommerce-page button[type=submit].single_add_to_cart_button, body[data-form-submit=regular].woocommerce-page .container-wrap button[type=submit].single_add_to_cart_button {
    font-size: 16px;
    padding: 15px 25px !important;
	margin-top: 10px;
}

.product_meta {
	display:none;
}

.woocommerce div.product form.cart .variations td, .woocommerce div.product form.cart .variations th {
    display: block;
    line-height: 1;
    padding-left: 0;
    padding-bottom: 0px;
    margin-top: 5px;
}

.woocommerce .variations, .woocommerce div.product form.cart .variations {
	margin-bottom:0px;
}

.pg-toc li {
	list-style:none;
}

.product-image img {
	margin-bottom:0px !important;
}

.nectar-social {
	display:none;
}
/* SICK7 — Single Product Flex Layout (delayed-sticky left, fixed center, zoom overlap) */
/*
  SICK7 — Single Product Flex Layout
  Left column = fully sticky (like right), scrolls internally
  Center gallery can expand over left; right TOC stays put.
*/

/* --- Global sticky safety --- */
body.single-product{
  overflow-x: clip;
  overflow-y: visible !important;
}
#ajax-content-wrap,
.container-wrap,
.container,
.main-content,
.row,
.nectar-prod-wrap,
.single-product-main-image,
.single-product div.product,
.row .wpb_column,
.row .col{
  overflow: visible !important;
  transform: none !important;
}

/* Make Salient image area full-width so our flex owns the row */
.single-product .nectar-prod-wrap > .span_5.col.single-product-main-image{
  width: 100% !important;
  float: none !important;
  clear: both !important;
  margin: 0 !important;
}

/* Hide theme summary (we render left column ourselves) */
.single-product .single-product-summary{ display:none !important; }

/* --- Vars --- */
:root{
  --pg-sticky-top: 96px;   /* JS updates this based on admin bar + header */
  --left-w:   550px;
  --center-w: 550px;       /* your working value */
  --right-w:  220px;
  --pg-gap: 0px;
  --pg-gap-sm: 6px;
  --pg-toc-size: 12px;:root;
  --mobile-container-width: 100%;

}

/* --- Flex wrapper --- */
.pg-layout{
  display:flex;
  align-items:flex-start;
  gap: var(--pg-gap);
  isolation:isolate; /* allow expanded gallery to layer above left */
}

/* Fixed column widths */
.pg-left  { width: var(--left-w);  position: sticky; top: var(--pg-sticky-top); z-index: 2;
            max-height: calc(100vh - var(--pg-sticky-top)); overflow: unset; padding-right:8px; }
.pg-center{ width: var(--center-w); position: relative; z-index: 1; }
.pg-right { width: var(--right-w);  position: sticky; top: var(--pg-sticky-top); z-index: 2;
            max-height: calc(100vh - var(--pg-sticky-top)); overflow: auto; padding-left:8px; }

.pg-left, .pg-center, .pg-right{ flex:0 0 auto; min-width:0; }

/* The card itself is no longer sticky—left column is */
.pg-card--sticky{ position: static; top:auto; }

/* Description sits under the card (HTML order already correct) */
.pg-details{ margin-top: var(--pg-gap); }
.pg-details .pg-h{ margin:16px 0 8px; font-size:16px; line-height:1.2; }
.pg-details .pg-prose p{ margin:0 0 8px; }

/* Mobile-only first image above card */
.pg-first-left{ display:none; margin-bottom: var(--pg-gap-sm); }

/* --- Gallery --- */
.product-images-container .product-image{ margin-bottom: var(--pg-gap-sm); }
.product-image{ scroll-margin-top: calc(var(--pg-sticky-top) + 12px); }
.product-image .product-image__anchor{ display:block; height:1px; margin-top:-1px; }

.pg-img{
  display:block;
  height:auto;
  max-height:90vh;       /* normal state */
  width:auto;
  max-width:100%;
  cursor: zoom-in;
}

/* Expand: image overlaps left but right column never moves */
.pg-center.pg-center--expanded{ z-index: 3; } /* above the sticky left (z=2) */
.pg-center.pg-center--expanded .pg-img{
  max-height:none;
  height:auto;
  width: calc(var(--left-w) + var(--center-w));
  max-width:none;
  position: relative;
  left: calc(-1 * var(--left-w)); /* visually cover the left column */
  cursor: zoom-out;
}

/* --- TOC --- */
.pg-toc{ list-style:none; margin:0; padding:0; }
.pg-toc li{ margin:0 0 6px; }
.pg-toc a{
  text-decoration:none;
  font-size: var(--pg-toc-size);
  line-height:1.25;
  display:inline-block;
}
.pg-toc a.is-active,
.pg-toc a[aria-current="true"]{ text-decoration: underline; }
.pg-toc a:focus{ outline:2px solid currentColor; outline-offset:2px; }

/* --- Woo polish --- */
.single-product div.product h1.product_title{ margin-bottom:10px; }
.single-product .quantity{ margin-right:8px; }

/* --- Responsive --- */
@media (max-width: 1400px){
  :root{ --center-w: 400px; }
}
@media (max-width: 1280px){
  :root{ --left-w: 380px; --center-w: 380px; --right-w: 210px; }
}
@media (max-width: 1180px){
  :root{ --left-w: 360px; --center-w: 360px; --right-w: 200px; }
}
@media (max-width: 1050px){
  :root{ --left-w: 340px; --center-w: 340px; --right-w: 200px; }
}

/* ---------- MOBILE: keep right rail as a slim slider ---------- */
@media (max-width: 999px){
   .container {
   	padding:0 8px;
   }
  /* Stack content, but reserve a little gutter so the rail doesn’t overlap text */
  .pg-layout{
    display:block;
    padding-right:10px; /* space for the rail */
  }
	.woocommerce-ordering {
		display:none;
	}
  /* Left & center behave like normal stacked content */
  .pg-left, .pg-center{
    width: 100%;
    max-height: none;
    overflow: visible;
    position: static;
  }

  /* Keep your “first image above card” behavior */
  .pg-first-left{ display:block; }

  /* Show the right column as a fixed vertical rail on the edge */
  .pg-right{
    display:block;                 /* was none; now visible on mobile */
    position: fixed;
    right: 8px;
    top: calc(var(--pg-sticky-top));
    width: 20px;                   /* skinny rail */
    height: calc(100vh - var(--pg-sticky-top) - 16px);
    overflow: auto;
    z-index: 5;                    /* above content */
    -webkit-overflow-scrolling: touch;
  }

  /* Vertical bar list */
  .pg-right .pg-toc{
    display:flex;
    flex-direction: column;
    align-items: center;
    gap: 0px;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  /* Each link becomes a tappable bar; hide the text visually */
  .pg-right .pg-toc a{
    display:block;
	width: 13px;
	height: 8px;
    background: rgba(0,0,0,.25);
    text-indent: -9999px;          /* visually hide labels */
    overflow: hidden;
    outline: none;
    touch-action: manipulation;
  }

  /* Active image indicator (darker/thicker) */
  .pg-right .pg-toc a.is-active,
  .pg-right .pg-toc a[aria-current="true"]{
    background: rgba(0,0,0,.85);
    width: 13px;
	height:10px;
  }

  /* Optional: larger touch target for comfort */
  .pg-right .pg-toc li{ padding:0 0 4px 0; margin:0; }

  /* Expanded image on mobile: just fill viewport width (no left overlap) */
  .pg-center.pg-center--expanded .pg-img{
    left: 0;
    width: 100%;
    max-width: 100%;
    max-height: none;
  }
	
	.pg-center .product-image:first-child{
		display: none;
	}
	.pg-right .pg-toc li:first-child{
		display: none;
	}
}


/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .pg-img{ transition:none; }
}