/*
 * account.css — Mi Cuenta (WooCommerce)
 *
 * Organización:
 *   1. Layout principal (wrapper + grid sidebar/content)
 *   2. Navegación (sidebar desktop / tabs mobile)
 *   3. Encabezados de sección y botones comunes
 *   4. Dashboard (bienvenida, stats, último pedido, accesos)
 *   5. Lista de pedidos (cards + filtros + paginación)
 *   6. Detalle de pedido (timeline, items, totales, meta)
 *   7. Direcciones (tarjetas + formulario)
 *   8. Formularios (editar cuenta, editar dirección)
 *   9. Login / Registro (panel dual + tabs)
 *  10. Estados de pedido (badges)
 *  11. Notices de WooCommerce
 *  12. Estado vacío
 *  13. Responsive mobile
 */

/* ══════════════════════════════════════════════════════════════
   1. LAYOUT PRINCIPAL
══════════════════════════════════════════════════════════════ */

.rda-account {
  background: var(--color-cream-light);
  min-height: 60vh;
  padding-block: var(--space-2xl) var(--space-3xl);
  /* Red de seguridad: si algún hijo se desborda, que recorte en vez de
     ensanchar la página entera (el bug clásico de "se ve en escritorio
     estando en móvil" casi siempre es un elemento angosto que empuja
     el viewport). */
  overflow-x: hidden;
}

/* Layout con sidebar (usuario logueado) */
.rda-account__layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: var(--space-2xl);
  align-items: start;
}

.rda-account__nav-wrap {
  position: sticky;
  top: calc(var(--header-height-desktop) + var(--space-lg));
}

.rda-account__content {
  min-width: 0; /* evita desbordamiento en grid */
}

/* Layout para invitado / login (sin sidebar) */
.rda-account__guest-wrap {
  max-width: 960px;
  margin-inline: auto;
}

/*
 * Compensación admin bar de WordPress para el sidebar sticky de Mi Cuenta.
 * (El offset del header en sí ya lo resuelve globalmente
 * components/header.css con --rda-admin-bar-offset, medido en vivo por
 * header.js — aquí solo faltaba sumar ese mismo espacio al sidebar.
 * Antes había además una regla duplicada `.admin-bar .rda-header` en este
 * archivo con valores fijos 32px/46px: como este stylesheet se encola
 * DESPUÉS de header.css en cada página, esa regla ganaba la cascada y
 * pisaba el offset dinámico — esa era la causa real de que el header
 * siguiera sin pegarse bien aunque header.css ya estuviera corregido.)
 */
.admin-bar .rda-account__nav-wrap {
  top: calc(var(--header-height-desktop) + var(--space-lg) + var(--rda-admin-bar-offset, 0px));
}

@media (max-width: 782px) {
  .admin-bar .rda-account__nav-wrap {
    top: calc(var(--header-height-mobile) + var(--space-md) + var(--rda-admin-bar-offset, 0px));
  }
}

/* ══════════════════════════════════════════════════════════════
   2. NAVEGACIÓN — SIDEBAR
══════════════════════════════════════════════════════════════ */

.rda-account-nav {
  background: var(--color-navy-base);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(10, 23, 51, 0.12);
}

/* ── Avatar + usuario ── */

.rda-account-nav__user {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  padding: var(--space-xl) var(--space-lg);
  border-bottom: 1px solid rgba(201, 168, 76, 0.15);
}

.rda-account-nav__avatar {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--color-gold-base);
  color: var(--color-navy-base);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: var(--weight-semibold);
  letter-spacing: 0.05em;
  line-height: 1;
  border: 2px solid rgba(201, 168, 76, 0.4);
}

.rda-account-nav__user-info {
  min-width: 0;
}

.rda-account-nav__user-name {
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: var(--weight-medium);
  color: var(--color-cream-light);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
}

.rda-account-nav__user-email {
  font-family: var(--font-body);
  font-size: 11px;
  color: var(--color-gold-soft);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 2px;
  letter-spacing: 0.02em;
}

/* ── Lista de navegación ── */

.rda-account-nav__list {
  list-style: none;
  margin: 0;
  padding: var(--space-sm) 0;
}

.rda-account-nav__link {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  padding: var(--space-sm) var(--space-lg);
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: var(--weight-regular);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(245, 237, 216, 0.7);
  text-decoration: none;
  transition:
    color var(--duration-fast) var(--ease-out),
    background var(--duration-fast) var(--ease-out);
  border-left: 3px solid transparent;
}

.rda-account-nav__link:hover {
  color: var(--color-cream-light);
  background: rgba(201, 168, 76, 0.08);
}

.rda-account-nav__link.is-active {
  color: var(--color-gold-base);
  background: rgba(201, 168, 76, 0.1);
  border-left-color: var(--color-gold-base);
  font-weight: var(--weight-medium);
}

.rda-account-nav__icon {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.rda-account-nav__icon svg {
  width: 16px;
  height: 16px;
}

.rda-account-nav__item--logout .rda-account-nav__link {
  color: rgba(160, 69, 69, 0.7);
  margin-top: var(--space-xs);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding-top: var(--space-md);
}

/*
 * Acceso al portal /equipo/ para usuarios con perfil operativo
 * (artesana/confirmación/logística/admin). Se destaca del resto del
 * menú de cliente porque no es un endpoint más de "Mi cuenta": lleva
 * a un módulo administrativo aparte.
 */
.rda-account-nav__item--ops .rda-account-nav__link {
  color: var(--color-gold-base);
  font-weight: var(--weight-semibold);
  border-left-color: rgba(201, 168, 76, 0.4);
  margin-bottom: var(--space-xs);
  padding-bottom: var(--space-md);
  border-bottom: 1px solid rgba(201, 168, 76, 0.15);
}

.rda-account-nav__item--ops .rda-account-nav__link:hover {
  color: var(--color-gold-warm);
  background: rgba(201, 168, 76, 0.12);
  border-left-color: var(--color-gold-base);
}

.rda-account-nav__item--logout .rda-account-nav__link:hover {
  color: #c87a7a;
  background: rgba(160, 69, 69, 0.1);
}

/* ── Soporte WhatsApp ── */

.rda-account-nav__support {
  padding: var(--space-md) var(--space-lg) var(--space-lg);
  border-top: 1px solid rgba(201, 168, 76, 0.12);
}

.rda-account-nav__wa-link {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: var(--weight-medium);
  letter-spacing: 0.08em;
  color: var(--color-gold-soft);
  text-decoration: none;
  text-transform: uppercase;
  transition: color var(--duration-fast) var(--ease-out);
}

.rda-account-nav__wa-link:hover {
  color: var(--color-gold-warm);
}

/* ══════════════════════════════════════════════════════════════
   3. ENCABEZADOS DE SECCIÓN Y BOTONES COMUNES
══════════════════════════════════════════════════════════════ */

.rda-account-section-header {
  margin-bottom: var(--space-xl);
}

.rda-account-section-title {
  font-family: var(--font-display);
  font-size: clamp(22px, 4vw, 30px);
  font-weight: var(--weight-regular);
  color: var(--color-ink-primary);
  line-height: var(--leading-tight);
}

.rda-account-section-subtitle {
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--color-ink-secondary);
  margin-top: var(--space-xs);
}

.rda-account-back-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--font-body);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-ink-muted);
  text-decoration: none;
  margin-bottom: var(--space-sm);
  transition: color var(--duration-fast) var(--ease-out);
}

.rda-account-back-link:hover {
  color: var(--color-gold-deep);
}

/* ── Botones de acción de cuenta ── */

.rda-btn-account {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  padding: 8px 16px;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: var(--weight-medium);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid transparent;
  cursor: pointer;
  transition:
    background var(--duration-fast) var(--ease-out),
    color var(--duration-fast) var(--ease-out),
    border-color var(--duration-fast) var(--ease-out);
  white-space: nowrap;
}

.rda-btn-account--primary {
  background: var(--color-navy-base);
  color: var(--color-cream-light);
  border-color: var(--color-navy-base);
}

.rda-btn-account--primary:hover {
  background: var(--color-navy-deep);
  border-color: var(--color-navy-deep);
  color: var(--color-cream-light);
}

.rda-btn-account--ghost {
  background: transparent;
  color: var(--color-ink-secondary);
  border-color: var(--color-border-medium);
}

.rda-btn-account--ghost:hover {
  border-color: var(--color-gold-base);
  color: var(--color-gold-deep);
}

.rda-btn-account--sm {
  padding: 6px 12px;
  font-size: 10px;
}

.rda-btn-account--full {
  width: 100%;
  justify-content: center;
}

/* ══════════════════════════════════════════════════════════════
   4. DASHBOARD
══════════════════════════════════════════════════════════════ */

.rda-dashboard {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xl);
}

/* ── Bienvenida ── */

.rda-dashboard__welcome {
  position: relative;
  background: var(--color-navy-base);
  border-radius: var(--radius-lg);
  padding: var(--space-xl) var(--space-2xl);
  overflow: hidden;
  color: var(--color-cream-light);
}

.rda-dashboard__welcome-deco {
  position: absolute;
  right: -40px;
  top: -40px;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(201, 168, 76, 0.15) 0%, transparent 70%);
  pointer-events: none;
}

.rda-dashboard__welcome-text {
  position: relative;
  z-index: 1;
}

.rda-dashboard__welcome .rda-section-eyebrow {
  color: var(--color-gold-soft);
}

.rda-dashboard__greeting {
  font-family: var(--font-display);
  font-size: clamp(24px, 4vw, 36px);
  font-weight: var(--weight-regular);
  color: var(--color-cream-light);
  line-height: var(--leading-tight);
  margin: var(--space-xs) 0 var(--space-sm);
}

.rda-dashboard__greeting-icon {
  font-style: normal;
}

.rda-dashboard__member-since {
  font-size: 13px;
  color: rgba(245, 237, 216, 0.6);
}

/* ── Stats ── */

.rda-dashboard__stats {
  display: flex;
  gap: 0;
  background: #fff;
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border-subtle);
  overflow: hidden;
}

.rda-dashboard__stat {
  flex: 1;
  padding: var(--space-xl) var(--space-lg);
  text-align: center;
}

.rda-dashboard__stat--divider {
  flex: 0 0 1px;
  background: var(--color-border-subtle);
  padding: 0;
}

.rda-dashboard__stat-value {
  font-family: var(--font-display);
  font-size: clamp(20px, 3vw, 28px);
  font-weight: var(--weight-regular);
  color: var(--color-ink-primary);
  line-height: 1;
}

.rda-dashboard__stat-value--badge {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-xs);
  font-size: 14px;
  color: var(--color-gold-deep);
}

.rda-dashboard__stat-label {
  font-family: var(--font-body);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-ink-muted);
  margin-top: var(--space-xs);
}

/* ── Secciones del dashboard ── */

.rda-dashboard__section {
  background: #fff;
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border-subtle);
  padding: var(--space-xl);
}

.rda-dashboard__section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--space-lg);
}

.rda-dashboard__section-title {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: var(--weight-regular);
  color: var(--color-ink-primary);
}

.rda-dashboard__section-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-family: var(--font-body);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-gold-deep);
  text-decoration: none;
  transition: color var(--duration-fast) var(--ease-out);
}

.rda-dashboard__section-link:hover {
  color: var(--color-gold-base);
}

/* ── Último pedido en dashboard ── */

.rda-dashboard__last-order {
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-md);
  padding: var(--space-lg);
  background: var(--color-cream-light);
}

.rda-dashboard__last-order-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-bottom: var(--space-sm);
}

.rda-dashboard__order-num {
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: var(--weight-medium);
  color: var(--color-ink-primary);
}

.rda-dashboard__order-date {
  font-size: 12px;
  color: var(--color-ink-muted);
}

.rda-dashboard__order-items {
  font-family: var(--font-display);
  font-size: 15px;
  color: var(--color-ink-secondary);
  margin-bottom: var(--space-md);
  font-style: italic;
}

.rda-dashboard__last-order-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-sm);
}

.rda-dashboard__order-total {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: var(--weight-medium);
  color: var(--color-ink-primary);
}

.rda-dashboard__last-order-actions {
  display: flex;
  gap: var(--space-sm);
  flex-wrap: wrap;
}

/* ── Accesos rápidos ── */

.rda-dashboard__quick-actions {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  gap: var(--space-md);
}

.rda-quick-action {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-sm);
  padding: var(--space-lg) var(--space-sm);
  background: var(--color-cream-light);
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-md);
  text-decoration: none;
  transition:
    border-color var(--duration-fast) var(--ease-out),
    box-shadow var(--duration-fast) var(--ease-out);
}

.rda-quick-action:hover {
  border-color: var(--color-gold-base);
  box-shadow: 0 4px 16px rgba(201, 168, 76, 0.1);
}

.rda-quick-action__icon {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--color-navy-base);
  color: var(--color-gold-base);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background var(--duration-fast) var(--ease-out);
}

.rda-quick-action__icon svg {
  width: 20px;
  height: 20px;
}

.rda-quick-action:hover .rda-quick-action__icon {
  background: var(--color-gold-base);
  color: var(--color-navy-base);
}

.rda-quick-action__label {
  font-family: var(--font-body);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-ink-secondary);
  text-align: center;
  line-height: 1.3;
}

/* ══════════════════════════════════════════════════════════════
   5. LISTA DE PEDIDOS
══════════════════════════════════════════════════════════════ */

.rda-orders {
  display: flex;
  flex-direction: column;
  gap: var(--space-xl);
}

/* ── Filtros ── */

.rda-orders__filters {
  display: flex;
  gap: var(--space-sm);
  flex-wrap: wrap;
}

.rda-orders__filter {
  padding: 8px 16px;
  font-family: var(--font-body);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-ink-secondary);
  background: #fff;
  border: 1px solid var(--color-border-subtle);
  border-radius: 999px;
  cursor: pointer;
  transition:
    background var(--duration-fast) var(--ease-out),
    color var(--duration-fast) var(--ease-out),
    border-color var(--duration-fast) var(--ease-out);
}

.rda-orders__filter:hover {
  border-color: var(--color-gold-base);
  color: var(--color-gold-deep);
}

.rda-orders__filter.is-active {
  background: var(--color-navy-base);
  color: var(--color-cream-light);
  border-color: var(--color-navy-base);
}

/* ── Lista de cards ── */

.rda-orders__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

/* ── Card de pedido ── */

.rda-order-card {
  background: #fff;
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: box-shadow var(--duration-fast) var(--ease-out);
}

.rda-order-card:hover {
  box-shadow: 0 4px 20px rgba(10, 23, 51, 0.07);
}

.rda-order-card[hidden] {
  display: none;
}

.rda-order-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-lg) var(--space-xl);
  border-bottom: 1px solid var(--color-border-subtle);
  background: var(--color-cream-light);
  flex-wrap: wrap;
  gap: var(--space-sm);
}

.rda-order-card__id-wrap {
  display: flex;
  align-items: center;
  gap: var(--space-md);
}

.rda-order-card__num {
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: var(--weight-semibold);
  color: var(--color-ink-primary);
  letter-spacing: 0.04em;
}

.rda-order-card__date {
  font-size: 12px;
  color: var(--color-ink-muted);
}

.rda-order-card__body {
  padding: var(--space-lg) var(--space-xl);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-lg);
}

.rda-order-card__items {
  font-family: var(--font-display);
  font-size: 15px;
  color: var(--color-ink-secondary);
  font-style: italic;
  flex: 1;
}

.rda-order-card__total {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: var(--weight-medium);
  color: var(--color-ink-primary);
  white-space: nowrap;
}

.rda-order-card__footer {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  padding: var(--space-md) var(--space-xl);
  border-top: 1px solid var(--color-border-subtle);
  background: #fafafa;
  flex-wrap: wrap;
}

/* ── Paginación ── */

.rda-account-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-lg);
}

.rda-account-pagination__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1px solid var(--color-border-medium);
  border-radius: var(--radius-sm);
  color: var(--color-ink-secondary);
  text-decoration: none;
  transition:
    border-color var(--duration-fast) var(--ease-out),
    color var(--duration-fast) var(--ease-out);
}

.rda-account-pagination__btn:hover {
  border-color: var(--color-gold-base);
  color: var(--color-gold-deep);
}

.rda-account-pagination__info {
  font-family: var(--font-body);
  font-size: 12px;
  color: var(--color-ink-muted);
  letter-spacing: 0.05em;
}

/* ══════════════════════════════════════════════════════════════
   6. DETALLE DE PEDIDO
══════════════════════════════════════════════════════════════ */

.rda-order-detail {
  display: flex;
  flex-direction: column;
  gap: var(--space-2xl);
}

.rda-order-detail__header-right {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  flex-wrap: wrap;
}

.rda-order-detail__date {
  font-size: 13px;
  color: var(--color-ink-muted);
  display: block;
  margin-top: var(--space-xs);
}

/* ── Timeline de estado ── */

.rda-order-timeline {
  display: flex;
  align-items: flex-start;
  gap: 0;
  background: #fff;
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-lg);
  padding: var(--space-xl) var(--space-2xl);
}

.rda-order-timeline__step {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  position: relative;
}

.rda-order-timeline__dot {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--color-border-subtle);
  border: 2px solid var(--color-border-medium);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 11px;
  flex-shrink: 0;
  transition: background var(--duration-normal) var(--ease-out);
  z-index: 1;
  position: relative;
}

.rda-order-timeline__step.is-done .rda-order-timeline__dot {
  background: var(--color-gold-base);
  border-color: var(--color-gold-base);
}

.rda-order-timeline__step.is-active .rda-order-timeline__dot {
  background: var(--color-navy-base);
  border-color: var(--color-navy-base);
  box-shadow: 0 0 0 4px rgba(13, 27, 62, 0.12);
}

.rda-order-timeline__line {
  position: absolute;
  top: 14px;
  left: 50%;
  width: 100%;
  height: 2px;
  background: var(--color-border-subtle);
  z-index: 0;
}

.rda-order-timeline__line.is-done {
  background: var(--color-gold-base);
}

.rda-order-timeline__label {
  font-family: var(--font-body);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-ink-muted);
  text-align: center;
  margin-top: var(--space-sm);
  line-height: 1.3;
}

.rda-order-timeline__step.is-active .rda-order-timeline__label,
.rda-order-timeline__step.is-done .rda-order-timeline__label {
  color: var(--color-ink-secondary);
  font-weight: var(--weight-medium);
}

/* ── Guía de envío ── */

.rda-tracking-card {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  background: linear-gradient(155deg, var(--color-navy-base) 0%, var(--color-navy-deep) 100%);
  border-radius: var(--radius-lg);
  padding: var(--space-lg) var(--space-xl);
  box-shadow: 0 10px 32px rgba(10, 23, 51, 0.16);
}

.rda-tracking-card__icon {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(201, 168, 76, 0.12);
  border: 1px solid rgba(201, 168, 76, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-gold-base);
}

.rda-tracking-card__body {
  flex: 1 1 auto;
  min-width: 0;
}

.rda-tracking-card__label {
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: var(--weight-medium);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-gold-soft);
  margin: 0 0 4px;
}

.rda-tracking-card__numero {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: var(--weight-regular);
  letter-spacing: 0.03em;
  color: var(--color-cream-light);
  margin: 0;
  word-break: break-all;
}

.rda-tracking-card__actions {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  flex-shrink: 0;
}

.rda-tracking-card__copy {
  display: flex;
  align-items: center;
  gap: 6px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: var(--radius-sm);
  padding: 8px 12px;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: var(--weight-medium);
  color: var(--color-cream-light);
  cursor: pointer;
  transition: background var(--duration-fast) var(--ease-out), border-color var(--duration-fast) var(--ease-out);
}

.rda-tracking-card__copy:hover {
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 255, 255, 0.28);
}

.rda-tracking-card__copy.is-copied {
  border-color: var(--color-gold-base);
  color: var(--color-gold-base);
}

.rda-tracking-card__link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: var(--weight-medium);
  color: var(--color-gold-base);
  text-decoration: none;
  white-space: nowrap;
  border-bottom: 1px solid var(--color-gold-base);
  padding-bottom: 1px;
  transition: color var(--duration-fast) var(--ease-out);
}

.rda-tracking-card__link:hover {
  color: var(--color-gold-warm);
}

@media (max-width: 599px) {
  .rda-tracking-card {
    flex-wrap: wrap;
    padding: var(--space-lg);
  }

  .rda-tracking-card__actions {
    width: 100%;
    justify-content: space-between;
    margin-top: var(--space-xs);
  }
}

/* ── Grid detalle ── */

.rda-order-detail__grid {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: var(--space-xl);
  align-items: start;
}

/* ── Items del pedido ── */

.rda-order-detail__section-title {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: var(--weight-regular);
  color: var(--color-ink-primary);
  margin-bottom: var(--space-lg);
}

.rda-order-detail__items {
  background: #fff;
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-lg);
  padding: var(--space-xl);
}

.rda-order-items {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  margin-bottom: var(--space-xl);
}

.rda-order-item {
  display: flex;
  gap: var(--space-md);
  align-items: flex-start;
  padding-bottom: var(--space-md);
  border-bottom: 1px solid var(--color-border-subtle);
}

.rda-order-item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.rda-order-item__img {
  flex-shrink: 0;
  width: 64px;
  height: 64px;
  overflow: hidden;
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border-subtle);
}

.rda-order-item__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rda-order-item__info {
  flex: 1;
  min-width: 0;
}

.rda-order-item__name {
  font-family: var(--font-display);
  font-size: 15px;
  color: var(--color-ink-primary);
  text-decoration: none;
  display: block;
}

.rda-order-item__name:hover {
  color: var(--color-gold-deep);
}

.rda-order-item__qty {
  font-size: 12px;
  color: var(--color-ink-muted);
  margin-top: 4px;
  display: block;
}

.rda-order-item__price {
  font-family: var(--font-display);
  font-size: 16px;
  color: var(--color-ink-primary);
  white-space: nowrap;
  font-weight: var(--weight-medium);
}

/* ── Totales ── */

.rda-order-totals {
  border-top: 1px solid var(--color-border-subtle);
  padding-top: var(--space-lg);
}

.rda-order-totals__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--space-xs) 0;
  font-size: 14px;
}

.rda-order-totals__label {
  color: var(--color-ink-secondary);
}

.rda-order-totals__value {
  font-weight: var(--weight-medium);
  color: var(--color-ink-primary);
}

.rda-order-totals__row--grand {
  border-top: 1px solid var(--color-border-subtle);
  margin-top: var(--space-sm);
  padding-top: var(--space-sm);
  font-size: 16px;
}

.rda-order-totals__row--grand .rda-order-totals__label,
.rda-order-totals__row--grand .rda-order-totals__value {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: var(--weight-medium);
  color: var(--color-ink-primary);
}

/* ── Meta sidebar del detalle ── */

.rda-order-detail__meta {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

.rda-order-detail__meta-card {
  background: #fff;
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-lg);
  padding: var(--space-lg);
}

.rda-order-detail__meta-title {
  font-family: var(--font-body);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-ink-muted);
  margin-bottom: var(--space-sm);
}

.rda-order-detail__address {
  font-style: normal;
  font-size: 14px;
  color: var(--color-ink-secondary);
  line-height: 1.7;
}

.rda-order-detail__payment {
  font-size: 14px;
  color: var(--color-ink-secondary);
}

.rda-order-detail__actions {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

/* ══════════════════════════════════════════════════════════════
   7. DIRECCIONES
══════════════════════════════════════════════════════════════ */

.rda-addresses {
  display: flex;
  flex-direction: column;
  gap: var(--space-xl);
}

.rda-addresses__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-lg);
}

.rda-address-card {
  position: relative;
  background: #fff;
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 2px 12px rgba(10, 23, 51, 0.05);
  transition:
    box-shadow var(--duration-base) var(--ease-out),
    transform var(--duration-base) var(--ease-out);
}

.rda-address-card:hover {
  box-shadow: 0 10px 32px rgba(10, 23, 51, 0.09);
  transform: translateY(-2px);
}

/* Acento dorado superior — mismo lenguaje visual que los paneles de login */
.rda-address-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: var(--space-xl);
  right: var(--space-xl);
  height: 2px;
  background: linear-gradient(to right, transparent, var(--color-gold-base), transparent);
  z-index: 1;
}

.rda-address-card__header {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  padding: var(--space-xl) var(--space-xl) var(--space-lg);
}

.rda-address-card__icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--color-navy-base);
  color: var(--color-gold-base);
  display: flex;
  align-items: center;
  justify-content: center;
}

.rda-address-card__icon svg {
  width: 20px;
  height: 20px;
}

.rda-address-card__heading {
  min-width: 0;
}

.rda-address-card__title {
  font-family: var(--font-display);
  font-size: 17px;
  font-weight: var(--weight-medium);
  color: var(--color-ink-primary);
  line-height: 1.3;
}

.rda-address-card__desc {
  font-family: var(--font-body);
  font-size: 12px;
  color: var(--color-ink-muted);
  margin-top: 2px;
}

.rda-address-card__body {
  padding: 0 var(--space-xl) var(--space-xl);
  flex: 1;
}

.rda-address-card__address {
  font-style: normal;
  font-size: 14px;
  color: var(--color-ink-secondary);
  line-height: 1.85;
  padding: var(--space-lg);
  background: var(--color-cream-light);
  border-radius: var(--radius-md);
  border-left: 3px solid var(--color-gold-base);
}

.rda-address-card__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-sm);
  padding: var(--space-xl) var(--space-md);
  color: var(--color-ink-whisper);
  background: var(--color-cream-light);
  border: 1px dashed var(--color-border-medium);
  border-radius: var(--radius-md);
}

.rda-address-card__empty svg {
  color: var(--color-ink-whisper);
}

.rda-address-card__empty p {
  font-family: var(--font-body);
  font-size: 13px;
  font-style: italic;
  color: var(--color-ink-muted);
  max-width: 220px;
}

.rda-address-card--empty {
  border-style: dashed;
  box-shadow: none;
}

.rda-address-card__footer {
  padding: var(--space-lg) var(--space-xl);
  border-top: 1px solid var(--color-border-subtle);
  background: var(--color-cream-light);
}

/* ── Formulario de dirección ──
   Antes los campos flotaban sueltos sobre el fondo de la página, sin
   ningún contenedor — de ahí la sensación "plana, sin estilos". Ahora el
   <form> es una tarjeta con el mismo lenguaje visual que el resto de
   "Mi cuenta" (acento dorado superior, sombra, radio de borde). ── */

.rda-address-form-wrap {
  display: flex;
  flex-direction: column;
  gap: var(--space-xl);
}

.rda-address-form {
  position: relative;
  background: #fff;
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-lg);
  padding: var(--space-2xl);
  box-shadow: 0 2px 12px rgba(10, 23, 51, 0.05);
}

.rda-address-form::before {
  content: '';
  position: absolute;
  top: 0;
  left: var(--space-2xl);
  right: var(--space-2xl);
  height: 2px;
  background: linear-gradient(to right, transparent, var(--color-gold-base), transparent);
}

.rda-address-form__fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-lg) var(--space-lg);
}

/* WooCommerce marca cada campo con form-row-wide (ancho completo, ej. calle,
   dirección) o form-row-first/form-row-last (pareja lado a lado, ej.
   nombre+apellido, ciudad+departamento). Sin esta regla, un campo "wide"
   solo ocupaba una de las dos columnas del grid — se veía descuadrado y
   asimétrico en vez de organizarse en filas prolijas. */
.rda-address-form__fields .form-row-wide {
  grid-column: 1 / -1;
}

.rda-address-form__submit-row {
  margin-top: var(--space-lg);
  padding-top: var(--space-lg);
  border-top: 1px solid var(--color-border-subtle);
}

/* ── Campos de WooCommerce (woocommerce_form_field) ──
   El wrapper real que imprime este formulario es .rda-address-form__fields,
   NO .woocommerce-address-fields__field-wrapper — esa clase pertenece al
   template por defecto de WooCommerce, que este tema no usa. Las reglas
   anteriores apuntaban ahí y nunca coincidían con nada, por eso los campos
   se veían con el estilo plano del navegador (borde gris, sin foco dorado,
   sin espaciado a propósito). ── */

.rda-address-form__fields .form-row {
  margin: 0;
}

.rda-address-form__fields .woocommerce-input-wrapper {
  display: block;
  width: 100%;
}

.rda-address-form__fields label {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: var(--weight-medium);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-ink-secondary);
  display: block;
  margin-bottom: 8px;
}

.rda-address-form__fields .required {
  color: var(--color-gold-deep);
  text-decoration: none;
  margin-left: 2px;
}

.rda-address-form__fields input,
.rda-address-form__fields select,
.rda-address-form__fields textarea {
  width: 100%;
  height: 50px;
  padding: 0 18px;
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1;
  color: var(--color-ink-primary);
  background: var(--color-cream-light);
  border: 1px solid var(--color-border-medium);
  border-radius: var(--radius-sm);
  outline: none;
  appearance: none;
  transition:
    border-color var(--duration-fast) var(--ease-out),
    box-shadow var(--duration-fast) var(--ease-out),
    background var(--duration-fast) var(--ease-out);
}

.rda-address-form__fields textarea {
  height: auto;
  min-height: 96px;
  padding-top: 14px;
  padding-bottom: 14px;
  line-height: 1.6;
  resize: vertical;
}

.rda-address-form__fields input:hover,
.rda-address-form__fields select:hover,
.rda-address-form__fields textarea:hover {
  border-color: var(--color-ink-whisper);
}

.rda-address-form__fields input:focus,
.rda-address-form__fields select:focus,
.rda-address-form__fields textarea:focus {
  border-color: var(--color-gold-base);
  box-shadow: 0 0 0 3px rgba(201, 168, 76, 0.15);
  background: #fff;
  outline: none;
}

/* Flechita custom para <select> — reemplaza el chevron nativo del navegador,
   que se ve distinto (y muy "clásico") en cada sistema operativo */
.rda-address-form__fields select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238A8FAA' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  padding-right: 42px;
  cursor: pointer;
}

.rda-address-form__fields .description {
  font-family: var(--font-body);
  font-size: 12px;
  color: var(--color-ink-muted);
  margin-top: 6px;
}

/* select2 (país) reemplaza el <select> nativo — que herede la misma altura
   para que todas las filas se vean parejas */
.rda-address-form__fields .select2-container .select2-selection--single {
  height: 50px !important;
}

/* ══════════════════════════════════════════════════════════════
   8. FORMULARIOS (editar cuenta + componentes compartidos)
══════════════════════════════════════════════════════════════ */

.rda-edit-account {
  display: flex;
  flex-direction: column;
  gap: var(--space-xl);
}

.rda-edit-account__form {
  position: relative;
  background: #fff;
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-lg);
  padding: var(--space-2xl);
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
  box-shadow: 0 2px 12px rgba(10, 23, 51, 0.05);
}

/* Acento dorado superior — mismo lenguaje visual que los paneles de login
   y las tarjetas de dirección, para que toda "Mi cuenta" se sienta como
   un solo sistema en vez de piezas sueltas. */
.rda-edit-account__form::before {
  content: '';
  position: absolute;
  top: 0;
  left: var(--space-2xl);
  right: var(--space-2xl);
  height: 2px;
  background: linear-gradient(to right, transparent, var(--color-gold-base), transparent);
}

.rda-edit-account__password-section {
  margin-top: var(--space-md);
  padding: var(--space-xl);
  background: var(--color-cream-light);
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-md);
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
}

.rda-edit-account__section-subtitle {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: var(--weight-regular);
  color: var(--color-ink-primary);
  margin-bottom: calc(-1 * var(--space-sm));
}

.rda-form-row--two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-lg);
}

.rda-form-hint {
  font-size: 12px;
  color: var(--color-ink-muted);
  margin-top: var(--space-xs);
}

/* ── Toggle de contraseña ── */

.rda-form-password-wrap {
  position: relative;
}

.rda-form-password-wrap .rda-form-input {
  padding-right: 48px;
}

.rda-form-password-toggle {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  cursor: pointer;
  color: var(--color-ink-muted);
  padding: 4px;
  display: flex;
  align-items: center;
  transition: color var(--duration-fast) var(--ease-out);
}

.rda-form-password-toggle:hover {
  color: var(--color-gold-deep);
}

.rda-form-password-toggle .rda-icon-eye-off {
  display: none;
}

.rda-form-password-toggle.is-visible .rda-icon-eye {
  display: none;
}

.rda-form-password-toggle.is-visible .rda-icon-eye-off {
  display: block;
}

/* ── Indicador de fortaleza de contraseña ── */

.rda-password-strength {
  margin-top: var(--space-sm);
  display: none;
}

.rda-password-strength.is-visible {
  display: block;
}

.rda-password-strength__bar {
  height: 3px;
  border-radius: 999px;
  background: var(--color-border-subtle);
  overflow: hidden;
  position: relative;
}

.rda-password-strength__bar::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: var(--strength-pct, 0%);
  background: var(--strength-color, var(--color-border-subtle));
  transition: width 300ms var(--ease-out), background 300ms;
}

.rda-password-strength__label {
  display: block;
  font-size: 11px;
  color: var(--color-ink-muted);
  margin-top: 4px;
}

/* ══════════════════════════════════════════════════════════════
   9. AUTH — LOGIN / REGISTRO (PREMIUM)
══════════════════════════════════════════════════════════════ */

/* ── Fondo de página — estado invitado ── */

.woocommerce-account:not(.logged-in) .rda-main {
  background: linear-gradient(
    160deg,
    #faf5ed 0%,
    #fdfaf4 55%,
    var(--color-cream-light) 100%
  );
  position: relative;
}

.woocommerce-account:not(.logged-in) .rda-main::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 12% 45%, rgba(201, 168, 76, 0.07) 0%, transparent 52%),
    radial-gradient(ellipse at 88% 25%, rgba(13, 27, 62, 0.04) 0%, transparent 48%);
  pointer-events: none;
}

/* ── Wrapper principal — maneja el espaciado cuando rda-account no está en el DOM ── */

.rda-auth {
  position: relative;
  z-index: 1;
  max-width: 980px;
  margin-inline: auto;
  padding: var(--space-3xl) var(--space-md) var(--space-4xl);
}

/* Cuando my-account.php genera el wrapper rda-account: sin padding extra */
.rda-account .rda-auth {
  padding: 0;
}

/* ── Selector de modo (tabs) — solo móvil ── */

.rda-auth__tabs {
  display: none;
  gap: 0;
  background: #fff;
  border: 1px solid var(--color-border-subtle);
  border-radius: var(--radius-md);
  padding: 4px;
  margin-bottom: var(--space-xl);
  box-shadow: 0 2px 12px rgba(10, 23, 51, 0.07);
}

.rda-auth__tab {
  flex: 1;
  padding: 13px 16px;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: var(--weight-semibold);
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--color-ink-muted);
  background: transparent;
  border: none;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition:
    background var(--duration-fast) var(--ease-out),
    color var(--duration-fast) var(--ease-out),
    box-shadow var(--duration-fast) var(--ease-out);
}

.rda-auth__tab.is-active {
  background: var(--color-navy-base);
  color: var(--color-cream-light);
  box-shadow: 0 2px 10px rgba(13, 27, 62, 0.22);
}

.rda-auth__tab:hover:not(.is-active) {
  background: var(--color-cream-warm);
  color: var(--color-ink-primary);
}

/* ── Cuadrícula de paneles ── */

.rda-auth__panels {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-xl);
  align-items: stretch;
  position: relative;
}

/* Divisor central decorativo — solo visible en escritorio */
.rda-auth__panels::after {
  content: '';
  position: absolute;
  left: 50%;
  top: var(--space-2xl);
  bottom: var(--space-2xl);
  width: 1px;
  background: linear-gradient(
    to bottom,
    transparent,
    rgba(201, 168, 76, 0.3) 25%,
    rgba(201, 168, 76, 0.3) 75%,
    transparent
  );
  transform: translateX(-50%);
  pointer-events: none;
}

/* ── Tarjeta de panel ── */

.rda-auth__panel-inner {
  position: relative;
  background: #fff;
  border: 1px solid rgba(201, 168, 76, 0.15);
  border-radius: var(--radius-lg);
  padding: var(--space-2xl);
  box-shadow:
    0 4px 32px rgba(10, 23, 51, 0.07),
    0 1px 4px rgba(10, 23, 51, 0.04);
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: box-shadow var(--duration-base) var(--ease-out);
}

/* Acento dorado superior */
.rda-auth__panel-inner::before {
  content: '';
  position: absolute;
  top: 0;
  left: var(--space-2xl);
  right: var(--space-2xl);
  height: 2px;
  background: linear-gradient(to right, transparent, var(--color-gold-base), transparent);
  border-radius: 0 0 2px 2px;
}

.rda-auth__panel-inner:hover {
  box-shadow:
    0 8px 40px rgba(10, 23, 51, 0.1),
    0 2px 8px rgba(10, 23, 51, 0.06);
}

/* ── Título del panel ── */

.rda-auth__title {
  font-family: var(--font-display);
  font-size: clamp(22px, 3vw, 28px);
  font-weight: var(--weight-regular);
  color: var(--color-ink-primary);
  line-height: var(--leading-tight);
  margin: var(--space-xs) 0 0;
}

/* ── Formulario de autenticación ── */

.rda-auth-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-lg);
  margin-top: var(--space-lg);
}

.rda-auth-form__options {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
  flex-wrap: wrap;
}

.rda-auth-form__lost-pass {
  font-family: var(--font-body);
  font-size: 12px;
  color: var(--color-gold-deep);
  text-decoration: none;
  transition: color var(--duration-fast) var(--ease-out);
}

.rda-auth-form__lost-pass:hover {
  color: var(--color-gold-base);
  text-decoration: underline;
}

/* ── Botón enviar ── */

.rda-auth-form__submit {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-sm);
  width: 100%;
  padding: 16px 24px;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: var(--weight-semibold);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-navy-base);
  background: var(--color-gold-base);
  border: 1px solid var(--color-gold-base);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition:
    background var(--duration-fast) var(--ease-out),
    border-color var(--duration-fast) var(--ease-out),
    transform var(--duration-fast) var(--ease-out),
    box-shadow var(--duration-fast) var(--ease-out);
}

.rda-auth-form__submit:hover {
  background: var(--color-gold-deep);
  border-color: var(--color-gold-deep);
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(201, 168, 76, 0.3);
}

.rda-auth-form__submit:active {
  transform: translateY(0);
  box-shadow: none;
}

.rda-auth-form__submit--navy {
  color: var(--color-cream-light);
  background: var(--color-navy-base);
  border-color: var(--color-navy-base);
}

.rda-auth-form__submit--navy:hover {
  background: var(--color-navy-deep);
  border-color: var(--color-navy-deep);
  box-shadow: 0 4px 16px rgba(13, 27, 62, 0.25);
}

/* ── Badge de confianza ── */

.rda-auth__trust {
  display: flex;
  align-items: flex-start;
  gap: var(--space-xs);
  margin-top: auto;
  padding-top: var(--space-lg);
  border-top: 1px solid var(--color-border-subtle);
  font-family: var(--font-body);
  font-size: 11px;
  color: var(--color-ink-muted);
  line-height: 1.5;
}

.rda-auth__trust svg {
  flex-shrink: 0;
  margin-top: 2px;
  color: var(--color-gold-base);
}

/* ══ Escritorio 768px+: SIEMPRE mostrar ambos paneles ══ */

@media (min-width: 768px) {
  .rda-auth__tabs {
    display: none;
  }

  /* Anula el atributo [hidden] del panel de registro en escritorio */
  .rda-auth__panels .rda-auth__panel {
    display: block !important;
  }
}

/* ══ Móvil max-767px: una columna + tabs ══ */

@media (max-width: 767px) {
  .rda-auth {
    padding: var(--space-xl) var(--space-md) var(--space-2xl);
  }

  .rda-auth__tabs {
    display: flex;
  }

  .rda-auth__panels {
    grid-template-columns: 1fr;
    gap: var(--space-lg);
  }

  .rda-auth__panels::after {
    display: none;
  }

  .rda-auth__panel-inner {
    padding: var(--space-lg);
  }

  .rda-auth__panel-inner::before {
    left: var(--space-lg);
    right: var(--space-lg);
  }
}

/* ── Variante panel único: olvidar / restablecer contraseña ── */

.rda-auth--single {
  max-width: 520px;
}

.rda-auth--single .rda-auth__panels {
  grid-template-columns: 1fr;
}

.rda-auth--single .rda-auth__panels::after {
  display: none;
}

/* Icono decorativo sobre el título */
.rda-auth__icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  background: linear-gradient(135deg, rgba(201, 168, 76, 0.12), rgba(201, 168, 76, 0.06));
  border: 1px solid rgba(201, 168, 76, 0.22);
  border-radius: var(--radius-full);
  color: var(--color-gold-base);
  margin-bottom: var(--space-xs);
}

/* Descripción introductoria */
.rda-auth__description {
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--color-ink-muted);
  line-height: var(--leading-relaxed);
  margin: var(--space-md) 0 0;
}

/* Pista de campo (confirmación contraseña) */
.rda-auth__field-hint {
  font-family: var(--font-body);
  font-size: 12px;
  margin: var(--space-2xs) 0 0;
  min-height: 18px;
  transition: color var(--duration-fast) var(--ease-out);
}

.rda-auth__field-hint--ok    { color: var(--color-success); }
.rda-auth__field-hint--error { color: var(--color-error); }

/* Enlace de regreso */
.rda-auth__back-link {
  text-align: center;
  margin-top: var(--space-xl);
}

.rda-auth__back-link a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-body);
  font-size: 13px;
  color: var(--color-ink-muted);
  text-decoration: none;
  transition: color var(--duration-fast) var(--ease-out);
}

.rda-auth__back-link a:hover {
  color: var(--color-gold-deep);
}

.rda-auth__back-link a:focus-visible {
  outline: 2px solid var(--color-gold-base);
  outline-offset: 3px;
  border-radius: 2px;
}

/* Links dentro del trust badge */
.rda-auth__trust a {
  color: var(--color-gold-deep);
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color var(--duration-fast) var(--ease-out);
}

.rda-auth__trust a:hover {
  color: var(--color-gold-base);
}

/* Texto de política de privacidad de WC — override para panel blanco */
.rda-auth__panel-inner .woocommerce-privacy-policy-text {
  color: var(--color-ink-muted);
}

.rda-auth__panel-inner .woocommerce-privacy-policy-text a {
  color: var(--color-gold-deep);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ══════════════════════════════════════════════════════════════
   10. ESTADOS DE PEDIDO (badges)
══════════════════════════════════════════════════════════════ */

.rda-order-status {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: var(--weight-semibold);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border-radius: 999px;
  white-space: nowrap;
}

.rda-order-status--pending {
  background: rgba(201, 168, 76, 0.12);
  color: #8a6d10;
}

.rda-order-status--processing {
  background: rgba(90, 112, 144, 0.12);
  color: var(--color-info);
}

.rda-order-status--on-hold {
  background: rgba(201, 168, 76, 0.12);
  color: #7a600c;
}

.rda-order-status--completed {
  background: rgba(79, 125, 92, 0.12);
  color: var(--color-success);
}

.rda-order-status--cancelled,
.rda-order-status--failed {
  background: rgba(160, 69, 69, 0.1);
  color: var(--color-error);
}

.rda-order-status--refunded {
  background: rgba(0, 0, 0, 0.06);
  color: var(--color-ink-muted);
}

/* ══════════════════════════════════════════════════════════════
   11. NOTICES DE WOOCOMMERCE
══════════════════════════════════════════════════════════════ */

.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
  display: flex;
  align-items: flex-start;
  gap: var(--space-md);
  padding: var(--space-lg) var(--space-xl);
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-size: 14px;
  margin-bottom: var(--space-lg);
  list-style: none;
}

.woocommerce-message {
  background: rgba(79, 125, 92, 0.08);
  border: 1px solid rgba(79, 125, 92, 0.2);
  color: var(--color-success);
}

.woocommerce-error {
  background: rgba(160, 69, 69, 0.08);
  border: 1px solid rgba(160, 69, 69, 0.2);
  color: var(--color-error);
}

.woocommerce-info {
  background: rgba(90, 112, 144, 0.08);
  border: 1px solid rgba(90, 112, 144, 0.2);
  color: var(--color-info);
}

/* ══════════════════════════════════════════════════════════════
   12. ESTADO VACÍO
══════════════════════════════════════════════════════════════ */

.rda-account-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: var(--space-3xl) var(--space-xl);
  gap: var(--space-md);
}

.rda-account-empty__icon {
  width: 80px;
  height: 80px;
  color: var(--color-ink-whisper);
}

.rda-account-empty__title {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: var(--weight-regular);
  color: var(--color-ink-secondary);
}

.rda-account-empty__text {
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--color-ink-muted);
  max-width: 360px;
}

/* ══════════════════════════════════════════════════════════════
   13. RESPONSIVE MOBILE (< 768px)
══════════════════════════════════════════════════════════════ */

@media (max-width: 1023px) {

  .rda-account__layout {
    grid-template-columns: 1fr;
    gap: var(--space-lg);
  }

  .rda-account__nav-wrap {
    position: static;
    /* Causa raíz del desborde: en una sola columna de grid, este wrapper
       pasa a ser una fila propia. Sin min-width:0, un item de grid nunca
       se encoge más allá del ancho intrínseco de su contenido — y como
       adentro vive la lista de pestañas con scroll horizontal, su ancho
       "natural" (sin cortar) es enorme. Eso forzaba a TODA la columna del
       grid (compartida por el banner, las estadísticas, el pedido, etc.)
       a ensancharse con él, aunque esas otras secciones sí cabían bien. */
    min-width: 0;
  }

  /*
   * Nav como grid de mosaicos en mobile (antes era una fila con scroll
   * horizontal: al sumar "Portal de Equipo" ya no entraban todos los
   * ítems de un vistazo y quedaban escondidos deslizando). Con grid de 3
   * columnas que envuelve en filas, TODAS las opciones se ven de una vez,
   * sin scroll.
   */
  .rda-account-nav {
    border-radius: var(--radius-md);
  }

  .rda-account-nav__user {
    display: none; /* ocultar en mobile para ahorrar espacio */
  }

  .rda-account-nav__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4px;
    padding: 8px;
  }

  .rda-account-nav__link {
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    padding: 10px 4px;
    border-left: none;
    border-bottom: none;
    border-radius: var(--radius-sm);
    text-align: center;
    white-space: normal;
    min-height: 64px; /* objetivo táctil accesible, con espacio para 2 líneas de texto */
  }

  .rda-account-nav__icon {
    justify-content: center;
  }

  .rda-account-nav__label {
    font-size: 10px;
    letter-spacing: 0.02em;
    line-height: 1.25;
  }

  .rda-account-nav__link.is-active {
    border-left: none;
    color: var(--color-navy-base);
    background: var(--color-gold-base);
    font-weight: var(--weight-semibold);
  }

  .rda-account-nav__support {
    display: none;
  }

  /* La cuadrícula ya separa visualmente cada ítem por su propia celda —
     el divisor dorado de "Portal de Equipo" y el margen del logout (ambos
     pensados para una lista vertical/horizontal en fila) no aplican aquí. */
  .rda-account-nav__item--ops .rda-account-nav__link {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 10px;
  }

  .rda-account-nav__item--logout {
    margin-top: 0;
  }

  .rda-account-nav__item--logout .rda-account-nav__link {
    border-top: none;
    padding-top: 10px;
  }

}

@media (max-width: 767px) {

  .rda-account {
    padding-block: var(--space-lg) var(--space-2xl);
  }

  /* ── Bienvenida: más compacta, ornamento contenido ── */
  .rda-dashboard {
    gap: var(--space-xl);
  }

  .rda-dashboard__welcome {
    padding: var(--space-lg);
    border-radius: var(--radius-md);
  }

  .rda-dashboard__welcome-deco {
    width: 130px;
    height: 130px;
    right: -30px;
    top: -30px;
  }

  .rda-dashboard__greeting {
    margin: 4px 0 var(--space-2xs);
  }

  /* ── Stats: filas horizontales tipo lista (patrón premium de apps
     financieras/membresías: etiqueta a la izquierda, valor destacado
     a la derecha) en vez de bloques centrados apilados ── */
  .rda-dashboard__stats {
    flex-direction: column;
    border-radius: var(--radius-md);
  }

  .rda-dashboard__stat--divider {
    display: none;
  }

  .rda-dashboard__stat {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    text-align: left;
    padding: var(--space-md) var(--space-lg);
  }

  .rda-dashboard__stat:not(:first-child) {
    border-top: 1px solid var(--color-border-subtle);
  }

  .rda-dashboard__stat-value {
    font-size: 19px;
  }

  .rda-dashboard__stat-value--badge {
    justify-content: flex-end;
  }

  .rda-dashboard__stat-label {
    margin-top: 0;
  }

  /* ── Secciones del dashboard: padding ajustado ── */
  .rda-dashboard__section {
    padding: var(--space-lg);
    border-radius: var(--radius-md);
  }

  .rda-dashboard__last-order-footer {
    flex-direction: column;
    align-items: stretch;
  }

  .rda-dashboard__order-total {
    text-align: right;
  }

  .rda-dashboard__last-order-actions {
    flex-direction: column;
  }

  .rda-dashboard__last-order-actions .rda-btn-account {
    justify-content: center;
    padding: 12px 16px; /* objetivo táctil cómodo */
  }

  /* ── Accesos rápidos: grid más respirado, tarjetas con más aire ── */
  .rda-dashboard__quick-actions {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-sm);
  }

  .rda-quick-action {
    padding: var(--space-md) var(--space-2xs);
    border-radius: var(--radius-md);
  }

  .rda-quick-action__icon {
    width: 40px;
    height: 40px;
  }

  /* Order card: body en columna */
  .rda-order-card__body {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-xs);
  }

  .rda-order-card__header,
  .rda-order-card__body,
  .rda-order-card__footer {
    padding-inline: var(--space-lg);
  }

  .rda-order-card__footer {
    flex-direction: column;
    align-items: stretch;
  }

  .rda-order-card__footer .rda-btn-account {
    justify-content: center;
  }

  /* Detalle de pedido: grid en columna */
  .rda-order-detail__grid {
    grid-template-columns: 1fr;
  }

  .rda-order-detail__items {
    padding: var(--space-lg);
  }

  /* Timeline horizontal → compacto y deslizable con objetivo legible */
  .rda-order-timeline {
    padding: var(--space-lg) var(--space-md);
    overflow-x: auto;
    justify-content: flex-start;
    -webkit-overflow-scrolling: touch;
  }

  .rda-order-timeline__step {
    min-width: 84px;
  }

  /* Direcciones: 1 columna, con menos padding y badge de icono más compacto */
  .rda-addresses__grid {
    grid-template-columns: 1fr;
  }

  .rda-address-card__header {
    padding: var(--space-lg) var(--space-lg) var(--space-md);
  }

  .rda-address-card__icon {
    width: 40px;
    height: 40px;
  }

  .rda-address-card__body {
    padding: 0 var(--space-lg) var(--space-lg);
  }

  .rda-address-card__footer {
    padding: var(--space-md) var(--space-lg);
  }

  /* Address form: 1 columna, padding reducido */
  .rda-address-form__fields {
    grid-template-columns: 1fr;
  }

  .rda-address-form {
    padding: var(--space-lg);
    border-radius: var(--radius-md);
  }

  .rda-address-form::before {
    left: var(--space-lg);
    right: var(--space-lg);
  }

  /* Auth panels: 1 columna */
  .rda-auth__panels {
    grid-template-columns: 1fr;
  }

  .rda-auth__tabs {
    display: flex;
  }

  /* Form row two → columna */
  .rda-form-row--two {
    grid-template-columns: 1fr;
  }

  /* Edit account: padding reducido */
  .rda-edit-account__form {
    padding: var(--space-lg);
    border-radius: var(--radius-md);
  }

  /* Order detail header */
  .rda-account-section-header {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-sm);
  }

  .rda-account-section-title {
    font-size: 22px;
  }

  /* view-order.php: badge de estado + link "Mis pedidos" — permitir que
     se acomoden en su propia fila sin forzar ancho completo (ese link es
     intencionalmente pequeño/secundario, no un CTA). */
  .rda-order-detail__header-right {
    width: 100%;
    justify-content: space-between;
  }

}

/* ── Ajuste fino para teléfonos pequeños (≤ 400px) ── */
@media (max-width: 400px) {

  .rda-dashboard__quick-actions {
    grid-template-columns: repeat(2, 1fr);
  }

  .rda-account-section-title {
    font-size: 20px;
  }

  .rda-dashboard__greeting {
    font-size: 24px;
  }

}

@media (prefers-reduced-motion: reduce) {
  .rda-order-timeline__dot,
  .rda-order-timeline__line,
  .rda-password-strength__bar::after {
    transition: none;
  }
}