/* TacticoTextil — Mi cuenta */

.account-page { padding-block: var(--space-8) var(--space-9); }
.account-page__inner { display: grid; gap: var(--space-6); align-items: start; }
.account-page h1 { font-size: var(--fs-600); margin: var(--space-3) 0 var(--space-6); }

.account-nav {
  display: flex;
  flex-direction: column;
  background: var(--c-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.account-nav a, .account-nav__logout button {
  padding: var(--space-4) var(--space-5);
  font-family: var(--font-display);
  font-weight: 600;
  font-size: var(--fs-200);
  border-bottom: 1px solid var(--color-border);
  text-align: left;
  width: 100%;
}
.account-nav a:hover { background: var(--c-paper); }
.account-nav a.is-active { color: var(--color-accent); background: var(--c-red-tint); }
.account-nav__logout button { color: var(--color-text-muted); border-bottom: none; }
.account-nav__logout button:hover { color: var(--c-error); }

.account-card {
  background: var(--c-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-6);
  margin-bottom: var(--space-5);
}
.account-card h2 { font-size: var(--fs-300); text-transform: uppercase; letter-spacing: 0.04em; color: var(--color-text-muted); margin-bottom: var(--space-4); }

.account-summary-grid { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); margin-bottom: var(--space-6); }
.account-stat { background: var(--c-white); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-5); }
.account-stat__value { font-family: var(--font-display); font-size: var(--fs-600); font-weight: 700; }
.account-stat__label { color: var(--color-text-muted); font-size: var(--fs-100); }

.account-address-grid { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.account-address-card { border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-5); position: relative; }
.account-address-card__default { position: absolute; top: var(--space-3); right: var(--space-3); }
.account-address-card p { color: var(--color-text-muted); font-size: var(--fs-200); margin-bottom: var(--space-1); }
.account-address-card__actions { display: flex; gap: var(--space-4); margin-top: var(--space-4); font-size: var(--fs-100); font-weight: 600; }
.account-address-card__actions a, .account-address-card__actions button { color: var(--color-accent); }

.account-order-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-3);
}
.account-order-row strong { font-family: var(--font-display); }

.auth-page { padding-block: var(--space-9); display: flex; justify-content: center; }
.auth-card { width: 100%; max-width: 420px; background: var(--c-white); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-8); box-shadow: var(--shadow-md); }
.auth-card h1 { font-size: var(--fs-600); margin: var(--space-3) 0 var(--space-5); text-align: center; }
.auth-card__switch { text-align: center; margin-top: var(--space-5); font-size: var(--fs-200); color: var(--color-text-muted); }
.auth-card__switch a { color: var(--color-accent); font-weight: 600; }

@media (min-width: 900px) {
  .account-page__inner { grid-template-columns: 240px 1fr; }
}