/* ==========================================================================
   LAYMI — account.css
   Только страница кабинета (body.woocommerce-account / .account-preview).
   Токены: только var() из tokens.css. Не волны. Не PLP.
   ========================================================================== */

.woocommerce-account,
.account-preview {
  background: var(--bg-base);
  color: var(--ink);
}

.account-preview {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--text-body-md);
  line-height: var(--lh-body);
  -webkit-font-smoothing: antialiased;
}

.account-preview *,
.account-preview *::before,
.account-preview *::after {
  box-sizing: border-box;
}

.account-preview .visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Превью: узкий chrome, не копия шапки витрины */
.account-preview-chrome {
  min-height: var(--header-h);
  display: flex;
  align-items: center;
  padding-inline: var(--gutter);
  padding-block: var(--space-md);
  border-block-end: var(--hairline) solid var(--line);
  background: var(--header-solid);
}

.account-preview-chrome__logo {
  font-family: var(--font-logo);
  font-size: var(--text-logo);
  font-weight: 800;
  letter-spacing: var(--tracking-logo);
  text-transform: uppercase;
  text-decoration: none;
  color: var(--ink);
  min-height: var(--touch);
  display: inline-flex;
  align-items: center;
}

.account-preview-scene {
  min-height: 100vh;
}

.account-preview-scene + .account-preview-scene {
  border-block-start: var(--hairline) solid var(--line);
}

.woocommerce-account .laymi-account,
.account-preview .laymi-account {
  width: min(100% - (var(--gutter) * 2), 52rem);
  margin-inline: auto;
  padding-block-start: var(--space-2xl);
  padding-block-end: var(--space-3xl);
  padding-inline: 0;
}

@media (min-width: 64.0625em) {
  .woocommerce-account .laymi-account,
  .account-preview .laymi-account {
    width: min(100% - (var(--gutter) * 2), 68rem);
    padding-block-start: var(--space-3xl);
  }
}

/* Скрыть английский H1 страницы WP («My account» / «Dashboard») у гостя и у body.logged-in */
.woocommerce-account article > h1:first-of-type,
.woocommerce-account .entry-title,
.woocommerce-account h1.page-title,
.woocommerce-account.logged-in article > h1:first-of-type,
body.logged-in.woocommerce-account article > h1:first-of-type,
body.logged-in.woocommerce-account .entry-title {
  display: none;
}

.woocommerce-account .visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.woocommerce-account .u-columns::before,
.woocommerce-account .u-columns::after,
.woocommerce-account .col2-set::before,
.woocommerce-account .col2-set::after {
  content: none;
  display: none;
}

.woocommerce-account .u-column1,
.woocommerce-account .u-column2,
.woocommerce-account .col-1,
.woocommerce-account .col-2 {
  float: none;
  width: auto;
  max-width: none;
}

.laymi-account__intro {
  text-align: start;
  margin-block-end: var(--space-2xl);
  max-width: var(--measure);
}

.laymi-account__eyebrow {
  margin: 0 0 var(--space-sm);
  font-family: var(--font-body);
  font-size: var(--text-label);
  font-weight: 500;
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--muted);
  line-height: var(--lh-label);
}

.laymi-account__title {
  margin: 0 0 var(--space-md);
  font-family: var(--font-display);
  font-size: var(--text-headline-md);
  font-weight: 600;
  line-height: var(--lh-headline-md);
  letter-spacing: 0.04em;
  color: var(--ink);
  text-wrap: balance;
}

.laymi-account__lead {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--text-body-md);
  line-height: var(--lh-body);
  color: var(--muted);
  max-width: 42ch;
}

.laymi-account__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-2xl);
  min-width: 0;
}

/* Desktop: якорь на колонке входа, не equal 3×1fr */
@media (min-width: 64.0625em) {
  .laymi-account__grid--split {
    grid-template-columns: minmax(0, 1.14fr) minmax(0, 0.86fr);
    gap: var(--space-3xl);
    align-items: start;
  }
}

.laymi-account__card {
  min-width: 0;
  padding: var(--space-xl);
  background: var(--surface);
  border: var(--hairline) solid var(--line);
  border-radius: var(--radius-sm);
  box-shadow: var(--frame-b-shadow);
}

.laymi-account__card--login {
  border-color: var(--frame-b-border-color);
}

.laymi-account__card--register {
  background: var(--bg-base);
  box-shadow: none;
}

.laymi-account__card-title {
  margin: 0 0 var(--space-md);
  font-family: var(--font-display);
  font-size: var(--text-headline-sm);
  font-weight: 600;
  line-height: var(--lh-headline-sm);
  color: var(--ink);
}

.laymi-account__card-lead {
  margin: 0 0 var(--space-lg);
  font-size: var(--text-body-md);
  line-height: var(--lh-body);
  color: var(--muted);
}

.laymi-account__form {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  margin: 0;
}

.laymi-account__field,
.laymi-account__row,
.laymi-account__lost,
.woocommerce-account .form-row {
  margin: 0;
}

.laymi-account__label {
  display: block;
  margin-block-end: var(--space-xs);
  font-family: var(--font-body);
  font-size: var(--text-label);
  font-weight: 500;
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--muted);
  line-height: var(--lh-label);
}

.laymi-account__label .required {
  color: var(--error);
}

.woocommerce-account .laymi-account__input,
.account-preview .laymi-account__input,
.woocommerce-account .woocommerce-Input,
.woocommerce-account input.input-text,
.woocommerce-account input[type="text"],
.woocommerce-account input[type="email"],
.woocommerce-account input[type="tel"],
.woocommerce-account input[type="password"] {
  width: 100%;
  min-width: 0;
  min-height: var(--touch);
  padding-inline: var(--space-md);
  padding-block: var(--space-sm);
  border: var(--hairline) solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--bg-base);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: var(--text-body-md);
  line-height: var(--lh-body);
}

.woocommerce-account .laymi-account__card--register .laymi-account__input,
.account-preview .laymi-account__card--register .laymi-account__input {
  background: var(--surface);
}

.woocommerce-account .laymi-account__input:focus-visible,
.account-preview .laymi-account__input:focus-visible,
.woocommerce-account .woocommerce-Input:focus-visible,
.woocommerce-account input.input-text:focus-visible {
  outline: var(--ring) solid var(--accent);
  outline-offset: 2px;
  border-color: var(--ink);
}

.laymi-account__row--actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-md);
}

.laymi-account__remember {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  min-height: var(--touch);
  font-family: var(--font-body);
  font-size: var(--text-body-md);
  color: var(--ink);
  cursor: pointer;
}

.laymi-account__remember input {
  width: 1.125rem;
  height: 1.125rem;
  accent-color: var(--accent);
  flex-shrink: 0;
}

.woocommerce-account .laymi-account .btn,
.account-preview .laymi-account .btn,
.woocommerce-account .laymi-account .woocommerce-button,
.account-preview .laymi-account .woocommerce-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: var(--btn-h);
  min-width: var(--touch);
  padding-inline: 28px;
  border: none;
  border-radius: var(--radius-sm);
  background: var(--accent);
  color: var(--on-accent);
  font-family: var(--font-body);
  font-size: var(--text-button);
  font-weight: 600;
  line-height: var(--lh-button);
  letter-spacing: var(--tracking-button);
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  transition:
    background-color var(--dur-fast) var(--ease-out),
    transform var(--dur-fast) var(--ease-spring),
    opacity var(--dur-fast) var(--ease-out);
}

.woocommerce-account .laymi-account .btn:hover,
.account-preview .laymi-account .btn:hover,
.woocommerce-account .laymi-account .woocommerce-button:hover,
.account-preview .laymi-account .woocommerce-button:hover {
  background: var(--accent-deep);
  color: var(--on-accent);
  opacity: 1;
}

.woocommerce-account .laymi-account .btn:active,
.account-preview .laymi-account .btn:active,
.woocommerce-account .laymi-account .woocommerce-button:active,
.account-preview .laymi-account .woocommerce-button:active {
  transform: scale(0.96);
}

.woocommerce-account .laymi-account .btn:focus-visible,
.account-preview .laymi-account .btn:focus-visible,
.woocommerce-account .laymi-account .woocommerce-button:focus-visible,
.account-preview .laymi-account .woocommerce-button:focus-visible {
  outline: var(--ring) solid var(--accent);
  outline-offset: 3px;
}

.laymi-account__lost {
  margin-block-start: var(--space-xs);
}

.laymi-account__lost a {
  display: inline-flex;
  align-items: center;
  min-height: var(--touch);
  font-family: var(--font-body);
  font-size: var(--text-body-md);
  color: var(--ink);
  text-underline-offset: 0.25em;
}

.laymi-account__lost a:hover {
  opacity: 0.82;
}

.laymi-account__consent {
  margin: 0;
}

.laymi-account__consent .laymi-account__remember {
  align-items: flex-start;
  gap: var(--space-sm);
}

.laymi-account__consent a {
  display: inline-flex;
  align-items: center;
  min-height: var(--touch);
  color: var(--ink);
  text-underline-offset: 0.25em;
}

.laymi-account__otp-status {
  margin: 0;
  min-height: 1.4em;
  font-family: var(--font-body);
  font-size: var(--text-body-md);
  line-height: var(--lh-body);
  color: var(--muted);
}

.laymi-account__otp-status.is-error {
  color: var(--error);
}

.laymi-account__otp-test {
  margin: 0;
  padding: var(--space-sm) var(--space-md);
  border: var(--hairline) solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--bg-base);
  font-family: var(--font-body);
  font-size: var(--text-body-md);
  color: var(--ink);
}

.laymi-account__alt {
  margin-block-start: var(--space-xl);
  padding-block-start: var(--space-lg);
  border-block-start: var(--hairline) solid var(--line);
}

.laymi-account__alt-summary {
  display: flex;
  align-items: center;
  min-height: var(--touch);
  cursor: pointer;
  font-family: var(--font-body);
  font-size: var(--text-button);
  font-weight: 600;
  letter-spacing: var(--tracking-button);
  text-transform: uppercase;
  color: var(--ink);
  list-style: none;
}

.laymi-account__alt-summary::-webkit-details-marker {
  display: none;
}

.laymi-account__alt-summary:focus-visible {
  outline: var(--ring) solid var(--accent);
  outline-offset: 3px;
}

.laymi-account__alt .laymi-account__form {
  margin-block-start: var(--space-lg);
}

.woocommerce-account .laymi-account .btn[hidden],
.account-preview .laymi-account .btn[hidden],
.laymi-account__field[hidden] {
  display: none;
}

.woocommerce-account .laymi-account .btn:disabled,
.account-preview .laymi-account .btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none;
}

.woocommerce-account .woocommerce-error,
.woocommerce-account .woocommerce-message,
.woocommerce-account .woocommerce-info,
.woocommerce-account .woocommerce-notices-wrapper .woocommerce-error {
  list-style: none;
  margin: 0 auto var(--space-lg);
  padding: var(--space-md) var(--space-lg);
  width: min(100% - (var(--gutter) * 2), 52rem);
  border: var(--hairline) solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--surface);
  color: var(--ink);
  font-family: var(--font-body);
}

.woocommerce-account .woocommerce-error {
  border-color: var(--error);
  color: var(--error);
}

/* ==========================================================================
   Logged-in cabinet: nav rail + content
   Group gap (nav↔content, intro↔shortcuts) ≥ 2× inner gap (nav items / field stack)
   Concentric: nav/content outer = frame-b outer; links/inputs = frame-b inner
   ========================================================================== */

.woocommerce-account.logged-in .woocommerce,
.account-preview--logged .woocommerce {
  max-width: none;
}

.woocommerce-account .laymi-account--logged,
.account-preview .laymi-account--logged {
  width: min(100% - (var(--gutter) * 2), 68rem);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-2xl);
  align-items: start;
  min-width: 0;
}

.woocommerce-account.logged-in .woocommerce-MyAccount-navigation,
.woocommerce-account.logged-in .woocommerce-MyAccount-content,
.account-preview .laymi-account-nav,
.account-preview .laymi-account__content {
  float: none;
  width: auto;
  max-width: none;
  min-width: 0;
}

.laymi-account-nav {
  background: var(--surface);
  border: var(--hairline) solid var(--line);
  border-radius: var(--frame-b-radius-outer);
  padding: var(--frame-b-pad);
  box-shadow: var(--frame-b-shadow);
}

.laymi-account-nav__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
}

.laymi-account-nav li {
  margin: 0;
  min-width: 0;
}

.laymi-account-nav a {
  display: inline-flex;
  align-items: center;
  min-height: var(--touch);
  min-width: var(--touch);
  padding-inline: var(--space-md);
  padding-block: var(--space-xs);
  border-radius: var(--frame-b-radius-inner);
  font-family: var(--font-body);
  font-size: var(--text-nav);
  font-weight: 500;
  letter-spacing: var(--tracking-nav);
  text-transform: uppercase;
  text-decoration: none;
  color: var(--ink);
  background: transparent;
  transition:
    background-color var(--dur-fast) var(--ease-out),
    color var(--dur-fast) var(--ease-out),
    transform var(--dur-fast) var(--ease-spring);
}

.laymi-account-nav a:hover {
  background: var(--bg-alt);
  color: var(--ink);
}

.laymi-account-nav a:active {
  transform: scale(0.96);
}

.laymi-account-nav a:focus-visible {
  outline: var(--ring) solid var(--accent);
  outline-offset: 2px;
}

.laymi-account-nav .is-active a,
.laymi-account-nav a[aria-current="page"] {
  background: var(--accent);
  color: var(--on-accent);
}

.laymi-account__content {
  background: var(--surface);
  border: var(--hairline) solid var(--line);
  border-radius: var(--frame-b-radius-outer);
  padding: var(--space-lg);
  box-shadow: var(--frame-b-shadow);
  min-width: 0;
}

.laymi-account--logged .laymi-account__intro {
  margin-block-end: var(--space-xl);
}

.laymi-account__shortcuts {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-lg);
}

.laymi-account__shortcut {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: var(--touch);
  min-width: 0;
  padding: var(--space-lg);
  border: var(--hairline) solid var(--line);
  border-radius: var(--frame-b-radius-inner);
  text-decoration: none;
  color: var(--ink);
  background: var(--bg-base);
  transition:
    background-color var(--dur-fast) var(--ease-out),
    border-color var(--dur-fast) var(--ease-out),
    transform var(--dur-fast) var(--ease-spring);
}

.laymi-account__shortcut--orders {
  border-color: var(--frame-b-border-color);
  background: var(--bg-base);
}

.laymi-account__shortcut--details {
  background: var(--surface);
}

.laymi-account__shortcut:hover {
  background: var(--bg-alt);
  color: var(--ink);
}

.laymi-account__shortcut:active {
  transform: scale(0.96);
}

.laymi-account__shortcut:focus-visible {
  outline: var(--ring) solid var(--accent);
  outline-offset: 3px;
}

.laymi-account__shortcut-label {
  font-family: var(--font-display);
  font-size: var(--text-headline-sm);
  font-weight: 600;
  line-height: var(--lh-headline-sm);
}

.laymi-account__shortcut-hint {
  margin-block-start: var(--space-xs);
  font-family: var(--font-body);
  font-size: var(--text-body-md);
  line-height: var(--lh-body);
  color: var(--muted);
}

.laymi-account__fieldset {
  margin: var(--space-lg) 0 0;
  padding: var(--space-lg);
  border: var(--hairline) solid var(--line);
  border-radius: var(--frame-b-radius-inner);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

.laymi-account__legend {
  padding-inline: var(--space-xs);
  font-family: var(--font-display);
  font-size: var(--text-headline-sm);
  font-weight: 600;
  color: var(--ink);
}

.laymi-account__form--edit .laymi-account__row .btn,
.laymi-account__empty .btn {
  width: auto;
  min-width: 12rem;
}

.laymi-account__empty {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: var(--space-md);
  padding-block: var(--space-md);
}

.laymi-account__empty-title {
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--text-headline-sm);
  font-weight: 600;
  color: var(--ink);
}

.laymi-account__empty-lead {
  margin: 0;
  color: var(--muted);
  max-width: 42ch;
}

.laymi-account__table-wrap {
  min-width: 0;
  overflow-x: auto;
}

.laymi-account-orders {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-body);
  font-size: var(--text-body-md);
}

.laymi-account-orders th,
.laymi-account-orders td {
  text-align: start;
  padding: var(--space-sm) var(--space-md);
  border-block-end: var(--hairline) solid var(--line);
  vertical-align: middle;
}

.laymi-account-orders thead th {
  font-size: var(--text-label);
  font-weight: 500;
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--muted);
}

.laymi-account-orders a {
  color: var(--ink);
  min-height: var(--touch);
  display: inline-flex;
  align-items: center;
}

.laymi-account__order-action {
  width: auto;
  min-width: var(--touch);
  padding-inline: var(--space-md);
}

.laymi-account__pager {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
  margin-block-start: var(--space-lg);
}

.laymi-account__pager .button {
  width: auto;
}

@media (min-width: 48em) {
  .laymi-account__shortcuts {
    grid-template-columns: minmax(0, 1.18fr) minmax(0, 0.82fr);
    gap: var(--space-xl);
  }
}

@media (min-width: 64.0625em) {
  .woocommerce-account .laymi-account--logged,
  .account-preview .laymi-account--logged {
    grid-template-columns: minmax(11rem, 14rem) minmax(0, 1fr);
    gap: var(--space-3xl);
    width: min(100% - (var(--gutter) * 2), 72rem);
  }

  .laymi-account-nav__list {
    flex-direction: column;
    flex-wrap: nowrap;
  }

  .laymi-account-nav a {
    width: 100%;
  }

  .laymi-account__content {
    padding: var(--space-xl);
  }
}

@media (prefers-reduced-motion: reduce) {
  .woocommerce-account .laymi-account .btn,
  .account-preview .laymi-account .btn,
  .woocommerce-account .laymi-account .woocommerce-button,
  .account-preview .laymi-account .woocommerce-button,
  .laymi-account-nav a,
  .laymi-account__shortcut {
    transition: none;
    transform: none;
  }

  .woocommerce-account .laymi-account .btn:active,
  .account-preview .laymi-account .btn:active,
  .woocommerce-account .laymi-account .woocommerce-button:active,
  .account-preview .laymi-account .woocommerce-button:active,
  .laymi-account-nav a:active,
  .laymi-account__shortcut:active {
    transform: none;
  }
}

@media (max-width: 47.99em) {
  .laymi-account-nav__list {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: var(--space-xs);
  }

  .laymi-account-nav a {
    width: 100%;
    justify-content: center;
    text-align: center;
  }

  .laymi-account__card {
    padding: var(--space-lg);
  }

  .woocommerce-account .laymi-account,
  .account-preview .laymi-account {
    padding-block-start: var(--space-xl);
    padding-inline: env(safe-area-inset-left, 0) env(safe-area-inset-right, 0);
  }

  .laymi-account__content {
    padding: var(--space-md);
  }

  .laymi-account-orders thead {
    display: none;
  }

  .laymi-account-orders,
  .laymi-account-orders tbody,
  .laymi-account-orders tr,
  .laymi-account-orders th,
  .laymi-account-orders td {
    display: block;
    width: 100%;
  }

  .laymi-account-orders tr {
    padding-block: var(--space-md);
    border-block-end: var(--hairline) solid var(--line);
  }

  .laymi-account-orders th,
  .laymi-account-orders td {
    display: flex;
    justify-content: space-between;
    gap: var(--space-md);
    border-block-end: 0;
    padding-inline: 0;
  }

  .laymi-account-orders td::before,
  .laymi-account-orders th::before {
    content: attr(data-title);
    font-size: var(--text-label);
    letter-spacing: var(--tracking-label);
    text-transform: uppercase;
    color: var(--muted);
  }

  .laymi-account__form--edit .laymi-account__row .btn,
  .laymi-account__empty .btn {
    width: 100%;
  }
}