/* ==========================================================
   Portal Monagas — Cambios 12
   Estabilidad visual: responsive, neón, loader, soporte y chat.
   Capa final: corrige conflictos sin cambiar la identidad visual.
   ========================================================== */

*,*::before,*::after{box-sizing:border-box}
html{width:100%;min-width:0;scrollbar-gutter:stable}
body{width:100%;min-width:0;overflow-x:hidden}
main,#contenido,section,.container{min-width:0}

/* Loader: siempre ocupa el viewport y nunca deja ver el contenido detrás. */
#portalLoader.portal-loader{
  position:fixed!important;
  inset:0!important;
  z-index:50000!important;
  min-width:100vw!important;
  min-height:100dvh!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  padding:28px 20px!important;
  background:#f7fbfe!important;
  overflow:hidden!important;
}
html:not(.portal-loading) #portalLoader:not(.is-active){pointer-events:none}
.portal-loader-core{position:relative!important;margin:0 0 26px!important}
.portal-loader-copy{width:min(420px,calc(100vw - 40px));min-height:0!important;margin:0!important;padding:0 8px!important}
.portal-loader-copy strong,.portal-loader-copy span{position:relative!important;inset:auto!important;transform:none!important}
.portal-loader-track{width:min(280px,70vw)!important;margin:18px auto 0!important}

/* Header: evita compresión, saltos y mezcla de vistas. */
.header,.topbar{width:100%}
.header-inner{min-width:0}
.brand{flex:0 1 230px;min-width:170px!important}
.brand img{width:min(230px,100%)!important;height:auto!important}
.header-actions{flex:0 0 auto;min-width:max-content}

@media (min-width:1241px){
  .main-nav{min-width:0!important}
  #nav.nav{min-width:0!important;flex-wrap:nowrap!important}
  #nav .nav-link{font-size:clamp(.72rem,.62vw,.82rem)!important;padding:10px clamp(7px,.58vw,11px)!important}
  body.mobile-nav-open{overflow:auto!important}
}

@media (max-width:1240px){
  .main-nav{width:0!important;flex:0 0 0!important;min-width:0!important}
  #nav.nav{
    position:absolute!important;
    top:calc(100% + 8px)!important;
    left:16px!important;
    right:16px!important;
    width:auto!important;
    max-width:none!important;
    max-height:calc(100dvh - 132px)!important;
    padding:14px!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    z-index:21000!important;
  }
  #nav.nav.open{display:flex!important}
  #nav .nav-link{min-height:48px!important;font-size:.92rem!important}
  body.mobile-nav-open{overflow:hidden!important}
  body.mobile-nav-open::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:20500;
    background:rgba(4,18,29,.28);
    backdrop-filter:blur(3px);
    pointer-events:none;
  }
  .header{z-index:20600!important}
  .topbar{z-index:20700!important}
  #hambBtn{z-index:21100!important}
}

@media (max-width:720px){
  .header-inner{height:76px!important;gap:10px!important}
  .brand{flex-basis:min(176px,55vw)!important;min-width:0!important}
  .header-actions{gap:6px!important}
  #nav.nav{top:calc(100% + 6px)!important;left:10px!important;right:10px!important;max-height:calc(100dvh - 92px)!important}
  .topbar{position:relative!important}
}

/* Neón: elevar sin agrandar la caja. Evita recortes y saltos de layout. */
.neon-tilt,.card,.secretaria-card,.direction-item,.system-card,.sistema-card,
.featured-news-card,.home-gallery-item,.info-item,.system-row,.service-item{
  transform-origin:center center;
  backface-visibility:hidden;
}
.neon-tilt:hover,
.card:hover,.secretaria-card:hover,.direction-item:hover,.system-card:hover,.sistema-card:hover,
.featured-news-card:hover,.home-gallery-item:hover,.info-item:hover,.system-row:hover,.service-item:hover{
  transform:translate3d(0,-7px,0)!important;
}
.grid-5,.grid-4,.grid-3,.grid-2,.secretarias-grid,.sistemas-grid,.direction-list,
.service-list,.detail-grid,.home-gallery-strip{padding-top:10px;padding-bottom:18px}

/* No cortar glows en wrappers de contenido. */
.page-box,.card,.secretaria-card,.direction-item,.system-card,.sistema-card,.service-item{
  overflow:visible;
}
.card img,.secretaria-card img,.direction-item img,.system-card img,.sistema-card img{
  border-radius:inherit;
}

/* Botones y controles: geometría estable + contraste. */
.btn,.card-link,.chat-suggestion,.search-row button,.form button{
  min-width:0;
  min-height:44px;
  padding-block:11px!important;
  line-height:1.25!important;
  overflow-wrap:anywhere;
}
.btn-primary,.header-access,button.btn-primary,a.btn-primary{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
.btn-primary i,.header-access i{color:#fff!important}

/* Carrusel: pantalla completa, proporción intacta y sin filtros que resten nitidez. */
.home-hero-carousel,.home-hero-slide{overflow:hidden!important;isolation:isolate}
.home-hero-slide img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center center!important;
  transform:none!important;
  filter:none!important;
  border-radius:0!important;
  image-rendering:auto!important;
}

/* Chatbot: el botón es transparente y el glow sigue la silueta del PNG. */
#chatAssistant{max-width:calc(100vw - 16px)}
#chatAssistant .chat-btn{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  border-radius:0!important;
  overflow:visible!important;
}
#chatAssistant .chat-btn::after{display:none!important}
#chatAssistant .chat-btn img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  filter:drop-shadow(0 10px 10px rgba(7,48,78,.22)) drop-shadow(0 0 10px rgba(116,193,235,.34))!important;
}
#chatAssistant .chat-window{
  max-width:min(400px,calc(100vw - 20px))!important;
  max-height:calc(100dvh - 118px)!important;
  min-width:0!important;
  overflow:hidden!important;
}
#chatAssistant .chat-head{min-width:0}
#chatAssistant .chat-head>div{min-width:0}
#chatAssistant .chat-head strong,#chatAssistant .chat-head span{overflow-wrap:anywhere}
#chatAssistant .bubble{overflow-wrap:anywhere;word-break:normal}
@media(max-width:680px){
  #chatAssistant{right:8px!important;bottom:8px!important}
  #chatAssistant .chat-btn{width:62px!important;height:76px!important}
  #chatAssistant .chat-window{right:0!important;left:auto!important;top:auto!important;bottom:82px!important;width:calc(100vw - 16px)!important;max-height:calc(100dvh - 100px)!important;border-radius:20px!important}
}

/* Soporte técnico: corrige geometría del robot, tarjetas y formulario. */
.support-hero-card{align-items:center!important;overflow:visible!important}
.support-hero-card>div{min-width:0}
.support-robot{
  width:100%!important;
  min-height:260px!important;
  display:grid!important;
  place-items:center!important;
  padding:20px!important;
  overflow:visible!important;
}
.support-robot img{
  width:auto!important;
  height:auto!important;
  max-width:min(220px,78%)!important;
  max-height:240px!important;
  object-fit:contain!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  filter:drop-shadow(0 16px 18px rgba(9,52,82,.18))!important;
}
.service-list{align-items:stretch}
.service-item{height:100%;min-height:0!important;overflow:visible!important}
.service-item>div{min-width:0}
.service-item i{flex-shrink:0}
#formulario-soporte .form{width:100%;min-width:0}
#formulario-soporte .form>*{min-width:0;max-width:100%}
#formulario-soporte input,#formulario-soporte select,#formulario-soporte textarea{width:100%;max-width:100%;min-width:0}
#formulario-soporte input[type=file]{white-space:normal}
#formulario-soporte .privacy-consent{gap:12px!important;align-items:flex-start!important}
#formulario-soporte .privacy-consent input{width:auto!important;flex:0 0 auto;margin-top:3px}
#formulario-soporte .privacy-consent span{min-width:0}
@media(max-width:980px){
  .support-hero-card{grid-template-columns:1fr!important}
  .support-robot{max-width:320px!important;margin-inline:auto!important;min-height:220px!important}
}

/* Textos y tablas nunca deben escapar del viewport. */
h1,h2,h3,h4,p,li,td,th,label,.breadcrumb,.mini-title{overflow-wrap:anywhere}
table{max-width:100%}
.table-wrap,.admin-table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}

/* Accesibilidad: sin transformaciones si el usuario reduce movimiento. */
@media(prefers-reduced-motion:reduce){
  .neon-tilt:hover,.card:hover,.secretaria-card:hover,.direction-item:hover,.system-card:hover,
  .sistema-card:hover,.service-item:hover{transform:none!important}
}


/* Cambios 23 — Loader móvil robusto y liviano. */
@media (max-width:720px){
  #portalLoader.portal-loader{
    min-height:100vh!important;
    min-height:100svh!important;
    padding:22px 16px!important;
  }
  #portalLoader.portal-loader::before,
  #portalLoader.portal-loader::after{animation:none!important;}
  #portalLoader .portal-loader-orbit{
    box-shadow:none!important;
    animation-duration:2.2s!important;
  }
  #portalLoader .portal-loader-orbit.orbit-b{display:none!important;}
  #portalLoader .portal-loader-track span{animation-duration:1.5s!important;}
  #portalLoader .portal-loader-core{margin-bottom:20px!important;}
}


/* Cambios 24 — Hotfix loader móvil de producción.
   La interfaz móvil nunca queda bloqueada por el loader aunque un CDN,
   una imagen, una fuente o un módulo JavaScript no termine de cargar. */
@media (max-width:720px){
  html.portal-loading,
  html.portal-loading body{
    overflow-x:hidden!important;
    overflow-y:auto!important;
  }
  #portalLoader.portal-loader.is-active{
    animation:portalMobileFailsafeHide .001s linear 1.8s forwards!important;
  }
  @keyframes portalMobileFailsafeHide{
    to{opacity:0;visibility:hidden;pointer-events:none}
  }
}


/* Cambios 24 — Identificadores internos de contenido ocultos en toda la interfaz pública. */
body:not(.admin-page) .identifier-badge,
body:not(.admin-page) .record-identity .identifier-badge{
  display:none!important;
}


/* Cambios 25 — Android/móvil: el loader no puede bloquear el portal. */
@media (max-width:900px){
  html.portal-loading,
  html.portal-loading body{overflow-x:hidden!important;overflow-y:auto!important}
  #portalLoader,
  #portalLoader.portal-loader,
  #portalLoader.portal-loader.is-active{
    display:none!important;opacity:0!important;visibility:hidden!important;
    pointer-events:none!important;animation:none!important
  }
}


/* ==========================================================
   Cambios 26 — Móvil ultra estable / Android performance
   ========================================================== */
@media (max-width:900px){
  html.portal-mobile-fast,
  html.portal-mobile-fast body{
    scroll-behavior:auto!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
  }

  html.portal-mobile-fast body * ,
  html.portal-mobile-fast body *::before,
  html.portal-mobile-fast body *::after{
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }

  html.portal-mobile-fast #portalLoader,
  html.portal-mobile-fast .portal-particles,
  html.portal-mobile-fast .portal-scroll-progress,
  html.portal-mobile-fast .portal-cursor-aura,
  html.portal-mobile-fast .neon-section-sweep,
  html.portal-mobile-fast .neon-ripple,
  html.portal-mobile-fast #chatAssistant .chat-nudge{
    display:none!important;
  }

  html.portal-mobile-fast .ux-reveal,
  html.portal-mobile-fast .ux-reveal.ux-visible,
  html.portal-mobile-fast .page-box,
  html.portal-mobile-fast .home-title,
  html.portal-mobile-fast .home-badge,
  html.portal-mobile-fast main section::after,
  html.portal-mobile-fast .portal-icon::after,
  html.portal-mobile-fast .secretaria-card .icon::after,
  html.portal-mobile-fast .direction-future-icon::after{
    opacity:1!important;
    filter:none!important;
    transform:none!important;
    animation:none!important;
    transition:none!important;
  }

  html.portal-mobile-fast .main-nav{
    background:#f9fcff!important;
    box-shadow:-10px 0 26px rgba(4,39,65,.12)!important;
  }
  html.portal-mobile-fast body.mobile-nav-open::after{
    background:rgba(4,24,39,.30)!important;
  }

  html.portal-mobile-fast .card,
  html.portal-mobile-fast .panel,
  html.portal-mobile-fast .service-item,
  html.portal-mobile-fast .featured-news-card,
  html.portal-mobile-fast .home-gallery-item,
  html.portal-mobile-fast .system-card,
  html.portal-mobile-fast .sistema-card,
  html.portal-mobile-fast .info-item,
  html.portal-mobile-fast .system-row{
    filter:none!important;
    transform:none!important;
    transition:border-color .15s ease,background-color .15s ease!important;
  }

  html.portal-mobile-fast main > section:not(:first-child),
  html.portal-mobile-fast footer{
    content-visibility:auto;
    contain-intrinsic-size:1px 720px;
  }

  html.portal-mobile-fast img{
    image-rendering:auto;
  }

  html.portal-mobile-fast #chatAssistant .chat-btn{
    touch-action:manipulation!important;
    will-change:auto!important;
    filter:none!important;
  }
  html.portal-mobile-fast #chatAssistant .chat-btn img{
    filter:none!important;
    transform:none!important;
  }
  html.portal-mobile-fast #chatAssistant .chat-window{
    box-shadow:none!important;
  }

  html.portal-mobile-fast a,
  html.portal-mobile-fast button,
  html.portal-mobile-fast input,
  html.portal-mobile-fast select,
  html.portal-mobile-fast textarea{
    touch-action:manipulation;
  }
}

@media (max-width:900px) and (hover:none){
  .card:hover,.home-gallery-item:hover,.featured-news-card:hover,.sistema-card:hover,.info-item:hover,.system-row:hover,
  .neon-tilt:hover,.secretaria-card:hover,.direction-item:hover,.system-card:hover,.service-item:hover{
    transform:none!important;
    filter:none!important;
  }
}