/* =====================================================================
   WooCommerce account area — My Account (all endpoints), login/register,
   lost/reset password, and order-received. Native WooCommerce templates,
   styled to the Momentus dark-purple design system. CSS-only (no template
   overrides, no core edits); scoped under body.vp-dark + WooCommerce body
   classes so nothing leaks. Inputs/buttons/notices are already themed in
   vp.css — this file handles account-specific LAYOUT + polish.
   ===================================================================== */

/* ── Page title + section headings (readable on dark) ─────────────── */
body.vp-dark.woocommerce-account .entry-title,
body.vp-dark.woocommerce-account h1.entry-title,
body.vp-dark.woocommerce-checkout .entry-title,
body.vp-dark.woocommerce-account .et_pb_title_container h1,
body.vp-dark.woocommerce-account h1 {
  color: var(--vp-white);
  font-family: var(--vp-font-display);
}
body.vp-dark.woocommerce-account .woocommerce > h2,
body.vp-dark .woocommerce h2,
body.vp-dark .woocommerce-MyAccount-content h2,
body.vp-dark #customer_login h2 {
  color: var(--vp-white);
  font-family: var(--vp-font-display);
  font-weight: 700;
  font-size: 1.15rem;
  letter-spacing: -0.01em;
  margin-bottom: 1rem;
}
body.vp-dark.woocommerce-account a { color: var(--vp-primary-light); }
body.vp-dark.woocommerce-account a:hover { color: var(--vp-primary-bright); }

/* ── LOGIN / REGISTER (logged-out) ────────────────────────────────── */
body.vp-dark #customer_login.u-columns {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  align-items: stretch;
  max-width: 960px;
  margin: 0 auto;
}
body.vp-dark #customer_login .u-column1,
body.vp-dark #customer_login .u-column2 {
  flex: 1 1 340px;
  width: auto;
  float: none;
  background: var(--vp-surface);
  border: 1px solid var(--vp-line);
  border-radius: var(--vp-radius-lg);
  padding: 2rem 1.9rem;
}
body.vp-dark .woocommerce form.login,
body.vp-dark .woocommerce form.register {
  border: 0;
  padding: 0;
  margin: 0;
}
body.vp-dark .woocommerce-form-login__rememberme,
body.vp-dark .woocommerce-form-register__submit,
body.vp-dark .woocommerce-form-login__submit { margin-top: 0.25rem; }
body.vp-dark .woocommerce-form-login .woocommerce-form-login__rememberme { display: inline-flex; align-items: center; gap: 0.4rem; color: var(--vp-gray-400); font-size: 0.85rem; }
body.vp-dark .woocommerce-LostPassword { margin-top: 1rem; font-size: 0.85rem; }
body.vp-dark .woocommerce form.register .woocommerce-privacy-policy-text p,
body.vp-dark .woocommerce-form-register em,
body.vp-dark .woocommerce form .woocommerce-privacy-policy-text { color: var(--vp-gray-500); font-size: 0.8rem; line-height: 1.6; }

/* ── LOGGED-IN: navigation sidebar + content ─────────────────────── */
body.vp-dark.woocommerce-account .woocommerce {
  display: flex;
  flex-wrap: wrap;
  gap: 1.75rem;
  align-items: flex-start;
}
body.vp-dark .woocommerce-MyAccount-navigation {
  flex: 0 0 240px;
  width: 240px;
  float: none;
  margin: 0;
  background: var(--vp-surface);
  border: 1px solid var(--vp-line);
  border-radius: var(--vp-radius-lg);
  overflow: hidden;
}
body.vp-dark .woocommerce-MyAccount-content {
  flex: 1 1 420px;
  width: auto;
  float: none;
  min-width: 0;
}
body.vp-dark .woocommerce-MyAccount-navigation ul,
body.vp-dark .woocommerce-MyAccount-navigation ul li { list-style: none !important; }
body.vp-dark .woocommerce-MyAccount-navigation ul { margin: 0; padding: 0.5rem; }
body.vp-dark .woocommerce-MyAccount-navigation ul li { margin: 0; border: 0; padding: 0; }
/* Kill any theme/Divi list bullet leaking in front of the nav links. */
body.vp-dark .woocommerce-MyAccount-navigation ul li::before,
body.vp-dark .woocommerce-MyAccount-navigation ul li::marker { content: none !important; display: none !important; background: none !important; }
body.vp-dark .woocommerce-MyAccount-navigation ul li a {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.7rem 0.85rem;
  border-radius: var(--vp-radius-sm);
  color: var(--vp-gray-300);
  font-family: var(--vp-font-display);
  font-size: 0.86rem;
  font-weight: 600;
  text-decoration: none;
  transition: background var(--vp-transition), color var(--vp-transition);
}
body.vp-dark .woocommerce-MyAccount-navigation ul li a:hover { background: rgba(255, 255, 255, 0.05); color: var(--vp-white); }
body.vp-dark .woocommerce-MyAccount-navigation ul li.is-active a {
  background: rgba(var(--vp-primary-rgb), 0.18);
  color: var(--vp-white);
}
/* Nav icons (CSS ::before per endpoint — no template override). */
body.vp-dark .woocommerce-MyAccount-navigation ul li a::before {
  content: "";
  width: 17px; height: 17px; flex-shrink: 0;
  background-repeat: no-repeat; background-position: center; background-size: contain;
  opacity: 0.9;
}
body.vp-dark .woocommerce-MyAccount-navigation-link--dashboard a::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 24 24' fill='none' stroke='%23ce83e8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7'/%3E%3Crect x='14' y='3' width='7' height='7'/%3E%3Crect x='14' y='14' width='7' height='7'/%3E%3Crect x='3' y='14' width='7' height='7'/%3E%3C/svg%3E"); }
body.vp-dark .woocommerce-MyAccount-navigation-link--orders a::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 24 24' fill='none' stroke='%23ce83e8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z'/%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M16 10a4 4 0 0 1-8 0'/%3E%3C/svg%3E"); }
body.vp-dark .woocommerce-MyAccount-navigation-link--downloads a::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 24 24' fill='none' stroke='%23ce83e8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpolyline points='7 10 12 15 17 10'/%3E%3Cline x1='12' y1='15' x2='12' y2='3'/%3E%3C/svg%3E"); }
body.vp-dark .woocommerce-MyAccount-navigation-link--edit-address a::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 24 24' fill='none' stroke='%23ce83e8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E"); }
body.vp-dark .woocommerce-MyAccount-navigation-link--edit-account a::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 24 24' fill='none' stroke='%23ce83e8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E"); }
body.vp-dark .woocommerce-MyAccount-navigation-link--customer-logout a::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 24 24' fill='none' stroke='%23ce83e8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpolyline points='16 17 21 12 16 7'/%3E%3Cline x1='21' y1='12' x2='9' y2='12'/%3E%3C/svg%3E"); }

/* ── DASHBOARD ────────────────────────────────────────────────────── */
body.vp-dark .woocommerce-MyAccount-content > p { color: var(--vp-body); line-height: 1.75; }
body.vp-dark .woocommerce-MyAccount-content mark,
body.vp-dark .woocommerce-MyAccount-content strong { background: transparent; color: var(--vp-primary-light); font-weight: 700; }

/* ── TABLES (orders, downloads, order details) ───────────────────── */
body.vp-dark.woocommerce-account table.woocommerce-orders-table,
body.vp-dark.woocommerce-account table.woocommerce-table,
body.vp-dark.woocommerce-account table.shop_table {
  border: 1px solid var(--vp-line);
  border-radius: var(--vp-radius-lg);
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  width: 100%;
  background: var(--vp-surface);
}
body.vp-dark.woocommerce-account table.woocommerce-table thead th,
body.vp-dark.woocommerce-account table.shop_table thead th {
  background: rgba(var(--vp-primary-rgb), 0.1);
  color: var(--vp-gray-300);
  font-family: var(--vp-font-display);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.85rem 1rem;
  border: 0;
  text-align: left;
}
body.vp-dark.woocommerce-account table.woocommerce-table td,
body.vp-dark.woocommerce-account table.shop_table td,
body.vp-dark.woocommerce-account table.shop_table th {
  padding: 0.85rem 1rem;
  border: 0;
  border-top: 1px solid var(--vp-line);
  color: var(--vp-body);
  font-size: 0.88rem;
  vertical-align: middle;
}
body.vp-dark.woocommerce-account table.shop_table tfoot th,
body.vp-dark.woocommerce-account table.shop_table tfoot td { color: var(--vp-white); font-weight: 700; }
body.vp-dark .woocommerce-orders-table__cell-order-status,
body.vp-dark .woocommerce-orders-table .order-status {
  display: inline-block;
  padding: 0.15rem 0.6rem;
  border-radius: var(--vp-radius-pill);
  background: rgba(var(--vp-primary-rgb), 0.16);
  color: var(--vp-primary-light);
  font-size: 0.72rem;
  font-weight: 700;
}

/* ── ADDRESSES ────────────────────────────────────────────────────── */
body.vp-dark .woocommerce-Addresses.u-columns {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin: 0;
}
body.vp-dark .woocommerce-Addresses .u-column1,
body.vp-dark .woocommerce-Addresses .u-column2 {
  flex: 1 1 300px;
  width: auto;
  float: none;
  background: var(--vp-surface);
  border: 1px solid var(--vp-line);
  border-radius: var(--vp-radius-lg);
  padding: 1.5rem 1.6rem;
}
body.vp-dark .woocommerce-Address-title h3 { color: var(--vp-white); font-family: var(--vp-font-display); font-size: 1rem; }
body.vp-dark .woocommerce-Address-title a.edit { font-size: 0.8rem; }
body.vp-dark .woocommerce-Address address { color: var(--vp-body); font-style: normal; line-height: 1.7; font-size: 0.9rem; border: 0; padding: 0; }

/* ── FORMS (edit account/address, reset password) ────────────────── */
body.vp-dark .woocommerce-EditAccountForm,
body.vp-dark .woocommerce-address-fields,
body.vp-dark .woocommerce-ResetPassword {
  max-width: 640px;
  background: var(--vp-surface);
  border: 1px solid var(--vp-line);
  border-radius: var(--vp-radius-lg);
  padding: 2rem 1.9rem;
}
body.vp-dark .woocommerce-EditAccountForm fieldset { border: 1px solid var(--vp-line); border-radius: var(--vp-radius); padding: 1.25rem 1.4rem; margin-top: 1.75rem; }
body.vp-dark .woocommerce-EditAccountForm fieldset legend { color: var(--vp-white); font-family: var(--vp-font-display); font-weight: 700; padding: 0 0.5rem; }
body.vp-dark .woocommerce form .form-row span.description,
body.vp-dark .woocommerce-EditAccountForm em { color: var(--vp-gray-500); font-size: 0.78rem; }

/* ── ORDER RECEIVED / VIEW ORDER (thank-you) ─────────────────────── */
body.vp-dark .woocommerce-order .woocommerce-thankyou-order-received,
body.vp-dark .woocommerce-order .woocommerce-notice--success {
  background: rgba(var(--vp-primary-rgb), 0.1);
  border: 1px solid rgba(var(--vp-primary-rgb), 0.3);
  border-radius: var(--vp-radius-lg);
  color: var(--vp-white);
  font-family: var(--vp-font-display);
  font-size: 1.05rem;
  font-weight: 700;
  padding: 1.25rem 1.5rem;
}
body.vp-dark .woocommerce-order .woocommerce-order-overview {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  list-style: none;
  margin: 1.5rem 0;
  padding: 0;
  border: 0;
}
body.vp-dark .woocommerce-order .woocommerce-order-overview li {
  flex: 1 1 150px;
  background: var(--vp-surface);
  border: 1px solid var(--vp-line);
  border-radius: var(--vp-radius);
  padding: 0.9rem 1.1rem;
  border-left-width: 1px;
  color: var(--vp-gray-500);
  font-family: var(--vp-font-display);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
body.vp-dark .woocommerce-order .woocommerce-order-overview li strong {
  display: block;
  margin-top: 0.35rem;
  color: var(--vp-white);
  font-size: 0.98rem;
  letter-spacing: -0.01em;
  text-transform: none;
}
body.vp-dark .woocommerce-order .woocommerce-column__title,
body.vp-dark .woocommerce-order h2 { color: var(--vp-white); font-family: var(--vp-font-display); }
body.vp-dark .woocommerce-customer-details .woocommerce-columns--addresses { display: flex; flex-wrap: wrap; gap: 1.5rem; }
body.vp-dark .woocommerce-customer-details .woocommerce-column {
  flex: 1 1 300px;
  background: var(--vp-surface);
  border: 1px solid var(--vp-line);
  border-radius: var(--vp-radius-lg);
  padding: 1.5rem;
}
body.vp-dark .woocommerce-customer-details address { color: var(--vp-body); border: 0; padding: 0; font-style: normal; line-height: 1.7; }

/* ── RESPONSIVE ───────────────────────────────────────────────────── */
@media (max-width: 860px) {
  body.vp-dark.woocommerce-account .woocommerce { display: block; }
  body.vp-dark .woocommerce-MyAccount-navigation { width: 100%; flex-basis: auto; margin-bottom: 1.5rem; }
  body.vp-dark .woocommerce-MyAccount-navigation ul { display: flex; flex-wrap: wrap; gap: 0.35rem; }
  body.vp-dark .woocommerce-MyAccount-navigation ul li { flex: 1 1 auto; }
  body.vp-dark .woocommerce-MyAccount-navigation ul li a { justify-content: center; }
}
@media (max-width: 600px) {
  body.vp-dark #customer_login .u-column1,
  body.vp-dark #customer_login .u-column2,
  body.vp-dark .woocommerce-Addresses .u-column1,
  body.vp-dark .woocommerce-Addresses .u-column2 { flex-basis: 100%; padding: 1.5rem 1.25rem; }
  body.vp-dark.woocommerce-account table.shop_table,
  body.vp-dark.woocommerce-account table.shop_table thead,
  body.vp-dark.woocommerce-account table.shop_table tbody,
  body.vp-dark.woocommerce-account table.shop_table th,
  body.vp-dark.woocommerce-account table.shop_table td,
  body.vp-dark.woocommerce-account table.shop_table tr { font-size: 0.82rem; }
}