/*
 * My Account (classic WooCommerce templates) and order details, which are shared by
 * My Account → view order and the thank-you page after checkout.
 * Selectors are scoped under .woocommerce-account / .woocommerce to beat WooCommerce's defaults.
 */

/* ---------- Layout: menu on the left, content on the right ---------- */
.woocommerce-account.logged-in .site-main .woocommerce {
	display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: var(--space-6); align-items: start;
}
/* WooCommerce's clearfix pseudo-elements would otherwise take the first grid cell. */
.woocommerce-account.logged-in .site-main .woocommerce::before,
.woocommerce-account.logged-in .site-main .woocommerce::after { display: none; }
.woocommerce-account.logged-in .site-main .woocommerce > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
.woocommerce-account.logged-in .site-main .woocommerce > .woocommerce-MyAccount-navigation { grid-column: 1; }
.woocommerce-account.logged-in .site-main .woocommerce > .woocommerce-MyAccount-content { grid-column: 2; }
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content { float: none; width: auto; }
.woocommerce-account .site-main .entry-title { margin-bottom: var(--space-5); }

/* ---------- Menu ---------- */
.woocommerce-account .woocommerce-MyAccount-navigation {
	position: sticky; top: var(--space-5);
	padding: var(--space-2); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-bg);
}
.woocommerce-MyAccount-navigation ul { display: grid; gap: 2px; }
.woocommerce-MyAccount-navigation a {
	display: flex; align-items: center; gap: var(--space-3);
	padding: var(--space-3) var(--space-4); border-radius: var(--radius);
	font-size: var(--fs-sm); font-weight: var(--fw-medium); color: var(--color-text);
	transition: background-color .15s ease, color .15s ease;
}
.woocommerce-MyAccount-navigation a .icon { width: 1.1rem; height: 1.1rem; color: var(--color-muted); }
.woocommerce-MyAccount-navigation a:hover { background: var(--color-bg-soft); color: var(--color-text); }
.woocommerce-MyAccount-navigation li.is-active a { background: var(--color-primary-soft); color: var(--color-primary); }
.woocommerce-MyAccount-navigation li.is-active a .icon { color: var(--color-primary); }
.woocommerce-MyAccount-navigation-link--customer-logout { margin-top: var(--space-2); padding-top: var(--space-2); border-top: 1px solid var(--color-border); }
.woocommerce-MyAccount-navigation-link--customer-logout a:hover { color: var(--color-primary); }

/* ---------- Content ---------- */
.woocommerce-MyAccount-content { font-size: var(--fs-sm); color: var(--color-text); }
.woocommerce-MyAccount-content > p:first-child { color: var(--color-muted); }
.woocommerce-MyAccount-content a:not(.button) { color: var(--color-primary); }
.woocommerce-MyAccount-content h2,
.woocommerce-order h2,
.woocommerce-order-details__title,
.woocommerce-column__title { font-size: var(--fs-md); font-weight: var(--fw-semibold); margin: 0 0 var(--space-4); }

/* "Order #1093 was placed on … and is currently Processing." */
.woocommerce-MyAccount-content mark,
.woocommerce-order mark { background: none; color: var(--color-text); font-weight: var(--fw-semibold); }
.woocommerce-MyAccount-content mark.order-status {
	display: inline-block; padding: 0.15em 0.7em; border-radius: var(--radius-pill);
	background: color-mix(in srgb, var(--color-success) 14%, #fff); color: color-mix(in srgb, var(--color-success) 70%, #000);
	font-size: var(--fs-xs);
}

/* ---------- Tables (orders list, order details) ---------- */
.woocommerce-account .woocommerce table.shop_table,
.woocommerce-order .woocommerce-table--order-details,
.woocommerce .woocommerce-order-details table.shop_table {
	width: 100%; margin: 0 0 var(--space-6); border: 1px solid var(--color-border); border-radius: var(--radius-lg);
	border-collapse: separate; border-spacing: 0; overflow: hidden; background: var(--color-bg);
}
.woocommerce table.shop_table th,
.woocommerce table.shop_table td { padding: var(--space-3) var(--space-4); border-top: 1px solid var(--color-border); vertical-align: middle; line-height: 1.45; }
.woocommerce table.shop_table thead th {
	border-top: 0; background: var(--color-bg-soft);
	font-size: var(--fs-xs); font-weight: var(--fw-semibold); color: var(--color-muted); text-transform: uppercase; letter-spacing: .04em;
}
.woocommerce table.shop_table tfoot th { font-weight: var(--fw-medium); color: var(--color-muted); }
.woocommerce table.shop_table tfoot td { font-weight: var(--fw-semibold); }
.woocommerce table.shop_table tfoot tr:last-child th,
.woocommerce table.shop_table tfoot tr:last-child td { font-size: var(--fs-base); }
.woocommerce .woocommerce-order-details table.shop_table .product-total,
.woocommerce .woocommerce-order-details table.shop_table tfoot td { text-align: right; white-space: nowrap; }
.woocommerce .woocommerce-orders-table .button { padding: 0.5em 1em; font-size: var(--fs-xs); }
.woocommerce .woocommerce-orders-table .woocommerce-orders-table__cell-order-number a { font-weight: var(--fw-semibold); }

/* Product image in front of each ordered item */
.woocommerce table.shop_table.woocommerce-table--order-details td.product-name { position: relative; height: calc(64px + 2 * var(--space-3)); padding-left: calc(64px + 2 * var(--space-4)); font-weight: var(--fw-medium); }
.order-item__media { position: absolute; left: var(--space-4); top: 50%; transform: translateY(-50%); }
.order-item__media img.order-item__thumb {
	width: 64px; height: 64px; object-fit: contain; padding: 4px;
	border: 1px solid var(--color-border); border-radius: var(--radius); background: #fff;
}
.woocommerce-table--order-details td.product-name > a:not([aria-hidden]) { color: var(--color-text); }
.woocommerce-table--order-details td.product-name > a:not([aria-hidden]):hover { color: var(--color-primary); }
.woocommerce-table--order-details .product-quantity { color: var(--color-muted); font-weight: var(--fw-medium); white-space: nowrap; }
.woocommerce-table--order-details .wc-item-meta { margin: var(--space-1) 0 0; font-size: var(--fs-xs); color: var(--color-muted); }
.woocommerce-table--order-details .wc-item-meta li { display: flex; gap: var(--space-1); }
.woocommerce-table--order-details .wc-item-meta p { margin: 0; }

/* ---------- Addresses ---------- */
.woocommerce .woocommerce-customer-details .woocommerce-columns--addresses,
.woocommerce-account .woocommerce-Addresses { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-5); }
.woocommerce .woocommerce-customer-details .col2-set::before,
.woocommerce .woocommerce-customer-details .col2-set::after,
.woocommerce-account .woocommerce-Addresses::before,
.woocommerce-account .woocommerce-Addresses::after { display: none; }
.woocommerce .woocommerce-customer-details .woocommerce-column,
.woocommerce-account .woocommerce-Addresses .woocommerce-Address { float: none; width: auto; max-width: none; }
.woocommerce .woocommerce-customer-details .woocommerce-columns--addresses:has(> .woocommerce-column:only-child) { grid-template-columns: 1fr; }
.woocommerce .woocommerce-customer-details address,
.woocommerce-account .woocommerce-Address address {
	padding: var(--space-4) var(--space-5); border: 1px solid var(--color-border); border-radius: var(--radius-lg);
	font-style: normal; line-height: 1.7; background: var(--color-bg);
}
.woocommerce .woocommerce-customer-details address p { margin: var(--space-2) 0 0; }
.woocommerce-account .woocommerce-Address-title { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-3); }
.woocommerce-account .woocommerce-Address-title::before,
.woocommerce-account .woocommerce-Address-title::after { display: none; }
.woocommerce-account .woocommerce-Address-title h2 { margin: 0; }
.woocommerce-account .woocommerce-Address-title a { float: none; font-size: var(--fs-xs); font-weight: var(--fw-medium); }

/* ---------- Order notes ("Order updates") ---------- */
.woocommerce ol.commentlist.notes { margin: 0 0 var(--space-6); padding: 0; list-style: none; display: grid; gap: var(--space-3); }
.woocommerce ol.commentlist.notes li { padding: var(--space-3) var(--space-4); border-radius: var(--radius); background: var(--color-bg-soft); }
.woocommerce ol.commentlist.notes .meta { margin: 0 0 var(--space-1); font-size: var(--fs-xs); color: var(--color-muted); }

/* ---------- Account forms (details, addresses) ---------- */
.woocommerce-account .woocommerce-MyAccount-content form .form-row { margin-bottom: var(--space-4); }
.woocommerce-account .woocommerce-MyAccount-content form .form-row label { display: block; margin-bottom: var(--space-1); font-weight: var(--fw-medium); }
.woocommerce-account .woocommerce-MyAccount-content form .form-row .required { color: var(--color-primary); text-decoration: none; border: 0; }
.woocommerce-account .woocommerce-MyAccount-content form .input-text,
.woocommerce-account .woocommerce-MyAccount-content form select { width: 100%; min-height: 3rem; font-size: var(--fs-base); }
.woocommerce-account .woocommerce-MyAccount-content fieldset { margin: var(--space-5) 0; padding: var(--space-4) var(--space-5); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.woocommerce-account .woocommerce-MyAccount-content legend { padding: 0 var(--space-2); font-weight: var(--fw-semibold); }
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-form-row--first,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-form-row--last { width: calc(50% - var(--space-2)); }
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-form-row--first { float: left; }
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-form-row--last { float: right; }
.woocommerce-account .woocommerce-MyAccount-content .clear { clear: both; }

/* Empty states ("No order has been made yet.") */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info { margin-bottom: var(--space-5); }

/* ---------- Thank-you page summary ---------- */
.woocommerce ul.woocommerce-order-overview {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: var(--space-3);
	margin: 0 0 var(--space-6); padding: 0;
}
.woocommerce ul.woocommerce-order-overview::before,
.woocommerce ul.woocommerce-order-overview::after { display: none; }
.woocommerce ul.woocommerce-order-overview li {
	float: none; margin: 0; padding: var(--space-3) var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-lg);
	font-size: var(--fs-xs); color: var(--color-muted); text-transform: uppercase; letter-spacing: .04em; line-height: 1.5;
}
.woocommerce ul.woocommerce-order-overview li strong { display: block; margin-top: var(--space-1); font-size: var(--fs-sm); color: var(--color-text); text-transform: none; letter-spacing: 0; }
.woocommerce .woocommerce-thankyou-order-received {
	padding: var(--space-4) var(--space-5); margin-bottom: var(--space-5); border-radius: var(--radius-lg);
	background: color-mix(in srgb, var(--color-success) 12%, #fff); font-weight: var(--fw-medium);
}

/* ---------- Responsive ---------- */
@media (max-width: 860px) {
	.woocommerce-account.logged-in .site-main .woocommerce { grid-template-columns: 1fr; gap: var(--space-5); }
	.woocommerce-account .woocommerce-MyAccount-navigation { position: static; }
	.woocommerce-account.logged-in .site-main .woocommerce > .woocommerce-MyAccount-navigation,
	.woocommerce-account.logged-in .site-main .woocommerce > .woocommerce-MyAccount-content { grid-column: 1; }
	.woocommerce-MyAccount-navigation ul { grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr)); }
	.woocommerce-MyAccount-navigation-link--customer-logout { margin-top: 0; padding-top: 0; border-top: 0; }
}
@media (max-width: 600px) {
	.woocommerce .woocommerce-customer-details .woocommerce-columns--addresses,
	.woocommerce-account .woocommerce-Addresses { grid-template-columns: 1fr; }
	.order-item__media img.order-item__thumb { width: 52px; height: 52px; }
	.woocommerce table.shop_table.woocommerce-table--order-details td.product-name { height: calc(52px + 2 * var(--space-3)); padding-left: calc(52px + var(--space-4) + var(--space-3)); }
	.order-item__media { left: var(--space-3); }
	.woocommerce-account .woocommerce-MyAccount-content .woocommerce-form-row--first,
	.woocommerce-account .woocommerce-MyAccount-content .woocommerce-form-row--last { float: none; width: 100%; }
	/* WooCommerce's responsive orders table: label/value rows */
	.woocommerce table.shop_table_responsive tbody tr { display: block; border-top: 1px solid var(--color-border); }
	.woocommerce table.shop_table_responsive tbody tr:first-child { border-top: 0; }
	.woocommerce table.shop_table_responsive tbody td { border-top: 0; padding-block: var(--space-2); }
}