/* =========================================================
   K-8 Mobile FINAL v1 · SPCyPD
   Capa de compatibilidad: manda sobre los controles móviles
   anteriores sin tocar el motor K-8 de escritorio.
   ========================================================= */

/* Oculta controles de intentos móviles anteriores para que no compitan. */
.k8-mobile-hide,
.k8-mini-actions,
#k8-mobile-toggle,
#k8-show-mobile{
  display:none !important;
}

#k8-final-hide,
#k8-final-show{
  display:none;
}

@media (max-width:860px), (hover:none) and (pointer:coarse){
  #k8-assistant{
    width:98px !important;
    height:108px !important;
    bottom:calc(18px + env(safe-area-inset-bottom)) !important;
    z-index:72 !important;
    margin:0 !important;
    transition:opacity .18s ease !important;
  }

  /* Estas clases tienen prioridad incluso si quedó CSS de pruebas anteriores. */
  #k8-assistant.k8-final-left{
    left:max(6px,env(safe-area-inset-left)) !important;
    right:auto !important;
  }
  #k8-assistant.k8-final-right{
    right:max(6px,env(safe-area-inset-right)) !important;
    left:auto !important;
  }

  #k8-assistant .k8-stage{
    overflow:visible !important;
  }

  #k8-assistant .k8-sprite{
    position:absolute !important;
    width:160px !important;
    height:175px !important;
    top:auto !important;
    bottom:0 !important;
    transform:scale(.61) !important;
    filter:none !important;
  }

  #k8-assistant.k8-final-right .k8-sprite{
    right:0 !important;
    left:auto !important;
    transform-origin:right bottom !important;
  }
  #k8-assistant.k8-final-left .k8-sprite{
    left:0 !important;
    right:auto !important;
    transform-origin:left bottom !important;
  }

  #k8-assistant .k8-holo{
    left:12px !important;
    right:12px !important;
    bottom:1px !important;
    height:13px !important;
    filter:none !important;
    opacity:.40 !important;
  }

  #k8-assistant .k8-bubble{
    bottom:74px !important;
    max-width:min(178px,calc(100vw - 116px)) !important;
    font-size:10.5px !important;
    padding:8px 10px !important;
  }
  #k8-assistant.k8-final-right .k8-bubble{
    right:82px !important;
    left:auto !important;
    border-radius:13px 13px 4px 13px !important;
  }
  #k8-assistant.k8-final-left .k8-bubble{
    left:82px !important;
    right:auto !important;
    border-radius:13px 13px 13px 4px !important;
  }

  #k8-final-hide{
    display:grid;
    position:absolute;
    width:30px;
    height:30px;
    top:0;
    border-radius:999px;
    border:1px solid rgba(212,177,90,.60);
    background:rgba(10,14,22,.96);
    color:#F0DBA6;
    place-items:center;
    padding:0;
    font:700 18px/1 system-ui,sans-serif;
    box-shadow:0 5px 14px rgba(0,0,0,.34);
    z-index:10;
    pointer-events:auto;
    touch-action:manipulation;
  }
  #k8-assistant.k8-final-right #k8-final-hide{right:0;left:auto}
  #k8-assistant.k8-final-left #k8-final-hide{left:0;right:auto}

  #k8-final-show{
    position:fixed;
    bottom:calc(18px + env(safe-area-inset-bottom));
    z-index:73;
    min-width:48px;
    min-height:42px;
    padding:8px 11px;
    border-radius:999px;
    border:1px solid rgba(212,177,90,.58);
    background:rgba(10,14,22,.96);
    color:#F0DBA6;
    align-items:center;
    justify-content:center;
    font:700 12px/1 system-ui,sans-serif;
    box-shadow:0 7px 20px rgba(0,0,0,.34);
    touch-action:manipulation;
  }
  #k8-final-show.k8-final-visible{display:inline-flex}
  #k8-final-show.k8-final-show-left{left:max(8px,env(safe-area-inset-left));right:auto}
  #k8-final-show.k8-final-show-right{right:max(8px,env(safe-area-inset-right));left:auto}

  #k8-assistant.k8-final-user-hidden{
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
  }

  /* Los paneles importantes tienen prioridad sobre la mascota. */
  body.rec-drawer-body-open #k8-assistant,
  body.estado-body-open #k8-assistant,
  body.rec-drawer-body-open #k8-final-show,
  body.estado-body-open #k8-final-show{
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
  }
}

@media(min-width:861px) and (hover:hover) and (pointer:fine){
  #k8-final-hide,#k8-final-show{display:none !important}
}