/*
 * mi-cuenta.css
 * Misma línea minimalista del resto del sitio (tipografía Montserrat en
 * mayúsculas para etiquetas, mucho espacio, un solo acento de color) aplicada
 * a "Mi Cuenta" y al panel mayorista que ya renderiza plugin-global-nails-core
 * (clases .gn-panel-*, .gn-tier-*, .gn-stats-*, .gn-credito-*, .gn-tracking-*)
 * más la gráfica de evolución que añade inc/mayoristas-visual.php
 * (.gn-evolucion-*). El tema solo aporta estilos: la lógica de esas clases
 * vive en el plugin, no aquí.
 */

.woocommerce-account .site-main { padding-block: var(--espacio-lg) var(--espacio-2xl); }

.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0 0 var(--espacio-lg);
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: var(--espacio-md);
	border-bottom: 1px solid var(--color-borde);
	padding-bottom: var(--espacio-sm);
}
.woocommerce-MyAccount-navigation li a {
	display: inline-block;
	color: var(--color-texto-suave);
	font-size: .8rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	padding-bottom: .4rem;
	border-bottom: 2px solid transparent;
}
.woocommerce-MyAccount-navigation li.is-active a {
	color: var(--color-secundario);
	border-bottom-color: var(--color-acento);
}

.woocommerce-MyAccount-content table.shop_table th { text-align: left; }

/* ─── Panel mayorista (contenido generado por el plugin) ─── */
.gn-panel-upgrade {
	text-align: center;
	background: var(--color-fondo-alterno);
	padding: var(--espacio-2xl) var(--espacio-lg);
}
.gn-panel-upgrade h2 { text-transform: uppercase; }

.gn-panel-wrap { display: flex; flex-direction: column; gap: var(--espacio-md); }

.gn-panel-tier { border: 1px solid var(--color-borde); border-top: 3px solid var(--color-primario); }
.gn-tier-header { display: flex; align-items: center; gap: var(--espacio-sm); padding: var(--espacio-md); color: #fff; }
.gn-tier-emoji { font-size: 1.8rem; }
.gn-tier-name { font-family: var(--fuente-titulos); font-weight: 800; text-transform: uppercase; letter-spacing: .02em; font-size: 1.2rem; margin: 0; color: #fff; }
.gn-tier-disc { margin: 0; opacity: .95; font-size: .9rem; }

.gn-tier-progress { padding: var(--espacio-md); }
.gn-prog-labels { display: flex; justify-content: space-between; font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; margin-bottom: .5rem; color: var(--color-texto-suave); }
.gn-prog-bar { height: 6px; background: var(--color-fondo-alterno); overflow: hidden; }
.gn-prog-fill { height: 100%; transition: width .6s ease; }
.gn-prog-hint { margin: .75rem 0 0; font-size: .85rem; color: var(--color-texto-suave); }
.gn-gold-msg { padding: var(--espacio-md); text-align: center; font-weight: 700; text-transform: uppercase; font-size: .85rem; letter-spacing: .04em; }

.gn-stats-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--color-borde); border: 1px solid var(--color-borde); }
.gn-stat { background: var(--color-fondo); padding: var(--espacio-md) var(--espacio-sm); text-align: center; }
.gn-stat-label { font-size: .7rem; color: var(--color-texto-suave); margin: 0 0 .4rem; text-transform: uppercase; letter-spacing: .05em; }
.gn-stat-value { font-family: var(--fuente-titulos); font-size: 1.4rem; font-weight: 800; margin: 0; color: var(--color-secundario); }

.gn-credito-card, .gn-tracking-card, .gn-evolucion-card {
	background: var(--color-fondo);
	border: 1px solid var(--color-borde);
	padding: var(--espacio-md);
}
.gn-credito-card h3, .gn-tracking-card h3, .gn-evolucion-card h3 {
	margin-bottom: var(--espacio-sm);
	font-size: .95rem;
	text-transform: uppercase;
	letter-spacing: .04em;
}
.gn-credito-aprobado { color: var(--color-exito); font-weight: 700; }
.gn-credito-revision { color: var(--color-aviso); font-weight: 700; }
.gn-credito-hint { font-size: .85rem; color: var(--color-texto-suave); }

.gn-tracking-table { width: 100%; border-collapse: collapse; }
.gn-tracking-table th { text-align: left; font-size: .7rem; text-transform: uppercase; letter-spacing: .04em; color: var(--color-texto-suave); padding-bottom: .6rem; }
.gn-tracking-table td { padding: .6rem 0; border-top: 1px solid var(--color-borde); font-size: .9rem; }
.gn-status { display: inline-block; padding: .2rem .6rem; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; background: var(--color-fondo-alterno); border: 1px solid var(--color-borde); }
.gn-status-completed { background: #e6f6ee; color: var(--color-exito); border-color: transparent; }
.gn-status-processing, .gn-status-empacado { background: #fdf3e3; color: var(--color-aviso); border-color: transparent; }
.gn-status-enviado { background: #e7f4fb; color: var(--color-azul-marca); border-color: transparent; }
.gn-track-btn { display: inline-block; padding: .3rem .8rem; background: var(--color-secundario); color: #fff; font-size: .75rem; font-weight: 600; }
.gn-no-track, .gn-no-orders { color: var(--color-texto-suave); font-size: .85rem; }

/* Gráfica de evolución (SVG propio, sin librerías) */
.gn-evolucion-svg { width: 100%; height: auto; }
.gn-barra { fill: var(--color-primario); transform-origin: bottom; animation: gn-crecer .6s ease both; }
.gn-barra-label { font-size: 11px; fill: var(--color-texto-suave); font-family: var(--fuente-cuerpo); }
@keyframes gn-crecer { from { transform: scaleY(0); opacity: 0; } to { transform: scaleY(1); opacity: 1; } }

@media (min-width: 768px) {
	.gn-panel-wrap { display: grid; grid-template-columns: 1fr 1fr; gap: var(--espacio-md); }
	.gn-panel-tier, .gn-evolucion-card { grid-column: 1 / -1; }
}