/* ==========================================================================
   account-wc.css
   Reskins WooCommerce's REAL My Account + Order Received markup (nav,
   orders table, addresses, edit-account form, login/register, order
   summary) to match our design system. Only loaded on is_account_page()
   and is_order_received_page() — see inc/enqueue.php.

   Nothing here touches WooCommerce's PHP/JS logic or element IDs/classes;
   it only restyles the exact classes WooCommerce core prints, so account
   management, order history, and address editing keep working untouched.
   ========================================================================== */

/* ---- Layout: nav + content two-column grid (My Account, logged in) ---- */
.nutra-account-layout{
	display:grid; grid-template-columns:240px 1fr; gap:32px;
	padding:28px 0 70px; align-items:start;
}
@media (max-width:860px){
	.nutra-account-layout{ grid-template-columns:1fr; }
}

.nutra-account-nav{
	background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md);
	padding:10px; position:sticky; top:100px;
}
.woocommerce-MyAccount-navigation ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; }
.woocommerce-MyAccount-navigation-link{ display:block; }
.woocommerce-MyAccount-navigation-link a{
	display:flex; align-items:center; gap:8px; padding:12px 14px; border-radius:var(--radius-sm);
	color:var(--text-muted); font-weight:700; font-size:13.5px; text-transform:none;
	transition:background .2s, color .2s;
}
.woocommerce-MyAccount-navigation-link a:hover{ background:rgba(255,27,60,.06); color:var(--text); }
.woocommerce-MyAccount-navigation-link.is-active a{
	background:linear-gradient(135deg,var(--volt),var(--ember)); color:#fff;
}
.woocommerce-MyAccount-navigation-link--customer-logout a{ color:var(--text-faint); }

.nutra-account-content{
	background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md);
	padding:28px 26px; min-height:200px;
}
.nutra-account-content h2,
.nutra-account-content h3{ margin-top:0; }
.nutra-account-content p{ color:var(--text-muted); line-height:1.7; }
.nutra-account-content a{ color:var(--volt); font-weight:600; }
.nutra-account-content mark{ background:none; color:var(--text); font-weight:700; }

/* ---- Dashboard welcome block ---- */
.woocommerce-MyAccount-content > p:first-child{ font-size:14.5px; }

/* ---- Orders table ---- */
.woocommerce-orders-table{ width:100%; border-collapse:collapse; margin:0 0 20px; }
.woocommerce-orders-table thead{ display:none; }
.woocommerce-orders-table tbody tr,
.woocommerce-orders-table tr{
	display:flex; flex-wrap:wrap; align-items:center; gap:8px 18px;
	padding:16px 4px; border-bottom:1px solid var(--border); font-size:13.5px;
}
.woocommerce-orders-table__cell{ color:var(--text-muted); }
.woocommerce-orders-table__cell-order-number a{ color:var(--text); font-weight:800; }
.woocommerce-orders-table__cell-order-status{
	padding:4px 12px; border-radius:var(--radius-pill); font-weight:700; font-size:11.5px;
	text-transform:uppercase; letter-spacing:.03em; background:rgba(255,27,60,.1); color:var(--volt);
}
.woocommerce-orders-table__cell-order-actions{ margin-left:auto; display:flex; gap:8px; }
.woocommerce-orders-table__cell-order-actions .button,
.woocommerce-MyAccount-downloads-file{
	display:inline-flex; align-items:center; padding:8px 16px; border-radius:var(--radius-pill);
	border:1.5px solid var(--border); color:var(--text); font-weight:700; font-size:12px;
	text-transform:uppercase; letter-spacing:.02em; transition:border-color .2s, color .2s;
}
.woocommerce-orders-table__cell-order-actions .button:hover{ border-color:var(--volt); color:var(--volt); }
.woocommerce-orders-table__cell-order-actions .button.pay,
.woocommerce-orders-table__cell-order-actions .button.view{
	border-color:var(--volt); background:var(--volt); color:#fff;
}

.woocommerce-Message,
.woocommerce-info{
	list-style:none; margin:0 0 18px; padding:16px 18px; background:rgba(255,255,255,.03);
	border:1px solid var(--border); border-radius:var(--radius-sm); color:var(--text-muted); font-size:13.5px;
	display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
}
.woocommerce-Message .button{
	padding:9px 18px; border-radius:var(--radius-pill); background:var(--volt); color:#fff;
	font-weight:700; font-size:12.5px; text-transform:uppercase;
}

/* ---- Single order view ---- */
.woocommerce-order-details,
.woocommerce-customer-details{ margin-bottom:26px; }
.woocommerce-order-details__title,
.woocommerce-column__title{ font-size:16px; text-transform:uppercase; margin-bottom:12px; }
table.woocommerce-table--order-details{ width:100%; border-collapse:collapse; font-size:13.5px; }
table.woocommerce-table--order-details th{
	text-align:left; padding:10px 0; color:var(--text-faint); font-size:11.5px; text-transform:uppercase;
	border-bottom:1px solid var(--border);
}
table.woocommerce-table--order-details td{ padding:12px 0; border-bottom:1px solid var(--border); color:var(--text); }
table.woocommerce-table--order-details tfoot th,
table.woocommerce-table--order-details tfoot td{ border-bottom:0; }
table.woocommerce-table--order-details tfoot tr:last-child th,
table.woocommerce-table--order-details tfoot tr:last-child td{ font-size:17px; font-weight:800; color:var(--volt); }
.woocommerce-table--order-details .product-name a{ color:var(--text); font-weight:600; }

address{ font-style:normal; color:var(--text-muted); line-height:1.7; font-size:13.5px; }

/* ---- Addresses ---- */
.woocommerce-Addresses{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
@media (max-width:640px){ .woocommerce-Addresses{ grid-template-columns:1fr; } }
.woocommerce-Address{
	background:var(--bg); border:1px solid var(--border); border-radius:var(--radius-sm); padding:20px;
}
.woocommerce-Address-title{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }
.woocommerce-Address-title h3{ margin:0; font-size:14px; text-transform:uppercase; }
.woocommerce-Address-title .edit{
	font-size:11.5px; font-weight:700; text-transform:uppercase; padding:6px 14px;
	border:1.5px solid var(--border); border-radius:var(--radius-pill); color:var(--text-muted);
}
.woocommerce-Address-title .edit:hover{ border-color:var(--volt); color:var(--volt); }

/* ---- Edit account / address forms (same field styling language as checkout) ---- */
.woocommerce-EditAccountForm,
.woocommerce-address-fields,
.woocommerce-form-row{ position:relative; }
.woocommerce-EditAccountForm .form-row,
.woocommerce-address-fields .form-row{ margin:0 0 16px; }
.woocommerce-EditAccountForm .form-row label,
.woocommerce-address-fields .form-row label,
.woocommerce-form-row label{
	display:block; font-size:12.5px; font-weight:700; letter-spacing:.02em; color:var(--text-muted);
	text-transform:uppercase; margin-bottom:6px;
}
.woocommerce-EditAccountForm input.input-text,
.woocommerce-EditAccountForm select,
.woocommerce-address-fields input.input-text,
.woocommerce-address-fields select,
.nutra-account-content input.woocommerce-Input,
.nutra-account-content select{
	width:100%; padding:13px 14px; background:var(--bg); border:1.5px solid var(--border);
	border-radius:var(--radius-sm); color:var(--text); font-size:14.5px; font-family:inherit;
	transition:border-color .2s, box-shadow .2s;
}
.woocommerce-EditAccountForm input.input-text:focus,
.woocommerce-address-fields input.input-text:focus,
.nutra-account-content input.woocommerce-Input:focus{
	outline:none; border-color:var(--volt); box-shadow:0 0 0 3px rgba(255,27,60,.15);
}
.woocommerce-EditAccountForm fieldset{ border:1px solid var(--border); border-radius:var(--radius-sm); padding:16px; margin:16px 0; }
.woocommerce-EditAccountForm legend{ padding:0 8px; font-size:12.5px; font-weight:700; text-transform:uppercase; color:var(--text-muted); }
.woocommerce-EditAccountForm button,
.woocommerce-address-fields button,
.nutra-account-content button[type="submit"]{
	padding:13px 26px; border:0; border-radius:var(--radius-pill);
	background:linear-gradient(135deg,var(--volt),var(--ember)); color:#fff; font-weight:800;
	font-size:13.5px; letter-spacing:.02em; text-transform:uppercase; cursor:pointer;
	transition:transform .18s, box-shadow .18s;
}
.woocommerce-EditAccountForm button:hover,
.woocommerce-address-fields button:hover,
.nutra-account-content button[type="submit"]:hover{ transform:translateY(-2px); box-shadow:0 12px 28px rgba(255,27,60,.3); }

/* ---- Downloads table ---- */
.woocommerce-MyAccount-downloads table{ width:100%; border-collapse:collapse; }
.woocommerce-MyAccount-downloads table th,
.woocommerce-MyAccount-downloads table td{ padding:12px 8px; border-bottom:1px solid var(--border); font-size:13.5px; }

/* ---- Notices (account pages don't load checkout-wc.css) ---- */
.woocommerce-NoticeGroup ul.woocommerce-error,
ul.woocommerce-error,
.woocommerce-error{
	list-style:none; margin:0 0 18px; padding:14px 16px; background:rgba(255,60,60,.08);
	border:1px solid rgba(255,60,60,.35); border-radius:var(--radius-sm); color:#ff8080; font-size:13.5px;
}
ul.woocommerce-error li{ margin:0; }

/* ---- Login / Register ---- */
.nutra-auth-layout{
	display:grid; grid-template-columns:1fr 1fr; gap:24px; padding:28px 0 80px; max-width:900px; margin:0 auto;
}
.nutra-auth-layout--single{ grid-template-columns:1fr; max-width:460px; }
@media (max-width:720px){ .nutra-auth-layout{ grid-template-columns:1fr; max-width:460px; } }

.nutra-auth-card{
	background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md); padding:28px 26px;
}
.nutra-auth-card h2{ margin-top:0; font-size:18px; text-transform:uppercase; margin-bottom:18px; }
.nutra-auth-card .form-row{ margin:0 0 16px; }
.nutra-auth-card .form-row label{
	display:block; font-size:12.5px; font-weight:700; letter-spacing:.02em; color:var(--text-muted);
	text-transform:uppercase; margin-bottom:6px;
}
.nutra-auth-card input.input-text{
	width:100%; padding:13px 14px; background:var(--bg); border:1.5px solid var(--border);
	border-radius:var(--radius-sm); color:var(--text); font-size:14.5px; font-family:inherit;
	transition:border-color .2s, box-shadow .2s;
}
.nutra-auth-card input.input-text:focus{ outline:none; border-color:var(--volt); box-shadow:0 0 0 3px rgba(255,27,60,.15); }
.nutra-auth-card .woocommerce-form-login__rememberme{
	display:flex; align-items:center; gap:8px; color:var(--text-muted); font-size:13px; font-weight:600;
	text-transform:none; margin-bottom:16px; cursor:pointer;
}
.nutra-auth-card button[type="submit"]{ width:100%; justify-content:center; }
.nutra-auth-card .lost_password{ margin-top:14px; text-align:center; font-size:13px; }
.nutra-auth-card .lost_password a{ color:var(--text-muted); }
.nutra-auth-card .lost_password a:hover{ color:var(--volt); }
.nutra-auth-card .nutra-auth-note{ font-size:13px; color:var(--text-muted); margin-bottom:16px; }

/* ---- Order Received / Thank You summary block ---- */

/* ==========================================================================
   ORDERS, ORDER DETAIL, AUTH FORMS, PAGINATION
   --------------------------------------------------------------------------
   These screens had no theme styling at all, so they fell through to
   WooCommerce's bundled woocommerce.css — which is built for a light theme.
   On the dark site that meant pale grey tables with near-invisible text on
   the pages customers use most (My Orders, View Order, Lost Password).

   Mobile is the priority here: the orders table becomes a stack of cards
   below 700px, because a 5-column table on a 375px screen is unusable no
   matter how it's styled.
   ========================================================================== */

/* ---------- Orders list ---------- */
.woocommerce-orders-table,
.woocommerce-MyAccount-content table.shop_table{
	width:100%; border-collapse:separate; border-spacing:0 10px;
	border:0 !important; background:none !important; margin:0;
}
.woocommerce-orders-table thead th,
.woocommerce-MyAccount-content table.shop_table thead th{
	background:none !important; border:0 !important; padding:0 14px 6px;
	font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.05em;
	color:var(--text-faint); text-align:left;
}
.woocommerce-orders-table tbody tr,
.woocommerce-MyAccount-content table.shop_table tbody tr{
	background:var(--surface); border-radius:var(--radius-md);
}
.woocommerce-orders-table tbody td,
.woocommerce-MyAccount-content table.shop_table tbody td{
	background:none !important; border:0 !important; border-top:1px solid var(--border) !important;
	border-bottom:1px solid var(--border) !important;
	padding:16px 14px; font-size:13.5px; color:var(--text); vertical-align:middle;
}
.woocommerce-orders-table tbody td:first-child,
.woocommerce-MyAccount-content table.shop_table tbody td:first-child{
	border-left:1px solid var(--border) !important;
	border-radius:var(--radius-md) 0 0 var(--radius-md);
}
.woocommerce-orders-table tbody td:last-child,
.woocommerce-MyAccount-content table.shop_table tbody td:last-child{
	border-right:1px solid var(--border) !important;
	border-radius:0 var(--radius-md) var(--radius-md) 0; text-align:right;
}
.woocommerce-orders-table__cell-order-number a{ font-weight:800; color:var(--text); }
.woocommerce-orders-table__cell-order-number a:hover{ color:var(--red); }
.woocommerce-orders-table__cell-order-status{ font-weight:700; }
.woocommerce-orders-table .woocommerce-button,
.woocommerce-MyAccount-content .woocommerce-button.button{
	display:inline-flex; align-items:center; justify-content:center;
	padding:9px 18px; border-radius:var(--radius-pill); border:1.5px solid var(--border-strong);
	background:var(--surface-2); color:var(--text); font-size:12px; font-weight:800;
	text-transform:uppercase; letter-spacing:.03em; transition:.2s var(--ease); white-space:nowrap;
}
.woocommerce-orders-table .woocommerce-button:hover,
.woocommerce-MyAccount-content .woocommerce-button.button:hover{
	border-color:var(--red); color:var(--red); background:var(--surface);
}

/* Orders as cards on phones. Each cell gets its column label back via the
   data-title attribute WooCommerce already prints, so nothing is lost when
   the header row disappears. */
@media (max-width:700px){
	.woocommerce-orders-table thead,
	.woocommerce-MyAccount-content table.shop_table thead{ display:none; }
	.woocommerce-orders-table,
	.woocommerce-orders-table tbody,
	.woocommerce-MyAccount-content table.shop_table,
	.woocommerce-MyAccount-content table.shop_table tbody{ display:block; }
	.woocommerce-orders-table tbody tr,
	.woocommerce-MyAccount-content table.shop_table tbody tr{
		display:block; border:1px solid var(--border); border-radius:var(--radius-md);
		padding:6px 14px; margin:0 0 12px;
	}
	.woocommerce-orders-table tbody td,
	.woocommerce-MyAccount-content table.shop_table tbody td{
		display:flex; align-items:center; justify-content:space-between; gap:14px;
		border:0 !important; border-radius:0 !important; padding:9px 0; text-align:right !important;
	}
	.woocommerce-orders-table tbody td::before,
	.woocommerce-MyAccount-content table.shop_table tbody td::before{
		content:attr(data-title); flex:0 0 auto;
		font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.04em;
		color:var(--text-faint);
	}
	.woocommerce-orders-table tbody td:last-child,
	.woocommerce-MyAccount-content table.shop_table tbody td:last-child{
		border-top:1px solid var(--border) !important; padding-top:12px; margin-top:4px;
	}
	.woocommerce-orders-table .woocommerce-button,
	.woocommerce-MyAccount-content .woocommerce-button.button{ width:auto; }
}

/* ---------- Single order view + thank-you details ---------- */
.woocommerce-order-details,
.woocommerce-customer-details,
.woocommerce-column--billing-address,
.woocommerce-column--shipping-address{
	background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg);
	padding:22px; margin:0 0 20px;
}
.woocommerce-order-details__title,
.woocommerce-column__title,
.woocommerce-customer-details h2{
	font-size:15.5px; text-transform:uppercase; letter-spacing:.03em; margin:0 0 16px;
}
.woocommerce-order-details table.shop_table{
	width:100%; border:0 !important; border-collapse:collapse; margin:0;
}
.woocommerce-order-details table.shop_table th,
.woocommerce-order-details table.shop_table td{
	border:0 !important; border-bottom:1px solid var(--border) !important;
	padding:12px 0; font-size:13.5px; color:var(--text); background:none !important;
}
.woocommerce-order-details table.shop_table thead th{
	font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.05em; color:var(--text-faint);
}
.woocommerce-order-details table.shop_table td:last-child,
.woocommerce-order-details table.shop_table th:last-child{ text-align:right; }
.woocommerce-order-details table.shop_table tfoot tr:last-child th,
.woocommerce-order-details table.shop_table tfoot tr:last-child td{
	border-bottom:0 !important; font-size:17px; font-weight:800; color:var(--volt); padding-top:16px;
}
.woocommerce-order-details .product-name a{ color:var(--text); font-weight:600; }
.woocommerce-order-details .product-name a:hover{ color:var(--red); }
.woocommerce-customer-details address{
	font-style:normal; line-height:1.8; color:var(--text-muted); font-size:13.5px;
	border:0; padding:0;
}
.woocommerce-columns--addresses{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media (max-width:700px){
	.woocommerce-columns--addresses{ grid-template-columns:1fr; }
	.woocommerce-order-details,
	.woocommerce-customer-details,
	.woocommerce-column--billing-address,
	.woocommerce-column--shipping-address{ padding:16px; }
}

/* Order status timeline WooCommerce prints on the thank-you page */
.woocommerce-order-overview{
	list-style:none; display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
	gap:14px; margin:0 0 22px; padding:0;
}
.woocommerce-order-overview li{
	background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md);
	padding:14px 16px; font-size:11px; font-weight:800; text-transform:uppercase;
	letter-spacing:.04em; color:var(--text-faint); border-left:0;
}
.woocommerce-order-overview li strong{
	display:block; margin-top:5px; font-size:14.5px; font-weight:800;
	text-transform:none; letter-spacing:0; color:var(--text);
}

/* ---------- Lost password / reset password / register ---------- */
.woocommerce-ResetPassword,
.woocommerce-form-register,
.woocommerce-form-login{ margin:0; }
.woocommerce-ResetPassword .form-row,
.woocommerce-form-register .form-row,
.woocommerce-form-login .form-row{
	display:flex; flex-direction:column; gap:7px; margin:0 0 16px; width:auto !important; float:none !important;
}
.woocommerce-ResetPassword label,
.woocommerce-form-register label,
.woocommerce-form-login label{
	font-size:11.5px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; color:var(--text-muted);
}
.woocommerce-ResetPassword input.input-text,
.woocommerce-form-register input.input-text,
.woocommerce-form-login input.input-text,
.woocommerce-form-register input[type="password"],
.woocommerce-form-login input[type="password"]{
	width:100%; padding:13px 16px; border-radius:var(--radius-md);
	border:1.5px solid var(--border-strong); background:var(--bg-soft); color:var(--text);
	font-size:16px; font-family:inherit; outline:none; transition:border-color .2s, box-shadow .2s;
}
.woocommerce-ResetPassword input.input-text:focus,
.woocommerce-form-register input.input-text:focus,
.woocommerce-form-login input.input-text:focus{
	border-color:var(--red); box-shadow:0 0 0 3px rgba(255,27,60,.14);
}
.woocommerce-ResetPassword button,
.woocommerce-form-register button,
.woocommerce-form-login button.woocommerce-form-login__submit{
	display:inline-flex; align-items:center; justify-content:center; width:100%;
	padding:14px 26px; border:0; border-radius:var(--radius-pill);
	background:linear-gradient(135deg,var(--volt),var(--volt-dark)); color:#fff;
	font-family:inherit; font-weight:700; font-size:14px; letter-spacing:.03em;
	text-transform:uppercase; cursor:pointer; box-shadow:var(--shadow-red);
	transition:transform .25s var(--ease), filter .2s;
}
.woocommerce-ResetPassword button:hover,
.woocommerce-form-register button:hover,
.woocommerce-form-login button.woocommerce-form-login__submit:hover{
	filter:brightness(1.12); transform:translateY(-2px);
}
.woocommerce-form-login__rememberme,
.woocommerce-form-register .woocommerce-privacy-policy-text{
	font-size:12.5px; color:var(--text-muted); text-transform:none; letter-spacing:0; font-weight:500;
}
.woocommerce-form-login__rememberme input{ accent-color:var(--red); margin-right:6px; }
.woocommerce-LostPassword a,
.woocommerce-privacy-policy-link{ color:var(--red); font-size:12.5px; font-weight:700; }
.woocommerce-password-strength{
	margin-top:8px; padding:8px 12px; border-radius:var(--radius-sm); font-size:12px; font-weight:700;
	background:rgba(255,255,255,.03); border:1px solid var(--border);
}
.woocommerce-password-strength.strong{ color:var(--green); border-color:rgba(47,224,125,.35); }
.woocommerce-password-strength.short,
.woocommerce-password-strength.bad{ color:#ff8080; border-color:rgba(255,60,60,.35); }
.woocommerce-password-hint{ display:block; margin-top:6px; font-size:12px; color:var(--text-faint); }

/* ---------- Pagination ---------- */
.woocommerce-pagination ul,
.woocommerce-MyAccount-content .woocommerce-pagination ul{
	display:flex; gap:8px; list-style:none; margin:22px 0 0; padding:0; border:0; justify-content:center;
}
.woocommerce-pagination li{ border:0 !important; }
.woocommerce-pagination a,
.woocommerce-pagination span{
	display:flex; align-items:center; justify-content:center; min-width:40px; height:40px; padding:0 12px;
	border-radius:var(--radius-sm); border:1.5px solid var(--border-strong);
	background:var(--surface); color:var(--text); font-weight:700; font-size:13.5px; transition:.2s var(--ease);
}
.woocommerce-pagination a:hover{ border-color:var(--red); color:var(--red); }
.woocommerce-pagination .current{
	background:linear-gradient(135deg,var(--volt),var(--volt-dark)); border-color:var(--red); color:#fff;
}

/* ---------- Account nav on phones ----------
   The vertical sidebar becomes a horizontal scrolling pill row so the
   content the customer came for isn't pushed below a full-height menu. */
@media (max-width:860px){
	.nutra-account-layout{ grid-template-columns:1fr; gap:18px; }
	.nutra-account-nav{ position:static; }
	.woocommerce-MyAccount-navigation ul{
		display:flex; gap:8px; overflow-x:auto; padding-bottom:4px;
		scrollbar-width:none; -webkit-overflow-scrolling:touch;
	}
	.woocommerce-MyAccount-navigation ul::-webkit-scrollbar{ display:none; }
	.woocommerce-MyAccount-navigation-link{ flex:0 0 auto; }
	.woocommerce-MyAccount-navigation-link a{
		white-space:nowrap; padding:10px 16px; border-radius:var(--radius-pill);
		border:1.5px solid var(--border-strong); font-size:12.5px;
	}
	.nutra-account-content{ padding:18px 16px; }
}

/* ==========================================================================
   FINAL OVERRIDES — must stay last in this file
   --------------------------------------------------------------------------
   Two things were fighting each other and breaking the Addresses screen:

   1. WooCommerce lays out address columns with FLOATS:
        .col2-set .col-1 { float:left; width:48% }
        .col2-set .col-2 { float:right; width:48% }
      Those widths are relative to whatever ancestor happened to establish the
      containing block, which here collapsed them into two narrow strips —
      hence "Billing address" wrapping onto two lines and body text breaking
      one word per line, with the cards sitting diagonally instead of side by
      side.

   2. This file grew a second set of .woocommerce-orders-table rules (a flex
      layout) on top of the original one, so the two were overriding each
      other unpredictably depending on selector order.

   Everything below states the final intent explicitly and unsets the float
   model rather than trying to out-specify it piece by piece.
   ========================================================================== */

/* ---- Addresses ---- */
.woocommerce-Addresses,
.woocommerce-account .col2-set{
	display:grid !important; grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
	gap:20px; width:100%; margin:22px 0 0; float:none !important;
}
.woocommerce-Addresses .col-1,
.woocommerce-Addresses .col-2,
.woocommerce-account .col2-set .col-1,
.woocommerce-account .col2-set .col-2{
	float:none !important; width:auto !important; max-width:none !important;
	margin:0 !important; padding:0 !important; min-width:0;
}
.woocommerce-Address{
	background:var(--bg-soft); border:1px solid var(--border); border-radius:var(--radius-md);
	padding:20px; height:100%; display:flex; flex-direction:column; gap:12px;
}
.woocommerce-Address-title{
	display:flex; align-items:center; justify-content:space-between; gap:12px;
	margin:0; padding:0 0 12px; border-bottom:1px solid var(--border);
}
.woocommerce-Address-title h2,
.woocommerce-Address-title h3{
	margin:0; font-size:14px; text-transform:uppercase; letter-spacing:.04em;
	white-space:nowrap; line-height:1.3;
}
.woocommerce-Address-title .edit{
	flex:0 0 auto; padding:7px 14px; border-radius:var(--radius-pill);
	border:1.5px solid var(--border-strong); background:var(--surface-2);
	color:var(--text) !important; font-size:11px; font-weight:800;
	text-transform:uppercase; letter-spacing:.03em; white-space:nowrap;
	transition:.2s var(--ease);
}
.woocommerce-Address-title .edit:hover{ border-color:var(--red); color:var(--red) !important; }
.woocommerce-Address address{
	font-style:normal; margin:0; padding:0; border:0;
	font-size:13.5px; line-height:1.75; color:var(--text-muted);
}

/* ---- Account nav ----
   The previous attempt put white-space:nowrap + overflow:hidden on an anchor
   that is display:flex. A flex container does not shrink-wrap text the way a
   block does, and text-overflow does not apply to it — the result was every
   label clipped to about two characters ("Da", "Or", "Lo") with the active
   item's red pill shrunk to match. Making the anchor a plain block element is
   what actually makes width:100% + ellipsis behave. */
/* Neutralise WooCommerce's float layout for the account nav. Its own CSS is
   `.woocommerce-account .woocommerce-MyAccount-navigation { float:left;
   width:30% }`, which is meant for WooCommerce's two-column default layout —
   here the nav sits in its own grid column and must simply fill it. */
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-MyAccount-navigation{
	float:none !important; width:100% !important; max-width:none !important; margin:0;
}
.woocommerce-account .woocommerce-MyAccount-content{
	float:none !important; width:100% !important;
}
.woocommerce-MyAccount-navigation ul{
	display:block !important; list-style:none; margin:0; padding:0; width:100%; overflow:visible;
}
.woocommerce-MyAccount-navigation-link{
	display:block !important; width:100%; margin:0 0 2px; flex:none !important;
}
.woocommerce-MyAccount-navigation-link a{
	display:block !important; width:100%; box-sizing:border-box;
	padding:12px 14px; border-radius:var(--radius-sm);
	font-weight:700; font-size:13.5px; line-height:1.35; text-transform:none;
	white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.woocommerce-MyAccount-navigation-link.is-active a{
	background:linear-gradient(135deg,var(--volt),var(--volt-dark)) !important;
	color:#fff !important; box-shadow:0 8px 20px rgba(255,27,60,.25);
}
.nutra-account-layout{ grid-template-columns:250px minmax(0,1fr); }
@media (max-width:860px){ .nutra-account-layout{ grid-template-columns:minmax(0,1fr); } }

/* ---- Orders table: retire the earlier flex variant ----
   The card/table treatment further up this file is the one that should win;
   these unsets stop the older flex rules from half-applying. */
.woocommerce-orders-table thead{ display:table-header-group; }
.woocommerce-orders-table tbody tr,
.woocommerce-orders-table tr{
	display:table-row; flex-wrap:initial; align-items:initial; gap:0; padding:0;
	border-bottom:0;
}
.woocommerce-orders-table__cell-order-actions{ margin-left:0; display:table-cell; }
.woocommerce-orders-table__cell-order-status{
	padding:5px 12px; border-radius:var(--radius-pill); font-size:11.5px;
	text-transform:uppercase; letter-spacing:.03em;
	background:rgba(255,27,60,.12); color:var(--red); display:inline-block;
}
@media (max-width:700px){
	.woocommerce-orders-table thead{ display:none; }
	.woocommerce-orders-table tbody tr,
	.woocommerce-orders-table tr{ display:block; }
	.woocommerce-orders-table__cell-order-actions{ display:flex; justify-content:flex-end; }
}

/* ---- Edit-account + address forms: kill WooCommerce's float columns ---- */
.woocommerce-address-fields__field-wrapper,
.woocommerce-EditAccountForm{
	display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px;
}
.woocommerce-address-fields .form-row,
.woocommerce-EditAccountForm .form-row{
	float:none !important; width:auto !important; margin:0 !important;
	display:flex; flex-direction:column; gap:7px; min-width:0;
}
.woocommerce-address-fields .form-row-wide,
.woocommerce-EditAccountForm .form-row-wide,
.woocommerce-EditAccountForm fieldset,
.woocommerce-EditAccountForm legend,
.woocommerce-EditAccountForm p:last-of-type,
.woocommerce-address-fields__field-wrapper + p{ grid-column:1 / -1; }
.woocommerce-address-fields input.input-text,
.woocommerce-address-fields select,
.woocommerce-address-fields textarea,
.woocommerce-EditAccountForm input.input-text{
	width:100% !important; padding:13px 16px; border-radius:var(--radius-md);
	border:1.5px solid var(--border-strong); background:var(--bg-soft); color:var(--text);
	font-size:16px; font-family:inherit; outline:none;
}
.woocommerce-address-fields button,
.woocommerce-EditAccountForm button{
	justify-self:start; padding:14px 30px; border:0; border-radius:var(--radius-pill);
	background:linear-gradient(135deg,var(--volt),var(--volt-dark)); color:#fff;
	font-weight:700; font-size:13.5px; text-transform:uppercase; letter-spacing:.03em;
	cursor:pointer; box-shadow:var(--shadow-red);
}
@media (max-width:640px){
	.woocommerce-address-fields__field-wrapper,
	.woocommerce-EditAccountForm{ grid-template-columns:minmax(0,1fr); }
	.woocommerce-address-fields button,
	.woocommerce-EditAccountForm button{ width:100%; justify-self:stretch; }
	.woocommerce-Address{ padding:16px; }
}

/* Mobile account nav re-stated AFTER the desktop block above, so the
   horizontal pill row still wins on small screens (the block rules above use
   !important to beat WooCommerce, so the mobile variant has to match). */
@media (max-width:860px){
	.woocommerce-MyAccount-navigation ul{
		display:flex !important; gap:8px; overflow-x:auto; padding-bottom:4px;
		scrollbar-width:none;
	}
	.woocommerce-MyAccount-navigation ul::-webkit-scrollbar{ display:none; }
	.woocommerce-MyAccount-navigation-link{
		display:block !important; width:auto; flex:0 0 auto !important; margin:0;
	}
	.woocommerce-MyAccount-navigation-link a{
		width:auto; padding:10px 16px; border-radius:var(--radius-pill);
		border:1.5px solid var(--border-strong); font-size:12.5px; overflow:visible;
	}
}

/* ==========================================================================
   ORDER RECEIVED / THANK YOU
   --------------------------------------------------------------------------
   .order-success is a centred column flex. In that context every child is
   sized to its own content, which is right for the tick, the heading and the
   order-number pill — and completely wrong for the order tables WooCommerce
   appends through woocommerce_thankyou. Those collapsed to their widest word,
   so the billing address printed one word per line down a narrow strip with
   the rest of the page empty around it.

   So: badges keep shrink-to-fit, blocks of content get a real width back.
   ========================================================================== */
.order-success > section,
.order-success > .woocommerce-order-details,
.order-success > .woocommerce-customer-details,
.order-success > .woocommerce-order-overview,
.order-success > .woocommerce-notice,
.order-success > .nutra-order-meta,
.order-success > table,
.order-success > .woocommerce-bacs-bank-details{
  align-self:stretch;
  width:100%;
  max-width:820px;
  margin-inline:auto;
  text-align:left;
}

/* ---- At-a-glance strip ---- */
.nutra-order-meta{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:2px;
  margin-top:22px; border:1px solid var(--border-strong); border-radius:var(--radius-lg);
  background:var(--border); overflow:hidden;
}
.nutra-order-meta > div{
  display:flex; flex-direction:column; gap:5px;
  padding:16px 18px; background:var(--surface);
}
.nutra-order-meta span{
  font-size:10.5px; text-transform:uppercase; letter-spacing:.12em; color:var(--text-faint);
}
.nutra-order-meta strong{ font-size:14px; color:var(--text); font-weight:700; line-height:1.35; }

/* ---- WooCommerce's own order details table ---- */
.woocommerce-order-details,
.woocommerce-customer-details{
  margin-top:26px; padding:26px 28px;
  background:var(--surface); border:1px solid var(--border-strong); border-radius:var(--radius-lg);
}
.woocommerce-order-details__title,
.woocommerce-column__title,
.woocommerce-customer-details h2{
  font-size:16px; text-transform:uppercase; letter-spacing:.1em; margin:0 0 18px;
  color:var(--text);
}
.woocommerce-table--order-details{
  width:100%; border-collapse:collapse; font-size:14px;
}
.woocommerce-table--order-details thead th{
  text-align:left; padding:0 0 12px; font-size:10.5px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--text-faint); font-weight:700;
  border-bottom:1px solid var(--border);
}
.woocommerce-table--order-details thead th:last-child,
.woocommerce-table--order-details tbody td:last-child,
.woocommerce-table--order-details tfoot td{ text-align:right; }
.woocommerce-table--order-details tbody td{
  padding:15px 0; border-bottom:1px solid var(--border); color:var(--text); vertical-align:top;
}
.woocommerce-table--order-details tbody td a{ color:var(--text); font-weight:600; }
.woocommerce-table--order-details tbody td a:hover{ color:var(--volt); }
.woocommerce-table--order-details .product-quantity{ color:var(--text-faint); font-weight:600; }
.woocommerce-table--order-details tfoot th{
  text-align:left; padding:11px 0; font-weight:600; color:var(--text-muted);
  font-size:13.5px; border:0;
}
.woocommerce-table--order-details tfoot td{ padding:11px 0; color:var(--text); border:0; }
/* The grand total is the number everyone actually looks for. */
.woocommerce-table--order-details tfoot tr:last-child th,
.woocommerce-table--order-details tfoot tr:last-child td{
  padding-top:16px; border-top:1px solid var(--border-strong);
  font-size:18px; font-weight:800; color:var(--volt);
}
.woocommerce-order-details .wc-item-meta,
.woocommerce-order-details .variation{
  margin:6px 0 0; padding:0; list-style:none; font-size:12.5px; color:var(--text-faint);
}
.woocommerce-order-details .wc-item-meta p{ margin:0; }

/* ---- Billing / shipping addresses ---- */
.woocommerce-customer-details .woocommerce-columns--addresses{
  display:grid; grid-template-columns:1fr 1fr; gap:26px;
}
/* WooCommerce's own stylesheet floats these into .col-1/.col-2 halves. Inside
   a grid that float does nothing useful and only risks collapsing the row. */
.woocommerce-customer-details .col-1,
.woocommerce-customer-details .col-2,
.woocommerce-customer-details .woocommerce-column{ float:none; width:auto; padding:0; }
.woocommerce-customer-details address{
  font-style:normal; line-height:1.75; color:var(--text-muted); font-size:14px;
  padding:16px 18px; border:1px solid var(--border); border-radius:var(--radius-md);
  background:var(--bg-soft, rgba(255,255,255,.02));
}
.woocommerce-customer-details address p{ margin:10px 0 0; display:flex; align-items:center; gap:9px; }
.woocommerce-customer-details address .woocommerce-customer-details--phone,
.woocommerce-customer-details address .woocommerce-customer-details--email{ color:var(--text); }

@media (max-width:720px){
  .order-success{ padding:48px 16px 70px; }
  .woocommerce-order-details,
  .woocommerce-customer-details{ padding:20px 18px; margin-top:20px; }
  .woocommerce-customer-details .woocommerce-columns--addresses{ grid-template-columns:1fr; gap:16px; }
  .woocommerce-table--order-details{ font-size:13.5px; }
  .nutra-order-meta{ grid-template-columns:1fr 1fr; }
}
@media (max-width:420px){
  .nutra-order-meta{ grid-template-columns:1fr; }
}