/* Account pages — shared by every variant of the page block "account" (blocks/account/*.twig) and the account templates:
   navigation base, dashboard tiles, order page (progress, lines, totals, history), info cards, addresses, wish list grid. */

.et-acc { display: flex; flex-direction: column; gap: var(--et-grid-gap); }
.et-acc .et-page-title { margin: 0; }
.et-acc__head { display: flex; flex-direction: column; gap: var(--space-xs); }
.et-acc__lead { margin: 0; color: var(--et-text-secondary); font-size: var(--et-text-sm); display: flex; flex-wrap: wrap; gap: var(--space-xs) var(--space-md); }
.et-acc__section { display: flex; flex-direction: column; gap: var(--space-sm); }
.et-acc__bar { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-sm); flex-wrap: wrap; }
.et-acc__title { margin: 0; font-family: var(--et-font-display); font-size: var(--et-text-lg); font-weight: var(--et-heading-weight); text-transform: var(--et-heading-transform); letter-spacing: var(--et-heading-tracking); font-style: var(--et-heading-style); }
.et-acc__more { color: var(--et-accent-text); font-size: var(--et-text-sm); font-weight: 600; text-decoration: none; }
.et-acc__more:hover { text-decoration: underline; }
.et-acc__results { margin: 0; text-align: center; color: var(--et-text-muted); font-size: var(--et-text-sm); }
.et-acc__count { color: var(--et-text-muted); font-weight: 400; }
.et-acc__actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); align-items: center; }

/* Navigation base (both variants) */
.et-acc-nav__list { list-style: none; margin: 0; padding: 0; display: flex; }
.et-acc-nav__link {
  display: flex; align-items: center; gap: var(--space-sm);
  color: var(--et-text-secondary); text-decoration: none; font-size: var(--et-text-sm); font-weight: 600;
  white-space: nowrap; transition: color var(--et-transition), background-color var(--et-transition);
}
.et-acc-nav__link:hover { color: var(--et-accent-text); }
.et-acc-nav__link[aria-current="page"] { color: var(--et-accent-text); }
.et-acc-nav__link:focus-visible { outline: 2px solid var(--et-accent); outline-offset: 2px; }
.et-acc-nav__link i { width: 1.25em; text-align: center; }
.et-acc-nav__count {
  margin-left: auto; min-width: 1.5em; padding: 0 var(--space-xs); border-radius: var(--et-radius-full);
  background: var(--et-surface-2, var(--et-bg)); color: var(--et-text-muted); font-size: var(--et-text-xs); text-align: center;
}
.et-acc-nav__item--logout .et-acc-nav__link:hover { color: var(--et-danger-text); }

/* Dashboard tiles */
.et-acc-tiles { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--et-grid-gap); grid-template-columns: repeat(auto-fill, minmax(min(100%, 10rem), 1fr)); }
.et-acc-tiles__tile {
  height: 100%; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; gap: var(--space-xs) var(--space-sm); align-items: center;
  padding: var(--et-card-pad); border: var(--et-border-width) solid var(--et-border); border-radius: var(--et-card-radius);
  background: var(--et-surface); color: var(--et-text); text-decoration: none; transition: border-color var(--et-transition);
}
.et-acc-tiles__tile:hover, .et-acc-tiles__tile:focus-visible { border-color: var(--et-accent); }
.et-acc-tiles__icon { grid-row: span 2; color: var(--et-accent-text); font-size: var(--et-text-xl); }
.et-acc-tiles__label { font-weight: 600; font-size: var(--et-text-sm); }
.et-acc-tiles__count { font-family: var(--et-font-display); font-size: var(--et-text-xl); font-weight: var(--et-heading-weight); line-height: 1; }

/* Info cards: payment/shipping, comment, addresses */
.et-acc-cards { display: grid; gap: var(--et-grid-gap); grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.et-acc-card { padding: var(--et-card-pad); border: var(--et-border-width) solid var(--et-border); border-radius: var(--et-card-radius); background: var(--et-surface); }
.et-acc-card > p { margin: var(--space-xs) 0 0; color: var(--et-text-secondary); }
.et-acc-card__title { margin: 0; font-size: var(--et-text-base); font-weight: 700; }
.et-acc-card__address { margin-top: var(--space-xs); font-style: normal; color: var(--et-text-muted); font-size: var(--et-text-sm); line-height: var(--et-body-leading, 1.6); }

.et-acc-addresses { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--et-grid-gap); grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); }
.et-acc-addresses__item { display: flex; flex-direction: column; gap: var(--space-sm); }
.et-acc-addresses__item .et-acc-card__address { margin: 0; flex: 1; }
.et-acc-addresses__actions { display: flex; align-items: center; gap: var(--space-md); }
.et-acc-addresses__delete { color: var(--et-danger-text); font-size: var(--et-text-sm); }
.et-acc-addresses__add {
  height: 100%; min-height: 8rem; display: flex; align-items: center; justify-content: center; gap: var(--space-sm);
  border: var(--et-border-width) dashed var(--et-border-strong, var(--et-border)); border-radius: var(--et-card-radius);
  color: var(--et-accent-text); font-weight: 600; text-decoration: none;
}
.et-acc-addresses__add:hover, .et-acc-addresses__add:focus-visible { border-color: var(--et-accent); }

.et-acc-wishlist { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--et-grid-gap); grid-template-columns: repeat(auto-fill, minmax(min(100%, 12rem), 1fr)); }

/* Order page: progress */
.et-order-progress { padding: var(--et-card-pad); border: var(--et-border-width) solid var(--et-border); border-radius: var(--et-card-radius); background: var(--et-surface); }
.et-order-progress__steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); }
.et-order-progress__step { position: relative; display: flex; flex-direction: column; align-items: center; gap: var(--space-xs); text-align: center; color: var(--et-text-muted); font-size: var(--et-text-sm); }
.et-order-progress__step::before {
  content: ""; position: absolute; top: calc(0.5rem - var(--et-border-width)); right: 50%; width: 100%;
  border-top: calc(var(--et-border-width) * 2) solid var(--et-border); z-index: 0;
}
.et-order-progress__step:first-child::before { display: none; }
.et-order-progress__step.is-done::before { border-color: var(--et-accent); }
.et-order-progress__dot { position: relative; z-index: 1; width: 1rem; height: 1rem; border-radius: var(--et-radius-full); border: calc(var(--et-border-width) * 2) solid var(--et-border); background: var(--et-surface); }
.et-order-progress__step.is-done .et-order-progress__dot { background: var(--et-accent); border-color: var(--et-accent); }
.et-order-progress__step.is-done { color: var(--et-text); }
.et-order-progress__step[aria-current="step"] .et-order-progress__label { font-weight: 700; }
.et-order-progress__date { color: var(--et-text-muted); font-size: var(--et-text-xs); }
.et-order-progress__note { margin: var(--space-sm) 0 0; padding: var(--space-sm); border-radius: var(--et-radius-sm); background: var(--et-warning-soft); color: var(--et-warning-text); font-size: var(--et-text-sm); text-align: center; }

/* Order page: lines, totals, history */
.et-order-lines { list-style: none; margin: 0; padding: 0; border-top: var(--et-border-width) solid var(--et-border); }
.et-order-lines__item {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--space-xs) var(--space-md); align-items: center;
  padding: var(--space-sm) 0; border-bottom: var(--et-border-width) solid var(--et-border);
}
.et-order-lines__item > .et-order-row__thumb { grid-row: span 2; width: 3.75rem; height: 3.75rem; }
.et-order-lines__info { display: flex; flex-direction: column; gap: 0.125rem; min-width: 0; }
.et-order-lines__name { color: var(--et-text); font-weight: 600; text-decoration: none; }
a.et-order-lines__name:hover { color: var(--et-accent-text); }
.et-order-lines__model, .et-order-lines__option { color: var(--et-text-muted); font-size: var(--et-text-xs); }
.et-order-lines__qty { color: var(--et-text-secondary); font-size: var(--et-text-sm); white-space: nowrap; }
.et-order-lines__total { font-family: var(--et-font-price, inherit); text-align: right; white-space: nowrap; }
.et-order-lines__actions { grid-column: 2 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-md); }
.et-order-lines__return { color: var(--et-text-muted); font-size: var(--et-text-sm); }
@media (min-width: 768px) {
  .et-order-lines__item { grid-template-columns: auto minmax(0, 1fr) auto auto auto; }
  .et-order-lines__item > .et-order-row__thumb { grid-row: auto; }
  .et-order-lines__actions { grid-column: auto; }
}
.et-order-totals { margin: 0; align-self: flex-end; width: min(100%, 18rem); display: flex; flex-direction: column; gap: var(--space-xs); }
.et-order-totals__row { display: flex; justify-content: space-between; gap: var(--space-md); color: var(--et-text-secondary); }
.et-order-totals__row dt, .et-order-totals__row dd { margin: 0; }
.et-order-totals__row--grand { color: var(--et-text); font-weight: 700; font-size: var(--et-text-lg); }
.et-order-history { list-style: none; margin: 0; padding: 0 0 0 var(--space-md); border-left: calc(var(--et-border-width) * 2) solid var(--et-border); display: flex; flex-direction: column; gap: var(--space-sm); }
.et-order-history__item { display: flex; flex-wrap: wrap; gap: var(--space-xs) var(--space-md); font-size: var(--et-text-sm); }
.et-order-history__date { color: var(--et-text-muted); }
.et-order-history__status { font-weight: 600; }
.et-order-history__comment { flex-basis: 100%; margin: 0; color: var(--et-text-secondary); }