/* ==========================================================================
   EVOX — Página "Mi cuenta"
   Reestiliza el My Account NATIVO de WooCommerce ([woocommerce_my_account])
   al diseño EVOX: navegación lateral (card) + contenido a la derecha.
   Scope: .evox-account-page (clase en la Section raíz del contenedor Bricks).
   ========================================================================== */

.evox-account-page {
	font-family: 'Manrope', sans-serif;
}

/* -------- Layout 2 columnas: navegación | contenido -------- */
.evox-account-page .woocommerce {
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	gap: 32px;
	align-items: start;
}
.evox-account-page .woocommerce-notices-wrapper {
	grid-column: 1 / -1;
}
.evox-account-page .woocommerce-notices-wrapper:empty {
	display: none;
}

/* -------- Avisos de éxito / error / info (los de wc_add_notice) --------
   Personaliza aquí su APARIENCIA (el texto se cambia en account-page.php). */
.evox-account-page .woocommerce-message,
.evox-account-page .woocommerce-info,
.evox-account-page .woocommerce-error {
	list-style: none;
	margin: 0 0 20px;
	padding: 14px 18px;
	border-radius: 8px;
	font-size: 14px;
	line-height: 1.5;
	background: #eef7f1;
	color: var(--evox-tinta);
	border-left: 3px solid var(--evox-verde); /* verde = éxito/info */
}
.evox-account-page .woocommerce-error {
	background: #fdf2f3;
	border-left-color: var(--evox-error); /* rojo = error */
}
.evox-account-page .woocommerce-message a,
.evox-account-page .woocommerce-error a {
	color: var(--evox-azul);
	font-weight: 600;
}

/* -------- Navegación lateral (card sticky) -------- */
.evox-account-page .woocommerce-MyAccount-navigation {
	position: sticky;
	top: 110px;
	background: var(--evox-fondo);
	border-radius: 12px;
	padding: 12px;
}
.evox-account-page .woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.evox-account-page .woocommerce-MyAccount-navigation li {
	margin: 0;
}
.evox-account-page .woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 12px 14px;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 600;
	color: var(--evox-cuerpo);
	text-decoration: none;
	transition: background 0.2s ease, color 0.2s ease;
}
.evox-account-page .woocommerce-MyAccount-navigation li a:hover {
	background: #eef1f4;
	color: var(--evox-azul);
}
.evox-account-page .woocommerce-MyAccount-navigation li.is-active a {
	background: var(--evox-azul);
	color: #fff;
}
/* La opción "Cerrar sesión", separada abajo y en rojo */
.evox-account-page .woocommerce-MyAccount-navigation li--logout a,
.evox-account-page .woocommerce-MyAccount-navigation li:last-child a {
	color: var(--evox-error);
}
.evox-account-page .woocommerce-MyAccount-navigation li--logout a:hover,
.evox-account-page .woocommerce-MyAccount-navigation li:last-child a:hover {
	background: #fdf2f3;
	color: var(--evox-error);
}

/* -------- Área de contenido -------- */
.evox-account-page .woocommerce-MyAccount-content {
	min-width: 0;
	background: #fff;
	border: 1px solid var(--evox-borde);
	border-radius: 12px;
	padding: 28px 32px;
}
.evox-account-page .woocommerce-MyAccount-content p {
	font-size: 14px;
	line-height: 1.6;
	color: var(--evox-cuerpo);
}
.evox-account-page .woocommerce-MyAccount-content a:not(.button):not(.evox-acc-card) {
	color: var(--evox-verde);
	font-weight: 600;
}

/* -------- Tarjetas de acceso rápido (panel Inicio) -------- */
.evox-acc-cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
	margin-top: 24px;
}
.evox-acc-card {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 20px;
	border: 1px solid var(--evox-borde);
	border-radius: 12px;
	text-decoration: none;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.evox-acc-card:hover {
	border-color: var(--evox-verde);
	box-shadow: 0 8px 20px rgba(0, 43, 112, 0.06);
}
.evox-acc-card__icon {
	width: 26px;
	height: 26px;
	background: var(--evox-azul);
	margin-bottom: 4px;
}
.evox-acc-card__icon--box {
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.7'%3E%3Cpath d='M21 8l-9-5-9 5v8l9 5 9-5z'/%3E%3Cpath d='M3 8l9 5 9-5'/%3E%3Cpath d='M12 13v8'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.7'%3E%3Cpath d='M21 8l-9-5-9 5v8l9 5 9-5z'/%3E%3Cpath d='M3 8l9 5 9-5'/%3E%3Cpath d='M12 13v8'/%3E%3C/svg%3E") center / contain no-repeat;
}
.evox-acc-card__icon--pin {
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.7'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.7'%3E%3Cpath d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E") center / contain no-repeat;
}
.evox-acc-card__icon--user {
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.7'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.7'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E") center / contain no-repeat;
}
.evox-acc-card__title {
	font-size: 15px;
	font-weight: 700;
	color: var(--evox-tinta);
}
.evox-acc-card__desc {
	font-size: 12.5px;
	color: var(--evox-cuerpo);
	line-height: 1.45;
}

/* -------- Tabla de pedidos -------- */
.evox-account-page .woocommerce-orders-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}
.evox-account-page .woocommerce-orders-table th {
	text-align: left;
	padding: 12px 10px;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var(--evox-cuerpo);
	border-bottom: 1px solid var(--evox-borde);
}
.evox-account-page .woocommerce-orders-table td {
	padding: 14px 10px;
	border-bottom: 1px solid var(--evox-fondo-2);
	color: var(--evox-tinta);
}
.evox-account-page .woocommerce-orders-table .button {
	display: inline-block;
	background: var(--evox-azul);
	color: #fff;
	padding: 7px 16px;
	border-radius: 6px;
	font-size: 12.5px;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.2s ease;
}
.evox-account-page .woocommerce-orders-table .button:hover {
	background: var(--evox-azul-hover);
}

/* ==========================================================================
   DETALLE DE UN PEDIDO (Mi cuenta → Ver pedido)
   ========================================================================== */

/* Barra superior con nº de pedido, fecha y estado */
.evox-account-page .woocommerce-MyAccount-content > p.order-info,
.evox-account-page p.woocommerce-thankyou-order-details {
	background: var(--evox-fondo);
	border-radius: 10px;
	padding: 14px 16px;
	font-size: 13.5px;
	color: var(--evox-cuerpo);
	margin: 0 0 22px;
}
.evox-account-page .order-info mark {
	background: none;
	color: var(--evox-tinta);
	font-weight: 700;
	padding: 0;
}

/* Títulos de secciones del pedido */
.evox-account-page .woocommerce-order-details__title,
.evox-account-page .woocommerce-column__title,
.evox-account-page .woocommerce-order-details h2,
.evox-account-page .woocommerce-customer-details h2 {
	font-family: 'Manrope', sans-serif;
	font-weight: 700;
	font-size: 15px !important;
	line-height: 1.3;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--evox-tinta);
	margin: 0 0 14px;
}

/* Tabla del pedido */
.evox-account-page table.woocommerce-table--order-details {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid var(--evox-borde);
	border-radius: 10px;
	overflow: hidden;
	font-size: 13.5px;
	margin-bottom: 28px;
}
.evox-account-page table.woocommerce-table--order-details th,
.evox-account-page table.woocommerce-table--order-details td {
	padding: 12px 16px;
	text-align: left;
	border: none;
	border-bottom: 1px solid var(--evox-fondo-2);
	background: #fff;
}
.evox-account-page table.woocommerce-table--order-details td:last-child,
.evox-account-page table.woocommerce-table--order-details th:last-child {
	text-align: right;
}
.evox-account-page table.woocommerce-table--order-details thead th {
	font-size: 11.5px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--evox-cuerpo);
	background: var(--evox-fondo);
}
.evox-account-page table.woocommerce-table--order-details tbody td a {
	color: var(--evox-tinta);
	font-weight: 600;
	text-decoration: none;
}
.evox-account-page table.woocommerce-table--order-details tbody td a:hover {
	color: var(--evox-verde);
}
.evox-account-page .woocommerce-table--order-details .product-quantity {
	color: var(--evox-cuerpo);
	font-weight: 500;
}
/* Filas de totales */
.evox-account-page table.woocommerce-table--order-details tfoot th {
	font-weight: 500;
	color: var(--evox-cuerpo);
	background: #fff;
}
.evox-account-page table.woocommerce-table--order-details tfoot td {
	font-weight: 600;
	color: var(--evox-tinta);
	background: #fff;
}
.evox-account-page table.woocommerce-table--order-details tfoot tr:last-child th,
.evox-account-page table.woocommerce-table--order-details tfoot tr:last-child td {
	font-family: 'Manrope', sans-serif;
	font-weight: 700;
	font-size: 16px;
	color: var(--evox-tinta);
	border-bottom: none;
	border-top: 1px solid var(--evox-borde);
}

/* Direcciones del pedido en dos columnas */
.evox-account-page .woocommerce-customer-details .woocommerce-columns--addresses {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	margin: 0;
}
.evox-account-page .woocommerce-customer-details .col-1,
.evox-account-page .woocommerce-customer-details .col-2 {
	width: auto;
	float: none;
	border: 1px solid var(--evox-borde);
	border-radius: 10px;
	padding: 18px 20px;
}

@media (max-width: 700px) {
	.evox-account-page .woocommerce-customer-details .woocommerce-columns--addresses {
		grid-template-columns: 1fr;
	}
	.evox-account-page table.woocommerce-table--order-details th,
	.evox-account-page table.woocommerce-table--order-details td {
		padding: 10px 12px;
	}
}

/* -------- Formularios (direcciones + datos) — inputs estilo checkout ----- */
.evox-account-page .woocommerce-MyAccount-content form .form-row {
	margin: 0 0 16px;
	padding: 0;
}
.evox-account-page .woocommerce-MyAccount-content label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: var(--evox-cuerpo);
	margin-bottom: 6px;
}
.evox-account-page .woocommerce-MyAccount-content input.input-text,
.evox-account-page .woocommerce-MyAccount-content select,
.evox-account-page .woocommerce-MyAccount-content textarea {
	width: 100%;
	height: 44px;
	padding: 0 14px;
	border: 1px solid var(--evox-borde-fuerte);
	border-radius: 8px;
	background: #fff;
	font-family: inherit;
	font-size: 14px;
	color: var(--evox-tinta);
	box-sizing: border-box;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.evox-account-page .woocommerce-MyAccount-content input.input-text:focus,
.evox-account-page .woocommerce-MyAccount-content select:focus,
.evox-account-page .woocommerce-MyAccount-content textarea:focus {
	outline: none;
	border-color: var(--evox-verde);
	box-shadow: 0 0 0 3px rgba(13, 188, 84, 0.15);
}
.evox-account-page .woocommerce-MyAccount-content .button,
.evox-account-page .woocommerce-MyAccount-content button[type="submit"] {
	display: inline-block;
	background: var(--evox-azul);
	color: #fff;
	border: none;
	padding: 13px 28px;
	border-radius: 8px;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	cursor: pointer;
	text-decoration: none;
	transition: background 0.2s ease;
}
.evox-account-page .woocommerce-MyAccount-content .button:hover,
.evox-account-page .woocommerce-MyAccount-content button[type="submit"]:hover {
	background: var(--evox-azul-hover);
}

/* Bloques de dirección (las 2 columnas billing/shipping) */
.evox-account-page .woocommerce-Addresses {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	margin-top: 16px;
}
.evox-account-page .woocommerce-Address {
	border: 1px solid var(--evox-borde);
	border-radius: 12px;
	padding: 20px;
}
.evox-account-page .woocommerce-Address-title h3,
.evox-account-page .woocommerce-Address h3,
.evox-account-page .woocommerce-Address header h3 {
	font-family: 'Manrope', sans-serif;
	font-size: 15px !important; /* pisa el tamaño por defecto de h3 del tema/Bricks */
	line-height: 1.3;
	font-weight: 700;
	color: var(--evox-tinta);
	margin: 0 0 6px;
}
/* El enlace "Editar ..." bajo el título */
.evox-account-page .woocommerce-Address-title a.edit,
.evox-account-page .woocommerce-Address a.edit {
	display: inline-block;
	margin-bottom: 10px;
	font-size: 13px;
}
.evox-account-page .woocommerce-Address address {
	font-style: normal;
	font-size: 13.5px;
	line-height: 1.7;
	color: var(--evox-cuerpo);
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 860px) {
	.evox-account-page .woocommerce {
		grid-template-columns: 1fr;
	}
	.evox-account-page .woocommerce-MyAccount-navigation {
		position: static;
		padding: 8px;
	}
	/* Menú en UNA fila con scroll horizontal (swipe): no se apila ni ocupa
	   media pantalla, y siempre se ve la sección activa. */
	.evox-account-page .woocommerce-MyAccount-navigation ul {
		display: flex;
		flex-wrap: nowrap;
		gap: 8px;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}
	.evox-account-page .woocommerce-MyAccount-navigation ul::-webkit-scrollbar {
		display: none;
	}
	.evox-account-page .woocommerce-MyAccount-navigation li {
		flex: 0 0 auto;
	}
	.evox-account-page .woocommerce-MyAccount-navigation li a {
		white-space: nowrap;
		padding: 10px 16px;
		font-size: 13.5px;
	}
	/* Títulos de dirección compactos en móvil */
	.evox-account-page .woocommerce-Address h3 {
		font-size: 14px !important;
	}
	.evox-acc-cards {
		grid-template-columns: 1fr;
	}
	.evox-account-page .woocommerce-Addresses {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 600px) {
	.evox-account-page .woocommerce-MyAccount-content {
		padding: 20px;
	}
	/* Tabla de pedidos en cards */
	.evox-account-page .woocommerce-orders-table thead {
		display: none;
	}
	.evox-account-page .woocommerce-orders-table,
	.evox-account-page .woocommerce-orders-table tbody,
	.evox-account-page .woocommerce-orders-table tr,
	.evox-account-page .woocommerce-orders-table td {
		display: block;
		width: 100%;
	}
	.evox-account-page .woocommerce-orders-table tr {
		border: 1px solid var(--evox-borde);
		border-radius: 10px;
		padding: 8px 12px;
		margin-bottom: 12px;
	}
	.evox-account-page .woocommerce-orders-table td {
		display: flex;
		justify-content: space-between;
		gap: 12px;
		padding: 8px 0;
		border: none;
		text-align: right;
	}
	.evox-account-page .woocommerce-orders-table td::before {
		content: attr(data-title);
		font-weight: 700;
		color: var(--evox-cuerpo);
		text-align: left;
	}
}

/* ==========================================================================
   ACCESO SIN SESIÓN — /mi-cuenta/ para visitantes
   Reemplaza al formulario nativo de WooCommerce (ver templates/form-login.php)
   ========================================================================== */
.evox-account-login {
	max-width: 420px;
	margin: 0 auto;
	padding: 28px 24px;
	background: #fff;
	border: 1px solid var(--evox-borde);
	border-radius: 14px;
}

.evox-account-login__title {
	margin: 0 0 6px;
	font-size: 22px;
	font-weight: 700;
	color: var(--evox-tinta);
	text-align: center;
}

.evox-account-login__subtitle {
	margin: 0 0 20px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--evox-cuerpo);
	text-align: center;
}

@media (max-width: 600px) {
	.evox-account-login {
		padding: 22px 16px;
		border: none;
		border-radius: 0;
	}
}