/* ==========================================================================
   WooCommerce layout CSS — applies to all WooCommerce pages (shop, product,
   cart, checkout, account, orders).

   Restores the design styling that Thrive's base theme.css + per-layout
   template CSS provided on the live site. The shop archive/product design
   rules live in shop-archive.css / single-product.css (scoped to
   .tve-theme-120 / .tve-theme-121); this file covers the shared
   WooCommerce elements: sidebar widget titles, filter checkboxes, forms,
   buttons, and account navigation.
   ========================================================================== */

/* --- Sidebar widget titles (serif italic, matching theme) --- */
.tve-theme-120 .sidebar-section .widget .widget-title,
.tve-theme-120 .sidebar-section .widget-title,
.tve-theme-120 .sidebar-section h2.widget-title {
	font-family: "Cormorant Infant", serif;
	font-style: italic;
	font-weight: var(--g-regular-weight, 400);
	font-size: 34px;
	line-height: 1.1em;
	color: var(--tcb-skin-color-4);
	text-transform: none;
	letter-spacing: 0;
	padding: 0;
	margin: 0 0 20px;
}

/* --- Sidebar widgets container spacing --- */
.tve-theme-120 .sidebar-section .widget {
	margin: 0 0 40px;
}
.tve-theme-120 .sidebar-section .widget ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.tve-theme-120 .sidebar-section .widget ul li {
	padding: 0;
	margin: 0 0 8px;
	list-style: none;
}

/* --- Filter by Attributes / layered nav + filter-everything checkboxes --- */
/* Override filter-everything plugin's default 300px scrollable list —
   always show the full attribute list, no inner scrollbar. The plugin's
   cached CSS loads AFTER this stylesheet and also uses !important, so
   source order alone won't win; body class + repeated selector raises
   specificity high enough to beat it regardless of load order. */
body.tve-theme-120 .sidebar-section ul.wpc-filters-ul-list.wpc-filters-ul-list.wpc-filters-ul-list.wpc-filters-ul-list.wpc-filters-ul-list.wpc-filters-ul-list.wpc-filters-ul-list.wpc-filters-ul-list.wpc-filters-ul-list.wpc-filters-ul-list {
	max-height: none !important;
	overflow-y: visible !important;
	overflow: visible !important;
}

.tve-theme-120 .sidebar-section .woocommerce-widget-layered-nav-list,
.tve-theme-120 .sidebar-section .wpc-filters-main-wrap ul.wpc-filters-labels {
	list-style: none;
	padding: 0;
	margin: 0;
}
.tve-theme-120 .sidebar-section .woocommerce-widget-layered-nav-list__item,
.tve-theme-120 .sidebar-section .wpc-filters-main-wrap li.wpc-term-item {
	margin: 0 0 10px;
}
.tve-theme-120 .sidebar-section .woocommerce-widget-layered-nav-list__item a,
.tve-theme-120 .sidebar-section .wpc-filters-main-wrap li.wpc-term-item a {
	color: var(--tcb-skin-color-4);
	font-family: "Muli", sans-serif;
	font-size: 16px;
	text-decoration: none;
	transition: opacity .15s;
}
.tve-theme-120 .sidebar-section .woocommerce-widget-layered-nav-list__item a:hover,
.tve-theme-120 .sidebar-section .wpc-filters-main-wrap li.wpc-term-item a:hover {
	opacity: .6;
}
/* Count badge */
.tve-theme-120 .sidebar-section .count,
.tve-theme-120 .sidebar-section .wpc-term-count {
	color: var(--tcb-skin-color-5);
	font-family: "Muli", sans-serif;
	font-size: 14px;
}
/* Custom checkbox: square, thin border, accent fill when checked */
.tve-theme-120 .sidebar-section .wpc-filters-main-wrap li.wpc-term-item input[type="checkbox"] {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 16px;
	height: 16px;
	border: 1px solid var(--tcb-skin-color-5);
	background-color: #fff;
	cursor: pointer;
	margin: 0 8px 0 0;
	vertical-align: middle;
	position: relative;
	top: -1px;
}
.tve-theme-120 .sidebar-section .wpc-filters-main-wrap li.wpc-term-item input[type="checkbox"]:checked {
	background-color: var(--tcb-skin-color-0);
	border-color: var(--tcb-skin-color-0);
}
.tve-theme-120 .sidebar-section .wpc-filters-main-wrap li.wpc-term-item input[type="checkbox"]:checked::after {
	content: "";
	position: absolute;
	left: 4px;
	top: 1px;
	width: 5px;
	height: 9px;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

/* --- Sidebar product list widget (Stock Clearance / Products) --- */
.tve-theme-120 .sidebar-section ul.product_list_widget li {
	display: flex;
	align-items: flex-start;
	margin-bottom: 20px;
}
.tve-theme-120 .sidebar-section ul.product_list_widget li a {
	display: block;
	color: var(--tcb-skin-color-4);
	font-family: "Muli", sans-serif;
	font-size: 14px;
	line-height: 1.4;
	text-decoration: none;
}
.tve-theme-120 .sidebar-section ul.product_list_widget li img {
	width: 55px;
	height: 55px;
	object-fit: cover;
	margin-right: 12px;
}
.tve-theme-120 .sidebar-section ul.product_list_widget li .amount {
	color: var(--tcb-skin-color-0);
	font-weight: 600;
}

/* --- Account navigation tabs --- */
.tve-theme-120 .woocommerce-MyAccount-navigation {
	float: left;
	width: 25%;
	padding-right: 40px;
	box-sizing: border-box;
}
.tve-theme-120 .woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.tve-theme-120 .woocommerce-MyAccount-navigation ul li {
	margin: 0 0 1px;
	list-style: none;
}
.tve-theme-120 .woocommerce-MyAccount-navigation ul li a {
	display: block;
	padding: 12px 0;
	color: var(--tcb-skin-color-4);
	font-family: "Cormorant Infant", serif;
	font-size: 20px;
	text-decoration: none;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	transition: opacity .15s;
}
.tve-theme-120 .woocommerce-MyAccount-navigation ul li a:hover {
	opacity: .6;
}
.tve-theme-120 .woocommerce-MyAccount-navigation ul li.is-active a {
	color: var(--tcb-skin-color-0);
	font-weight: 600;
}
.tve-theme-120 .woocommerce-MyAccount-content {
	float: right;
	width: 75%;
	box-sizing: border-box;
}

/* --- Forms: inputs, selects, buttons --- */
.tve-theme-120 .woocommerce form .form-row input.input-text,
.tve-theme-120 .woocommerce form .form-row textarea,
.tve-theme-120 .woocommerce form .form-row select,
.tve-theme-120 .woocommerce-Input,
.tve-theme-120 .woocommerce form input[type="text"],
.tve-theme-120 .woocommerce form input[type="email"],
.tve-theme-120 .woocommerce form input[type="password"],
.tve-theme-120 .woocommerce form input[type="tel"] {
	width: 100%;
	padding: 14px 16px;
	border: 1px solid rgba(151, 151, 151, 0.5);
	border-radius: 0;
	font-family: "Muli", sans-serif;
	font-size: 15px;
	color: var(--tcb-skin-color-4);
	background-color: #fff;
	box-sizing: border-box;
	transition: border-color .15s;
}
.tve-theme-120 .woocommerce form .form-row input.input-text:focus,
.tve-theme-120 .woocommerce form .form-row textarea:focus,
.tve-theme-120 .woocommerce form .form-row select:focus,
.tve-theme-120 .woocommerce form input:focus {
	border-color: var(--tcb-skin-color-0);
	outline: none;
}
.tve-theme-120 .woocommerce form .form-row label {
	font-family: "Muli", sans-serif;
	font-size: 14px;
	color: var(--tcb-skin-color-4);
	line-height: 1.8;
}

/* Buttons: uppercase, bordered, transparent bg (matches product "Select Options") */
.tve-theme-120 .woocommerce #respond input#submit,
.tve-theme-120 .woocommerce a.button,
.tve-theme-120 .woocommerce button.button,
.tve-theme-120 .woocommerce input.button,
.tve-theme-120 .woocommerce #payment #place_order,
.tve-theme-120 .woocommerce button[name="login"] {
	display: inline-block;
	font-family: "Muli", sans-serif;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--tcb-skin-color-23);
	background-color: transparent;
	border: 1px solid rgba(0, 0, 0, 0.55);
	border-radius: 0;
	padding: 14px 30px;
	line-height: 1.2;
	cursor: pointer;
	transition: color .15s, border-color .15s, background-color .15s;
}
.tve-theme-120 .woocommerce #respond input#submit:hover,
.tve-theme-120 .woocommerce a.button:hover,
.tve-theme-120 .woocommerce button.button:hover,
.tve-theme-120 .woocommerce input.button:hover,
.tve-theme-120 .woocommerce #payment #place_order:hover {
	color: var(--tcb-skin-color-16);
	border-color: var(--tcb-skin-color-0);
	background-color: transparent;
}
/* Primary/alt buttons (Add to cart, Place order) */
.tve-theme-120 .woocommerce a.button.alt,
.tve-theme-120 .woocommerce button.button.alt,
.tve-theme-120 .woocommerce #respond input#submit.alt,
.tve-theme-120 .woocommerce input.button.alt {
	background-color: var(--tcb-skin-color-0);
	color: #fff;
	border-color: var(--tcb-skin-color-0);
}
.tve-theme-120 .woocommerce a.button.alt:hover,
.tve-theme-120 .woocommerce button.button.alt:hover {
	background-color: var(--tcb-skin-color-16);
	border-color: var(--tcb-skin-color-16);
	color: #fff;
}

/* Account login/register submit button — full width, no stacking */
.tve-theme-120 .woocommerce form.login button[name="login"],
.tve-theme-120 .woocommerce form.register button[name="register"] {
	width: 100%;
	display: block;
	white-space: nowrap;
	text-align: center;
	margin-top: 20px;
}

/* --- Account login/register forms --- */
.tve-theme-120 .woocommerce form.login,
.tve-theme-120 .woocommerce form.register {
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 0;
	padding: 40px;
	max-width: 520px;
	margin: 0 auto;
}
.tve-theme-120 .woocommerce form.login h2,
.tve-theme-120 .woocommerce form.register h2 {
	font-family: "Cormorant Infant", serif;
	font-size: 34px;
	color: var(--tcb-skin-color-4);
	margin: 0 0 20px;
}
.tve-theme-120 .woocommerce form .woocommerce-form-login__rememberme,
.tve-theme-120 .woocommerce form .woocommerce-form-register__rememberme {
	display: flex;
	align-items: center;
}
.tve-theme-120 .woocommerce form .woocommerce-form-login__rememberme input,
.tve-theme-120 .woocommerce form .woocommerce-form-register__rememberme input {
	margin-right: 8px;
}
.tve-theme-120 .woocommerce-LostPassword a {
	color: var(--tcb-skin-color-0);
	text-decoration: underline;
}

/* --- Tables (cart, order details) --- */
.tve-theme-120 .woocommerce table.shop_table {
	border: none;
	border-radius: 0;
	font-family: "Muli", sans-serif;
}
.tve-theme-120 .woocommerce table.shop_table th,
.tve-theme-120 .woocommerce table.shop_table td {
	border: none;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
	padding: 14px 0;
}
.tve-theme-120 .woocommerce table.shop_table th {
	font-family: "Cormorant Infant", serif;
	font-size: 18px;
	color: var(--tcb-skin-color-4);
	text-transform: none;
	letter-spacing: 0;
}

/* --- Notices --- */
.tve-theme-120 .woocommerce-message,
.tve-theme-120 .woocommerce-info,
.tve-theme-120 .woocommerce-error {
	background-color: transparent;
	border-top: 2px solid var(--tcb-skin-color-0);
	font-family: "Muli", sans-serif;
}
.tve-theme-120 .woocommerce-message::before,
.tve-theme-120 .woocommerce-info::before,
.tve-theme-120 .woocommerce-error::before {
	color: var(--tcb-skin-color-0);
}

/* --- Responsive --- */
@media (max-width: 768px) {
	.tve-theme-120 .woocommerce-MyAccount-navigation,
	.tve-theme-120 .woocommerce-MyAccount-content {
		float: none;
		width: 100%;
		padding-right: 0;
	}
	.tve-theme-120 .woocommerce form.login,
	.tve-theme-120 .woocommerce form.register {
		padding: 24px;
	}
}

/* --- Checkout: fix Sender.net "Register to our new stock update email
   notifications" checkbox overlapping its own label text --- */
/*
 * The Sender.net plugin (Sender_Carts.php::senderAddNewsletterCheck) renders
 * this checkbox via woocommerce_form_field() with raw text as a sibling node
 * instead of wrapping the label text in a <span> the way WooCommerce's own
 * checkbox fields do (e.g. "Ship to a different address?"). The theme's
 * checkout CSS (css/theme/woocommerce.css) has a rule:
 *   .woocommerce-checkout .woocommerce-form__label-for-checkbox
 *     input[type="checkbox"] ~ span:not(.required) { padding-left: 35px; }
 * That rule only pads a <span> sibling — with no <span> wrapping the label
 * text, nothing gets the 35px left padding, so the absolutely-positioned
 * checkbox (which stretches to the label's full width because it has no
 * explicit width) overlaps "Register to our new stock..." directly.
 *
 * Fix: give the checkbox an explicit small square size + fixed left
 * position, and pad the label itself so the text always starts clear of it.
 * Scoped narrowly to this specific field via its name attribute so it can't
 * affect any other checkbox on the site.
 */
.woocommerce-checkout label:has(input[name="sender_newsletter"]) {
	position: relative;
	padding-left: 26px;
	display: block;
}
.woocommerce-checkout input[type="checkbox"][name="sender_newsletter"] {
	position: absolute;
	left: 0;
	top: 2px;
	width: 18px;
	height: 18px;
	opacity: 1;
	margin: 0;
}

/* --- My Account: fix chevron/arrow overlapping nav link text --- */
/*
 * WooCommerce's own theme.css draws a left-pointing chevron as a background
 * image on the active/hovered nav link, positioned at `left: 19px`, and
 * reserves space for it via `padding: 0 20px 0 45px` on
 * `.woocommerce-account .woocommerce-MyAccount-navigation a`.
 *
 * This theme's own account-nav rule (.tve-theme-120 ... ul li a) resets that
 * to `padding: 12px 0`, wiping out the left padding. With no left padding,
 * the link text starts flush against the left edge — exactly where the
 * chevron renders — so the icon sits on top of the first letter(s) of the
 * label (e.g. "Dashboard", "Orders").
 *
 * Fix: keep this theme's font/border-bottom styling, but restore left
 * padding wide enough to clear the chevron, and give it a fixed vertical
 * rhythm (line-height) so text stays vertically centered no matter how the
 * surrounding two-column layout is sized. Scoped to the account nav only.
 */
/*
 * !important is required here too: style.css has a higher-specificity rule
 * (.sv-woocommerce-page .woocommerce-account .woocommerce-MyAccount-navigation
 * li a — 3 classes) that resets padding to "12px 16px" with no room for the
 * chevron, and wins on specificity alone regardless of source order.
 */
.tve-theme-120 .woocommerce-MyAccount-navigation ul li a {
	padding: 12px 20px 12px 45px !important;
	line-height: 1.4;
}
/*
 * !important is required below: the theme also bundles a *duplicate mirror*
 * of WooCommerce core's own woocommerce-layout.css at
 * css/plugins/woocommerce/woocommerce-layout.css, enqueued AFTER this file.
 * That copy has un-scoped rules — e.g.
 *   .woocommerce-account .woocommerce-MyAccount-navigation { float:left; width:30%; }
 * — with the SAME specificity (two classes) as our .tve-theme-120-prefixed
 * rules below, so it was winning purely on load order and silently
 * reverting the account nav/content back to fluid percentage widths. Forcing
 * these specific layout properties with !important guarantees this fix
 * holds regardless of what else loads after it.
 */
/* Desktop: fixed, generously spaced two-column layout (nav + content) */
@media (min-width: 769px) {
	.tve-theme-120 .woocommerce-MyAccount-navigation {
		float: left !important;
		width: 260px !important;
		max-width: 260px !important;
		padding-right: 40px !important;
	}
	.tve-theme-120 .woocommerce-MyAccount-content {
		float: right !important;
		width: calc(100% - 260px) !important;
	}
}
/* Mobile (<=768px): stack nav above content, full width, same chevron fix */
@media (max-width: 768px) {
	.tve-theme-120 .woocommerce-MyAccount-navigation,
	.tve-theme-120 .woocommerce-MyAccount-content {
		float: none !important;
		width: 100% !important;
		max-width: 100% !important;
		padding-right: 0 !important;
	}
	.tve-theme-120 .woocommerce-MyAccount-navigation ul li a {
		padding: 14px 20px 14px 45px !important;
	}
}

/* --- My Account > Orders: keep the order number visible on mobile --- */
/*
 * woocommerce-smallscreen.css blanket-hides every <th> inside
 * table.shop_table_responsive on screens <=768px:
 *   .woocommerce table.shop_table_responsive tbody th { display: none; }
 * WooCommerce renders the Orders table's "Order" column as a <th
 * scope="row"> (not a <td> like the other columns), so that rule removes
 * the order number specifically on mobile while Date/Status/Total survive
 * (they're <td>s). Re-show it, matching the same responsive "label: value"
 * row layout the other cells get from ::before { content: attr(data-title) }.
 */
@media (max-width: 768px) {
	.woocommerce table.my_account_orders.shop_table_responsive tbody th,
	.woocommerce-page table.my_account_orders.shop_table_responsive tbody th {
		display: block !important;
		text-align: right;
	}
	.woocommerce table.my_account_orders.shop_table_responsive tbody th::before,
	.woocommerce-page table.my_account_orders.shop_table_responsive tbody th::before {
		content: attr(data-title) ": ";
		font-weight: 700;
		float: left;
	}
}