/*
 * JG Mi Cuenta Pro.
 * Todas las reglas están limitadas a body.jg-account-pro-page.
 */
body.jg-account-pro-page {
	font-size: var(--jg-ap-base, 16px);
}

body.jg-account-pro-page .site-content .woocommerce,
body.jg-account-pro-page main .woocommerce,
body.jg-account-pro-page .entry-content > .woocommerce {
	width: min(100%, var(--jg-ap-max, 1240px));
	max-width: var(--jg-ap-max, 1240px);
	margin-inline: auto;
	font-family: var(--jg-ap-font, inherit);
}

body.jg-account-pro-page .woocommerce *,
body.jg-account-pro-page .woocommerce *::before,
body.jg-account-pro-page .woocommerce *::after {
	box-sizing: border-box;
}

body.jg-account-pro-hide-title .entry-title,
body.jg-account-pro-hide-title .page-title {
	display: none !important;
}

/* Navegación segura: horizontal, sin forzar grid sobre toda la salida de WooCommerce. */
body.jg-account-pro-logged .woocommerce-MyAccount-navigation,
body.jg-account-pro-logged .woocommerce-MyAccount-content {
	float: none !important;
	width: 100% !important;
	max-width: none !important;
}

body.jg-account-pro-logged .woocommerce-MyAccount-navigation {
	position: relative;
	z-index: 2;
	margin: 0 0 24px !important;
	padding: 8px;
	background: var(--jg-ap-dark);
	border: 1px solid color-mix(in srgb, var(--jg-ap-dark) 76%, white);
	border-radius: var(--jg-ap-radius);
	box-shadow: var(--jg-ap-shadow);
}

body.jg-account-pro-logged .woocommerce-MyAccount-navigation ul {
	display: flex;
	overflow-x: auto;
	gap: 6px;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	scrollbar-width: thin;
}

body.jg-account-pro-logged .woocommerce-MyAccount-navigation li {
	flex: 0 0 auto;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}

body.jg-account-pro-logged .woocommerce-MyAccount-navigation a {
	display: inline-flex;
	min-height: 43px;
	align-items: center;
	padding: 10px 14px;
	color: #e6e6e6 !important;
	background: transparent;
	border: 0;
	border-radius: calc(var(--jg-ap-radius) * .55);
	font-family: var(--jg-ap-font, inherit);
	font-size: .82em;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none !important;
	white-space: nowrap;
}

body.jg-account-pro-logged .woocommerce-MyAccount-navigation a:hover,
body.jg-account-pro-logged .woocommerce-MyAccount-navigation a:focus,
body.jg-account-pro-logged .woocommerce-MyAccount-navigation-link.is-active a {
	color: #fff !important;
	background: var(--jg-ap-primary);
}

body.jg-account-pro-dashboard-page .woocommerce-MyAccount-content {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

body.jg-account-pro-dashboard-page .jg-account-pro-dashboard {
	order: -10;
}

body.jg-account-pro-dashboard-page .woocommerce-MyAccount-content > p {
	margin: 0;
	padding: 14px 16px;
	color: var(--jg-ap-muted);
	background: var(--jg-ap-surface);
	border: 1px solid var(--jg-ap-border);
	border-radius: calc(var(--jg-ap-radius) * .75);
	font-size: .88em;
}

.jg-account-pro-dashboard {
	display: grid;
	gap: 22px;
	color: var(--jg-ap-text);
}

.jg-account-pro-hero,
.jg-account-pro-guest {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	color: #fff;
	background:
		linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px),
		var(--jg-ap-dark);
	background-size: 30px 30px, 30px 30px, auto;
	border: 1px solid color-mix(in srgb, var(--jg-ap-dark) 76%, white);
	border-radius: calc(var(--jg-ap-radius) * 1.25);
	box-shadow: var(--jg-ap-shadow);
}

.jg-account-pro-hero {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 160px;
	gap: 32px;
	align-items: center;
	min-height: 315px;
	padding: clamp(30px, 5vw, 58px);
}

.jg-account-pro-hero::before,
.jg-account-pro-guest::before {
	position: absolute;
	top: 0;
	right: 0;
	width: 34%;
	height: 7px;
	background: var(--jg-ap-primary);
	content: "";
}

.jg-account-pro-hero-copy,
.jg-account-pro-guest-copy,
.jg-account-pro-access-options {
	position: relative;
	z-index: 2;
}

.jg-account-pro-eyebrow {
	margin: 0 0 12px !important;
	color: var(--jg-ap-primary) !important;
	font-size: .72em !important;
	font-weight: 800 !important;
	letter-spacing: .11em;
	line-height: 1.35;
	text-transform: uppercase;
}

.jg-account-pro-hero h1,
.jg-account-pro-guest h1 {
	margin: 0 !important;
	color: #fff !important;
	font-family: var(--jg-ap-font, inherit) !important;
	font-size: clamp(2rem, 4.4vw, 3.7rem) !important;
	font-weight: var(--jg-ap-heading-weight) !important;
	letter-spacing: -.045em;
	line-height: 1.02;
}

.jg-account-pro-hero-copy > p:not(.jg-account-pro-eyebrow),
.jg-account-pro-guest-copy > p:not(.jg-account-pro-eyebrow) {
	max-width: 680px;
	margin: 18px 0 0 !important;
	color: #c9cdd3 !important;
	font-size: 1em !important;
	line-height: 1.7;
}

.jg-account-pro-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 26px;
}

.jg-account-pro-button {
	display: inline-flex;
	min-height: 48px;
	align-items: center;
	justify-content: center;
	padding: 12px 20px;
	border: 2px solid transparent;
	border-radius: calc(var(--jg-ap-radius) * .55);
	font-family: var(--jg-ap-font, inherit);
	font-size: .75em;
	font-weight: 800;
	line-height: 1;
	text-decoration: none !important;
	text-transform: uppercase;
	transition: transform .18s ease, color .18s ease, background .18s ease;
}

.jg-account-pro-button:hover,
.jg-account-pro-button:focus { transform: translateY(-2px); }
.jg-account-pro-button.is-primary { color: #fff !important; background: var(--jg-ap-primary); border-color: var(--jg-ap-primary); }
.jg-account-pro-button.is-primary:hover { color: var(--jg-ap-primary) !important; background: transparent; }
.jg-account-pro-button.is-light { color: var(--jg-ap-dark) !important; background: #fff; border-color: #fff; }
.jg-account-pro-button.is-light:hover { color: #fff !important; background: transparent; }
.jg-account-pro-button.is-success { color: #fff !important; background: var(--jg-ap-success); border-color: var(--jg-ap-success); }
.jg-account-pro-button.is-success:hover { background: transparent; }

.jg-account-pro-hero-mark {
	display: grid;
	width: 145px;
	height: 145px;
	place-items: center;
	color: var(--jg-ap-primary);
	background: rgba(255,255,255,.055);
	border: 1px solid rgba(255,255,255,.14);
	border-radius: calc(var(--jg-ap-radius) * 1.5);
}


.jg-account-pro-icon,
.jg-account-pro-hero-mark {
	color: var(--jg-ap-primary);
}

.jg-account-pro-icon svg,
.jg-account-pro-hero-mark svg {
	width: 27px;
	height: 27px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.jg-account-pro-hero-mark svg { width: 48px; height: 48px; }

.jg-account-pro-stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
}

.jg-account-pro-stat {
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr);
	gap: 14px;
	align-items: center;
	min-height: 110px;
	padding: 20px;
	background: var(--jg-ap-surface);
	border: 1px solid var(--jg-ap-border);
	border-radius: var(--jg-ap-radius);
	box-shadow: var(--jg-ap-shadow);
}

.jg-account-pro-icon {
	display: grid;
	width: 48px;
	height: 48px;
	place-items: center;
	background: color-mix(in srgb, var(--jg-ap-primary) 11%, white);
	border-radius: calc(var(--jg-ap-radius) * .7);
}

.jg-account-pro-stat strong { display:block; color:var(--jg-ap-text); font-weight:var(--jg-ap-heading-weight); line-height:1.25; }
.jg-account-pro-stat p { margin:5px 0 0 !important; color:var(--jg-ap-muted) !important; font-size:.78em !important; line-height:1.5; }

.jg-account-pro-panel {
	padding: clamp(24px, 4vw, 38px);
	background: var(--jg-ap-surface);
	border: 1px solid var(--jg-ap-border);
	border-radius: calc(var(--jg-ap-radius) * 1.1);
	box-shadow: var(--jg-ap-shadow);
}

.jg-account-pro-section-head {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 22px;
	margin-bottom: 24px;
}

.jg-account-pro-section-head h2 {
	margin: 0 !important;
	color: var(--jg-ap-text) !important;
	font-family: var(--jg-ap-font, inherit) !important;
	font-size: clamp(1.55rem, 3vw, 2.25rem) !important;
	font-weight: var(--jg-ap-heading-weight) !important;
	letter-spacing: -.035em;
	line-height: 1.1;
}

.jg-account-pro-section-head > a { color:var(--jg-ap-primary) !important; font-size:.78em; font-weight:800; text-decoration:none !important; }

.jg-account-pro-action-grid,
.jg-account-pro-product-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px;
}

.jg-account-pro-action {
	display: flex;
	min-height: 225px;
	flex-direction: column;
	padding: 22px;
	color: var(--jg-ap-text) !important;
	background: var(--jg-ap-bg);
	border: 1px solid var(--jg-ap-border);
	border-radius: var(--jg-ap-radius);
	text-decoration: none !important;
	transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.jg-account-pro-action:hover,
.jg-account-pro-action:focus {
	color: var(--jg-ap-text) !important;
	border-color: var(--jg-ap-primary);
	box-shadow: var(--jg-ap-shadow);
	transform: translateY(-3px);
}

.jg-account-pro-action h3 { margin:22px 0 0 !important; color:inherit !important; font-size:1.05em !important; font-weight:var(--jg-ap-heading-weight) !important; line-height:1.25; }
.jg-account-pro-action p { margin:9px 0 0 !important; color:var(--jg-ap-muted) !important; font-size:.82em !important; line-height:1.6; }
.jg-account-pro-action small { margin-top:auto; padding-top:18px; color:var(--jg-ap-primary); font-size:.7em; font-weight:800; text-transform:uppercase; }

.jg-account-pro-product {
	overflow: hidden;
	background: var(--jg-ap-bg);
	border: 1px solid var(--jg-ap-border);
	border-radius: var(--jg-ap-radius);
	transition: transform .18s ease, border-color .18s ease;
}

.jg-account-pro-product:hover { border-color:var(--jg-ap-primary); transform:translateY(-3px); }
.jg-account-pro-product-media { display:grid; aspect-ratio:1/.82; overflow:hidden; place-items:center; padding:15px; background:var(--jg-ap-surface); }
.jg-account-pro-product-image { display:block; width:100%; height:100%; margin:0 !important; object-fit:contain; }
.jg-account-pro-product-content { padding:17px; }
.jg-account-pro-product-content h3 { margin:0 !important; font-size:.88em !important; font-weight:var(--jg-ap-heading-weight) !important; line-height:1.35; }
.jg-account-pro-product-content h3 a { color:var(--jg-ap-text) !important; text-decoration:none !important; }
.jg-account-pro-price { margin-top:9px; color:var(--jg-ap-text); font-size:.88em; font-weight:800; }
.jg-account-pro-product-link { display:inline-block; margin-top:12px; color:var(--jg-ap-primary) !important; font-size:.7em; font-weight:800; text-decoration:none !important; text-transform:uppercase; }

.jg-account-pro-empty {
	grid-column: 1/-1;
	display:grid;
	grid-template-columns:56px minmax(0,1fr);
	gap:16px;
	align-items:center;
	padding:24px;
	background:var(--jg-ap-bg);
	border:1px dashed var(--jg-ap-border);
	border-radius:var(--jg-ap-radius);
}
.jg-account-pro-empty h3 { margin:0 !important; color:var(--jg-ap-text) !important; font-size:1em !important; font-weight:var(--jg-ap-heading-weight) !important; }
.jg-account-pro-empty p { margin:7px 0 0 !important; color:var(--jg-ap-muted) !important; font-size:.82em !important; }
.jg-account-pro-empty a { display:inline-block; margin-top:10px; color:var(--jg-ap-primary) !important; font-size:.72em; font-weight:800; text-decoration:none !important; text-transform:uppercase; }

/* Visitantes y formularios nativos. */
body.jg-account-pro-guest-page .site-content .woocommerce,
body.jg-account-pro-guest-page main .woocommerce,
body.jg-account-pro-guest-page .entry-content > .woocommerce {
	width: min(100%, var(--jg-ap-max));
}

.jg-account-pro-guest {
	display:grid;
	grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr);
	gap:clamp(28px,5vw,64px);
	align-items:center;
	min-height:370px;
	margin-bottom:26px;
	padding:clamp(30px,5vw,56px);
}

.jg-account-pro-access-options {
	display:grid;
	gap:12px;
}

.jg-account-pro-access-option {
	display:grid;
	grid-template-columns:48px minmax(0,1fr);
	gap:14px;
	align-items:start;
	padding:18px;
	background:rgba(255,255,255,.07);
	border:1px solid rgba(255,255,255,.14);
	border-radius:calc(var(--jg-ap-radius)*.75);
}

.jg-account-pro-access-option-copy strong {
	display:block;
	color:#fff;
	font-size:.88em;
	font-weight:800;
}

.jg-account-pro-access-option-copy p {
	margin:5px 0 14px !important;
	color:#c2c7ce !important;
	font-size:.76em !important;
	line-height:1.5;
}

.jg-account-pro-access-option .jg-account-pro-button {
	min-height:40px;
	padding:9px 14px;
	font-size:.68em;
}

.jg-account-pro-anchor {
	position:relative;
	display:block;
	top:-24px;
	visibility:hidden;
}

/*
 * WooCommerce añade ::before y ::after a .col2-set para limpiar floats.
 * Al convertir #customer_login en grid, esos pseudo-elementos pueden ocupar
 * celdas reales y desplazar Acceder y Registrarse a filas distintas.
 * Se neutralizan solo dentro de Mi cuenta y se restablecen ambas columnas.
 */
body.jg-account-pro-guest-page #customer_login {
	display:grid !important;
	grid-template-columns:repeat(2,minmax(0,1fr)) !important;
	gap:clamp(20px,3vw,32px) !important;
	align-items:start !important;
	width:100% !important;
	max-width:none !important;
	margin:0 !important;
	padding:0 !important;
	float:none !important;
	clear:none !important;
}

body.jg-account-pro-guest-page #customer_login::before,
body.jg-account-pro-guest-page #customer_login::after {
	display:none !important;
	content:none !important;
	clear:none !important;
}

body.jg-account-pro-guest-page #customer_login > .u-column1,
body.jg-account-pro-guest-page #customer_login > .u-column2,
body.jg-account-pro-guest-page #customer_login > .col-1,
body.jg-account-pro-guest-page #customer_login > .col-2 {
	display:flex !important;
	min-width:0 !important;
	width:100% !important;
	max-width:none !important;
	flex-direction:column !important;
	float:none !important;
	clear:none !important;
	position:static !important;
	margin:0 !important;
	padding:0 !important;
}

body.jg-account-pro-guest-page #customer_login > .u-column1 > h2,
body.jg-account-pro-guest-page #customer_login > .u-column2 > h2,
body.jg-account-pro-guest-page #customer_login > .col-1 > h2,
body.jg-account-pro-guest-page #customer_login > .col-2 > h2 {
	min-height:2.15rem;
}

body.jg-account-pro-guest-page #customer_login .woocommerce-form-login,
body.jg-account-pro-guest-page #customer_login .woocommerce-form-register {
	width:100% !important;
	max-width:none !important;
}

body.jg-account-pro-guest-page #customer_login h2,
body.jg-account-pro-guest-page .woocommerce-form-login + h2 {
	margin:0 0 15px !important;
	color:var(--jg-ap-text) !important;
	font-family:var(--jg-ap-font,inherit) !important;
	font-size:1.7rem !important;
	font-weight:var(--jg-ap-heading-weight) !important;
}

body.jg-account-pro-guest-page .woocommerce-form-login,
body.jg-account-pro-guest-page .woocommerce-form-register,
body.jg-account-pro-guest-page .woocommerce-ResetPassword,
body.jg-account-pro-endpoint-page .woocommerce-MyAccount-content {
	margin:0 !important;
	padding:clamp(24px,4vw,36px) !important;
	background:var(--jg-ap-surface) !important;
	border:1px solid var(--jg-ap-border) !important;
	border-radius:var(--jg-ap-radius) !important;
	box-shadow:var(--jg-ap-shadow);
}

body.jg-account-pro-page .woocommerce form .form-row label { color:var(--jg-ap-text); font-size:.78em; font-weight:700; }
body.jg-account-pro-page .woocommerce input.input-text,
body.jg-account-pro-page .woocommerce select,
body.jg-account-pro-page .woocommerce textarea {
	min-height:48px;
	padding:11px 13px;
	color:var(--jg-ap-text);
	background:var(--jg-ap-surface);
	border:1px solid var(--jg-ap-border);
	border-radius:calc(var(--jg-ap-radius)*.55);
	font-family:var(--jg-ap-font,inherit);
	font-size:.95em;
}
body.jg-account-pro-page .woocommerce input.input-text:focus,
body.jg-account-pro-page .woocommerce select:focus,
body.jg-account-pro-page .woocommerce textarea:focus { border-color:var(--jg-ap-primary); outline:0; box-shadow:0 0 0 4px color-mix(in srgb,var(--jg-ap-primary) 14%,transparent); }

body.jg-account-pro-page .woocommerce button.button,
body.jg-account-pro-page .woocommerce a.button,
body.jg-account-pro-page .woocommerce input.button {
	min-height:45px;
	padding:11px 18px;
	color:#fff !important;
	background:var(--jg-ap-primary) !important;
	border:1px solid var(--jg-ap-primary) !important;
	border-radius:calc(var(--jg-ap-radius)*.5) !important;
	font-family:var(--jg-ap-font,inherit) !important;
	font-size:.75em !important;
	font-weight:800 !important;
	line-height:1;
	text-transform:uppercase;
}
body.jg-account-pro-page .woocommerce button.button:hover,
body.jg-account-pro-page .woocommerce a.button:hover,
body.jg-account-pro-page .woocommerce input.button:hover { color:var(--jg-ap-primary) !important; background:transparent !important; }

body.jg-account-pro-page .woocommerce-error,
body.jg-account-pro-page .woocommerce-info,
body.jg-account-pro-page .woocommerce-message { border-top-color:var(--jg-ap-primary); border-radius:calc(var(--jg-ap-radius)*.6); }

@media (max-width: 1050px) {
	.jg-account-pro-action-grid,
	.jg-account-pro-product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width: 820px) {
	.jg-account-pro-hero,
	.jg-account-pro-guest { grid-template-columns:1fr; }
	.jg-account-pro-hero-mark { display:none; }
	.jg-account-pro-stats { grid-template-columns:1fr; }
	body.jg-account-pro-guest-page #customer_login {
		grid-template-columns:1fr !important;
		gap:24px !important;
	}
}

@media (max-width: 620px) {
	.jg-account-pro-hero,
	.jg-account-pro-guest { padding:28px 21px; }
	.jg-account-pro-buttons { display:grid; }
	.jg-account-pro-button { width:100%; }
	.jg-account-pro-action-grid,
	.jg-account-pro-product-grid { grid-template-columns:1fr; }
	.jg-account-pro-section-head { align-items:flex-start; flex-direction:column; }
	.jg-account-pro-action { min-height:190px; }
}

@media (prefers-reduced-motion: reduce) {
	body.jg-account-pro-page .woocommerce *,
	body.jg-account-pro-page .woocommerce *::before,
	body.jg-account-pro-page .woocommerce *::after { transition:none !important; scroll-behavior:auto !important; }
}
