/*
Theme Name: Redes Clic Lienzo
Theme URI: https://redesclic.com
Author: Redes Clic
Author URI: https://redesclic.com
Description: Tema "lienzo en blanco" para apps hechas con snippets (RC Finanzas, RC Comandas, demos). Sin cabecera, sin menús y sin barra lateral; pie de página opcional y configurable. Ancho completo. Colores, ancho y márgenes se configuran en Apariencia → Personalizar → Lienzo Redes Clic, y cada página puede tener su propio color de fondo.
Version: 1.1.0
Requires at least: 5.8
Requires PHP: 7.4
License: GPLv2 or later
Text Domain: redesclic-lienzo
*/

html, body { margin: 0; padding: 0; }
*, *::before, *::after { box-sizing: border-box; }
body {
	background: var(--rcl-fondo, #0b0d13);
	color: var(--rcl-texto, #eef1f8);
	font-family: var(--rcl-fuente, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif);
	font-size: 16px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}
a { color: var(--rcl-enlace, #22d3ff); }
img, video, iframe { max-width: 100%; height: auto; }

.rcl-lienzo {
	flex: 1 0 auto;
	width: 100%;
	max-width: var(--rcl-ancho, 100%);
	margin: 0 auto;
	padding: var(--rcl-pad-v, 12px) var(--rcl-pad-h, 12px);
}
.rcl-titulo { margin: 0 0 16px; font-size: 26px; }
.rcl-contenido > *:first-child { margin-top: 0; }
.rcl-contenido > *:last-child { margin-bottom: 0; }

/* Bloques de WordPress a ancho completo */
.rcl-contenido .alignfull, .rcl-contenido .alignwide { width: 100%; max-width: 100%; }
.rcl-contenido .wp-block-shortcode { margin: 0; }

.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); }

/* Pie de página opcional */
.rcl-pie {
	flex-shrink: 0;
	background: var(--rcl-pie-fondo, #070910);
	color: var(--rcl-pie-texto, #8e96aa);
	font-size: 13px;
	line-height: 1.5;
	padding: 18px var(--rcl-pad-h, 12px) calc(18px + env(safe-area-inset-bottom));
	border-top: 2px solid var(--rcl-pie-linea, transparent);
}
.rcl-pie-in { max-width: var(--rcl-ancho, 100%); margin: 0 auto; display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; justify-content: var(--rcl-pie-alin, center); text-align: var(--rcl-pie-talin, center); }
.rcl-pie a { color: var(--rcl-pie-enlace, #c6ff00); text-decoration: none; font-weight: 600; }
.rcl-pie a:hover { text-decoration: underline; }
.rcl-pie p { margin: 0; }
.rcl-pie-wa { display: inline-flex; align-items: center; gap: 6px; background: #25d366; color: #fff !important; padding: 7px 12px; border-radius: 20px; font-weight: 700; }
.rcl-pie-wa:hover { text-decoration: none !important; filter: brightness(1.05); }
.rcl-pie-wa svg { width: 16px; height: 16px; fill: currentColor; }