/* =======================================================
   🔷 WIN98 ISOLATED ENVIRONMENT
   Version: 2.1.0 - ENHANCED ISOLATION
   Description: Aislamiento completo del entorno Win98
   Solo se activa cuando body.win98-active está presente
   
   🚨 CRITICAL: Este archivo debe cargarse ANTES de win98.css
   🎯 Objetivo: Sobrescribir 100% de estilos Astra/Elementor
   ======================================================= */

/* ============================
   BODY - Modo Win98 Activo
   Reseteo agresivo completo
   ============================ */
body.win98-active,
body.win98-active.wp-singular,
body.win98-active.elementor-default,
body.win98-active.theme-astra {
  background: rgb(0,128,128) !important;
  background-color: rgb(0,128,128) !important;
  background-image: none !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 100vh !important;
  width: 100vw !important;
  position: relative !important;
  min-height: 100vh !important;
}

/* ============================
   VARIABLES CSS GLOBALES
   ============================ */
body.win98-active {
  --wp-admin-bar-height: 32px;
}

/* ============================
   BOX-SIZING GLOBAL
   Reseteo de modelo de caja
   ============================ */
body.win98-active *,
body.win98-active *::before,
body.win98-active *::after {
  box-sizing: border-box !important;
}

/* ============================
   ADMIN BAR COMPATIBILITY
   ============================ */
body.win98-active.admin-bar #win98-root,
body.win98-active.admin-bar [id^="win98-root-"] {
  top: var(--wp-admin-bar-height) !important;
  height: calc(100vh - var(--wp-admin-bar-height)) !important;
}

@media screen and (max-width: 782px) {
  body.win98-active {
    --wp-admin-bar-height: 46px;
  }
}

/* ============================
   ADMIN BAR COMPATIBILITY
   Ajuste de altura cuando admin bar está presente
   ============================ */
body.win98-active.admin-bar #win98-root {
  top: 32px !important;
  height: calc(100vh - 32px) !important;
}

@media screen and (max-width: 782px) {
  body.win98-active.admin-bar #win98-root {
    top: 46px !important;
    height: calc(100vh - 46px) !important;
  }
}

/* ============================
   OCULTACIÓN DE WORDPRESS
   Esconde TODOS los elementos de WP/Astra/Elementor
   ============================ */
body.win98-active .wp-site-blocks,
body.win98-active header,
body.win98-active footer,
body.win98-active .ast-container,
body.win98-active .site-content,
body.win98-active .wp-block-group,
body.win98-active .entry-content,
body.win98-active .site-header,
body.win98-active .site-footer,
body.win98-active #masthead,
body.win98-active #colophon,
body.win98-active .ast-header-break-point,
body.win98-active .ast-desktop,
body.win98-active .ast-mobile-header-wrap,
body.win98-active .ast-primary-header,
body.win98-active nav,
body.win98-active aside,
body.win98-active .elementor,
body.win98-active .elementor-widget-container,
body.win98-active [class*="elementor-"],
body.win98-active [class*="ast-"]:not([class*="win98"]) {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  height: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  position: absolute !important;
  left: -9999px !important;
}

/* ============================
   CONTENEDOR ROOT WIN98
   Pantalla completa fija
   ============================ */
body.win98-active #win98-root,
body.win98-active [id^="win98-root"] {
  width: 100vw !important;
  height: 100vh !important;
  background: rgb(0,128,128) !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 2147483647 !important;
  overflow: hidden !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ============================
   TASKBAR WIN98
   Barra inferior clásica
   ============================ */
body.win98-active .win98-taskbar,
body.win98-active .taskbar {
  background: rgb(192,192,192) !important;
  border-top: 2px solid rgb(255,255,255) !important;
  border-bottom: 2px solid rgb(64,64,64) !important;
  height: 28px !important;
  display: flex !important;
  align-items: center !important;
  padding: 2px !important;
  position: absolute !important;
  bottom: 0 !important;
  width: 100% !important;
  z-index: 2147483646 !important;
  box-sizing: border-box !important;
}

/* ============================
   DESKTOP WIN98
   Área principal del escritorio
   ============================ */
body.win98-active .desktop,
body.win98-active .win98-desktop {
  width: 100% !important;
  height: calc(100vh - 28px) !important;
  background: rgb(0,128,128) !important;
  position: relative !important;
  overflow: auto !important;
}

/* ============================
   RESETEO DE FLEXBOX/GRID
   Sobrescribe layouts de Astra/Elementor
   ============================ */
body.win98-active .desktop-icons {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, 80px) !important;
  gap: 20px !important;
  padding: 20px !important;
  align-content: start !important;
}

body.win98-active .desktop-icon {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 80px !important;
  height: auto !important;
}

/* ============================
   VENTANAS WIN98
   Estilo clásico de ventanas
   ============================ */
body.win98-active .window {
  background: rgb(192,192,192) !important;
  border: 2px outset rgb(192,192,192) !important;
  box-shadow: 2px 2px 4px rgba(0,0,0,0.3) !important;
  position: absolute !important;
}

body.win98-active .title-bar {
  background: linear-gradient(to right, rgb(0,0,128), rgb(0,0,255)) !important;
  color: white !important;
  font-weight: bold !important;
  padding: 2px 4px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  height: 18px !important;
}

/* ============================
   ICONOS DEL DESKTOP
   ============================ */
body.win98-active .desktop-icon {
  width: 64px !important;
  padding: 4px !important;
  text-align: center !important;
  color: white !important;
  text-shadow: 1px 1px 2px black !important;
  cursor: pointer !important;
}

body.win98-active .desktop-icon:hover {
  background: rgba(0,0,128,0.3) !important;
  outline: 1px dotted white !important;
}

body.win98-active .desktop-icon.selected {
  background: rgba(0,0,128,0.5) !important;
  outline: 1px dotted white !important;
}

/* ============================
   MENÚ START
   ============================ */
body.win98-active .start-menu {
  background: rgb(192,192,192) !important;
  border: 2px outset rgb(192,192,192) !important;
  box-shadow: 2px 2px 4px rgba(0,0,0,0.3) !important;
  position: absolute !important;
  bottom: 28px !important;
  left: 0 !important;
  min-width: 200px !important;
  z-index: 2147483645 !important;
}

/* ============================
   RESET DE FUENTES PARA WIN98
   ============================ */
body.win98-active,
body.win98-active * {
  font-family: 'ms_sans_serif', 'Microsoft Sans Serif', Arial, sans-serif !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
}

/* ============================
   PREVENCIÓN DE CONFLICTOS
   Resetear propiedades que podrían heredarse
   ============================ */
body.win98-active #win98-root * {
  box-sizing: border-box !important;
}

body.win98-active #win98-root a {
  text-decoration: none !important;
  color: inherit !important;
}

body.win98-active #win98-root img {
  max-width: none !important;
  height: auto !important;
}

/* ============================
   FIN DEL ARCHIVO
   ============================ */