/**
 * Customer account area and login form (classic WooCommerce templates).
 */

/* WooCommerce derives its classic form fields from these variables. */
.woocommerce-account {
  --wc-form-border-color: var(--wp--preset--color--line);
  --wc-form-border-radius: 10px;
  --wc-form-border-width: 1px;
  --wc-form-color-background: var(--wp--preset--color--background);
  --wc-form-color-text: var(--wp--preset--color--ink);
}

/* -------------------------------------------------------------------------
   Form fields
   ---------------------------------------------------------------------- */

.woocommerce-account .woocommerce form .form-row {
  margin: 0 0 1.25rem;
  padding: 0;
}
.woocommerce-account .woocommerce form .form-row label {
  display: block;
  margin-bottom: 0.5rem;
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--wp--preset--color--ink);
}
.woocommerce-account .woocommerce form .form-row .required {
  color: var(--wp--preset--color--primary);
  text-decoration: none;
}
.woocommerce-account .woocommerce form .form-row .input-text,
.woocommerce-account .woocommerce form .form-row select {
  padding: 0.875rem 1rem;
  font-size: 1rem;
  line-height: 1.4;
  transition: border-color .2s, box-shadow .2s;
}
.woocommerce-account .woocommerce form .form-row .input-text:focus,
.woocommerce-account .woocommerce form .form-row select:focus {
  outline: none;
  border-color: var(--wp--preset--color--primary);
  box-shadow: 0 0 0 3px var(--wp--preset--color--primary-muted);
}
.woocommerce-account .woocommerce form .form-row em,
.woocommerce-account .woocommerce form .form-row .description {
  display: block;
  margin-top: 0.375rem;
  font-size: 0.8125rem;
  font-style: normal;
  color: var(--wp--preset--color--ink-mute);
}
.woocommerce-account .woocommerce form .form-row .woocommerce-form__label-for-checkbox {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  font-weight: 400;
  cursor: pointer;
}
.woocommerce-account .woocommerce form .form-row input[type="checkbox"] {
  width: 1.125rem;
  height: 1.125rem;
  margin: 0;
  accent-color: var(--wp--preset--color--primary);
}
/* Display name: only used with product reviews (see Rescape\Custom\Account). */
.woocommerce-account .woocommerce form .form-row:has(#account_display_name) {
  display: none;
}
.woocommerce-account .woocommerce fieldset {
  margin: 2rem 0 0;
  padding: 0;
  border: 0;
}
.woocommerce-account .woocommerce legend {
  margin-bottom: 1rem;
  padding: 0;
  font-family: var(--wp--preset--font-family--display);
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 700;
}

/* Secondary buttons (e.g. "Bearbeiten", "Ansehen", "Zahlungsart
   hinzufügen") keep the pill shape of the primary button but stay quiet. */
.woocommerce-account .woocommerce .button:not(.wp-element-button),
.woocommerce-account .woocommerce-MyAccount-content table .button {
  display: inline-flex;
  align-items: center;
  padding: 0.5rem 1rem;
  border: 1px solid var(--wp--preset--color--line);
  border-radius: var(--rescape-radius-pill);
  background: transparent;
  color: var(--wp--preset--color--ink);
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
}
.woocommerce-account .woocommerce .button:not(.wp-element-button):hover,
.woocommerce-account .woocommerce-MyAccount-content table .button:hover {
  border-color: var(--wp--preset--color--ink-soft);
  background: var(--wp--preset--color--background-warm);
}

/* -------------------------------------------------------------------------
   Login
   ---------------------------------------------------------------------- */

/* The form brings its own "Anmelden" heading; the page title "Mein Konto"
   above it only repeats the context. */
.woocommerce-account main:has(.woocommerce-form-login) > .wp-block-post-title,
.woocommerce-account main:has(.woocommerce-form-login) > .wp-block-spacer,
.woocommerce-lost-password main > .wp-block-spacer {
  display: none;
}
.woocommerce-account main .woocommerce:has(> .woocommerce-form-login),
.woocommerce-lost-password main > .wp-block-post-content {
  max-width: 28rem;
}
.woocommerce-account .woocommerce:has(> .woocommerce-form-login) > h2,
.woocommerce-lost-password main > .wp-block-post-title {
  margin: 0 auto 1.5rem;
  font-size: var(--wp--preset--font-size--x-large);
  text-align: center;
}
.woocommerce-account .woocommerce form.login,
.woocommerce-account .woocommerce form.lost_reset_password {
  margin: 0;
  padding: 2rem;
  border: 1px solid var(--wp--preset--color--line-soft);
  border-radius: var(--rescape-radius-card);
  background: var(--wp--preset--color--background);
  box-shadow: var(--rescape-shadow-soft);
}
/* Remember-me checkbox above a full-width submit button. */
.woocommerce-account .woocommerce form.login .form-row:has(.woocommerce-form-login__submit) {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.25rem;
}
.woocommerce-account .woocommerce form.login .woocommerce-form-login__submit {
  order: 1;
  width: 100%;
  margin: 0;
}
.woocommerce-account .woocommerce form.login .lost_password {
  margin: 0;
  font-size: 0.875rem;
  text-align: center;
}

/* Lost and reset password: one field per row, full-width submit button. */
.woocommerce-account .woocommerce form.lost_reset_password > p:first-child {
  margin: 0 0 1.5rem;
  font-size: 0.9375rem;
  color: var(--wp--preset--color--ink-soft);
}
.woocommerce-account .woocommerce form.lost_reset_password .form-row {
  float: none;
  width: 100%;
}
.woocommerce-account .woocommerce form.lost_reset_password .form-row:last-of-type {
  margin-bottom: 0;
}
.woocommerce-account .woocommerce form.lost_reset_password .wp-element-button {
  width: 100%;
  margin-top: 0.25rem;
}

/* Passkey login (WP 2FA): secondary to the password login. */
.woocommerce-account .woocommerce form.login .wp-2fa-login-woocommerce-wrapper {
  margin: 1.5rem 0 0;
  padding: 1.5rem 0 0;
  border-top: 1px solid var(--wp--preset--color--line-soft);
}
.woocommerce-account .woocommerce form.login .wp-2fa-login-woocommerce-wrapper .wp-element-button {
  width: 100%;
  margin: 0;
  border: 1px solid var(--wp--preset--color--line);
  background: transparent;
  color: var(--wp--preset--color--ink);
}
.woocommerce-account .woocommerce form.login .wp-2fa-login-woocommerce-wrapper .wp-element-button:hover {
  border-color: var(--wp--preset--color--ink-soft);
  background: var(--wp--preset--color--background-warm);
}

/* -------------------------------------------------------------------------
   Account area: navigation + content
   ---------------------------------------------------------------------- */

.woocommerce-account main .woocommerce:has(> .woocommerce-MyAccount-navigation) {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 2rem;
}
/* WooCommerce's float clearfix would otherwise occupy grid cells. */
.woocommerce-account main .woocommerce:has(> .woocommerce-MyAccount-navigation)::before,
.woocommerce-account main .woocommerce:has(> .woocommerce-MyAccount-navigation)::after {
  display: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content {
  float: none;
  width: auto;
}

/* Mobile: wrapping rows of pills. */
.woocommerce-account .woocommerce-MyAccount-navigation ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
}
.woocommerce-account .woocommerce-MyAccount-navigation li {
  flex: 0 0 auto;
  padding: 0;
  list-style: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: block;
  padding: 0.5rem 1rem;
  border: 1px solid var(--wp--preset--color--line-soft);
  border-radius: var(--rescape-radius-pill);
  color: var(--wp--preset--color--ink);
  font-size: 0.9375rem;
  font-weight: 500;
  text-decoration: none;
  transition: background-color .2s, color .2s, border-color .2s;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
  background: var(--wp--preset--color--background-warm);
  text-decoration: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
  border-color: var(--wp--preset--color--secondary);
  background: var(--wp--preset--color--secondary);
  color: var(--wp--preset--color--primary-deep);
  font-weight: 600;
  text-decoration: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a {
  color: var(--wp--preset--color--ink-mute);
}

@media (min-width: 1024px) {
  .woocommerce-account main .woocommerce:has(> .woocommerce-MyAccount-navigation) {
    grid-template-columns: 15rem minmax(0, 1fr);
    gap: 4rem;
    align-items: start;
  }

  /* Desktop: a vertical list. */
  .woocommerce-account .woocommerce-MyAccount-navigation ul {
    flex-direction: column;
    gap: 0.25rem;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation li a {
    padding: 0.625rem 1rem;
    border: 0;
    border-radius: 10px;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--wp--preset--color--line-soft);
  }
}

.woocommerce-account .woocommerce-MyAccount-content > :first-child,
.woocommerce-account .woocommerce-MyAccount-content > .woocommerce-notices-wrapper:first-child + * {
  margin-top: 0;
}
.woocommerce-account .woocommerce-MyAccount-content form {
  max-width: 40rem;
}
.woocommerce-account .woocommerce-MyAccount-content h2 {
  font-size: var(--wp--preset--font-size--large);
}

/* Addresses: one card per address. */
.woocommerce-account .woocommerce-Addresses {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.5rem;
  margin-top: 1.5rem;
}
.woocommerce-account .woocommerce-Addresses::before,
.woocommerce-account .woocommerce-Addresses::after {
  display: none;
}
.woocommerce-account .woocommerce-Addresses .woocommerce-Address {
  float: none;
  width: auto;
  padding: 1.5rem;
  border: 1px solid var(--wp--preset--color--line-soft);
  border-radius: var(--rescape-radius-card);
  background: var(--wp--preset--color--background);
}
.woocommerce-account .woocommerce-Address-title {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  margin-bottom: 1rem;
}
.woocommerce-account .woocommerce-Addresses .woocommerce-Address-title::before,
.woocommerce-account .woocommerce-Addresses .woocommerce-Address-title::after {
  display: none;
}
.woocommerce-account .woocommerce-Address-title h2 {
  margin: 0;
  font-size: var(--wp--preset--font-size--medium);
}
.woocommerce-account .woocommerce-Address-title .edit {
  float: none;
  margin: 0;
  font-size: 0.875rem;
}
@media (min-width: 1024px) {
  .woocommerce-account .woocommerce-Addresses {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.woocommerce-account .woocommerce-Address address {
  font-style: normal;
  line-height: 1.6;
}

/* Tables: orders list, order details, saved payment methods. */
.woocommerce-account .woocommerce-MyAccount-content table.shop_table {
  width: 100%;
  border: 1px solid var(--wp--preset--color--line-soft);
  border-radius: var(--rescape-radius-card);
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
}
.woocommerce-account .woocommerce-MyAccount-content table.shop_table th,
.woocommerce-account .woocommerce-MyAccount-content table.shop_table td {
  padding: 0.875rem 1rem;
  border: 0;
  border-top: 1px solid var(--wp--preset--color--line-soft);
  text-align: left;
  vertical-align: middle;
}
.woocommerce-account .woocommerce-MyAccount-content table.shop_table thead th {
  border-top: 0;
  background: var(--wp--preset--color--card-soft);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--wp--preset--color--ink-soft);
}