/* ============================================================
   VIÑALES · MI CUENTA (account.css)
   Estiliza el markup NATIVO de WooCommerce en los endpoints de
   "Mi cuenta" que NO tiene template a medida (editar cuenta,
   direcciones, detalle de pedido, login/registro) para que hablen
   el mismo lenguaje visual que el dashboard, el checkout y la ficha.

   - Se carga SOLO en is_account_page() (ver inc/enqueue.php).
   - Reutiliza los tokens de :root definidos en style.css.
   - Todo va scoped bajo body.woocommerce-account para no filtrar
     estilos a otras vistas (el checkout usa .woocommerce-checkout).
   - NO redefine .account / .acct-nav / .acct-order / .stat-card:
     esas clases ya viven en style.css y se ven bien.
   ============================================================ */

/* Variables de formulario de Woo (su woocommerce.css usa estas para
   pintar el borde por defecto). Las alineamos al sistema Viñales. */
body.woocommerce-account{--wc-form-border-color:var(--line-2);--wc-form-border-width:1px}

/* ------------------------------------------------------------
   1) TÍTULOS Y TEXTO INTRO DE LOS PANELES
   Los templates default de Woo traen <h2>/<p> sueltos. Los
   igualamos a .acct-panel__h / .acct-panel__sub del dashboard.
   ------------------------------------------------------------ */
.woocommerce-account .acct-main > h2,
.woocommerce-account .acct-main form > h2,
.woocommerce-account .woocommerce-EditAccountForm ~ h2,
.woocommerce-account .woocommerce-order-details__title,
.woocommerce-account .woocommerce-column__title{
  font-family:var(--serif);font-weight:600;color:var(--ink);
  font-size:1.4rem;line-height:1.15;margin:0 0 var(--s3)}

.woocommerce-account .acct-form-head{margin-bottom:var(--s5)}
.woocommerce-account .acct-form-head .acct-panel__h{margin-bottom:var(--s2)}
.woocommerce-account .acct-form-head .acct-panel__sub{color:var(--muted);margin:0}

/* Párrafos de introducción (p.ej. "Las siguientes direcciones…",
   o la línea de estado del pedido en view-order). */
.woocommerce-account .acct-main > p{color:var(--muted);line-height:1.7;margin:0 0 var(--s5)}

/* Marks del estado del pedido (view-order): nº, fecha y estado. */
.woocommerce-account .acct-main mark{background:transparent;color:var(--ink);font-weight:600}
.woocommerce-account .acct-main mark.order-status{
  display:inline-block;background:rgba(176,141,79,.18);color:var(--gold-ink);
  font-size:var(--fs-xs);font-weight:700;padding:.2rem .6rem;border-radius:var(--r-pill);
  line-height:1.4;text-transform:capitalize}

/* ------------------------------------------------------------
   2) INPUTS / SELECT / TEXTAREA  (patrón idéntico al checkout)
   ------------------------------------------------------------ */
.woocommerce-account .acct-main .woocommerce-form-row,
.woocommerce-account .acct-main .form-row{
  display:flex;flex-direction:column;gap:.3rem;margin:0 0 var(--s4);padding:0;width:100%}

/* WooCommerce le da al label line-height:2 (24px) + a la fila padding:3px, lo que
   infla cada fila ~20px y genera aire de más. Lo compactamos aquí. */
.woocommerce-account .acct-main .form-row > label,
.woocommerce-account .acct-main .woocommerce-form-row > label{
  font-size:var(--fs-xs);font-weight:600;color:var(--ink);line-height:1.35;margin:0}

.woocommerce-account .acct-main .form-row .required{color:var(--gold-ink);text-decoration:none;border:0}
.woocommerce-account .acct-main .form-row .optional{color:var(--muted);font-weight:400}

/* El span.woocommerce-input-wrapper que Woo mete alrededor del input. */
.woocommerce-account .acct-main .woocommerce-input-wrapper{display:block;width:100%}

.woocommerce-account .acct-main .input-text,
.woocommerce-account .acct-main .woocommerce-Input,
.woocommerce-account .acct-main input[type="text"],
.woocommerce-account .acct-main input[type="email"],
.woocommerce-account .acct-main input[type="tel"],
.woocommerce-account .acct-main input[type="password"],
.woocommerce-account .acct-main select,
.woocommerce-account .acct-main textarea,
.woocommerce-account .acct-main .select2-container .select2-selection{
  width:100%;padding:.7rem .8rem;border:1px solid var(--line-2);border-radius:var(--r-sm);
  font:inherit;font-size:var(--fs-sm);line-height:1.4;background:#fff;color:var(--ink);
  transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}

.woocommerce-account .acct-main textarea{min-height:110px;resize:vertical}

/* Foco: borde vino + halo suave (mismo que checkout/ficha). */
.woocommerce-account .acct-main .input-text:focus,
.woocommerce-account .acct-main input:focus,
.woocommerce-account .acct-main select:focus,
.woocommerce-account .acct-main textarea:focus{
  outline:none;border-color:var(--wine);box-shadow:0 0 0 3px rgba(42,35,32,.08)}

/* Select nativo con chevron dorado-neutro (igual que .co-field). */
.woocommerce-account .acct-main select{
  appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:2rem;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236B5F54' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .8rem center}

/* Select2 (país/estado en direcciones). */
.woocommerce-account .acct-main .select2-container .select2-selection{
  height:auto;min-height:calc(1.4em + 1.4rem + 2px);display:flex;align-items:center}
.woocommerce-account .acct-main .select2-container--default .select2-selection--single .select2-selection__rendered{
  line-height:1.4;padding:0;color:var(--ink)}
.woocommerce-account .acct-main .select2-container--default .select2-selection--single .select2-selection__arrow{height:100%}
.woocommerce-account .acct-main .select2-dropdown{border-color:var(--line-2);border-radius:var(--r-sm)}
.woocommerce-account .acct-main .select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--wine)}

/* Texto de ayuda bajo un campo (p.ej. "así se mostrará tu nombre"). */
.woocommerce-account .acct-main .form-row em,
.woocommerce-account .acct-main .form-row span[id$="_description"]{
  display:block;margin-top:.35rem;font-style:normal;color:var(--muted);font-size:var(--fs-xs);line-height:1.5}

/* Error inline de validación (borde borgoña + halo). */
.woocommerce-account .acct-main .woocommerce-invalid .input-text,
.woocommerce-account .acct-main .woocommerce-invalid select{
  border-color:var(--sale);box-shadow:0 0 0 3px rgba(110,31,43,.10)}
.woocommerce-account .acct-main .woocommerce-validated .input-text{border-color:var(--line-2)}

/* ------------------------------------------------------------
   3) BOTONES  →  look .btn--primary del tema
   El markup default sale como .button / .woocommerce-Button
   "pelado"; aquí lo mapeamos al botón vino de la marca.
   (No tocamos .btn.* — esas ya vienen estilizadas.)
   ------------------------------------------------------------ */
.woocommerce-account .acct-main button.button,
.woocommerce-account .acct-main button.woocommerce-Button,
.woocommerce-account .acct-main .woocommerce-Button.button,
.woocommerce-account .acct-main input.button,
.woocommerce-account .acct-main a.button:not(.btn){
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  font-family:var(--sans);font-weight:600;font-size:var(--fs-sm);letter-spacing:.03em;
  padding:.85rem 1.6rem;border:1px solid var(--wine);border-radius:var(--r-sm);
  background:var(--wine);color:var(--cream);cursor:pointer;white-space:nowrap;text-decoration:none;
  transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease),transform var(--dur) var(--ease)}
.woocommerce-account .acct-main button.button:hover,
.woocommerce-account .acct-main button.woocommerce-Button:hover,
.woocommerce-account .acct-main input.button:hover,
.woocommerce-account .acct-main a.button:not(.btn):hover{
  background:var(--wine-900);border-color:var(--wine-900);color:var(--cream);transform:translateY(-1px)}

/* Botones secundarios (p.ej. acciones de pedido: "Pedir de nuevo",
   "Ver"). Woo les da .button.view / .order-again → los dejamos
   igual de sólidos, pero variantes ghost donde aplica. */
.woocommerce-account .acct-main .woocommerce-button--view,
.woocommerce-account .acct-main a.button.view{
  background:transparent;color:var(--ink);border-color:var(--line-2)}
.woocommerce-account .acct-main .woocommerce-button--view:hover,
.woocommerce-account .acct-main a.button.view:hover{
  background:transparent;color:var(--wine);border-color:var(--wine)}

/* La <p> que envuelve el botón de guardar en los forms Woo. */
.woocommerce-account .acct-main form > p:last-child{margin-top:var(--s2);margin-bottom:0}

/* ------------------------------------------------------------
   4) EDITAR CUENTA  (form.woocommerce-EditAccountForm)
   Grilla de 2 columnas: nombre/apellido lado a lado, resto full.
   ------------------------------------------------------------ */
.woocommerce-account .woocommerce-EditAccountForm{
  display:grid;grid-template-columns:1fr 1fr;gap:0 var(--s4);
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s6)}
.woocommerce-account .woocommerce-EditAccountForm .form-row-first{grid-column:1}
.woocommerce-account .woocommerce-EditAccountForm .form-row-last{grid-column:2}
.woocommerce-account .woocommerce-EditAccountForm .form-row-wide,
.woocommerce-account .woocommerce-EditAccountForm > fieldset,
.woocommerce-account .woocommerce-EditAccountForm > p:last-child{grid-column:1 / -1}
/* Los <div class="clear"> de Woo sobran con grid. */
.woocommerce-account .woocommerce-EditAccountForm .clear{display:none}

/* Fieldset "Cambiar contraseña" como sub-sección con separador limpio.
   El legend va flotado a 100% para que el borde superior NO se parta (línea
   completa arriba y el título debajo), y los campos van con ritmo compacto. */
.woocommerce-account .acct-main fieldset{
  border:0;border-top:1px solid var(--line);margin:var(--s5) 0 0;padding:var(--s5) 0 0}
.woocommerce-account .acct-main fieldset legend{
  float:left;width:100%;
  font-family:var(--serif);font-weight:600;color:var(--ink);font-size:1.1rem;
  padding:0;margin:0 0 var(--s3)}
.woocommerce-account .acct-main fieldset .form-row{grid-column:1 / -1;clear:both;margin:0 0 var(--s3)}
.woocommerce-account .acct-main fieldset .form-row:last-child{margin-bottom:0}

/* ------------------------------------------------------------
   5) DIRECCIONES
   a) Índice (my-address.php): tarjetas tipo .addr-card
   b) Formulario (form-edit-address.php): grilla 2 col
   ------------------------------------------------------------ */
.woocommerce-account .woocommerce-Addresses{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);margin-top:var(--s3)}
.woocommerce-account .woocommerce-Address{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s5);
  width:auto;float:none;margin:0}
.woocommerce-account .woocommerce-Address-title{
  display:flex;align-items:center;justify-content:space-between;gap:var(--s3);margin-bottom:var(--s3)}
.woocommerce-account .woocommerce-Address-title h2,
.woocommerce-account .woocommerce-Address-title h3{
  font-family:var(--serif);font-weight:600;color:var(--ink);font-size:1.1rem;margin:0}
.woocommerce-account .woocommerce-Address-title .edit{
  font-size:var(--fs-xs);font-weight:600;color:var(--gold-ink);text-decoration:none;white-space:nowrap;
  transition:color var(--dur) var(--ease)}
.woocommerce-account .woocommerce-Address-title .edit:hover{color:var(--wine)}
.woocommerce-account .woocommerce-Address address{
  font-style:normal;color:var(--muted);line-height:1.7;font-size:var(--fs-sm)}

/* Formulario de dirección: cabecera + grilla de campos. */
.woocommerce-account .woocommerce-address-fields{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s6)}
.woocommerce-account .woocommerce-address-fields__field-wrapper{
  display:grid;grid-template-columns:1fr 1fr;gap:0 var(--s4)}
.woocommerce-account .woocommerce-address-fields__field-wrapper .form-row-first{grid-column:1}
.woocommerce-account .woocommerce-address-fields__field-wrapper .form-row-last{grid-column:2}
.woocommerce-account .woocommerce-address-fields__field-wrapper .form-row-wide{grid-column:1 / -1}
.woocommerce-account .acct-main form[method="post"] > h2{margin-bottom:var(--s5)}

/* ------------------------------------------------------------
   6) DETALLE DE PEDIDO (view-order.php + hook woocommerce_view_order)
   ------------------------------------------------------------ */
/* Notas / actualizaciones del pedido. */
.woocommerce-account .woocommerce-OrderUpdates{list-style:none;margin:0 0 var(--s6);padding:0}
.woocommerce-account .woocommerce-OrderUpdate{
  background:var(--cream-50);border:1px solid var(--line);border-radius:var(--r);
  padding:var(--s4) var(--s5);margin-bottom:var(--s3)}
.woocommerce-account .woocommerce-OrderUpdate .meta{
  font-size:var(--fs-xs);color:var(--muted);text-transform:uppercase;letter-spacing:.06em;
  font-weight:600;margin:0 0 .3rem}
.woocommerce-account .woocommerce-OrderUpdate .description{color:var(--ink);font-size:var(--fs-sm)}
.woocommerce-account .woocommerce-OrderUpdate .description p:last-child{margin:0}

/* Tabla de detalle del pedido (misma gramática que el order review).
   border-collapse:separate (no collapse) para que border-radius + overflow
   recorten las esquinas de la "tarjeta"; border-spacing:0 evita huecos. */
.woocommerce-account .acct-main table.shop_table,
.woocommerce-account .acct-main .woocommerce-table--order-details{
  width:100%;border-collapse:separate;border-spacing:0;font-size:var(--fs-sm);
  background:var(--cream-50);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:var(--s5);margin:0 0 var(--s6);overflow:hidden}
.woocommerce-account .acct-main table.shop_table thead th{
  text-align:left;font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.06em;
  color:var(--muted);font-weight:600;padding:.2rem .9rem .6rem;border-bottom:1px solid var(--line)}
.woocommerce-account .acct-main table.shop_table td,
.woocommerce-account .acct-main table.shop_table th{
  padding:.6rem .9rem;text-align:left;border:0;vertical-align:top}
.woocommerce-account .acct-main table.shop_table td:last-child,
.woocommerce-account .acct-main table.shop_table th:last-child{text-align:right;white-space:nowrap}
.woocommerce-account .acct-main table.shop_table tbody tr td{border-bottom:1px solid var(--line)}
.woocommerce-account .acct-main table.shop_table .product-name{font-weight:500;color:var(--ink)}
.woocommerce-account .acct-main table.shop_table .product-name a{color:var(--ink);text-decoration:none}
.woocommerce-account .acct-main table.shop_table .product-name a:hover{color:var(--gold-ink)}
.woocommerce-account .acct-main table.shop_table .product-quantity,
.woocommerce-account .acct-main table.shop_table .wc-item-meta{color:var(--muted);font-size:var(--fs-xs)}
.woocommerce-account .acct-main table.shop_table tfoot th{font-weight:600;color:var(--muted)}
.woocommerce-account .acct-main table.shop_table tfoot td{color:var(--ink)}
.woocommerce-account .acct-main table.shop_table tfoot tr:last-child th,
.woocommerce-account .acct-main table.shop_table tfoot tr:last-child td,
.woocommerce-account .acct-main table.shop_table .order-total th,
.woocommerce-account .acct-main table.shop_table .order-total td{
  border-top:1px solid var(--line);padding-top:var(--s3)}
.woocommerce-account .acct-main table.shop_table .order-total .amount{
  font-family:var(--serif);font-size:1.4rem;color:var(--ink)}

/* Datos del cliente (facturación / envío bajo el detalle). */
.woocommerce-account .woocommerce-customer-details{margin-top:var(--s5)}
.woocommerce-account .woocommerce-customer-details .woocommerce-columns--addresses{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);margin:0}
.woocommerce-account .woocommerce-customer-details .woocommerce-column{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s5)}
.woocommerce-account .woocommerce-customer-details address{
  font-style:normal;color:var(--muted);line-height:1.7;font-size:var(--fs-sm);border:0;padding:0}
.woocommerce-account .woocommerce-customer-details .woocommerce-customer-details--phone,
.woocommerce-account .woocommerce-customer-details .woocommerce-customer-details--email{margin:.4rem 0 0}

/* ------------------------------------------------------------
   7) LOGIN / REGISTRO (form-login.php, cuenta sin sesión)
   ------------------------------------------------------------ */
.woocommerce-account #customer_login.col2-set,
.woocommerce-account .u-columns.col2-set{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--s5);align-items:start;margin:0}
.woocommerce-account #customer_login .u-column1,
.woocommerce-account #customer_login .u-column2,
.woocommerce-account #customer_login .col-1,
.woocommerce-account #customer_login .col-2{
  width:auto;float:none;margin:0;
  background:var(--cream-50);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s6)}
.woocommerce-account #customer_login h2,
.woocommerce-account .woocommerce-form-login h2,
.woocommerce-account .woocommerce-form-register h2{
  font-family:var(--serif);font-weight:600;color:var(--ink);font-size:1.4rem;margin:0 0 var(--s4)}

/* Recuérdame + submit alineados. */
.woocommerce-account .woocommerce-form-login__rememberme{
  display:inline-flex;align-items:center;gap:.5rem;font-size:var(--fs-sm);color:var(--muted);margin-bottom:var(--s4)}
.woocommerce-account .woocommerce-form-login__rememberme input{accent-color:var(--wine);width:auto}
.woocommerce-account .woocommerce-form-login__submit,
.woocommerce-account .woocommerce-form-register__submit{width:100%}
.woocommerce-account .woocommerce-LostPassword{margin:var(--s3) 0 0}
.woocommerce-account .woocommerce-LostPassword a{color:var(--gold-ink);font-size:var(--fs-sm);text-decoration:none}
.woocommerce-account .woocommerce-LostPassword a:hover{color:var(--wine)}

/* ------------------------------------------------------------
   Página de contraseña (solicitar / restablecer / confirmación).
   Tarjeta centrada, elegante, con el look & feel del sitio.
   ------------------------------------------------------------ */
.woocommerce-account .auth-reset{max-width:460px;margin:var(--s6) auto var(--s8);width:100%}
.woocommerce-account .auth-reset__panel{
  background:var(--cream-50);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:var(--s7) var(--s6);box-shadow:0 1px 2px rgba(42,35,32,.04)}
.woocommerce-account .auth-reset__panel--sent{text-align:center}
.woocommerce-account .auth-reset__head{text-align:center;margin-bottom:var(--s5)}
.woocommerce-account .auth-reset__icon{
  display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;
  border-radius:50%;background:rgba(122,29,42,.08);color:var(--wine);margin-bottom:var(--s4)}
.woocommerce-account .auth-reset__icon svg{width:26px;height:26px}
.woocommerce-account .auth-reset__icon--ok{background:rgba(31,122,74,.1);color:var(--event)}
.woocommerce-account .auth-reset__title{
  font-family:var(--serif);font-weight:600;color:var(--ink);font-size:1.45rem;line-height:1.2;margin:0}
.woocommerce-account .auth-reset__sub{
  color:var(--muted);font-size:var(--fs-sm);line-height:1.55;margin:var(--s2) auto 0;max-width:34ch}
/* Campos idénticos al checkout (no dependen de .acct-main, que aquí no existe). */
.woocommerce-account .auth-reset__form .form-row{margin:0 0 var(--s4);text-align:left}
.woocommerce-account .auth-reset__form .form-row:last-of-type{margin-bottom:0}
.woocommerce-account .auth-reset__form label{
  display:block;font-size:var(--fs-xs);font-weight:600;color:var(--ink);margin-bottom:.35rem}
.woocommerce-account .auth-reset__form .required{color:var(--gold-ink);text-decoration:none;border:0}
.woocommerce-account .auth-reset__form .input-text{
  width:100%;box-sizing:border-box;padding:.75rem .85rem;border:1px solid var(--line-2);
  border-radius:var(--r-sm);font:inherit;font-size:var(--fs-sm);line-height:1.4;background:#fff;color:var(--ink);
  transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.woocommerce-account .auth-reset__form .input-text:focus{
  outline:none;border-color:var(--wine);box-shadow:0 0 0 3px rgba(42,35,32,.08)}
.woocommerce-account .auth-reset__submit{margin-top:var(--s2)}
.woocommerce-account .auth-reset__back{
  display:inline-flex;align-items:center;justify-content:center;gap:.4rem;width:100%;
  margin-top:var(--s4);font-size:var(--fs-sm);font-weight:500;color:var(--muted);text-decoration:none;
  transition:color var(--dur) var(--ease)}
.woocommerce-account .auth-reset__back svg{width:16px;height:16px}
.woocommerce-account .auth-reset__back:hover{color:var(--wine)}

/* Reconciliación con el bloque antiguo de login/registro que sigue en
   assets/css/style.css (~1959-1983). Login/registro se renderizan FUERA
   de .acct-main (form-login.php directo, sin my-account.php), por lo que
   §2/§3 no los alcanzan y los gobernaba ese bloque viejo (píldora tinta +
   tarjeta doble + inputs distintos al checkout). Estos overrides van
   scoped bajo #customer_login: al llevar id ganan siempre en especificidad
   al bloque viejo (selectores solo-clase), sin tener que editar style.css. */

/* a) Anular la tarjeta interna de form.login/register: la columna
   (.u-column1/.u-column2, §7) ya es la tarjeta crema. Evita caja-en-caja. */
.woocommerce-account #customer_login form.login,
.woocommerce-account #customer_login form.register{
  max-width:none;margin:0;background:transparent;border:0;border-radius:0;padding:0}

/* b) Inputs y labels idénticos al checkout/§2 (no el patrón del bloque viejo). */
.woocommerce-account #customer_login .woocommerce-form-row > label,
.woocommerce-account #customer_login .form-row > label{
  display:block;font-size:var(--fs-xs);font-weight:600;color:var(--ink);margin-bottom:.3rem}
.woocommerce-account #customer_login input[type="text"],
.woocommerce-account #customer_login input[type="email"],
.woocommerce-account #customer_login input[type="password"],
.woocommerce-account #customer_login input.input-text{
  width:100%;box-sizing:border-box;padding:.7rem .8rem;border:1px solid var(--line-2);
  border-radius:var(--r-sm);font:inherit;font-size:var(--fs-sm);line-height:1.4;
  background:#fff;color:var(--ink);margin-bottom:0;
  transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.woocommerce-account #customer_login input:focus{
  outline:none;border-color:var(--wine);box-shadow:0 0 0 3px rgba(42,35,32,.08)}

/* c) Botón login/registro = look .btn--primary (rectángulo vino), no la
   píldora color tinta del bloque viejo. width:100% coherente con §7. */
.woocommerce-account #customer_login button[name="login"],
.woocommerce-account #customer_login button[name="register"],
.woocommerce-account #customer_login button.woocommerce-Button{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;width:100%;
  font-family:var(--sans);font-weight:600;font-size:var(--fs-sm);letter-spacing:.03em;
  padding:.85rem 1.6rem;border:1px solid var(--wine);border-radius:var(--r-sm);
  background:var(--wine);color:var(--cream);cursor:pointer;white-space:nowrap;text-decoration:none;
  transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease),transform var(--dur) var(--ease)}
.woocommerce-account #customer_login button[name="login"]:hover,
.woocommerce-account #customer_login button[name="register"]:hover,
.woocommerce-account #customer_login button.woocommerce-Button:hover{
  background:var(--wine-900);border-color:var(--wine-900);color:var(--cream);transform:translateY(-1px)}

/* ------------------------------------------------------------
   8) FOCO ACCESIBLE (links/botones del área de cuenta)
   ------------------------------------------------------------ */
.woocommerce-account .acct-main a:focus-visible,
.woocommerce-account .acct-main button:focus-visible,
.woocommerce-account .acct-nav a:focus-visible{
  outline:2px solid var(--gold);outline-offset:2px;border-radius:2px}

/* ------------------------------------------------------------
   9) RESPONSIVE
   ------------------------------------------------------------ */
@media (max-width:860px){
  .woocommerce-account .woocommerce-Addresses,
  .woocommerce-account .woocommerce-customer-details .woocommerce-columns--addresses,
  .woocommerce-account #customer_login.col2-set,
  .woocommerce-account .u-columns.col2-set{grid-template-columns:1fr}
  .woocommerce-account .woocommerce-EditAccountForm,
  .woocommerce-account .woocommerce-address-fields__field-wrapper{grid-template-columns:1fr}
  .woocommerce-account .woocommerce-EditAccountForm .form-row-first,
  .woocommerce-account .woocommerce-EditAccountForm .form-row-last,
  .woocommerce-account .woocommerce-address-fields__field-wrapper .form-row-first,
  .woocommerce-account .woocommerce-address-fields__field-wrapper .form-row-last{grid-column:1 / -1}
  .woocommerce-account .woocommerce-EditAccountForm,
  .woocommerce-account .woocommerce-address-fields{padding:var(--s5)}
}

/* iOS: evita el zoom al enfocar (inputs a 16px). */
@media (max-width:600px){
  .woocommerce-account .acct-main .input-text,
  .woocommerce-account .acct-main input,
  .woocommerce-account .acct-main select,
  .woocommerce-account .acct-main textarea,
  .woocommerce-account #customer_login input{font-size:16px}
  .woocommerce-account .acct-main table.shop_table{display:block;overflow-x:auto}
  .woocommerce-account .acct-main button.button,
  .woocommerce-account .acct-main input.button{width:100%}
}

/* ------------------------------------------------------------
   10) LIBRETA DE DIRECCIONES (pestaña «Direcciones»)
   ------------------------------------------------------------ */
.woocommerce-account .addr-book__head{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--s4);flex-wrap:wrap;margin-bottom:var(--s5)}
.woocommerce-account .addr-book__head .acct-panel__sub{margin:.3rem 0 0}
.woocommerce-account .addr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--s4);align-items:stretch}
.woocommerce-account .addr-card{position:relative;height:100%;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s5);display:flex;flex-direction:column}
.woocommerce-account .addr-card--default{border-color:var(--event);box-shadow:0 0 0 1px var(--event)}
.woocommerce-account .addr-card__top{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.6rem;padding-right:1.8rem}
.woocommerce-account .addr-card__label{font-weight:700;color:var(--ink)}
.woocommerce-account .addr-card__badge{font-size:var(--fs-xs);font-weight:600;color:#fff;background:var(--event);border:1px solid var(--event);padding:2px 9px;border-radius:999px;white-space:nowrap}
.woocommerce-account .addr-card__body{font-size:var(--fs-sm);color:var(--body);line-height:1.5;margin:0}
.woocommerce-account .addr-card__phone{font-size:var(--fs-sm);color:var(--body);margin:.4rem 0 0}
.woocommerce-account .addr-card__actions{display:flex;flex-wrap:wrap;align-items:center;gap:1.1rem;margin-top:auto;padding-top:var(--s4);border-top:1px solid var(--line-2)}
.woocommerce-account .addr-card__actions .addr-inline{display:inline;margin:0}
/* Basurero: esquina superior derecha de la tarjeta. */
.woocommerce-account .addr-card__del{position:absolute;top:.55rem;right:.55rem;margin:0;line-height:0}
.woocommerce-account .addr-link{background:none;border:0;padding:0;font:inherit;font-size:var(--fs-sm);font-weight:600;color:var(--gold-ink);cursor:pointer;text-decoration:none}
.woocommerce-account .addr-link:hover{color:var(--wine)}
.woocommerce-account .addr-link--danger{color:var(--muted)}
.woocommerce-account .addr-link--danger:hover{color:var(--sale)}
/* «Eliminar» como ícono (basurero) en la esquina de la tarjeta, para aligerar el texto. */
.woocommerce-account .addr-link--icon{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--r-sm);transition:color var(--dur) var(--ease),background var(--dur) var(--ease)}
.woocommerce-account .addr-link--icon svg{width:17px;height:17px}
.woocommerce-account .addr-link--icon:hover{background:rgba(155,44,44,.09)}
.woocommerce-account .addr-empty{text-align:center;padding:var(--s7) 0;color:var(--muted)}
.woocommerce-account .addr-empty svg{width:40px;height:40px;color:var(--line-2);margin-bottom:var(--s3)}

/* Formulario de alta/edición */
.woocommerce-account .addr-form .co-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);margin-top:var(--s4)}
.woocommerce-account .addr-form .co-field{margin:0}
.woocommerce-account .addr-form .co-field--wide{grid-column:1 / -1}
.woocommerce-account .addr-form label{display:block;font-size:var(--fs-xs);font-weight:600;color:var(--ink);margin-bottom:.35rem}
.woocommerce-account .addr-form input,
.woocommerce-account .addr-form select{width:100%;box-sizing:border-box;padding:.7rem .85rem;border:1px solid var(--line-2);
  border-radius:var(--r-sm);font:inherit;font-size:var(--fs-sm);line-height:1.4;background:#fff;color:var(--ink)}
.woocommerce-account .addr-form input:focus,
.woocommerce-account .addr-form select:focus{outline:none;border-color:var(--wine);box-shadow:0 0 0 3px rgba(42,35,32,.08)}
.woocommerce-account .addr-form__foot{display:flex;justify-content:flex-end;gap:.8rem;margin-top:var(--s5)}
@media (max-width:600px){ .woocommerce-account .addr-form .co-grid{grid-template-columns:1fr} }