/* SOS Centro Comercial — menú del usuario (0.9.2). Liviano: se carga en todo el sitio. */
.scc-menu,
.scc-carrito-flotante {
	--scc-menu-p: #1d4ed8;
	--scc-menu-pt: #fff;
	--scc-menu-e: #b91c1c;
	--scc-menu-et: #fff;
	--scc-menu-fondo: #fff;
	--scc-menu-texto: #0f172a;
	--scc-menu-suave: #64748b;
	--scc-menu-borde: #e2e8f0;
	--scc-menu-hover: #f1f5f9;
	font-size: 15px;
	line-height: 1.4;
	color: var(--scc-menu-texto);
}
.scc-menu *,
.scc-menu *::before,
.scc-menu *::after { box-sizing: border-box; }

/* Botón */
.scc-menu .scc-menu-boton {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 10px 16px;
	border: 0;
	border-radius: 999px;
	background: var(--scc-menu-p);
	color: var(--scc-menu-pt);
	font: inherit;
	font-weight: 600;
	letter-spacing: normal;
	text-transform: none;
	line-height: 1.2;
	cursor: pointer;
	box-shadow: 0 6px 20px rgba(15, 23, 42, .22);
	transition: transform .15s ease, box-shadow .15s ease;
	position: relative;
}
.scc-menu .scc-menu-boton:hover,
.scc-menu .scc-menu-boton:focus { background: var(--scc-menu-p); color: var(--scc-menu-pt); transform: translateY(-1px); box-shadow: 0 10px 26px rgba(15, 23, 42, .28); }
.scc-menu .scc-menu-boton:focus-visible { outline: 3px solid var(--scc-menu-e); outline-offset: 3px; }
.scc-menu .scc-menu-icono { flex: none; }
.scc-menu-punto,
.scc-menu-carrito-n {
	min-width: 20px;
	height: 20px;
	padding: 0 6px;
	border-radius: 999px;
	background: var(--scc-menu-e);
	color: var(--scc-menu-et);
	font-size: 12px;
	font-weight: 700;
	line-height: 20px;
	text-align: center;
}
.scc-menu-carrito-n { background: #fff; color: var(--scc-menu-p); }
.scc-menu-carrito-n::before { content: "🛒 "; font-size: 11px; }
.scc-menu [hidden] { display: none !important; }

/* Flotante */
.scc-menu-flotante {
	position: fixed;
	bottom: 20px;
	z-index: 99990;
}
.scc-menu-flotante.scc-menu-derecha { right: 20px; }
.scc-menu-flotante.scc-menu-izquierda { left: 20px; }
body.admin-bar .scc-menu-flotante { bottom: 20px; }

/* En línea (shortcode en un encabezado o página) */
.scc-menu-en-linea { position: relative; display: inline-block; }
.scc-menu-en-linea .scc-menu-boton { box-shadow: none; padding: 8px 14px; }

/* Panel */
.scc-menu-panel {
	position: absolute;
	width: min(340px, calc(100vw - 32px));
	max-height: min(76vh, 640px);
	display: flex;
	flex-direction: column;
	background: var(--scc-menu-fondo);
	color: var(--scc-menu-texto);
	border: 1px solid var(--scc-menu-borde);
	border-radius: 18px;
	box-shadow: 0 24px 60px rgba(15, 23, 42, .25);
	overflow: hidden;
	text-align: left;
	animation: scc-menu-entra .16s ease-out;
}
.scc-menu-flotante .scc-menu-panel { bottom: calc(100% + 12px); }
.scc-menu-flotante.scc-menu-derecha .scc-menu-panel { right: 0; }
.scc-menu-flotante.scc-menu-izquierda .scc-menu-panel { left: 0; }
.scc-menu-en-linea .scc-menu-panel { top: calc(100% + 8px); right: 0; z-index: 99990; }
@keyframes scc-menu-entra { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.scc-menu-cabecera {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 16px 12px;
	border-bottom: 1px solid var(--scc-menu-borde);
}
.scc-menu-sitio { display: block; font-size: 16px; }
.scc-menu-hola { display: block; color: var(--scc-menu-suave); font-size: 13px; }
.scc-menu .scc-menu-cerrar {
	flex: none;
	width: 32px;
	height: 32px;
	margin: 0;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 999px;
	background: var(--scc-menu-hover);
	color: var(--scc-menu-texto);
	cursor: pointer;
}
.scc-menu .scc-menu-cerrar:hover { background: var(--scc-menu-borde); color: var(--scc-menu-texto); }

.scc-menu-cuerpo { overflow-y: auto; padding: 6px 8px 8px; overscroll-behavior: contain; }
.scc-menu-seccion { padding: 6px 0; }
.scc-menu-seccion + .scc-menu-seccion { border-top: 1px solid var(--scc-menu-borde); }
.scc-menu .scc-menu-titulo {
	margin: 6px 8px 4px;
	padding: 0;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--scc-menu-suave);
	display: flex;
	align-items: baseline;
	gap: 6px;
	line-height: 1.3;
}
.scc-menu .scc-menu-titulo a { color: inherit; text-decoration: none; }
.scc-menu .scc-menu-titulo a:hover { color: var(--scc-menu-p); }
.scc-menu .scc-menu-titulo small { font-size: 11px; font-weight: 600; text-transform: none; letter-spacing: 0; padding: 1px 8px; border-radius: 999px; background: var(--scc-menu-hover); }
.scc-menu-seccion-cc .scc-menu-titulo { color: var(--scc-menu-e); }
.scc-menu-seccion ul { list-style: none; margin: 0; padding: 0; }
.scc-menu-seccion li { margin: 0; padding: 0; }
.scc-menu .scc-menu-seccion a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 9px 10px;
	border-radius: 10px;
	color: var(--scc-menu-texto);
	text-decoration: none;
	font-weight: 500;
}
.scc-menu .scc-menu-seccion a:hover,
.scc-menu .scc-menu-seccion a:focus-visible { background: var(--scc-menu-hover); color: var(--scc-menu-texto); outline: none; }
.scc-menu .scc-menu-seccion a[aria-current="page"] { background: var(--scc-menu-hover); color: var(--scc-menu-p); font-weight: 700; }
.scc-menu .scc-menu-seccion a.scc-menu-sec { color: var(--scc-menu-suave); font-size: 14px; }
.scc-menu-cuenta {
	flex: none;
	min-width: 22px;
	padding: 1px 8px;
	border-radius: 999px;
	background: var(--scc-menu-e);
	color: var(--scc-menu-et);
	font-size: 12px;
	font-weight: 700;
	text-align: center;
}
.scc-menu-cuenta-suave { background: var(--scc-menu-p); color: var(--scc-menu-pt); }

.scc-menu-pie {
	display: flex;
	gap: 8px;
	justify-content: space-between;
	padding: 10px 16px 14px;
	border-top: 1px solid var(--scc-menu-borde);
	background: #f8fafc;
	font-size: 14px;
}
.scc-menu .scc-menu-pie a { color: var(--scc-menu-p); text-decoration: none; font-weight: 600; }
.scc-menu .scc-menu-pie a:hover { text-decoration: underline; }

/* Teléfono: hoja desde abajo, a todo el ancho */
@media (max-width: 600px) {
	.scc-menu-flotante { bottom: 14px; }
	.scc-menu-flotante.scc-menu-derecha { right: 14px; }
	.scc-menu-flotante.scc-menu-izquierda { left: 14px; }
	.scc-menu-flotante .scc-menu-texto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.scc-menu-flotante .scc-menu-boton { padding: 14px; }
	.scc-menu-flotante .scc-menu-panel,
	.scc-menu-en-linea .scc-menu-panel {
		position: fixed;
		left: 8px;
		right: 8px;
		bottom: 8px;
		top: auto;
		width: auto;
		max-height: 82vh;
		border-radius: 20px;
		z-index: 99991;
	}
	.scc-menu-abierto::before {
		content: "";
		position: fixed;
		inset: 0;
		background: rgba(15, 23, 42, .35);
		z-index: 99989;
	}
	.scc-menu .scc-menu-seccion a { padding: 12px 10px; }
}

/* Carrito flotante (0.9.3): siempre abajo a la derecha */
.scc-carrito-flotante {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 99990;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 16px;
	border-radius: 999px;
	background: var(--scc-menu-p);
	color: var(--scc-menu-pt);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	box-shadow: 0 6px 20px rgba(15, 23, 42, .22);
	transition: transform .15s ease, box-shadow .15s ease;
}
.scc-carrito-flotante:hover,
.scc-carrito-flotante:focus { color: var(--scc-menu-pt); text-decoration: none; transform: translateY(-1px); box-shadow: 0 10px 26px rgba(15, 23, 42, .28); }
.scc-carrito-flotante:focus-visible { outline: 3px solid var(--scc-menu-e); outline-offset: 3px; }
.scc-carrito-flotante svg { flex: none; }
.scc-carrito-flotante-alto { bottom: 80px; }
.scc-carrito-flotante-n {
	min-width: 22px;
	height: 22px;
	padding: 0 6px;
	border-radius: 999px;
	background: var(--scc-menu-e);
	color: var(--scc-menu-et);
	font-size: 12px;
	font-weight: 700;
	line-height: 22px;
	text-align: center;
}
.scc-carrito-flotante-n[hidden] { display: none; }
.scc-carrito-salto { animation: scc-carrito-salto .45s ease; }
@keyframes scc-carrito-salto { 0% { transform: scale(1); } 35% { transform: scale(1.14); } 70% { transform: scale(.96); } 100% { transform: scale(1); } }
/* Con el carrito a la derecha, el menú del mismo lado sube (lo decide el PHP con -alto). */
@media (max-width: 600px) {
	.scc-carrito-flotante { right: 14px; bottom: 14px; padding: 14px; }
	.scc-carrito-flotante-alto { bottom: 76px; }
	.scc-carrito-flotante-texto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.scc-carrito-flotante-n { position: absolute; top: -4px; right: -4px; }
}

/* Impresión y movimiento reducido */
@media print { .scc-menu, .scc-carrito-flotante { display: none !important; } }
@media (prefers-reduced-motion: reduce) {
	.scc-menu-panel { animation: none; }
	.scc-menu .scc-menu-boton, .scc-carrito-flotante { transition: none; }
	.scc-carrito-salto { animation: none; }
}