/* =========================================================================
   Aslan Account UI  —  estilos de "Mi Cuenta"
   Compatible con WCMAMTX y con el menú nativo de WooCommerce.
   ========================================================================= */

:root {
	--aslan-yellow: #f4d000;
	--aslan-yellow-soft: #fff4bf;
	--aslan-black: #0d0d0d;
	--aslan-ink: #1a1a1a;
	--aslan-card: #ffffff;
	--aslan-muted: #7a7a7a;
	--aslan-border: #ececec;
	--aslan-radius: 16px;
	--aslan-shadow: 0 2px 10px rgba(0, 0, 0, .06);
	--aslan-shadow-hover: 0 6px 20px rgba(0, 0, 0, .12);
}

/* Contenedor general de Mi Cuenta -------------------------------------- */
.woocommerce-account .woocommerce {
	color: var(--aslan-ink);
}

/* =========================================================================
   1. MENÚ LATERAL  (tarjetas blancas con ícono + subtítulo + chevrón)
   ========================================================================= */
.woocommerce-account .woocommerce-MyAccount-navigation ul,
.woocommerce-account ul.wcmamtx_vertical {
	display: flex !important;
	flex-direction: column !important;
	gap: 12px;
	list-style: none;
	margin: 0 !important;
	padding: 0;
}

/* Orden (respeta tu lógica previa) */
.woocommerce-MyAccount-navigation ul li { order: 50; }
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--dashboard { order: 10; }
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--cashback,
.woocommerce-MyAccount-navigation ul li.aslan-aui-cashback { order: 11; }
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout { order: 999; }

/* Cada item = tarjeta */
.woocommerce-account .woocommerce-MyAccount-navigation ul li,
.woocommerce-account ul.wcmamtx_vertical li {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a,
.woocommerce-account ul.wcmamtx_vertical li a,
.woocommerce-account .wcmamtx_dashboard_link {
	position: relative;
	display: flex !important;
	align-items: center;
	gap: 14px;
	padding: 16px 46px 16px 16px !important;
	background: var(--aslan-card) !important;
	color: var(--aslan-ink) !important;
	border: 1px solid var(--aslan-border) !important;
	border-radius: var(--aslan-radius) !important;
	box-shadow: var(--aslan-shadow);
	font-weight: 700;
	text-transform: none !important;
	text-decoration: none !important;
	line-height: 1.25;
	transition: box-shadow .18s ease, transform .18s ease, background .18s ease;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover,
.woocommerce-account ul.wcmamtx_vertical li a:hover {
	box-shadow: var(--aslan-shadow-hover);
	transform: translateY(-1px);
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a:active,
.woocommerce-account ul.wcmamtx_vertical li a:active {
	transform: translateY(0);
	box-shadow: var(--aslan-shadow);
}

/* Item activo */
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-account ul.wcmamtx_vertical li.is-active a {
	border-color: var(--aslan-yellow) !important;
	box-shadow: 0 0 0 2px var(--aslan-yellow) inset, var(--aslan-shadow);
}

/* -------------------------------------------------------------------------
   CUADRO DE ÍCONO AMARILLO  +  ÍCONOS MODERNOS (estilo Lucide, trazo fino)
   El SVG se pinta dentro de .aslan-aui-iconbox vía ::before, según el slug.
   ------------------------------------------------------------------------- */

.aslan-aui-iconbox {
	position: relative;
	flex: 0 0 auto;
	width: 48px;
	height: 48px;
	border-radius: 14px;
	background: var(--aslan-yellow);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.aslan-aui-iconbox::before {
	content: "";
	width: 24px;
	height: 24px;
	background: center / contain no-repeat var(--aslan-ico, none);
}

/* Íconos modernos por endpoint (trazo 1.8, esquinas redondeadas) */
.aslan-aui-dashboard       .aslan-aui-iconbox,
.wcmtx-iconbox.aslan-aui-dashboard       { --aslan-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d0d0d' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='9' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='5' rx='1.5'/%3E%3Crect x='14' y='12' width='7' height='9' rx='1.5'/%3E%3Crect x='3' y='16' width='7' height='5' rx='1.5'/%3E%3C/svg%3E"); }
.aslan-aui-cashback        .aslan-aui-iconbox,
.wcmtx-iconbox.aslan-aui-cashback        { --aslan-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d0d0d' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='14' rx='3'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M6 12h.01M18 12h.01'/%3E%3C/svg%3E"); }
.aslan-aui-orders          .aslan-aui-iconbox,
.wcmtx-iconbox.aslan-aui-orders          { --aslan-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d0d0d' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z'/%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M16 10a4 4 0 0 1-8 0'/%3E%3C/svg%3E"); }
.aslan-aui-edit-address    .aslan-aui-iconbox,
.wcmtx-iconbox.aslan-aui-edit-address    { --aslan-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d0d0d' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E"); }
.aslan-aui-edit-account    .aslan-aui-iconbox,
.wcmtx-iconbox.aslan-aui-edit-account    { --aslan-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d0d0d' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3Cpath d='M5.5 21a6.5 6.5 0 0 1 13 0'/%3E%3C/svg%3E"); }
.aslan-aui-customer-logout .aslan-aui-iconbox,
.wcmtx-iconbox.aslan-aui-customer-logout { --aslan-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d0d0d' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='m16 17 5-5-5-5'/%3E%3Cpath d='M21 12H9'/%3E%3C/svg%3E"); }

/* Logout: caja gris (como el mockup) */
.aslan-aui-customer-logout .aslan-aui-iconbox { background: #e9e9e9; }

/* Respaldo: si por algún motivo no hay iconbox, mostramos un cuadro neutro */
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:not(.aslan-has-iconbox)::before,
.woocommerce-account ul.wcmamtx_vertical li a:not(.aslan-has-iconbox)::before {
	content: "";
	flex: 0 0 auto;
	width: 48px;
	height: 48px;
	border-radius: 14px;
	background: var(--aslan-yellow);
}

/* Chevron a la derecha */
.woocommerce-account .woocommerce-MyAccount-navigation ul li a::after,
.woocommerce-account ul.wcmamtx_vertical li a::after {
	content: "";
	position: absolute;
	right: 16px;
	top: 50%;
	width: 9px;
	height: 9px;
	border-right: 2px solid #b0b0b0;
	border-top: 2px solid #b0b0b0;
	transform: translateY(-50%) rotate(45deg);
}

/* Subtítulo (insertado por JS como <span class="aslan-aui-sub">) */
.aslan-aui-label-wrap {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}
.aslan-aui-sub {
	display: block;
	font-weight: 400;
	font-size: .82em;
	color: var(--aslan-muted);
	text-transform: none;
}

/* Quita el margen raro que tenías */
ul.wcmamtx_vertical {
	margin-left: 0 !important;
	margin-bottom: 24px !important;
}

/* =========================================================================
   2. CONTENIDO DEL DASHBOARD (tarjetas de acción grandes -> estilo limpio)
   ========================================================================= */
.woocommerce-account .woocommerce-MyAccount-content {
	color: var(--aslan-ink);
}

/* Si el dashboard usa la grilla de "botones" amarillos del tema, los suavizamos */
.woocommerce-account .woocommerce-MyAccount-content a.button,
.woocommerce-account .woocommerce-MyAccount-content .wcmamtx_dashboard_link {
	border-radius: var(--aslan-radius) !important;
}

/* =========================================================================
   3. ENCABEZADO ¡Hola! (inyectado por JS arriba de la navegación)
   ========================================================================= */
.aslan-aui-greeting {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 4px 18px;
}
.aslan-aui-greeting__logo {
	display: none; /* logo oculto por preferencia del cliente */
}
.aslan-aui-greeting__title { font-size: 1.15rem; font-weight: 800; margin: 0; line-height: 1.1; color: #f3d100; }
.aslan-aui-greeting__sub   { font-size: .85rem; color: var(--aslan-muted); margin: 2px 0 0; }

/* =========================================================================
   4. ACCESO RÁPIDO + barra de confianza
   ========================================================================= */
.aslan-aui-extra { margin-top: 28px; }

.aslan-aui-quick {
	background: var(--aslan-black);
	border-radius: var(--aslan-radius);
	padding: 18px 16px 20px;
	color: #fff;
}
.aslan-aui-quick__title {
	display: block;
	font-size: .72rem;
	letter-spacing: .12em;
	font-weight: 700;
	color: var(--aslan-yellow);
	margin-bottom: 14px;
}
.aslan-aui-quick__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
}
.aslan-aui-quick__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 6px;
	color: #fff !important;
	text-decoration: none !important;
	padding: 8px 4px;
	border-radius: 12px;
	transition: background .18s ease;
}
.aslan-aui-quick__item:hover { background: rgba(255, 255, 255, .06); }
.aslan-aui-quick__item svg { color: var(--aslan-yellow); }
.aslan-aui-quick__label { font-weight: 700; font-size: .9rem; }
.aslan-aui-quick__desc  { font-size: .72rem; color: #b9b9b9; }

.aslan-aui-trust {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: var(--aslan-yellow);
	color: var(--aslan-black);
	border-radius: 12px;
	padding: 10px 14px;
	margin-top: 12px;
	font-size: .82rem;
	font-weight: 600;
}

/* =========================================================================
   6. GRILLA DE TARJETAS DEL DASHBOARD  (.wcmtx-my-account-links.wcmtx-grid)
   Las tarjetas grandes: Escritorio, Pedidos, Direcciones, etc.
   ========================================================================= */
.woocommerce-account .wcmtx-my-account-links.wcmtx-grid,
.woocommerce-account ul.wcmtx-my-account-links {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
	list-style: none;
	margin: 8px 0 0 !important;
	padding: 0 !important;
}

.woocommerce-account .wcmtx-my-account-links li {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	background: transparent !important;
}

.woocommerce-account .wcmtx-my-account-links li a {
	display: flex !important;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 14px;
	min-height: 150px;
	padding: 26px 18px !important;
	background: var(--aslan-card) !important;
	color: var(--aslan-ink) !important;
	border: 1px solid var(--aslan-border) !important;
	border-radius: var(--aslan-radius) !important;
	box-shadow: var(--aslan-shadow);
	font-weight: 700;
	font-size: 1rem;
	text-align: center;
	text-decoration: none !important;
	text-transform: none !important;
	transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}

.woocommerce-account .wcmtx-my-account-links li a:hover {
	box-shadow: var(--aslan-shadow-hover);
	transform: translateY(-3px);
	border-color: var(--aslan-yellow) !important;
}

.woocommerce-account .wcmtx-my-account-links li a:active {
	transform: translateY(-1px);
}

/* Ícono del tema dentro del cuadro amarillo (envuelto por JS) */
.wcmtx-iconbox {
	position: relative;
	width: 60px;
	height: 60px;
	border-radius: 18px;
	background: var(--aslan-yellow);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.wcmtx-iconbox::before {
	content: "";
	width: 30px;
	height: 30px;
	background: center / contain no-repeat var(--aslan-ico, none);
}

/* Tarjeta de Salir: cuadro gris */
.woocommerce-account .wcmtx-my-account-links li a[href*="logout"] .wcmtx-iconbox,
.woocommerce-account .wcmtx-my-account-links li.logout a .wcmtx-iconbox,
.wcmtx-iconbox.aslan-aui-customer-logout {
	background: #e9e9e9;
}

/* =========================================================================
   7. SUBPÁGINAS  (Pedidos, Direcciones, Detalles de la cuenta)
   El contenido vive sobre fondo oscuro -> acentos en amarillo.
   ========================================================================= */

/* Respiro interno del contenedor de contenido (estaba pegado a la izquierda) */
.woocommerce-account .woocommerce-MyAccount-content,
.woocommerce-account .woocommerce-MyAccount-content-wrapper {
	box-sizing: border-box;
	padding: 8px 4px;
}

/* Acentos: enlaces y números de pedido en amarillo (sobre fondo oscuro) */
.woocommerce-account .woocommerce-MyAccount-content a:not(.button):not(.wcmtx-iconbox a) {
	color: var(--aslan-yellow);
}
.woocommerce-account .woocommerce-MyAccount-content a:not(.button):hover {
	text-decoration: underline;
}

/* ---------- 7.1  Tabla de PEDIDOS ---------- */
.woocommerce-account .woocommerce-orders-table,
.woocommerce-account table.shop_table {
	width: 100%;
	border-collapse: separate !important;
	border-spacing: 0 6px;
	border: 0 !important;
}
.woocommerce-account .woocommerce-orders-table thead th,
.woocommerce-account table.shop_table thead th {
	border: 0 !important;
	background: transparent !important;
	color: var(--aslan-yellow) !important;
	font-weight: 700;
	text-align: left;
	padding: 8px 14px !important;
}
.woocommerce-account .woocommerce-orders-table tbody td,
.woocommerce-account table.shop_table tbody td {
	border: 0 !important;
	background: rgba(255, 255, 255, .04) !important;
	color: #e9e9e9 !important;
	padding: 16px 14px !important;
	vertical-align: middle;
}
/* Bordes redondeados en la primera/última celda de cada fila */
.woocommerce-account .woocommerce-orders-table tbody tr td:first-child,
.woocommerce-account table.shop_table tbody tr td:first-child {
	border-top-left-radius: 12px;
	border-bottom-left-radius: 12px;
}
.woocommerce-account .woocommerce-orders-table tbody tr td:last-child,
.woocommerce-account table.shop_table tbody tr td:last-child {
	border-top-right-radius: 12px;
	border-bottom-right-radius: 12px;
}
.woocommerce-account .woocommerce-orders-table tbody tr:hover td {
	background: rgba(255, 255, 255, .08) !important;
}
/* Número de pedido */
.woocommerce-account .woocommerce-orders-table__cell-order-number a {
	font-weight: 700;
	color: var(--aslan-yellow) !important;
}

/* Badges de estado por color */
.woocommerce-account .woocommerce-orders-table__cell-order-status {
	font-weight: 600;
}
.woocommerce-account .woocommerce-orders-table__cell-order-status::before {
	content: "";
	display: inline-block;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	margin-right: 8px;
	vertical-align: middle;
	background: #9a9a9a;
}
.woocommerce-account .order-status.status-pending::before,
.woocommerce-account .woocommerce-orders-table__cell-order-status:has(.status-pending)::before { background: #f0ad4e; }
.woocommerce-account .order-status.status-processing::before,
.woocommerce-account .woocommerce-orders-table__cell-order-status:has(.status-processing)::before { background: #3b82f6; }
.woocommerce-account .order-status.status-completed::before,
.woocommerce-account .woocommerce-orders-table__cell-order-status:has(.status-completed)::before { background: #22c55e; }
.woocommerce-account .order-status.status-cancelled::before,
.woocommerce-account .order-status.status-refunded::before,
.woocommerce-account .order-status.status-failed::before { background: #ef4444; }

/* Botones "Ver" / "Siguiente" / paginación en amarillo */
.woocommerce-account .woocommerce-orders-table .button,
.woocommerce-account .woocommerce-pagination a,
.woocommerce-account .woocommerce-Pagination a,
.woocommerce-account .woocommerce-MyAccount-content .button {
	background: var(--aslan-yellow) !important;
	color: var(--aslan-black) !important;
	border: 0 !important;
	border-radius: 999px !important;
	padding: 8px 22px !important;
	font-weight: 700 !important;
	box-shadow: none !important;
	transition: filter .15s ease, transform .15s ease;
}
.woocommerce-account .woocommerce-orders-table .button:hover,
.woocommerce-account .woocommerce-MyAccount-content .button:hover {
	filter: brightness(.92);
	transform: translateY(-1px);
}

/* ---------- 7.1b  PEDIDOS COMO TARJETAS  (generado por JS) ---------- */

/* Cuando hay tarjetas, ocultamos la tabla original */
.woocommerce-orders[data-aslan-cards] > table.woocommerce-orders-table { display: none; }

/* Ocultar la sección duplicada de WCMAMTX en la subpágina de Pedidos.
   WCMAMTX inyecta sus propias tablas/listas con prefijo .wcmamtx_*, pero
   queremos solo el render nativo (que mi JS convierte en tarjetas). */
.woocommerce-account .woocommerce-MyAccount-content .wcmamtx_orders,
.woocommerce-account .woocommerce-MyAccount-content .wcmamtx-orders,
.woocommerce-account .woocommerce-MyAccount-content .wcmamtx_my_orders,
.woocommerce-account .woocommerce-MyAccount-content .wcmamtx-myaccount-orders,
.woocommerce-account .woocommerce-MyAccount-content [class*="wcmamtx"][class*="order"]:not(.aslan-order-card):not([data-aslan-cards]),
.woocommerce-account .woocommerce-MyAccount-content table.shop_table.wcmamtx_orders_table {
	display: none !important;
}

/* Cabecera "Mis pedidos" */
.aslan-orders-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	margin: 4px 0 22px;
}
.aslan-orders-header h2 {
	margin: 0 0 6px;
	font-size: 2rem;
	font-weight: 800;
	color: var(--aslan-yellow) !important;
	line-height: 1.1;
	font-family: inherit; /* misma tipografía que el resto del tema/menú */
	text-transform: uppercase;
	letter-spacing: -.01em;
}
.aslan-orders-header p {
	margin: 0;
	color: #b9b9b9 !important;
	font-size: .95rem;
}

/* Grilla de tarjetas */
.aslan-orders-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 18px;
}
@media (max-width: 1100px) {
	.aslan-orders-grid { grid-template-columns: 1fr; }
}

/* Tarjeta */
.aslan-order-card {
	background: rgba(255, 255, 255, .04);
	border: 1px solid rgba(255, 255, 255, .08);
	border-radius: 18px;
	padding: 20px;
	color: #e9e9e9;
	display: flex;
	flex-direction: column;
	gap: 16px;
	transition: border-color .18s ease, transform .18s ease;
}
.aslan-order-card:hover {
	border-color: rgba(244, 208, 0, .35);
	transform: translateY(-2px);
}

/* Fila superior: ícono + título + badge */
.aslan-order-top {
	display: grid;
	grid-template-columns: 56px 1fr auto;
	align-items: center;
	gap: 14px;
}
.aslan-order-icon {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .05);
	display: flex;
	align-items: center;
	justify-content: center;
}
.aslan-order-icon svg {
	width: 28px;
	height: 28px;
	color: var(--aslan-yellow);
}
.aslan-order-title {
	min-width: 0;
}
.aslan-order-title h3 {
	margin: 0;
	font-size: 1.2rem;
	font-weight: 700;
	color: #ffffff;
	line-height: 1.2;
}
.aslan-order-title .aslan-order-date {
	margin: 4px 0 0;
	color: #9a9a9a;
	font-size: .85rem;
}

/* Badge superior derecho (resumen del estado) */
.aslan-order-pill {
	background: rgba(244, 208, 0, .12);
	color: var(--aslan-yellow);
	border-radius: 999px;
	padding: 6px 14px;
	font-size: .78rem;
	font-weight: 700;
	white-space: nowrap;
}

/* Coloración por estado del ícono y de la píldora */
.aslan-order-card[data-status="processing"] .aslan-order-icon { background: rgba(34, 197, 94, .18); }
.aslan-order-card[data-status="processing"] .aslan-order-icon svg { color: #22c55e; }
.aslan-order-card[data-status="processing"] .aslan-order-pill { background: rgba(34, 197, 94, .15); color: #22c55e; }

.aslan-order-card[data-status="completed"] .aslan-order-icon { background: rgba(59, 130, 246, .18); }
.aslan-order-card[data-status="completed"] .aslan-order-icon svg { color: #3b82f6; }
.aslan-order-card[data-status="completed"] .aslan-order-pill { background: rgba(59, 130, 246, .15); color: #3b82f6; }

.aslan-order-card[data-status="cancelled"] .aslan-order-icon,
.aslan-order-card[data-status="failed"]   .aslan-order-icon,
.aslan-order-card[data-status="refunded"] .aslan-order-icon { background: rgba(239, 68, 68, .18); }
.aslan-order-card[data-status="cancelled"] .aslan-order-icon svg,
.aslan-order-card[data-status="failed"]   .aslan-order-icon svg,
.aslan-order-card[data-status="refunded"] .aslan-order-icon svg { color: #ef4444; }
.aslan-order-card[data-status="cancelled"] .aslan-order-pill,
.aslan-order-card[data-status="failed"]   .aslan-order-pill,
.aslan-order-card[data-status="refunded"] .aslan-order-pill { background: rgba(239, 68, 68, .15); color: #ef4444; }

/* Cuerpo: 3 columnas (Total / Estado / Acciones) */
.aslan-order-body {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 14px;
	align-items: end;
}
.aslan-order-col__label {
	display: block;
	font-size: .78rem;
	color: #9a9a9a;
	margin-bottom: 6px;
	font-weight: 500;
}
.aslan-order-total__value {
	font-size: 1.15rem;
	font-weight: 800;
	color: #ffffff;
	line-height: 1.2;
}
.aslan-order-total__note {
	font-size: .8rem;
	color: #9a9a9a;
	margin-top: 2px;
}

/* Badge grande "En espera" con reloj */
.aslan-order-status-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: rgba(244, 208, 0, .12);
	color: var(--aslan-yellow);
	border-radius: 12px;
	padding: 8px 12px;
	font-weight: 700;
	font-size: .85rem;
	white-space: nowrap;
}
.aslan-order-status-badge svg { width: 16px; height: 16px; }
.aslan-order-card[data-status="processing"] .aslan-order-status-badge { background: rgba(34, 197, 94, .15); color: #22c55e; }
.aslan-order-card[data-status="completed"]  .aslan-order-status-badge { background: rgba(59, 130, 246, .15); color: #3b82f6; }
.aslan-order-card[data-status="cancelled"] .aslan-order-status-badge,
.aslan-order-card[data-status="failed"]    .aslan-order-status-badge,
.aslan-order-card[data-status="refunded"]  .aslan-order-status-badge { background: rgba(239, 68, 68, .15); color: #ef4444; }

/* Botón "Ver detalles" */
.aslan-order-card .aslan-order-action {
	display: inline-block;
	background: var(--aslan-yellow) !important;
	color: var(--aslan-black) !important;
	border-radius: 12px;
	padding: 10px 14px;
	font-weight: 700;
	text-align: center;
	text-decoration: none !important;
	font-size: .9rem;
	max-width: 100%;
	box-sizing: border-box;
	transition: filter .15s ease, transform .15s ease;
}
.aslan-order-actions { min-width: 0; }
.aslan-order-actions .aslan-order-action { display: block; width: 100%; }
.aslan-order-card .aslan-order-action:hover { filter: brightness(.92); transform: translateY(-1px); }

/* Pie con cantidad de artículos */
.aslan-order-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-top: 1px solid rgba(255, 255, 255, .08);
	padding-top: 14px;
	color: #b9b9b9;
	font-size: .9rem;
}
.aslan-order-foot__items {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.aslan-order-foot__items svg { width: 18px; height: 18px; color: #b9b9b9; }

/* Filtro */
.aslan-orders-filter {
	margin-top: 18px;
}
.aslan-orders-filter__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	background: transparent;
	color: var(--aslan-yellow);
	border: 1.5px solid var(--aslan-yellow);
	border-radius: 14px;
	padding: 14px 16px;
	font-weight: 700;
	cursor: pointer;
	transition: background .18s ease, color .18s ease;
}
.aslan-orders-filter__btn:hover {
	background: var(--aslan-yellow);
	color: var(--aslan-black);
}
.aslan-orders-filter__btn svg { width: 18px; height: 18px; }
.aslan-orders-filter__panel {
	display: none;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 12px;
}
.aslan-orders-filter.is-open .aslan-orders-filter__panel { display: flex; }
.aslan-orders-filter__chip {
	background: rgba(255, 255, 255, .06);
	color: #e9e9e9;
	border: 1px solid rgba(255, 255, 255, .12);
	border-radius: 999px;
	padding: 7px 14px;
	font-size: .82rem;
	font-weight: 600;
	cursor: pointer;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.aslan-orders-filter__chip:hover { border-color: var(--aslan-yellow); }
.aslan-orders-filter__chip.is-active {
	background: var(--aslan-yellow);
	color: var(--aslan-black);
	border-color: var(--aslan-yellow);
}

/* Cuando no hay coincidencias */
.aslan-orders-empty {
	text-align: center;
	color: #9a9a9a;
	padding: 30px 12px;
	background: rgba(255, 255, 255, .03);
	border-radius: 14px;
	margin-top: 14px;
}

/* ---------- 7.2  DIRECCIONES ---------- */
.woocommerce-account .woocommerce-Addresses,
.woocommerce-account .u-columns.addresses {
	display: grid !important;
	grid-template-columns: repeat(2, 1fr);
	gap: 18px;
	margin-top: 8px;
}
.woocommerce-account .woocommerce-Address {
	width: auto !important;
	float: none !important;
	background: rgba(255, 255, 255, .04);
	border: 1px solid rgba(255, 255, 255, .12);
	border-radius: var(--aslan-radius);
	padding: 20px 22px;
}
.woocommerce-account .woocommerce-Address-title h2,
.woocommerce-account .woocommerce-Address-title h3 {
	color: var(--aslan-yellow) !important;
	margin: 0 0 12px;
	font-size: 1.05rem;
}
.woocommerce-account .woocommerce-Address address {
	color: #e9e9e9 !important;
	line-height: 1.7;
	font-style: normal;
}
.woocommerce-account .woocommerce-Address-title .edit {
	background: var(--aslan-yellow) !important;
	color: var(--aslan-black) !important;
	border-radius: 999px;
	padding: 5px 16px !important;
	font-size: .8rem;
	font-weight: 700;
	text-decoration: none !important;
}

/* ---------- 7.3  DETALLES DE LA CUENTA (formulario) ---------- */
.woocommerce-account .woocommerce-EditAccountForm label,
.woocommerce-account .woocommerce-MyAccount-content form label {
	color: #f0f0f0 !important;
	font-weight: 600;
	display: block;
	margin-bottom: 6px;
}
.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-form-row,
.woocommerce-account .woocommerce-MyAccount-content form p {
	margin-bottom: 18px;
}
.woocommerce-account .woocommerce-MyAccount-content form input[type="text"],
.woocommerce-account .woocommerce-MyAccount-content form input[type="email"],
.woocommerce-account .woocommerce-MyAccount-content form input[type="password"],
.woocommerce-account .woocommerce-MyAccount-content form input[type="tel"],
.woocommerce-account .woocommerce-MyAccount-content form select,
.woocommerce-account .woocommerce-MyAccount-content form textarea {
	width: 100%;
	box-sizing: border-box;
	background: #ffffff !important;
	color: #1a1a1a !important;
	border: 1px solid var(--aslan-border) !important;
	border-radius: 12px !important;
	padding: 14px 16px !important;
	font-size: 1rem;
	transition: box-shadow .15s ease, border-color .15s ease;
}
.woocommerce-account .woocommerce-MyAccount-content form input:focus,
.woocommerce-account .woocommerce-MyAccount-content form select:focus,
.woocommerce-account .woocommerce-MyAccount-content form textarea:focus {
	outline: none;
	border-color: var(--aslan-yellow) !important;
	box-shadow: 0 0 0 3px rgba(244, 208, 0, .35) !important;
}
/* "Cambio de contraseña" y leyendas */
.woocommerce-account .woocommerce-MyAccount-content form fieldset legend,
.woocommerce-account .woocommerce-MyAccount-content form h2,
.woocommerce-account .woocommerce-MyAccount-content form h3 {
	color: #ffffff !important;
	border: 0;
	margin: 8px 0 16px;
}
.woocommerce-account .woocommerce-MyAccount-content form fieldset {
	border: 0;
	border-top: 1px solid rgba(255, 255, 255, .12);
	padding-top: 18px;
	margin-top: 8px;
}
.woocommerce-account .woocommerce-MyAccount-content form .description,
.woocommerce-account .woocommerce-MyAccount-content form span em,
.woocommerce-account .woocommerce-MyAccount-content form em {
	color: #b9b9b9 !important;
}
/* Botón "Guardar cambios" */
.woocommerce-account .woocommerce-EditAccountForm button[type="submit"],
.woocommerce-account .woocommerce-MyAccount-content form button[type="submit"] {
	background: var(--aslan-yellow) !important;
	color: var(--aslan-black) !important;
	border: 0 !important;
	border-radius: 999px !important;
	padding: 12px 32px !important;
	font-weight: 800 !important;
	cursor: pointer;
	transition: filter .15s ease, transform .15s ease;
}
.woocommerce-account .woocommerce-MyAccount-content form button[type="submit"]:hover {
	filter: brightness(.92);
	transform: translateY(-1px);
}

/* =========================================================================
   7.4  LOGIN / REGISTRO  (un solo contenedor con dos columnas)
   ========================================================================= */
.woocommerce-account:not(.logged-in) .woocommerce {
	max-width: 980px;
	margin: 24px auto;
}

/* Encabezado superior (lo inyecta el JS) */
.aslan-auth-header {
	text-align: center;
	margin: 0 0 20px;
}
.aslan-auth-header h2 {
	margin: 0 0 6px;
	color: var(--aslan-yellow) !important;
	font-size: 1.8rem;
	font-weight: 800;
	letter-spacing: -.01em;
}
.aslan-auth-header p {
	margin: 0;
	color: #b9b9b9 !important;
	font-size: .95rem;
}

/* Contenedor único que envuelve las dos columnas */
.woocommerce-account:not(.logged-in) .u-columns {
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	float: none !important;
	width: 100% !important;
	background: linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .02));
	border: 1px solid rgba(255, 255, 255, .1);
	border-radius: 22px;
	overflow: hidden;
	position: relative;
}
/* Divisor vertical entre columnas (en escritorio) */
.woocommerce-account:not(.logged-in) .u-columns::before {
	content: "";
	position: absolute;
	top: 32px;
	bottom: 32px;
	left: 50%;
	width: 1px;
	background: rgba(255, 255, 255, .1);
}
.woocommerce-account:not(.logged-in) .u-column1,
.woocommerce-account:not(.logged-in) .u-column2 {
	width: 100% !important;
	float: none !important;
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	padding: 34px 32px;
}

/* Encabezados de cada columna en amarillo */
.woocommerce-account:not(.logged-in) .u-column1 h2,
.woocommerce-account:not(.logged-in) .u-column2 h2 {
	margin: 0 0 6px;
	color: var(--aslan-yellow) !important;
	font-weight: 800;
	font-size: 1.35rem;
	display: flex;
	align-items: center;
	gap: 10px;
}
/* Pequeño subtítulo bajo cada h2 (inyectado por JS) */
.aslan-auth-sub {
	display: block;
	color: #9a9a9a;
	font-size: .85rem;
	margin: 0 0 22px;
}

/* Inputs */
.woocommerce-account:not(.logged-in) .woocommerce-form .form-row {
	margin-bottom: 16px;
}
.woocommerce-account:not(.logged-in) .woocommerce-form label {
	display: block;
	color: #e9e9e9 !important;
	font-weight: 600;
	margin-bottom: 6px;
	font-size: .9rem;
}
.woocommerce-account:not(.logged-in) .woocommerce-form input[type="text"],
.woocommerce-account:not(.logged-in) .woocommerce-form input[type="email"],
.woocommerce-account:not(.logged-in) .woocommerce-form input[type="password"],
.woocommerce-account:not(.logged-in) .woocommerce-form input[type="tel"] {
	width: 100%;
	box-sizing: border-box;
	background: rgba(255, 255, 255, .06) !important;
	color: #ffffff !important;
	border: 1px solid rgba(255, 255, 255, .15) !important;
	border-radius: 12px !important;
	padding: 13px 16px !important;
	font-size: .95rem;
	transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.woocommerce-account:not(.logged-in) .woocommerce-form input::placeholder {
	color: rgba(255, 255, 255, .45);
}
.woocommerce-account:not(.logged-in) .woocommerce-form input:focus {
	outline: none;
	background: rgba(255, 255, 255, .1) !important;
	border-color: var(--aslan-yellow) !important;
	box-shadow: 0 0 0 3px rgba(244, 208, 0, .25) !important;
}

/* Botones */
.woocommerce-account:not(.logged-in) .woocommerce-form button[type="submit"],
.woocommerce-account:not(.logged-in) .woocommerce-Button {
	width: 100%;
	background: var(--aslan-yellow) !important;
	color: var(--aslan-black) !important;
	border: 0 !important;
	border-radius: 999px !important;
	padding: 13px 28px !important;
	font-weight: 800 !important;
	font-size: .95rem;
	cursor: pointer;
	transition: filter .15s ease, transform .15s ease;
	margin-top: 4px;
}
.woocommerce-account:not(.logged-in) .woocommerce-form button[type="submit"]:hover {
	filter: brightness(.92);
	transform: translateY(-1px);
}

/* Fila de "Recordarme" + "¿Olvidaste tu contraseña?" */
.woocommerce-account:not(.logged-in) .woocommerce-form-login__rememberme {
	color: #d9d9d9;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: .9rem;
}
.woocommerce-account:not(.logged-in) .woocommerce-LostPassword {
	margin-top: 14px;
	text-align: right;
}
.woocommerce-account:not(.logged-in) .woocommerce-LostPassword a {
	color: var(--aslan-yellow);
	text-decoration: none;
	font-weight: 600;
	font-size: .88rem;
}
.woocommerce-account:not(.logged-in) .woocommerce-LostPassword a:hover {
	text-decoration: underline;
}

/* Notas legales */
.woocommerce-account:not(.logged-in) .woocommerce-privacy-policy-text,
.woocommerce-account:not(.logged-in) .woocommerce-privacy-policy-text * {
	color: #9a9a9a;
	font-size: .82rem;
	line-height: 1.5;
}
.woocommerce-account:not(.logged-in) .woocommerce-privacy-policy-text a { color: var(--aslan-yellow); }

/* Mensajes */
.woocommerce-account:not(.logged-in) .woocommerce-error,
.woocommerce-account:not(.logged-in) .woocommerce-notices-wrapper .woocommerce-error {
	background: rgba(239, 68, 68, .12) !important;
	border-left: 3px solid #ef4444 !important;
	color: #fecaca !important;
	border-radius: 10px;
}
.woocommerce-account:not(.logged-in) .woocommerce-message {
	background: rgba(34, 197, 94, .12) !important;
	border-left: 3px solid #22c55e !important;
	color: #bbf7d0 !important;
	border-radius: 10px;
}

/* Móvil: una columna, sin divisor, sin partir el contenedor */
@media (max-width: 768px) {
	.woocommerce-account:not(.logged-in) .u-columns {
		grid-template-columns: 1fr;
	}
	.woocommerce-account:not(.logged-in) .u-columns::before {
		display: none;
	}
	.woocommerce-account:not(.logged-in) .u-column2 {
		border-top: 1px solid rgba(255, 255, 255, .1);
	}
	.woocommerce-account:not(.logged-in) .u-column1,
	.woocommerce-account:not(.logged-in) .u-column2 {
		padding: 26px 22px;
	}
	.aslan-auth-header h2 { font-size: 1.5rem; }
}

/* =========================================================================
   8. CASHBACK  (plugin cashback-global: .cgcash-myaccount-page)
   ========================================================================= */

/* ----- Tarjeta de saldo ----- */
.cgcash-myaccount-page .cgcash-balance-card {
	background: linear-gradient(135deg, #161616 0%, #0d0d0d 100%);
	border: 1px solid rgba(244, 208, 0, .35);
	border-radius: var(--aslan-radius);
	padding: 26px 28px;
	margin-bottom: 26px;
	position: relative;
	overflow: hidden;
}
.cgcash-myaccount-page .cgcash-balance-card::after {
	/* destello decorativo */
	content: "";
	position: absolute;
	top: -40px;
	right: -40px;
	width: 160px;
	height: 160px;
	background: radial-gradient(circle, rgba(244, 208, 0, .18), transparent 70%);
	pointer-events: none;
}
.cgcash-myaccount-page .cgcash-balance-card h3 {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 14px;
	color: #cfcfcf !important;
	font-size: .95rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .06em;
}
/* Oculta el emoji original y antepone ícono SVG (billetera) */
.cgcash-myaccount-page .cgcash-balance-card h3 {
	font-size: 0; /* colapsa el emoji de texto */
}
.cgcash-myaccount-page .cgcash-balance-card h3::before {
	content: "";
	width: 22px;
	height: 22px;
	flex: 0 0 auto;
	background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f4d000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3Cpath d='M16 12h.01M3 9h13'/%3E%3C/svg%3E");
}
.cgcash-myaccount-page .cgcash-balance-card h3::after {
	content: "Tu saldo actual";
	font-size: .95rem;
	color: #cfcfcf;
}
.cgcash-myaccount-page .cgcash-balance-display {
	font-size: 2.4rem;
	font-weight: 800;
	color: var(--aslan-yellow) !important;
	line-height: 1.1;
}
.cgcash-myaccount-page .cgcash-balance-display * { color: var(--aslan-yellow) !important; }
.cgcash-myaccount-page .cgcash-balance-note {
	margin: 10px 0 0;
	color: #9a9a9a !important;
	font-size: .85rem;
}

/* ----- Sección de historial ----- */
.cgcash-myaccount-page .cgcash-history-section h3 {
	display: flex;
	align-items: center;
	gap: 10px;
	color: #ffffff !important;
	font-size: 1.05rem;
	margin: 0 0 14px;
	font-size: 0; /* colapsa emoji */
}
.cgcash-myaccount-page .cgcash-history-section h3::before {
	content: "";
	width: 20px;
	height: 20px;
	flex: 0 0 auto;
	background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f4d000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3' width='16' height='18' rx='2'/%3E%3Cpath d='M8 8h8M8 12h8M8 16h5'/%3E%3C/svg%3E");
}
.cgcash-myaccount-page .cgcash-history-section h3::after {
	content: "Historial de movimientos";
	font-size: 1.05rem;
	color: #fff;
}

/* La tabla reutiliza .woocommerce-orders-table -> ya estilizada en §7.1.
   Badge de color para la columna Tipo (lo arma el JS con .cgcash-type-*). */
.cgcash-type-badge {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-weight: 600;
}
.cgcash-type-badge::before {
	content: "";
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: #9a9a9a;
}
.cgcash-type-badge.cgcash-type-earn::before   { background: #22c55e; }
.cgcash-type-badge.cgcash-type-spend::before  { background: #ef4444; }
.cgcash-type-badge.cgcash-type-adjust::before { background: #f0ad4e; }
.cgcash-type-badge.cgcash-type-reset::before  { background: #3b82f6; }

/* Mensaje "sin movimientos" */
.cgcash-myaccount-page .woocommerce-Message--info {
	background: rgba(255, 255, 255, .04) !important;
	border-left: 3px solid var(--aslan-yellow) !important;
	color: #d9d9d9 !important;
	border-radius: 10px;
}





/* En escritorio, WooCommerce ya muestra menú (25%) + contenido (75%).
   Mantenemos las tarjetas verticales en la columna del menú. */
@media (min-width: 769px) {
	.woocommerce-account .woocommerce-MyAccount-navigation { width: 28%; }
	.woocommerce-account .woocommerce-MyAccount-content     { width: 68%; }

	/* Espaciado del contenido en Elementor (solo escritorio).
	   En móvil NO aplica para no romper el layout apilado. */
	.elementor-widget-woocommerce-my-account .e-my-account-tab:not(.e-my-account-tab__dashboard--custom) .woocommerce-MyAccount-content-wrapper {
		font-size: 14px;
		margin-left: 5%;
		margin-top: 10%;
	}

	/* Detalles de cuenta: Nombre y Apellidos lado a lado */
	.woocommerce-account .woocommerce-MyAccount-content form .form-row-first {
		width: 48% !important;
		float: left;
		margin-right: 4%;
	}
	.woocommerce-account .woocommerce-MyAccount-content form .form-row-last {
		width: 48% !important;
		float: right;
		margin-right: 0;
	}
	.woocommerce-account .woocommerce-MyAccount-content form .clear { clear: both; }
}

/* Móvil: una sola columna, todo apilado como en el mockup */
@media (max-width: 768px) {
	.woocommerce-account .woocommerce-MyAccount-navigation,
	.woocommerce-account .woocommerce-MyAccount-content {
		width: 100% !important;
		float: none !important;
	}
	.woocommerce-account .woocommerce-MyAccount-navigation ul li a,
	.woocommerce-account ul.wcmamtx_vertical li a {
		padding: 14px 42px 14px 14px !important;
	}

	/* Grilla del dashboard: 1 columna en móvil */
	.woocommerce-account .wcmtx-my-account-links.wcmtx-grid,
	.woocommerce-account ul.wcmtx-my-account-links {
		grid-template-columns: 1fr;
	}
	.woocommerce-account .wcmtx-my-account-links li a {
		flex-direction: row;
		justify-content: flex-start;
		min-height: 0;
		text-align: left;
		gap: 16px;
	}
	.wcmtx-iconbox { width: 48px; height: 48px; border-radius: 14px; }
	.wcmtx-iconbox::before { width: 24px; height: 24px; }

	/* Direcciones: 1 columna en móvil */
	.woocommerce-account .woocommerce-Addresses,
	.woocommerce-account .u-columns.addresses {
		grid-template-columns: 1fr;
	}
	/* Detalles de cuenta: nombre/apellidos apilados */
	.woocommerce-account .woocommerce-MyAccount-content form .form-row-first,
	.woocommerce-account .woocommerce-MyAccount-content form .form-row-last {
		width: 100% !important;
		float: none !important;
		margin-right: 0 !important;
	}

	/* ------------------------------------------------------------------
	   MENÚ COMPACTO EN MÓVIL — solo en SUBPÁGINAS (no en dashboard).
	   WooCommerce marca el <body> con clases por endpoint:
	   .woocommerce-orders, .woocommerce-view-order, .woocommerce-edit-address,
	   .woocommerce-edit-account, .woocommerce-orders-payment,
	   .woocommerce-customer-logout, y endpoints custom (cashback).
	   Cuando alguna de esas clases está presente, colapsamos el menú lateral
	   a chips horizontales con scroll.
	   ------------------------------------------------------------------ */
	body.woocommerce-orders         .woocommerce-MyAccount-navigation,
	body.woocommerce-view-order     .woocommerce-MyAccount-navigation,
	body.woocommerce-edit-address   .woocommerce-MyAccount-navigation,
	body.woocommerce-edit-account   .woocommerce-MyAccount-navigation,
	body.woocommerce-orders-payment .woocommerce-MyAccount-navigation,
	body[class*="woocommerce-cashback"] .woocommerce-MyAccount-navigation,
	body[class*="endpoint-"]:not(.woocommerce-dashboard) .woocommerce-MyAccount-navigation {
		margin-bottom: 14px;
	}

	/* Oculta el saludo en subpáginas (ya está claro dónde estás) */
	body.woocommerce-orders         .aslan-aui-greeting,
	body.woocommerce-view-order     .aslan-aui-greeting,
	body.woocommerce-edit-address   .aslan-aui-greeting,
	body.woocommerce-edit-account   .aslan-aui-greeting,
	body.woocommerce-orders-payment .aslan-aui-greeting,
	body[class*="woocommerce-cashback"] .aslan-aui-greeting,
	body[class*="endpoint-"]:not(.woocommerce-dashboard) .aslan-aui-greeting {
		display: none;
	}

	/* Convierte la lista vertical en una fila horizontal con scroll */
	body.woocommerce-orders         .woocommerce-MyAccount-navigation > ul,
	body.woocommerce-view-order     .woocommerce-MyAccount-navigation > ul,
	body.woocommerce-edit-address   .woocommerce-MyAccount-navigation > ul,
	body.woocommerce-edit-account   .woocommerce-MyAccount-navigation > ul,
	body.woocommerce-orders-payment .woocommerce-MyAccount-navigation > ul,
	body[class*="woocommerce-cashback"] .woocommerce-MyAccount-navigation > ul,
	body[class*="endpoint-"]:not(.woocommerce-dashboard) .woocommerce-MyAccount-navigation > ul {
		flex-direction: row !important;
		flex-wrap: nowrap;
		gap: 8px !important;
		overflow-x: auto;
		overflow-y: hidden;
		padding: 4px 2px 10px;
		margin: 0 -10px 10px !important;
		padding-left: 10px;
		padding-right: 10px;
		scrollbar-width: none;
		-ms-overflow-style: none;
	}
	body.woocommerce-orders         .woocommerce-MyAccount-navigation > ul::-webkit-scrollbar,
	body.woocommerce-view-order     .woocommerce-MyAccount-navigation > ul::-webkit-scrollbar,
	body.woocommerce-edit-address   .woocommerce-MyAccount-navigation > ul::-webkit-scrollbar,
	body.woocommerce-edit-account   .woocommerce-MyAccount-navigation > ul::-webkit-scrollbar,
	body.woocommerce-orders-payment .woocommerce-MyAccount-navigation > ul::-webkit-scrollbar,
	body[class*="woocommerce-cashback"] .woocommerce-MyAccount-navigation > ul::-webkit-scrollbar,
	body[class*="endpoint-"]:not(.woocommerce-dashboard) .woocommerce-MyAccount-navigation > ul::-webkit-scrollbar {
		display: none;
	}

	/* Cada item del menú en modo "chip" */
	body.woocommerce-orders         .woocommerce-MyAccount-navigation > ul > li > a,
	body.woocommerce-view-order     .woocommerce-MyAccount-navigation > ul > li > a,
	body.woocommerce-edit-address   .woocommerce-MyAccount-navigation > ul > li > a,
	body.woocommerce-edit-account   .woocommerce-MyAccount-navigation > ul > li > a,
	body.woocommerce-orders-payment .woocommerce-MyAccount-navigation > ul > li > a,
	body[class*="woocommerce-cashback"] .woocommerce-MyAccount-navigation > ul > li > a,
	body[class*="endpoint-"]:not(.woocommerce-dashboard) .woocommerce-MyAccount-navigation > ul > li > a {
		display: inline-flex !important;
		align-items: center;
		gap: 8px;
		padding: 8px 14px !important;
		border-radius: 999px !important;
		background: rgba(255, 255, 255, .06) !important;
		border: 1px solid rgba(255, 255, 255, .1) !important;
		color: #f5f5f5 !important;
		box-shadow: none;
		font-size: .82rem;
		font-weight: 600;
		white-space: nowrap;
		min-height: 0;
	}
	body.woocommerce-orders         .woocommerce-MyAccount-navigation > ul > li.is-active > a,
	body.woocommerce-view-order     .woocommerce-MyAccount-navigation > ul > li.is-active > a,
	body.woocommerce-edit-address   .woocommerce-MyAccount-navigation > ul > li.is-active > a,
	body.woocommerce-edit-account   .woocommerce-MyAccount-navigation > ul > li.is-active > a,
	body.woocommerce-orders-payment .woocommerce-MyAccount-navigation > ul > li.is-active > a,
	body[class*="woocommerce-cashback"] .woocommerce-MyAccount-navigation > ul > li.is-active > a,
	body[class*="endpoint-"]:not(.woocommerce-dashboard) .woocommerce-MyAccount-navigation > ul > li.is-active > a {
		background: var(--aslan-yellow) !important;
		color: var(--aslan-black) !important;
		border-color: var(--aslan-yellow) !important;
		box-shadow: none !important;
	}

	/* Caja de ícono mucho más pequeña en modo chip */
	body.woocommerce-orders         .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-iconbox,
	body.woocommerce-view-order     .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-iconbox,
	body.woocommerce-edit-address   .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-iconbox,
	body.woocommerce-edit-account   .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-iconbox,
	body.woocommerce-orders-payment .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-iconbox,
	body[class*="woocommerce-cashback"] .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-iconbox,
	body[class*="endpoint-"]:not(.woocommerce-dashboard) .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-iconbox {
		width: 22px;
		height: 22px;
		border-radius: 6px;
		background: transparent;
	}
	body.woocommerce-orders         .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-iconbox::before,
	body.woocommerce-view-order     .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-iconbox::before,
	body.woocommerce-edit-address   .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-iconbox::before,
	body.woocommerce-edit-account   .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-iconbox::before,
	body.woocommerce-orders-payment .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-iconbox::before,
	body[class*="woocommerce-cashback"] .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-iconbox::before,
	body[class*="endpoint-"]:not(.woocommerce-dashboard) .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-iconbox::before {
		width: 16px;
		height: 16px;
		/* El SVG base es negro; lo aclaramos para que se vea en el chip oscuro */
		filter: invert(1) brightness(1.6);
	}
	/* En el chip activo (fondo amarillo) el ícono vuelve a negro */
	body.woocommerce-orders         .woocommerce-MyAccount-navigation > ul > li.is-active > a .aslan-aui-iconbox::before,
	body.woocommerce-view-order     .woocommerce-MyAccount-navigation > ul > li.is-active > a .aslan-aui-iconbox::before,
	body.woocommerce-edit-address   .woocommerce-MyAccount-navigation > ul > li.is-active > a .aslan-aui-iconbox::before,
	body.woocommerce-edit-account   .woocommerce-MyAccount-navigation > ul > li.is-active > a .aslan-aui-iconbox::before,
	body.woocommerce-orders-payment .woocommerce-MyAccount-navigation > ul > li.is-active > a .aslan-aui-iconbox::before,
	body[class*="woocommerce-cashback"] .woocommerce-MyAccount-navigation > ul > li.is-active > a .aslan-aui-iconbox::before,
	body[class*="endpoint-"]:not(.woocommerce-dashboard) .woocommerce-MyAccount-navigation > ul > li.is-active > a .aslan-aui-iconbox::before {
		filter: none;
	}

	/* Oculta el subtítulo y el chevrón en modo chip */
	body.woocommerce-orders         .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-sub,
	body.woocommerce-view-order     .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-sub,
	body.woocommerce-edit-address   .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-sub,
	body.woocommerce-edit-account   .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-sub,
	body.woocommerce-orders-payment .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-sub,
	body[class*="woocommerce-cashback"] .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-sub,
	body[class*="endpoint-"]:not(.woocommerce-dashboard) .woocommerce-MyAccount-navigation > ul > li > a .aslan-aui-sub,
	body.woocommerce-orders         .woocommerce-MyAccount-navigation > ul > li > a::after,
	body.woocommerce-view-order     .woocommerce-MyAccount-navigation > ul > li > a::after,
	body.woocommerce-edit-address   .woocommerce-MyAccount-navigation > ul > li > a::after,
	body.woocommerce-edit-account   .woocommerce-MyAccount-navigation > ul > li > a::after,
	body.woocommerce-orders-payment .woocommerce-MyAccount-navigation > ul > li > a::after,
	body[class*="woocommerce-cashback"] .woocommerce-MyAccount-navigation > ul > li > a::after,
	body[class*="endpoint-"]:not(.woocommerce-dashboard) .woocommerce-MyAccount-navigation > ul > li > a::after {
		display: none !important;
	}
}

/* Tablet: grilla del dashboard a 2 columnas */
@media (min-width: 769px) and (max-width: 1100px) {
	.woocommerce-account .wcmtx-my-account-links.wcmtx-grid,
	.woocommerce-account ul.wcmtx-my-account-links {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* Pantallas muy chicas: acceso rápido en 3 columnas compactas */
@media (max-width: 360px) {
	.aslan-aui-quick__label { font-size: .82rem; }
	.aslan-aui-quick__desc  { font-size: .66rem; }
}
