/**
 * Mi Evento Bolivia — Planificador de Eventos.
 * Modo Aplicación a Pantalla Completa (App Mode) + Bloqueo de scroll global.
 *
 * Oculta por completo el entorno nativo de WordPress (barra de administración,
 * menú lateral, footer y avisos del admin) cuando el usuario se encuentra
 * dentro del planificador, y fija el "app shell" a exactamente 100vw x 100vh
 * para eliminar las barras de scroll nativas del navegador (inferior y lateral).
 *
 * Esta hoja SOLO se encola en la página que renderiza el shortcode
 * [pablo_ponce_wedding_planner] (ver PPWP_Module_Loader::enqueue_base_assets()),
 * por lo que no afecta al resto del área de administración de WordPress.
 *
 * ── Mapeo de los selectores genéricos de la especificación a los reales ──
 *   html, body, #wpwrap, #wpcontent, #wpbody, #wpbody-content -> nativos WP
 *   .planner-app-wrapper / #planner-main-container            -> #ppwp-wedding-planner.ppwp-wrapper
 *   .planner-module-content                                   -> .ppwp-content-area
 *   .tables-module-wrapper                                    -> .ppwp-seating (módulo Plan de Mesas)
 *
 * @package PabloPonceWeddingPlanner
 * @since   1.7.0
 */

/* =========================================================================
   1. Ocultar elementos nativos de WordPress
   ========================================================================= */
#wpadminbar,
#adminmenumain,
#adminmenuback,
#adminmenuwrap,
#wpfooter,
.notice,
.updated,
.error {
	display: none !important;
}

/* =========================================================================
   2. Bloqueo de scroll global (evita las barras nativas inferior y lateral)

   El navegador NUNCA desplaza la ventana: la página queda fija a exactamente
   100vw x 100vh. El único punto de scroll válido pasa a ser el área de
   contenido interna (.ppwp-content-area), de modo que el contenido de los
   módulos sigue siendo alcanzable sin generar barras en la ventana.

   NOTA (100vw + barra de scroll): usar `100vw` junto a un scroll vertical
   provoca una barra horizontal fantasma, porque `100vw` incluye el ancho de la
   barra. Aquí `overflow: hidden` anula todo scroll nativo, por lo que ese
   efecto desaparece por completo.
   ========================================================================= */
html,
body,
#wpwrap,
#wpcontent,
#wpbody,
#wpbody-content {
	overflow: hidden !important;
	width: 100vw !important;
	height: 100vh !important;
	margin: 0 !important;
	padding: 0 !important;
	box-sizing: border-box !important;
}

/* Contenedores nativos de WordPress: se extraen del flujo y se anclan a la
   esquina superior izquierda para que el planificador ocupe toda la pantalla. */
#wpcontent,
#wpbody-content {
	margin-left: 0 !important;
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	background: #f8fafc !important; /* Fondo limpio del planificador */
	z-index: 99999 !important;
}

/* =========================================================================
   3. Layout principal del planificador (App Shell)

   Mapeo: .planner-app-wrapper / #planner-main-container
          -> #ppwp-wedding-planner.ppwp-wrapper

   Se usa el selector con ID (mayor especificidad) para ganar en la cascada a
   la regla móvil `.ppwp-wrapper { height: auto; overflow: visible }` de
   public/css/ppwp-responsive.css (§8), manteniendo el shell acotado a la
   ventana también en pantallas pequeñas. `box-sizing: border-box` garantiza
   que el padding de 12px no sume píxeles extra al ancho/alto total (100vw).
   ========================================================================= */
#ppwp-wedding-planner.ppwp-wrapper,
.ppwp-wrapper.ppwp-dashboard-container,
.planner-app-wrapper,
#planner-main-container {
	display: flex !important;
	flex-direction: column !important;
	width: 100vw !important;
	max-width: 100vw !important;
	height: 100vh !important;
	height: 100dvh !important;
	max-height: 100vh !important;
	max-height: 100dvh !important;
	overflow: hidden !important;
	box-sizing: border-box !important;
	padding: 12px !important;
}

/* =========================================================================
   4. Área de contenido del módulo (Plan de Mesas y demás)

   Mapeo: .planner-module-content -> .ppwp-content-area

   `flex: 1 1 auto` + `min-height: 0` es CLAVE: permite que el área se encoja
   dentro del shell de altura fija y se convierta en el ÚNICO punto de scroll
   interno (overflow-y: auto). Así el contenido nunca se recorta y la ventana
   no genera barras.
   ========================================================================= */
.ppwp-content-area,
.planner-module-content {
	flex: 1 1 auto !important;
	width: 100% !important;
	max-width: 100% !important;
	min-height: 0 !important;
	height: calc(100vh - var(--ppwp-header-height, 56px)) !important;
	max-height: none !important;
	overflow-y: auto !important;
	overflow-x: hidden !important;
	box-sizing: border-box !important;
	-webkit-overflow-scrolling: touch;
}

/* =========================================================================
   5. Neutralizar la franja superior que WordPress reserva para su barra de
      administración en el front-end: WP imprime `html { margin-top: 32px !important }`.
      Como el planificador se inserta con shortcode en una página pública, esa
      franja quedaba en blanco en la parte de arriba, empujando el navbar de
      módulos hacia abajo y desalineando los overlays anclados a
      `--ppwp-header-height` (editor de notas). Aquí se anula por completo.
   ========================================================================= */
html {
	margin-top: 0 !important;
}

html.wp-toolbar {
	padding-top: 0 !important;
}

body.admin-bar {
	margin-top: 0 !important;
	padding-top: 0 !important;
}