/* =========================================================================
   Pawmily — WooCommerce
   ========================================================================= */

.pw-shop-wrap { padding-block: var(--pw-8) var(--pw-section); }

/* -------------------------------------------------------------------------
   Avisos del plugin
   ------------------------------------------------------------------------- */

.woocommerce-notices-wrapper:empty { display: none; }

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--pw-3);
	margin: 0 0 var(--pw-6);
	padding: var(--pw-4) var(--pw-5);
	background: var(--pw-surface);
	border: 1px solid var(--pw-line);
	border-radius: var(--pw-r-md);
	list-style: none;
	font-size: var(--pw-text-sm);
	color: var(--pw-ink-deep);
}
.woocommerce-message { background: var(--pw-success-bg); border-color: #c3dcbb; color: #2f5c2b; }
.woocommerce-error   { background: var(--pw-danger-bg);  border-color: #eec4b8; color: #7d2f22; }
.woocommerce-error li { margin: 0; }

.woocommerce-message .button,
.woocommerce-info .button,
.pw-msg-link {
	margin-left: auto;
	font-weight: 700;
	white-space: nowrap;
}

/* -------------------------------------------------------------------------
   Catálogo
   ------------------------------------------------------------------------- */

.pw-shop-layout { display: grid; gap: var(--pw-8); align-items: start; }

@media (min-width: 1000px) {
	.pw-shop-layout { grid-template-columns: 250px minmax(0, 1fr); gap: var(--pw-10); }
}

/* Barra superior: recuento y orden */
.pw-shop-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--pw-3);
	margin-bottom: var(--pw-6);
	padding-bottom: var(--pw-4);
	border-bottom: 1px solid var(--pw-line);
}

.woocommerce-result-count {
	margin: 0;
	font-size: var(--pw-text-sm);
	color: var(--pw-ink-soft);
}

.woocommerce-ordering { margin: 0; }
.woocommerce-ordering select { min-height: 44px; font-size: var(--pw-text-sm); width: auto; }

/* Botón de filtros en móvil */
.pw-filters-toggle { display: inline-flex; }
@media (min-width: 1000px) { .pw-filters-toggle { display: none; } }

/* Columna de filtros */
.pw-filters { display: none; }
.pw-filters[data-open="true"] { display: block; }
@media (min-width: 1000px) { .pw-filters { display: block; } }

.pw-widget {
	padding: var(--pw-5);
	margin-bottom: var(--pw-4);
	background: var(--pw-surface);
	border: 1px solid var(--pw-line);
	border-radius: var(--pw-r-lg);
}
.pw-widget__title {
	margin: 0 0 var(--pw-3);
	font-size: var(--pw-text-base);
	font-weight: 600;
}
.pw-widget ul { list-style: none; margin: 0; padding: 0; }
.pw-widget li { margin-bottom: var(--pw-1); }
.pw-widget a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--pw-2);
	padding: var(--pw-2) var(--pw-3);
	border-radius: var(--pw-r-sm);
	color: var(--pw-ink);
	text-decoration: none;
	font-size: var(--pw-text-sm);
	transition: background-color var(--pw-fast) var(--pw-ease);
}
.pw-widget a:hover { background: var(--pw-bg); color: var(--pw-ink-deep); }
.pw-widget .count { color: var(--pw-ink-soft); font-size: var(--pw-text-xs); }
.pw-widget .current-cat > a { background: var(--pw-bg); font-weight: 700; color: var(--pw-ink-deep); }

/* Rejilla de WooCommerce: se sustituye por la del tema. */
ul.products {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--pw-4);
	margin: 0;
	padding: 0;
	list-style: none;
}
@media (min-width: 700px)  { ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--pw-5); } }
@media (min-width: 1000px) { ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--pw-6); } }
@media (min-width: 1200px) { ul.products { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

ul.products li.product { margin: 0; }

/* Sin barra lateral, cabe una columna más. */
.pw-no-sidebar ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 700px)  { .pw-no-sidebar ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .pw-no-sidebar ul.products { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* -------------------------------------------------------------------------
   Paginación
   ------------------------------------------------------------------------- */

.woocommerce-pagination, .pw-pagination {
	margin-top: var(--pw-10);
	display: flex;
	justify-content: center;
}
.woocommerce-pagination ul,
.pw-pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pw-2);
	list-style: none;
	margin: 0;
	padding: 0;
	border: 0;
}
.woocommerce-pagination li { margin: 0; border: 0; }

.woocommerce-pagination a, .woocommerce-pagination span,
.pw-pagination a, .pw-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--pw-2);
	min-width: 44px; height: 44px;
	padding: 0 var(--pw-3);
	background: var(--pw-surface);
	border: 1px solid var(--pw-line);
	border-radius: var(--pw-r-full);
	color: var(--pw-ink);
	font-family: var(--pw-font-display);
	font-weight: 600;
	text-decoration: none;
	transition: background-color var(--pw-fast) var(--pw-ease),
	            border-color var(--pw-fast) var(--pw-ease);
}
.woocommerce-pagination a:hover,
.pw-pagination a:hover { background: var(--pw-bg); border-color: var(--pw-ink-brand); color: var(--pw-ink-deep); }

.woocommerce-pagination .current,
.pw-pagination .current {
	background: var(--pw-ink-brand);
	border-color: var(--pw-ink-brand);
	color: var(--pw-surface);
}
.pw-pagination svg { width: 18px; height: 18px; }

/* -------------------------------------------------------------------------
   Ficha de producto
   ------------------------------------------------------------------------- */

.single-product div.product {
	display: grid;
	gap: var(--pw-8);
	margin-top: var(--pw-4);
}
@media (min-width: 900px) {
	.single-product div.product {
		grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
		gap: var(--pw-12);
		align-items: start;
	}
}

/* Galería */
.woocommerce-product-gallery {
	position: relative;
	border-radius: var(--pw-r-xl);
	overflow: hidden;
	background: var(--pw-surface);
}
@media (min-width: 900px) {
	.woocommerce-product-gallery { position: sticky; top: calc(var(--pw-header-h) + var(--pw-4)); }
}
.woocommerce-product-gallery img { border-radius: var(--pw-r-xl); }

.woocommerce-product-gallery__wrapper { margin: 0; }

.woocommerce-product-gallery .flex-control-thumbs {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--pw-2);
	margin: var(--pw-3) 0 0;
	padding: 0;
	list-style: none;
}
.woocommerce-product-gallery .flex-control-thumbs li { margin: 0; }
.woocommerce-product-gallery .flex-control-thumbs img {
	border-radius: var(--pw-r);
	border: 2px solid transparent;
	cursor: pointer;
	transition: border-color var(--pw-fast) var(--pw-ease);
}
.woocommerce-product-gallery .flex-control-thumbs img.flex-active,
.woocommerce-product-gallery .flex-control-thumbs img:hover { border-color: var(--pw-ink-brand); }

.woocommerce-product-gallery__trigger {
	position: absolute;
	top: var(--pw-4); right: var(--pw-4);
	z-index: 5;
	width: 44px; height: 44px;
	display: grid;
	place-items: center;
	background: var(--pw-surface);
	border-radius: var(--pw-r-full);
	box-shadow: var(--pw-shadow);
	color: var(--pw-ink-deep);
	text-decoration: none;
	font-size: 0;
}
.woocommerce-product-gallery__trigger::after {
	content: "";
	width: 22px; height: 22px;
	background: currentColor;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5M11 8v6M8 11h6'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Resumen */
.single-product .product_title { margin-bottom: var(--pw-3); }

.single-product .summary .pw-price { margin-bottom: var(--pw-1); }
.single-product .summary .pw-price__now { font-size: var(--pw-text-3xl); }
.single-product .summary .pw-price__was { font-size: var(--pw-text-lg); }
.single-product .summary .pw-price__save { margin-bottom: var(--pw-5); }

.woocommerce-product-details__short-description {
	margin-bottom: var(--pw-6);
	color: var(--pw-ink);
	font-size: var(--pw-text-lg);
	max-width: 52ch;
}

.single-product .woocommerce-product-rating {
	display: flex;
	align-items: center;
	gap: var(--pw-3);
	margin-bottom: var(--pw-4);
	font-size: var(--pw-text-sm);
}

/* Formulario de compra */
.single-product form.cart {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pw-3);
	margin-bottom: var(--pw-6);
	padding-bottom: var(--pw-6);
	border-bottom: 1px solid var(--pw-line);
}
.single-product form.cart .quantity { flex: none; }

.single-product form.cart .single_add_to_cart_button {
	flex: 1 1 200px;
	min-height: 56px;
	padding: var(--pw-4) var(--pw-8);
	background: var(--pw-ink-brand);
	color: var(--pw-surface);
	border: 2px solid transparent;
	border-radius: var(--pw-r-full);
	font-family: var(--pw-font-display);
	font-size: var(--pw-text-lg);
	font-weight: 600;
	cursor: pointer;
	touch-action: manipulation;
	transition: background-color var(--pw-fast) var(--pw-ease),
	            transform var(--pw-fast) var(--pw-ease),
	            box-shadow var(--pw-fast) var(--pw-ease);
}
.single-product form.cart .single_add_to_cart_button:hover {
	background: var(--pw-ink);
	transform: translateY(-1px);
	box-shadow: var(--pw-shadow);
}
.single-product form.cart .single_add_to_cart_button.disabled {
	background: var(--pw-line);
	color: var(--pw-ink-soft);
	cursor: not-allowed;
	transform: none;
}

.pw-buy-now { flex: 1 1 160px; min-height: 56px; }

/* Variaciones */
.variations { width: 100%; border: 0; margin-bottom: var(--pw-4); }
.variations tr { display: flex; flex-direction: column; gap: var(--pw-2); margin-bottom: var(--pw-4); }
.variations th, .variations td { display: block; padding: 0; text-align: left; border: 0; }
.variations th label { font-weight: 600; }
.reset_variations {
	display: inline-block;
	margin-top: var(--pw-2);
	font-size: var(--pw-text-sm);
}
.woocommerce-variation-price { margin-bottom: var(--pw-4); }

/* Garantías bajo el botón */
.pw-assurances {
	list-style: none;
	margin: 0 0 var(--pw-6);
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--pw-3);
}
.pw-assurances li {
	display: flex;
	align-items: flex-start;
	gap: var(--pw-3);
	margin: 0;
	font-size: var(--pw-text-sm);
	color: var(--pw-ink);
}
.pw-assurances svg { width: 20px; height: 20px; color: var(--pw-ink-brand); flex: none; margin-top: 2px; }

/* Pestañas */
.woocommerce-tabs { grid-column: 1 / -1; margin-top: var(--pw-8); }

.woocommerce-tabs ul.tabs {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pw-2);
	margin: 0 0 var(--pw-6);
	padding: 0 0 var(--pw-3);
	list-style: none;
	border-bottom: 1px solid var(--pw-line);
}
.woocommerce-tabs ul.tabs li { margin: 0; }
.woocommerce-tabs ul.tabs a {
	display: block;
	padding: var(--pw-2) var(--pw-5);
	border-radius: var(--pw-r-full);
	color: var(--pw-ink);
	font-family: var(--pw-font-display);
	font-weight: 600;
	text-decoration: none;
	transition: background-color var(--pw-fast) var(--pw-ease);
}
.woocommerce-tabs ul.tabs a:hover { background: var(--pw-surface); }
.woocommerce-tabs ul.tabs li.active a { background: var(--pw-ink-brand); color: var(--pw-surface); }

.woocommerce-Tabs-panel { max-width: var(--pw-max-text); }
.woocommerce-Tabs-panel h2 { font-size: var(--pw-text-xl); }

/* Tabla de atributos */
.shop_attributes { border-radius: var(--pw-r-md); overflow: hidden; }
/* El rayado se define en wc-normalize.css, con el mismo selector que usa
   el plugin, para no superponer dos sistemas de filas alternas. */
.shop_attributes th, .shop_attributes td {
	padding: var(--pw-3) var(--pw-4);
	text-align: left;
	font-size: var(--pw-text-sm);
	border-bottom: 1px solid var(--pw-line);
}
.shop_attributes th { font-weight: 700; width: 40%; }
.shop_attributes p { margin: 0; }

/* Opiniones */
.woocommerce-Reviews .commentlist { list-style: none; margin: 0 0 var(--pw-8); padding: 0; }
.woocommerce-Reviews .comment_container {
	display: flex;
	gap: var(--pw-4);
	padding: var(--pw-5);
	margin-bottom: var(--pw-3);
	background: var(--pw-surface);
	border-radius: var(--pw-r-md);
}
.woocommerce-Reviews .avatar { border-radius: var(--pw-r-full); width: 48px; height: 48px; }
.woocommerce-Reviews .meta { font-size: var(--pw-text-sm); color: var(--pw-ink-soft); margin-bottom: var(--pw-2); }
.woocommerce-Reviews .star-rating { color: var(--pw-brand); }

.comment-form-rating .stars a { color: var(--pw-brand); }

/* Relacionados y ventas cruzadas */
.related, .up-sells, .cross-sells { grid-column: 1 / -1; margin-top: var(--pw-12); }
.related > h2, .up-sells > h2, .cross-sells > h2 { margin-bottom: var(--pw-6); }

/* -------------------------------------------------------------------------
   Carrito
   ------------------------------------------------------------------------- */

.pw-cart-layout { display: grid; gap: var(--pw-8); align-items: start; }
@media (min-width: 1000px) {
	.pw-cart-layout { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: var(--pw-10); }
}

.pw-shipping-bar { margin-bottom: var(--pw-5); }
.pw-shipping-bar svg { color: var(--pw-ink-brand); width: 22px; height: 22px; }

/* En móvil la tabla se convierte en tarjetas. */
.shop_table.cart { border: 0; }
.shop_table.cart thead { display: none; }

.shop_table.cart tr.cart_item {
	display: grid;
	grid-template-columns: 88px minmax(0, 1fr);
	grid-template-areas:
		"img  info"
		"img  price";
	gap: var(--pw-2) var(--pw-4);
	padding: var(--pw-4);
	margin-bottom: var(--pw-3);
	background: var(--pw-surface);
	border: 1px solid var(--pw-line);
	border-radius: var(--pw-r-lg);
}

.shop_table.cart td { padding: 0; border: 0; }
.shop_table.cart td.product-remove { grid-area: img; align-self: start; }
.shop_table.cart td.product-thumbnail { grid-area: img; }
.shop_table.cart td.product-name { grid-area: info; }
.shop_table.cart td.product-price { display: none; }
.shop_table.cart td.product-quantity,
.shop_table.cart td.product-subtotal { grid-area: price; }

@media (min-width: 700px) {
	.shop_table.cart tr.cart_item {
		grid-template-columns: 88px minmax(0, 1fr) auto auto;
		grid-template-areas: "img info qty total";
		align-items: center;
		gap: var(--pw-4);
	}
	.shop_table.cart td.product-quantity { grid-area: qty; }
	.shop_table.cart td.product-subtotal { grid-area: total; text-align: right; }
}

.shop_table.cart .product-thumbnail img,
.shop_table.cart .product-thumbnail svg {
	width: 88px; height: 88px;
	object-fit: cover;
	border-radius: var(--pw-r-md);
}

.shop_table.cart .product-name a {
	font-family: var(--pw-font-display);
	font-weight: 600;
	color: var(--pw-ink-deep);
	text-decoration: none;
}
.shop_table.cart .product-name a:hover { color: var(--pw-ink-brand); }

.shop_table.cart .product-subtotal { font-weight: 700; font-size: var(--pw-text-lg); color: var(--pw-ink-deep); }

.shop_table.cart a.remove {
	display: inline-grid;
	place-items: center;
	width: 32px; height: 32px;
	background: var(--pw-bg);
	color: var(--pw-ink-soft);
	border-radius: var(--pw-r-full);
	font-size: 1.1rem;
	line-height: 1;
	text-decoration: none;
	transition: background-color var(--pw-fast) var(--pw-ease),
	            color var(--pw-fast) var(--pw-ease);
}
.shop_table.cart a.remove:hover { background: var(--pw-danger-bg); color: var(--pw-danger); }

/* Cupón */
.pw-coupon {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pw-3);
	align-items: flex-end;
	padding: var(--pw-5);
	margin-top: var(--pw-4);
	background: var(--pw-surface);
	border: 1px dashed var(--pw-line-strong);
	border-radius: var(--pw-r-lg);
}
.pw-coupon .pw-field { flex: 1 1 200px; margin: 0; }

/* Resumen */
.cart_totals, .pw-summary {
	padding: var(--pw-6);
	background: var(--pw-surface);
	border: 1px solid var(--pw-line);
	border-radius: var(--pw-r-xl);
}
@media (min-width: 1000px) {
	.cart_totals, .pw-summary { position: sticky; top: calc(var(--pw-header-h) + var(--pw-4)); }
}
.cart_totals h2, .pw-summary h2 { font-size: var(--pw-text-xl); margin-bottom: var(--pw-5); }

.cart_totals table, .pw-summary table { border: 0; }
.cart_totals th, .cart_totals td,
.pw-summary th, .pw-summary td {
	padding: var(--pw-3) 0;
	text-align: left;
	border-bottom: 1px solid var(--pw-line);
	font-size: var(--pw-text-sm);
}
.cart_totals td, .pw-summary td { text-align: right; font-weight: 600; }
.cart_totals .order-total th, .cart_totals .order-total td,
.pw-summary .order-total th, .pw-summary .order-total td {
	border-bottom: 0;
	padding-top: var(--pw-4);
	font-family: var(--pw-font-display);
	font-size: var(--pw-text-xl);
	font-weight: 700;
	color: var(--pw-ink-deep);
}

.wc-proceed-to-checkout { margin-top: var(--pw-5); }
.wc-proceed-to-checkout .checkout-button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 56px;
	padding: var(--pw-4) var(--pw-6);
	background: var(--pw-ink-brand);
	color: var(--pw-surface);
	border-radius: var(--pw-r-full);
	font-family: var(--pw-font-display);
	font-size: var(--pw-text-lg);
	font-weight: 600;
	text-decoration: none;
	transition: background-color var(--pw-fast) var(--pw-ease);
}
.wc-proceed-to-checkout .checkout-button:hover { background: var(--pw-ink); color: var(--pw-surface); }

.shipping-calculator-button { font-size: var(--pw-text-sm); }

/* -------------------------------------------------------------------------
   Checkout
   ------------------------------------------------------------------------- */

.pw-checkout-layout { display: grid; gap: var(--pw-8); align-items: start; }
@media (min-width: 1000px) {
	.pw-checkout-layout { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: var(--pw-10); }
}

.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
.woocommerce-additional-fields h3,
#order_review_heading {
	font-size: var(--pw-text-xl);
	margin-bottom: var(--pw-5);
	padding-bottom: var(--pw-3);
	border-bottom: 1px solid var(--pw-line);
}

.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper { display: grid; gap: 0 var(--pw-4); }
@media (min-width: 640px) {
	.woocommerce-billing-fields__field-wrapper,
	.woocommerce-shipping-fields__field-wrapper { grid-template-columns: 1fr 1fr; }
	.form-row-wide, .form-row-full { grid-column: 1 / -1; }
}

.form-row { display: flex; flex-direction: column; gap: var(--pw-2); margin-bottom: var(--pw-4); }
.form-row label { font-size: var(--pw-text-sm); font-weight: 600; }
.form-row.woocommerce-invalid label { color: var(--pw-danger); }

.woocommerce-form__label-for-checkbox {
	flex-direction: row;
	align-items: center;
	gap: var(--pw-3);
}

/* Métodos de envío y pago: opciones tocables, no radios sueltos. */
#shipping_method, .wc_payment_methods {
	list-style: none;
	margin: 0 0 var(--pw-5);
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--pw-2);
}
#shipping_method li, .wc_payment_methods li { margin: 0; }

#shipping_method li label,
.wc_payment_methods li > label {
	display: flex;
	align-items: center;
	gap: var(--pw-3);
	padding: var(--pw-4);
	background: var(--pw-bg);
	border: 1.5px solid var(--pw-line);
	border-radius: var(--pw-r-md);
	cursor: pointer;
	font-weight: 600;
	font-size: var(--pw-text-sm);
	transition: border-color var(--pw-fast) var(--pw-ease),
	            background-color var(--pw-fast) var(--pw-ease);
}
#shipping_method li label:hover,
.wc_payment_methods li > label:hover { border-color: var(--pw-brand); }

#shipping_method li input:checked + label,
.wc_payment_methods li input:checked + label {
	border-color: var(--pw-ink-brand);
	background: var(--pw-surface);
}
#shipping_method .amount, .wc_payment_methods .amount { margin-left: auto; font-weight: 700; }

.payment_box {
	padding: var(--pw-4);
	margin-top: var(--pw-1);
	background: var(--pw-surface);
	border-radius: var(--pw-r);
	font-size: var(--pw-text-sm);
}
.payment_box p:last-child { margin: 0; }

#place_order {
	width: 100%;
	min-height: 56px;
	background: var(--pw-ink-brand);
	color: var(--pw-surface);
	border: 0;
	border-radius: var(--pw-r-full);
	font-family: var(--pw-font-display);
	font-size: var(--pw-text-lg);
	font-weight: 600;
	cursor: pointer;
	transition: background-color var(--pw-fast) var(--pw-ease);
}
#place_order:hover { background: var(--pw-ink); }

.woocommerce-checkout-review-order-table { width: 100%; }
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
	padding: var(--pw-3) 0;
	text-align: left;
	border-bottom: 1px solid var(--pw-line);
	font-size: var(--pw-text-sm);
}
.woocommerce-checkout-review-order-table td { text-align: right; }
.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order-table .order-total td {
	font-family: var(--pw-font-display);
	font-size: var(--pw-text-xl);
	font-weight: 700;
	color: var(--pw-ink-deep);
	border-bottom: 0;
}

.woocommerce-privacy-policy-text { font-size: var(--pw-text-sm); color: var(--pw-ink-soft); }

/* -------------------------------------------------------------------------
   Mi cuenta
   ------------------------------------------------------------------------- */

/* Solo con sesión iniciada existe la navegación lateral. Sin ella, la
   columna de 240px quedaría vacía y empujaría el formulario de acceso. */
.woocommerce-account.logged-in .woocommerce { display: grid; gap: var(--pw-8); }
@media (min-width: 900px) {
	.woocommerce-account.logged-in .woocommerce {
		grid-template-columns: 240px minmax(0, 1fr);
		gap: var(--pw-10);
		align-items: start;
	}
}

.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: var(--pw-3);
	background: var(--pw-surface);
	border: 1px solid var(--pw-line);
	border-radius: var(--pw-r-lg);
}
.woocommerce-MyAccount-navigation li { margin: 0; }
.woocommerce-MyAccount-navigation a {
	display: block;
	padding: var(--pw-3) var(--pw-4);
	border-radius: var(--pw-r);
	color: var(--pw-ink);
	text-decoration: none;
	font-weight: 600;
	font-size: var(--pw-text-sm);
	transition: background-color var(--pw-fast) var(--pw-ease);
}
.woocommerce-MyAccount-navigation a:hover { background: var(--pw-bg); }
.woocommerce-MyAccount-navigation .is-active a {
	background: var(--pw-ink-brand);
	color: var(--pw-surface);
}

/* Login y registro */
.pw-auth { display: grid; gap: var(--pw-6); }
@media (min-width: 800px) { .pw-auth { grid-template-columns: 1fr 1fr; gap: var(--pw-8); } }

.pw-auth__panel {
	padding: var(--pw-6);
	background: var(--pw-surface);
	border: 1px solid var(--pw-line);
	border-radius: var(--pw-r-xl);
}
.pw-auth__panel h2 { font-size: var(--pw-text-xl); margin-bottom: var(--pw-2); }
.pw-auth__panel > p:first-of-type { color: var(--pw-ink-soft); font-size: var(--pw-text-sm); margin-bottom: var(--pw-5); }

.woocommerce-form-login__rememberme { display: flex; align-items: center; gap: var(--pw-2); }
.woocommerce-LostPassword { font-size: var(--pw-text-sm); }

/* Pedidos */
.woocommerce-orders-table, .woocommerce-table--order-details { width: 100%; }
.woocommerce-orders-table th, .woocommerce-orders-table td,
.woocommerce-table--order-details th, .woocommerce-table--order-details td {
	padding: var(--pw-3);
	text-align: left;
	border-bottom: 1px solid var(--pw-line);
	font-size: var(--pw-text-sm);
}
.woocommerce-orders-table th { font-weight: 700; color: var(--pw-ink-deep); }

@media (max-width: 699px) {
	.woocommerce-orders-table thead { display: none; }
	.woocommerce-orders-table tr {
		display: block;
		padding: var(--pw-4);
		margin-bottom: var(--pw-3);
		background: var(--pw-surface);
		border: 1px solid var(--pw-line);
		border-radius: var(--pw-r-lg);
	}
	.woocommerce-orders-table td {
		display: flex;
		justify-content: space-between;
		gap: var(--pw-4);
		border: 0;
		padding: var(--pw-1) 0;
	}
	.woocommerce-orders-table td::before {
		content: attr(data-title);
		font-weight: 700;
		color: var(--pw-ink-soft);
	}
}

/* -------------------------------------------------------------------------
   Botones genéricos del plugin que no pasan por el tema
   ------------------------------------------------------------------------- */

.woocommerce .button:not(.pw-btn):not(.single_add_to_cart_button):not(.checkout-button),
.woocommerce input.button:not(.pw-btn) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--pw-2);
	min-height: 48px;
	padding: var(--pw-3) var(--pw-6);
	background: var(--pw-ink-brand);
	color: var(--pw-surface);
	border: 2px solid transparent;
	border-radius: var(--pw-r-full);
	font-family: var(--pw-font-display);
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	transition: background-color var(--pw-fast) var(--pw-ease);
}
.woocommerce .button:not(.pw-btn):hover,
.woocommerce input.button:not(.pw-btn):hover { background: var(--pw-ink); color: var(--pw-surface); }

.woocommerce .button[disabled], .woocommerce input.button[disabled] {
	background: var(--pw-line);
	color: var(--pw-ink-soft);
	cursor: not-allowed;
}

/* La estrella de valoración de WooCommerce usa su propia fuente. */
.star-rating { color: var(--pw-brand); }
.star-rating::before { color: var(--pw-line-strong); }

/* -------------------------------------------------------------------------
   Ficha de producto: correcciones de composición

   El grid de `div.product` recibe como hijos directos la etiqueta de oferta,
   la galería y el resumen. Sin tratar, la etiqueta ocupa una celda entera y
   desplaza todo lo demás.
   ------------------------------------------------------------------------- */

.single-product div.product { position: relative; }

/* La etiqueta suelta que WooCommerce imprime fuera de la galería. */
.single-product div.product > .onsale {
	position: absolute;
	top: var(--pw-4);
	left: var(--pw-4);
	z-index: 5;
	width: auto;
	margin: 0;
}

/* La que sí va dentro de la galería. */
.pw-onsale-wrap {
	position: absolute;
	top: var(--pw-4);
	left: var(--pw-4);
	z-index: 5;
	display: flex;
	gap: var(--pw-2);
}
.pw-onsale-wrap .onsale,
.pw-onsale-wrap .pw-badge { position: static; margin: 0; }

/* En escritorio la galería va primero y ocupa la columna ancha. */
@media (min-width: 900px) {
	.single-product .woocommerce-product-gallery { grid-column: 1; grid-row: 1; }
	.single-product .summary { grid-column: 2; grid-row: 1; }
}

.pw-gallery-placeholder {
	display: block;
	background: var(--pw-bg);
	border-radius: var(--pw-r-xl);
	overflow: hidden;
}
.pw-gallery-placeholder svg { width: 100%; height: auto; display: block; }

/* El título no debe partirse en tres líneas por una columna estrecha. */
.single-product .product_title { text-wrap: balance; }

/* La cantidad y el botón comparten línea de base. */
.single-product form.cart .quantity { display: flex; align-items: center; }
.single-product form.cart .quantity input.qty {
	width: 84px;
	min-height: 56px;
	text-align: center;
	border-radius: var(--pw-r-full);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}


/* La galería ocupa su columna completa. */
.woocommerce-product-gallery { width: 100%; }
.woocommerce-product-gallery__wrapper > div,
.woocommerce-product-gallery__wrapper > a { display: block; width: 100%; }
.pw-illu--single { width: 100%; height: auto; }

/* Relacionados y ventas cruzadas: fuera del grid de dos columnas. */
.single-product .related,
.single-product .up-sells,
.single-product .cross-sells,
.single-product .woocommerce-tabs { grid-column: 1 / -1; width: 100%; }

/* -------------------------------------------------------------------------
   Anular el maquetado flotante de WooCommerce

   El plugin aplica `float: left; width: 48%` a la galería y al resumen, del
   maquetado de dos columnas anterior a CSS Grid. Dentro de un grid el 48% se
   resuelve contra la columna, no contra la fila, y deja ambos a la mitad de
   su celda. Los selectores de abajo llevan un peso mayor a propósito.
   ------------------------------------------------------------------------- */

body.single-product div.product > .woocommerce-product-gallery.images,
body.single-product div.product > .summary.entry-summary {
	float: none;
	width: 100%;
	max-width: none;
}

/* El resumen conserva una medida de lectura cómoda sin encoger la columna. */
body.single-product div.product > .summary.entry-summary > * { max-width: 56ch; }
body.single-product div.product > .summary.entry-summary > form.cart { max-width: none; }

/* -------------------------------------------------------------------------
   Clearfix heredado dentro de un grid

   WooCommerce añade `::before` y `::after` de tipo table a ul.products para
   limpiar floats. En un contenedor grid esos pseudo-elementos cuentan como
   items y ocupan la primera y la última celda: la rejilla arranca desplazada
   una posición y queda un hueco inicial.
   ------------------------------------------------------------------------- */

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

/* Mismo motivo en las filas del carrito y en los contenedores de WooCommerce
   que siguen usando el patrón. */
.woocommerce .woocommerce-notices-wrapper::before,
.woocommerce .woocommerce-notices-wrapper::after { content: none; }

/* -------------------------------------------------------------------------
   Botones «alt» de WooCommerce

   El plugin los pinta con su morado corporativo (#7f54b3) mediante
   selectores de tres clases. Se igualan aquí con el mismo peso.
   ------------------------------------------------------------------------- */

.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
	background-color: var(--pw-ink-brand);
	color: var(--pw-surface);
	border-color: transparent;
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover { background-color: var(--pw-ink); }

.woocommerce a.button.alt.disabled,
.woocommerce button.button.alt.disabled,
.woocommerce input.button.alt.disabled {
	background-color: var(--pw-line);
	color: var(--pw-ink-soft);
}

/* -------------------------------------------------------------------------
   Avisos: quitar la tipografía de iconos del plugin

   WooCommerce inserta un glifo con ::before en posición absoluta que se
   superpone al texto cuando el aviso es flex.
   ------------------------------------------------------------------------- */

.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before { content: none; display: none; }

.woocommerce-message, .woocommerce-info, .woocommerce-error { padding-left: var(--pw-5); }

/* -------------------------------------------------------------------------
   Carrito: composición a dos columnas
   ------------------------------------------------------------------------- */

.pw-cart-main { min-width: 0; }

.pw-cart-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--pw-4);
	margin-top: var(--pw-4);
}
.pw-cart-actions .pw-coupon { flex: 1 1 320px; margin-top: 0; }

.pw-cart-continue { margin-top: var(--pw-6); }
.pw-cart-continue a {
	display: inline-flex;
	align-items: center;
	gap: var(--pw-2);
	font-family: var(--pw-font-display);
	font-weight: 600;
	text-decoration: none;
}
.pw-cart-continue svg { width: 18px; height: 18px; transition: transform var(--pw-fast) var(--pw-ease); }
.pw-cart-continue a:hover svg { transform: translateX(-3px); }

/* El precio unitario junto al nombre; la columna propia solo en escritorio. */
.pw-cart-unit {
	display: block;
	margin-top: var(--pw-1);
	font-size: var(--pw-text-sm);
	color: var(--pw-ink-soft);
	font-variant-numeric: tabular-nums;
}
@media (min-width: 700px) { .pw-cart-unit { display: none; } }

.shop_table.cart td.product-price { display: none; }
@media (min-width: 900px) {
	.shop_table.cart tr.cart_item {
		grid-template-columns: 40px 88px minmax(0, 1fr) auto auto auto;
		grid-template-areas: "rm img info price qty total";
	}
	.shop_table.cart td.product-remove { grid-area: rm; }
	.shop_table.cart td.product-thumbnail { grid-area: img; }
	.shop_table.cart td.product-price { grid-area: price; display: block; font-variant-numeric: tabular-nums; }
}

/* La celda de eliminar no debe solaparse con la miniatura en móvil. */
@media (max-width: 699px) {
	.shop_table.cart tr.cart_item {
		grid-template-columns: 88px minmax(0, 1fr) auto;
		grid-template-areas:
			"img info rm"
			"img qty total";
		align-items: start;
	}
	.shop_table.cart td.product-remove { grid-area: rm; justify-self: end; }
	.shop_table.cart td.product-quantity { grid-area: qty; }
	.shop_table.cart td.product-subtotal { grid-area: total; justify-self: end; align-self: center; }
}

/* La cantidad de WooCommerce dentro del carrito. */
.shop_table.cart .quantity input.qty {
	width: 72px;
	min-height: 44px;
	text-align: center;
	border-radius: var(--pw-r-full);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

/* Encabezado de tabla oculto: las filas son tarjetas. */
.shop_table.cart thead { display: none; }

/* -------------------------------------------------------------------------
   Contenedor ancho para carrito, pago y cuenta
   ------------------------------------------------------------------------- */

.pw-wide { width: 100%; max-width: none; }

/* -------------------------------------------------------------------------
   Totales del carrito

   Mismo caso que la galería: WooCommerce los flota al 48% y dentro del grid
   quedan reducidos a la mitad de su columna.
   ------------------------------------------------------------------------- */

.woocommerce .cart-collaterals .cart_totals,
.woocommerce-page .cart-collaterals .cart_totals,
.pw-cart-aside .cart_totals {
	float: none;
	width: 100%;
	max-width: none;
}

.woocommerce .cart-collaterals,
.woocommerce-page .cart-collaterals { width: 100%; }

.woocommerce .cart-collaterals::before,
.woocommerce .cart-collaterals::after { content: none; }

/* La fila del carrito necesita que la columna del nombre no colapse. */
@media (min-width: 900px) {
	.shop_table.cart tr.cart_item {
		grid-template-columns: 40px 88px minmax(180px, 1fr) auto auto auto;
	}
}

/* Bordes sueltos de las celdas heredadas de la tabla. */
.shop_table.cart td,
.shop_table.cart th { border-top: 0; border-bottom: 0; }

/* -------------------------------------------------------------------------
   Checkout

   WooCommerce sigue maquetando el formulario con floats y porcentajes
   (form-row-first al 47%, col-1/col-2 al 48%). Dentro de un grid esos
   porcentajes se calculan sobre la columna y dejan los campos a la mitad.
   ------------------------------------------------------------------------- */

.woocommerce form .form-row-first,
.woocommerce form .form-row-last,
.woocommerce form .form-row-wide,
.woocommerce-page form .form-row-first,
.woocommerce-page form .form-row-last,
.woocommerce-page form .form-row-wide {
	float: none;
	width: auto;
	overflow: visible;
}

.woocommerce .col2-set,
.woocommerce-page .col2-set { display: grid; gap: var(--pw-8); width: 100%; }
@media (min-width: 640px) {
	.woocommerce .col2-set,
	.woocommerce-page .col2-set { grid-template-columns: 1fr; }
}

.woocommerce .col2-set .col-1,
.woocommerce .col2-set .col-2,
.woocommerce-page .col2-set .col-1,
.woocommerce-page .col2-set .col-2 {
	float: none;
	width: 100%;
}
.woocommerce .col2-set::before,
.woocommerce .col2-set::after { content: none; }

.pw-checkout-main { min-width: 0; }

@media (min-width: 1000px) {
	.pw-checkout-aside { position: sticky; top: calc(var(--pw-header-h) + var(--pw-4)); }
}

/* El bloque de pago llega con el gris del plugin. */
#payment,
.woocommerce-checkout #payment {
	background: transparent;
	border-radius: var(--pw-r-lg);
	padding: 0;
	margin-top: var(--pw-5);
}
#payment ul.payment_methods {
	padding: 0;
	border-bottom: 0;
	margin-bottom: var(--pw-4);
}
#payment div.form-row { padding: 0; }
#payment .place-order { padding: 0; margin: 0; }

/* Aviso de «no hay métodos de pago». */
.woocommerce-notice--info,
#payment .woocommerce-info {
	margin-bottom: var(--pw-4);
}

/* La nota de privacidad, legible y discreta. */
.woocommerce-privacy-policy-text {
	margin-bottom: var(--pw-4);
	font-size: var(--pw-text-sm);
	color: var(--pw-ink-soft);
}
.woocommerce-privacy-policy-text p { margin: 0; }

/* Cupón del checkout. */
.woocommerce-form-coupon-toggle { margin-bottom: var(--pw-5); }
.checkout_coupon {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pw-3);
	align-items: flex-end;
	padding: var(--pw-5);
	margin-bottom: var(--pw-6);
	background: var(--pw-surface);
	border: 1px dashed var(--pw-line-strong);
	border-radius: var(--pw-r-lg);
}
.checkout_coupon .form-row { flex: 1 1 220px; margin: 0; }
.checkout_coupon::before, .checkout_coupon::after { content: none; }

/* Tabla del resumen. */
.woocommerce-checkout-review-order-table thead th { font-weight: 700; color: var(--pw-ink-deep); }
.woocommerce-checkout-review-order-table .product-name { text-align: left; }
.woocommerce-checkout-review-order-table .product-total { text-align: right; white-space: nowrap; }

/* -------------------------------------------------------------------------
   Acceso y registro
   ------------------------------------------------------------------------- */

.pw-auth--solo { max-width: 460px; margin-inline: auto; }

.pw-auth__row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--pw-3);
	margin-bottom: var(--pw-5);
}
.woocommerce-form-login__rememberme {
	display: flex;
	align-items: center;
	gap: var(--pw-2);
	margin: 0;
	font-weight: 400;
	font-size: var(--pw-text-sm);
	cursor: pointer;
}
.pw-auth__lost { font-size: var(--pw-text-sm); }

/* El panel de registro se distingue del de acceso sin cambiar de mundo. */
.pw-auth__panel--register { background: var(--pw-bg); border-style: dashed; }

/* WooCommerce vuelve a flotar estas columnas. */
.woocommerce .u-columns.col2-set,
.woocommerce-page .u-columns.col2-set { display: grid; }
.woocommerce .u-column1,
.woocommerce .u-column2 { float: none; width: 100%; }

/* El título «Acceder» que imprime el plugin sobra: los paneles ya lo dicen. */
.woocommerce-account:not(.logged-in) .entry-content > h2:first-child { display: none; }

/* WooCommerce enmarca los formularios de acceso y registro con su propio
   borde gris; los paneles del tema ya aportan el contenedor. */
.woocommerce form.login,
.woocommerce form.register,
.woocommerce-page form.login,
.woocommerce-page form.register {
	border: 0;
	padding: 0;
	margin: 0;
	border-radius: 0;
}
