/* MemiPetShop - Mi Cuenta Mejorada
   Estilo amarillo/negro de marca. Pensado para convivir con Astra. */

:root {
	--mmc-yellow: #f4b400;
	--mmc-yellow-soft: #fdf3d3;
	--mmc-ink: #1a1a1a;
	--mmc-muted: #6b6b6b;
	--mmc-line: #ececec;
	--mmc-card: #ffffff;
	--mmc-danger: #c0392b;
	--mmc-danger-soft: #fdecea;
	--mmc-success: #1e8e3e;
	--mmc-success-soft: #e6f4ea;
	--mmc-accent: #185fa5;
	--mmc-accent-soft: #e6f1fb;
	--mmc-warning: #8a6d00;
	--mmc-warning-soft: #fff6d6;
}

/* ---------- Menú lateral ---------- */
.woocommerce-account .woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.mmc-nav {
	border: 0;
	margin: 2px 0;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.mmc-nav a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 11px 14px;
	border-radius: 10px;
	color: var(--mmc-ink);
	text-decoration: none;
	font-weight: 400;
	transition: background .15s ease;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.mmc-nav a:hover {
	background: #f6f6f6;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.mmc-nav.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active.mmc-nav a {
	background: var(--mmc-yellow-soft);
	color: var(--mmc-ink);
	font-weight: 500;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.mmc-nav a::before {
	font-size: 18px;
	line-height: 1;
}
.mmc-nav--dashboard a::before { content: "🏠"; }
.mmc-nav--orders a::before { content: "📦"; }
.mmc-nav--seguimiento a::before { content: "🛵"; }
.mmc-nav--favoritos a::before { content: "💛"; }
.mmc-nav--volver-a-pedir a::before { content: "🔁"; }
.mmc-nav--edit-address a::before { content: "📍"; }
.mmc-nav--edit-account a::before { content: "👤"; }
.mmc-nav--downloads a::before { content: "⬇️"; }
.mmc-nav--customer-logout a::before { content: "🚪"; }

/* ---------- Tarjetas de resumen ---------- */
.mmc-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
	gap: 12px;
	margin: 0 0 22px;
}
.mmc-card {
	background: #faf9f6;
	border-radius: 12px;
	padding: 14px 16px;
}
.mmc-card__label { font-size: 13px; color: var(--mmc-muted); }
.mmc-card__value { font-size: 26px; font-weight: 500; color: var(--mmc-ink); line-height: 1.2; }

.mmc-section-title { font-size: 17px; font-weight: 500; margin: 8px 0 12px; }

/* ---------- Tarjeta de pedido ---------- */
.mmc-order {
	background: var(--mmc-card);
	border: 1px solid var(--mmc-line);
	border-radius: 14px;
	padding: 18px;
	margin: 0 0 18px;
}
.mmc-order__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 8px;
}
.mmc-order__num { font-size: 16px; font-weight: 500; }
.mmc-order__date { font-size: 13px; color: var(--mmc-muted); }

.mmc-badge {
	font-size: 13px;
	font-weight: 500;
	padding: 5px 12px;
	border-radius: 20px;
	white-space: nowrap;
}
.mmc-badge--warning { background: var(--mmc-warning-soft); color: var(--mmc-warning); }
.mmc-badge--accent  { background: var(--mmc-accent-soft);  color: var(--mmc-accent); }
.mmc-badge--success { background: var(--mmc-success-soft); color: var(--mmc-success); }
.mmc-badge--danger  { background: var(--mmc-danger-soft);  color: var(--mmc-danger); }
.mmc-badge--muted   { background: #f1f1f1; color: var(--mmc-muted); }

/* ---------- Barra de seguimiento ---------- */
.mmc-stepper {
	display: flex;
	align-items: flex-start;
	margin: 18px 4px 6px;
}
.mmc-step { flex: 0 0 auto; width: 64px; text-align: center; }
.mmc-step__dot {
	width: 34px; height: 34px;
	border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	margin: 0 auto;
	font-size: 16px;
	background: #f0f0f0;
	filter: grayscale(1) opacity(.55);
	border: 1px solid #e2e2e2;
}
.mmc-step__label { display: block; font-size: 12px; margin-top: 6px; color: var(--mmc-muted); }
.mmc-step--done .mmc-step__dot,
.mmc-step--current .mmc-step__dot {
	background: var(--mmc-yellow);
	filter: none;
	border-color: var(--mmc-yellow);
}
.mmc-step--current .mmc-step__dot {
	box-shadow: 0 0 0 4px var(--mmc-yellow-soft);
}
.mmc-step--current .mmc-step__label { color: var(--mmc-ink); font-weight: 500; }
.mmc-step--done .mmc-step__label { color: var(--mmc-ink); }
.mmc-bar {
	flex: 1 1 auto;
	height: 3px;
	background: #e6e6e6;
	margin-top: 16px;
	border-radius: 2px;
}
.mmc-bar--done { background: var(--mmc-yellow); }
.mmc-stepper--alert .mmc-step--current .mmc-step__dot {
	background: var(--mmc-danger);
	border-color: var(--mmc-danger);
	color: #fff;
	box-shadow: 0 0 0 4px var(--mmc-danger-soft);
}

.mmc-terminal {
	text-align: center;
	padding: 14px;
	border-radius: 10px;
	font-weight: 500;
	margin: 14px 0 6px;
}
.mmc-terminal--danger { background: var(--mmc-danger-soft); color: var(--mmc-danger); }
.mmc-terminal--muted  { background: #f1f1f1; color: var(--mmc-muted); }

/* ---------- Ítems y total ---------- */
.mmc-order__items {
	border-top: 1px solid var(--mmc-line);
	margin-top: 14px;
	padding-top: 12px;
	font-size: 14px;
}
.mmc-order__item { display: flex; justify-content: space-between; padding: 3px 0; color: #444; }
.mmc-order__total { display: flex; justify-content: space-between; padding-top: 8px; font-weight: 500; color: var(--mmc-ink); }

/* ---------- Botones ---------- */
.mmc-order__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.mmc-order__actions--single { margin-top: 18px; }
.mmc-btn {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 9px 14px;
	border-radius: 10px;
	font-size: 14px; font-weight: 500;
	border: 1px solid #dcdcdc;
	background: #fff;
	color: var(--mmc-ink);
	cursor: pointer;
	line-height: 1.2;
	text-decoration: none;
}
.mmc-btn:hover { background: #f6f6f6; }
.mmc-btn .dashicons { font-size: 17px; width: 17px; height: 17px; }
.mmc-btn--primary { background: var(--mmc-yellow); border-color: var(--mmc-yellow); color: #111; }
.mmc-btn--primary:hover { background: #e0a600; }
.mmc-btn--danger { border-color: #e6b4ae; color: var(--mmc-danger); }
.mmc-btn--danger:hover { background: var(--mmc-danger-soft); }

.mmc-order__hint { font-size: 12px; color: var(--mmc-muted); margin-top: 10px; display: flex; align-items: center; gap: 5px; }
.mmc-order__hint .dashicons { font-size: 15px; width: 15px; height: 15px; }

/* Confirmación inline de anulación */
.mmc-confirm {
	background: var(--mmc-danger-soft);
	border-radius: 10px;
	padding: 12px 14px;
	margin-top: 10px;
	width: 100%;
}
.mmc-confirm__text { font-size: 14px; color: var(--mmc-danger); margin-bottom: 10px; }
.mmc-confirm__actions { display: flex; gap: 8px; }

/* ---------- Estados vacíos ---------- */
.mmc-empty {
	background: #faf9f6;
	border-radius: 12px;
	padding: 22px;
	text-align: center;
	color: var(--mmc-muted);
	font-size: 15px;
}
.mmc-empty__emoji { font-size: 22px; display: block; margin-bottom: 6px; }

/* ---------- Volver a pedir ---------- */
.mmc-reorder-row {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	background: #fff; border: 1px solid var(--mmc-line); border-radius: 12px;
	padding: 14px 16px; margin-bottom: 10px;
}
.mmc-reorder-row__num { font-weight: 500; }
.mmc-reorder-row__date { color: var(--mmc-muted); font-size: 13px; margin-left: 6px; }
.mmc-reorder-row__items { font-size: 13px; color: #555; margin-top: 4px; }

/* ---------- Favoritos: corazón ---------- */
.mmc-fav-btn {
	display: inline-flex; align-items: center; gap: 6px;
	background: #fff; border: 1px solid #e2e2e2; border-radius: 20px;
	padding: 6px 10px; cursor: pointer; color: #b0b0b0; line-height: 1;
}
.mmc-fav-btn:hover { color: var(--mmc-danger); border-color: #e6b4ae; }
.mmc-fav-btn.is-fav { color: var(--mmc-danger); border-color: #e6b4ae; background: var(--mmc-danger-soft); }
.mmc-fav-btn .dashicons { font-size: 18px; width: 18px; height: 18px; }
.mmc-fav-btn__text { font-size: 13px; font-weight: 500; }
.mmc-fav-btn.is-loading { opacity: .5; pointer-events: none; }
.woocommerce ul.products li.product .mmc-fav-btn { position: absolute; top: 10px; right: 10px; z-index: 2; padding: 6px; }
.woocommerce ul.products li.product { position: relative; }

/* ---------- Favoritos: grilla en el panel ---------- */
.mmc-fav-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 14px;
}
.mmc-fav-card {
	border: 1px solid var(--mmc-line); border-radius: 12px; padding: 12px; text-align: center;
}
.mmc-fav-card__img img { width: 100%; height: auto; border-radius: 8px; }
.mmc-fav-card__name { display: block; font-size: 14px; font-weight: 500; color: var(--mmc-ink); margin: 8px 0 4px; text-decoration: none; }
.mmc-fav-card__price { font-size: 14px; color: #333; margin-bottom: 10px; }
.mmc-fav-card__actions { display: flex; align-items: center; justify-content: center; gap: 8px; }

/* ---------- Marco del panel ---------- */
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content {
	background: #fff;
	border: 1px solid var(--mmc-line);
	border-radius: 16px;
	box-sizing: border-box;
}
.woocommerce-account .woocommerce-MyAccount-navigation { padding: 10px; }
.woocommerce-account .woocommerce-MyAccount-content { padding: 26px 28px; }
@media (min-width: 769px) {
	.woocommerce-account .woocommerce-MyAccount-content { width: 71%; }
	.woocommerce-account .woocommerce-MyAccount-navigation { width: 26%; }
}

/* ---------- Saludo de bienvenida ---------- */
.mmc-welcome {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 4px 0 20px;
	margin-bottom: 18px;
	border-bottom: 1px solid var(--mmc-line);
}
.mmc-welcome__avatar {
	width: 52px; height: 52px;
	border-radius: 50%;
	background: var(--mmc-yellow);
	color: #1a1a1a;
	display: flex; align-items: center; justify-content: center;
	font-size: 19px; font-weight: 500;
	flex: 0 0 auto;
}
.mmc-welcome__hi { font-size: 19px; font-weight: 500; color: var(--mmc-ink); line-height: 1.25; }
.mmc-welcome__sub { font-size: 13px; color: var(--mmc-muted); margin-top: 2px; }

/* ---------- Miniaturas de producto en pedidos ---------- */
.mmc-order__item { align-items: center; }
.mmc-order__item-main { display: flex; align-items: center; gap: 10px; }
.mmc-order__item-img {
	width: 40px; height: 40px;
	border-radius: 8px;
	object-fit: cover;
	border: 1px solid var(--mmc-line);
	flex: 0 0 auto;
	margin: 0;
}
.mmc-order__item-name { font-size: 14px; }
.mmc-order__item-price { white-space: nowrap; }

/* ---------- Tabla "Mis pedidos" modernizada ---------- */
.woocommerce-account .woocommerce-MyAccount-content table.shop_table,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-orders-table,
.woocommerce-account .woocommerce-MyAccount-content table {
	border-collapse: separate;
	border-spacing: 0;
	width: 100%;
	border: 1px solid var(--mmc-line);
	border-radius: 12px;
	overflow: hidden;
}
.woocommerce-account .woocommerce-MyAccount-content table th {
	background: var(--mmc-yellow-soft);
	color: var(--mmc-ink);
	font-weight: 500;
	font-size: 13px;
	padding: 12px 14px;
	text-align: left;
	border: 0;
}
.woocommerce-account .woocommerce-MyAccount-content table td {
	padding: 12px 14px;
	border: 0;
	border-top: 1px solid var(--mmc-line);
	font-size: 14px;
	vertical-align: middle;
}
.woocommerce-account .woocommerce-MyAccount-content table tr:hover td { background: #fcfbf7; }

/* ---------- Estados vacíos con acción ---------- */
.mmc-empty { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.mmc-empty .mmc-btn { text-decoration: none; }

@media (max-width: 600px) {
	.mmc-step { width: 48px; }
	.mmc-step__dot { width: 30px; height: 30px; font-size: 14px; }
	.mmc-step__label { font-size: 11px; }
	.woocommerce-account .woocommerce-MyAccount-content { padding: 18px; }
	.mmc-order__item-img { width: 34px; height: 34px; }
}
