/* GokieBox - ajustes propios de estilo (fuera de ThorBound.min.css) */
/* Badges de bonus del lobby: quedaban debajo del avatar de fondo (.AniObject, z-index 1)
   y, con las etiquetas largas, el amarillo (+10% GP de plus10gp) pisaba al rojo (PU +10% GP). */
#myPUGP, #myPUG, #myPlusGP { z-index: 5; white-space: nowrap; }
#myPlusGP { right: 78px; }
/* Pantalla de login: el lobby se oculta para que se vea la portada completa (escena entera, nada la tapa).
   La clase body.gk-login la pone gokiebox.js mientras #LoginWindowBG esté visible. */
body.gk-login #channelScreen, body.gk-login #buddydiv, body.gk-login #guilddiv { visibility: hidden !important; }
body.gk-login { background-image: url(/static/images/themes/classicHD/bg_full_gk_batalla.webp) !important; }
/* Pie legal del login (#gk-login-footer, dentro de #LoginWindowBG): una sola linea con Terminos de uso y
   Politica de privacidad. Vive dentro del fondo del login, asi que solo se ve mientras el login esta visible
   (misma condicion que body.gk-login). Sustituye a #toslink/#pplink (bajo el formulario) y #toslink2/#pplink2
   (panel de rankings), ya retirados de index.handlebars. */
#gk-login-footer {
  position: absolute; left: 0; right: 0; bottom: calc(10px + env(safe-area-inset-bottom, 0px));
  text-align: center; font-size: 11px; line-height: 16px; color: #fff; opacity: .85;
  font-family: 'lucida grande', tahoma, verdana, arial, sans-serif; white-space: nowrap; pointer-events: none;
}
#gk-login-footer a { color: #fff; text-decoration: none; pointer-events: auto; }
#gk-login-footer a:hover { text-decoration: underline; }
#gk-login-footer .gk-sep { margin: 0 8px; }
/* Modal de textos legales (#gk-legal): lo abren los enlaces del pie del login (gokiebox.js lo crea bajo <body>,
   fuera de #container para que no le afecte la escala del juego). Linea grafica "Gokie Dorado"
   (images/themes/gokie/paleta.json): fondo #190D0C, borde #FAB944, titulo #FCC448, texto crema #FFF3D6. */
#gk-legal {
  position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center;
  padding: 24px; box-sizing: border-box; background: rgba(8, 4, 3, .72);
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
  opacity: 0; transition: opacity 150ms ease-out;
}
#gk-legal.gk-abierto { opacity: 1; }
#gk-legal .gk-legal-panel {
  position: relative; display: flex; flex-direction: column; width: 100%; max-width: 720px; height: 80%; max-height: 80vh;
  background: rgba(25, 13, 12, .92); border: 2px solid #FAB944; border-radius: 12px; box-sizing: border-box;
  box-shadow: 0 0 0 1px rgba(25, 13, 12, .9), 0 0 22px rgba(250, 185, 68, .32), 0 18px 48px rgba(0, 0, 0, .65);
  color: #FFF3D6; transform: translateY(12px) scale(.98); transition: transform 150ms ease-out;
}
#gk-legal.gk-abierto .gk-legal-panel { transform: none; }
#gk-legal .gk-legal-cab { flex: 0 0 auto; padding: 18px 56px 12px 28px; border-bottom: 1px solid rgba(250, 185, 68, .35); }
#gk-legal .gk-legal-titulo { margin: 0; font-size: 22px; line-height: 1.25; font-weight: bold; color: #FCC448; text-shadow: 0 1px 2px rgba(0, 0, 0, .6); }
#gk-legal .gk-legal-fecha { margin: 4px 0 0; font-size: 12px; color: #FAB944; opacity: .8; min-height: 1em; }
#gk-legal .gk-legal-x {
  position: absolute; top: 12px; right: 12px; width: 32px; height: 32px; padding: 0; border: 1px solid rgba(250, 185, 68, .55);
  border-radius: 8px; background: rgba(99, 33, 9, .55); color: #FCC448; cursor: pointer; font: bold 20px/30px arial, sans-serif; text-align: center;
}
#gk-legal .gk-legal-x:hover, #gk-legal .gk-legal-x:focus { background: #632109; border-color: #FCC448; outline: none; }
#gk-legal .gk-legal-cuerpo {
  flex: 1 1 auto; overflow-y: auto; padding: 16px 28px 20px; font-size: 16px; line-height: 1.6; color: #FFF3D6;
  -webkit-overflow-scrolling: touch; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #F89E32 rgba(99, 33, 9, .4);
  -webkit-user-select: text; user-select: text;
}
#gk-legal .gk-legal-cuerpo::-webkit-scrollbar { width: 10px; }
#gk-legal .gk-legal-cuerpo::-webkit-scrollbar-track { background: rgba(99, 33, 9, .4); border-radius: 5px; }
#gk-legal .gk-legal-cuerpo::-webkit-scrollbar-thumb { background: #F89E32; border-radius: 5px; }
#gk-legal .gk-legal-cuerpo h2 { margin: 22px 0 8px; font-size: 18px; line-height: 1.3; color: #FCC448; }
#gk-legal .gk-legal-cuerpo h2:first-child { margin-top: 0; }
#gk-legal .gk-legal-cuerpo h3 { margin: 16px 0 6px; font-size: 16px; color: #FAB944; }
#gk-legal .gk-legal-cuerpo p { margin: 0 0 12px; }
#gk-legal .gk-legal-cuerpo ul { margin: 0 0 12px; padding-left: 22px; }
#gk-legal .gk-legal-cuerpo li { margin: 0 0 6px; }
#gk-legal .gk-legal-cuerpo a { color: #60AC9B; text-decoration: underline; }
#gk-legal .gk-legal-cuerpo a:hover { color: #FCC448; }
#gk-legal .gk-legal-cuerpo strong { color: #FFF3D6; font-weight: bold; }
#gk-legal .gk-legal-estado { color: #FAB944; opacity: .85; font-style: italic; }
#gk-legal .gk-legal-pie { flex: 0 0 auto; padding: 12px 28px 16px; border-top: 1px solid rgba(250, 185, 68, .35); text-align: right; }
#gk-legal .gk-legal-cerrar {
  padding: 8px 26px; border: 1px solid #FAB944; border-radius: 8px; cursor: pointer; font: bold 14px/1.3 'lucida grande', tahoma, verdana, arial, sans-serif;
  color: #190D0C; background: linear-gradient(#FCC448, #F89E32); box-shadow: 0 2px 6px rgba(0, 0, 0, .45);
}
#gk-legal .gk-legal-cerrar:hover, #gk-legal .gk-legal-cerrar:focus { background: linear-gradient(#FFE08A, #FCC448); outline: none; }
@media (max-width: 600px), (max-height: 520px) {
  #gk-legal { padding: 8px; }
  #gk-legal .gk-legal-panel { max-width: none; height: 100%; max-height: calc(100vh - 16px); max-height: calc(100dvh - 16px); border-radius: 10px; }
  #gk-legal .gk-legal-cab { padding: 14px 52px 10px 16px; }
  #gk-legal .gk-legal-titulo { font-size: 19px; }
  #gk-legal .gk-legal-cuerpo { padding: 12px 16px 16px; font-size: 15px; }
  #gk-legal .gk-legal-pie { padding: 10px 16px 12px; }
}
