/* Tienda de WC / VIP (inc/manualshop.php). Escrito a mano: no lo genera recolor_css.py.
   Cabecera de piedra, ventanas con barra de título como las del juego y casilleros tipo inventario. */
.mk-shop {
	--shop-gold: #e2c48e;
	--shop-gold-hi: #ffd88a;
	--shop-orange: #e08a2c;
	--shop-line: #574128;
	--shop-line-hi: #b26c1f;
	--shop-text: #d8cdb9;
	--shop-muted: #9c8768;
	font-size: 11px; color: var(--shop-text);
}
.mk-shop-num { font-variant-numeric: tabular-nums; }
.mk-shop-muted { color: var(--shop-muted); }
.mk-shop a { color: var(--shop-gold); }
.mk-shop a:hover { color: #ff9900; }

/* ---------- Cabecera ---------- */
/* Ilustración pintada (hoja T3) a la derecha; título y saldo sobre el lado oscuro de la izquierda */
.mk-shop-head {
	min-height: 92px; padding: 12px 16px; margin-bottom: 14px;
	border: 1px solid #000; outline: 1px solid #4a3822; outline-offset: -2px;
	background: linear-gradient(90deg, #0a0705e6 0%, #0a0705b3 38%, #0a070500 62%), url(../img/content_bg.jpg) center / cover;
	box-shadow: inset 0 0 24px #000;
}
.mk-shop-head-wc { background-image: linear-gradient(90deg, #0a0705e6 0%, #0a0705b3 38%, #0a070500 62%), url(../img/shop/head-wc@2x.jpg); background-size: auto, cover; background-position: 0 0, right bottom; }
.mk-shop-head-vip { background-image: linear-gradient(90deg, #0a0705e6 0%, #0a0705b3 38%, #0a070500 62%), url(../img/shop/head-vip@2x.jpg); background-size: auto, cover; background-position: 0 0, right bottom; }
.mk-content .mk-shop-head h1 {
	margin: 0 0 6px; line-height: 0; /* el título es una imagen (mkTitle) */
}
.mk-shop-head-title p { margin: 0; color: var(--shop-muted); }
.mk-shop-head-account { display: inline-flex; margin: 10px 0 0; border: 1px solid #3b2d1c; background: #0d0a07d9; }
.mk-shop-head-account > div { min-width: 92px; padding: 6px 10px; border-left: 1px solid #3b2d1c; }
.mk-shop-head-account > div:first-child { border-left: 0; }
.mk-shop-head-account dt { color: var(--shop-muted); font-size: 11px; }
.mk-shop-head-account dd { margin: 2px 0 0; color: #fff; font-weight: bold; font-size: 12px; }
.mk-shop-head-account small { display: block; color: var(--shop-muted); font-weight: normal; font-size: 10px; }
.mk-shop-vip-active { color: #7cff4e; }
.mk-shop-vip-expired { color: #ff7a5c; }
.mk-shop-vip-free { color: var(--shop-gold); }

/* ---------- Pestañas (main_tab_server_01) ---------- */
.mk-shop-tabs { display: flex; align-items: flex-end; margin: 0; border-bottom: 1px solid var(--shop-line-hi); }
.mk-shop-tabs a {
	display: inline-block; width: 114px; height: 21px; padding-left: 6px; margin-right: 2px;
	background: url(../img/main_tab_server_01_off.png) no-repeat;
	font: 12px/21px Arial, sans-serif; color: var(--shop-gold);
}
.mk-shop-tabs a.mk-tab-on { background-image: url(../img/main_tab_server_01_on.gif); color: #fff; }
.mk-shop-tabs .mk-shop-admin { width: auto; margin-left: auto; background: none; font-size: 11px; }

.mk-shop-notice { margin: 10px 0 0; padding: 7px 10px 7px 30px; border: 1px solid #6a5220; background: #1d160d url(../img/main_ico_notice.gif) 10px 9px no-repeat; color: var(--shop-text); }
.mk-shop-notice strong { color: var(--shop-gold-hi); }

/* Ventanas, casilleros base y botón principal: ver ventanas.css */


.mk-slot-art { display: block; width: 52px; height: 52px; margin-bottom: 6px; filter: drop-shadow(0 3px 4px #000); }
.mk-slot-art img { display: block; width: 52px; height: 52px; object-fit: contain; }
/* Monedas VIP: traen el resplandor dentro del PNG (la moneda ocupa ~80 %); se agrandan para medir como las WC */
.mk-slot-art img.mk-slot-vipcoin { width: 64px; height: 64px; margin: -6px; max-width: none; }
.mk-slot-amount { font: bold 16px/1.2 Arial, sans-serif; color: #f3dfb4; }
.mk-slot-unit { margin-top: 2px; color: var(--shop-muted); font-size: 11px; }
.mk-slot-save { margin-top: 3px; color: #8fe36a; font-size: 11px; font-weight: bold; } /* promo de VIP 60/90 días */
.mk-slot-unit, .mk-slot-save { margin-bottom: 10px; } .mk-slot-unit:has(+ .mk-slot-save), .mk-slots-method .mk-slot-unit { margin-bottom: 0; }
.mk-slot-price {
	align-self: stretch; margin: auto -8px 0; padding: 6px 4px; /* auto: la franja del precio queda abajo aunque haya renglón de promo */
	border-top: 1px solid #3b2d1c; background: #0d0a07b3;
	color: var(--shop-gold-hi); font-weight: bold; font-size: 12px;
}
.mk-slot:has(input:checked) .mk-slot-price { background: #3a2610; border-top-color: #8a6331; }

.mk-slots-method .mk-slot { padding-bottom: 10px; }
.mk-slot-name { margin-top: 8px; color: #fff; font-weight: bold; font-size: 12px; }

/* Logos de cada marca en una placa: oscura (Mercado Pago es blanco, Binance amarillo) y clara para PayPal */
.mk-shop-logo { display: flex; justify-content: center; align-items: center; width: 120px; height: 34px; padding: 3px 8px; border: 1px solid #5e4526; background: #0a0806; box-sizing: border-box; }
.mk-shop-logo img { display: block; max-width: 100%; max-height: 24px; }
.mk-shop-logo.mk-shop-logo-mp img { max-height: 30px; }
.mk-shop-logo.mk-shop-logo-paypal { background: #efe6d2; }

.mk-shop-benefits { margin-top: 14px; } /* la tabla de beneficios ya trae su fondo: sin recuadro extra */
.mk-content .mk-shop-benefits h3 { margin: 0 0 8px; line-height: 0; }
.mk-shop-benefits p { margin: 8px 0 0; }

/* ---------- Confirmación ---------- */
.mk-shop-confirm .mk-win-body { display: flex; align-items: stretch; gap: 14px; }
.mk-shop-lines { flex: 1 1 auto; margin: 0; }
.mk-shop-lines > div { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; border-bottom: 1px dotted #3b2d1c; }
.mk-shop-lines dt { color: var(--shop-muted); }
.mk-shop-lines dd { margin: 0; color: #fff; font-weight: bold; text-align: right; }
.mk-shop-lines-total dd { color: var(--shop-gold-hi); font-size: 14px; }
.mk-shop-total {
	flex: 0 0 210px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
	padding: 10px; border: 1px solid #000; outline: 1px solid #5e4526; outline-offset: -2px; background: #0d0a07;
	text-align: center;
}
.mk-shop-total > span { color: var(--shop-muted); font-size: 11px; font-weight: bold; }
.mk-shop-total strong { font: bold 20px/1.2 Arial, sans-serif; color: var(--shop-gold-hi); }
.mk-shop-total small { color: var(--shop-muted); font-size: 10px; }

.mk-shop-cta-row { display: flex; justify-content: flex-end; align-items: center; gap: 16px; margin: 10px 0 0; }

/* ---------- Instrucciones de pago ---------- */
.mk-shop-review { outline-color: #b26c1f; }
.mk-shop-review .mk-win-title { background: linear-gradient(#5a3a17, #2a190b); }
.mk-shop-review:focus { box-shadow: 0 0 0 1px var(--shop-orange); }
.mk-shop-review .mk-shop-lines { margin-bottom: 10px; }
.mk-shop-instructions { margin: 0; padding: 8px 10px; border-left: 2px solid #8a6331; background: #0d0a07; }

/* ¿Cómo recibís tu compra?: usa .mk-steps (ventanas.css) */
.mk-shop-footnote { margin: 10px 0 0; color: var(--shop-muted); font-size: 10px; }