/* TV PLAY V1.48 — accesos más claros y visor de imágenes limpio.
 * Solo afecta la tarjeta de Instalación, sus botones y la ampliación HD.
 * Se mantiene intacta la sección principal, el selector y las guías.
 */

/* 1. La guía se amplía al tocar la imagen; no mostrar ningún texto superpuesto. */
.section-install-inline .inline-install-poster-hint {
  display:none !important;
}
.section-install-inline .inline-install-poster-open {
  cursor:zoom-in;
}
.section-install-inline .inline-install-poster-open:hover {
  transform:translateY(-1px);
  filter:brightness(1.04);
}

/* 2. Mensaje corto y amable, con la acción de iniciar sesión más clara. */
.section-install-inline .inline-install-help-tip {
  border-color:rgba(65,117,170,.52);
  background:linear-gradient(145deg,rgba(9,31,55,.88),rgba(8,24,45,.92));
}
.section-install-inline .inline-install-help-tip strong {
  font-size:13px;
  font-weight:780;
  color:#f5fbff;
}
.section-install-inline .inline-install-help-tip p {
  margin-top:7px;
  color:#b8d3eb;
  font-size:12px;
  line-height:1.6;
}

/* 3. Dos botones claros: descarga y ayuda real por WhatsApp. */
.section-install-inline .inline-install-guide-actions .button.install-download-link,
.section-install-inline .inline-install-guide-actions .button.install-help-link {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:49px;
  padding:12px 14px;
  font-size:12px;
  font-weight:750;
  line-height:1.3;
  white-space:nowrap;
}
.section-install-inline .inline-install-guide-actions .install-btn-icon,
.section-install-inline .inline-install-guide-actions .install-btn-whatsapp {
  display:block;
  flex:0 0 18px;
  width:18px;
  height:18px;
  object-fit:contain;
}
.section-install-inline .inline-install-guide-actions .install-download-link .install-btn-icon {
  color:#f1fbff;
}
.section-install-inline .inline-install-guide-actions .install-help-link {
  background:rgba(14,32,55,.64);
  border:1px solid #3e6488;
  color:#f1fbff;
}
.section-install-inline .inline-install-guide-actions .install-help-link:hover {
  border-color:#69b2c5;
  background:rgba(23,58,83,.72);
}
.section-install-inline .inline-install-guide-actions .install-help-link .install-btn-whatsapp {
  filter:drop-shadow(0 0 4px rgba(58,222,146,.24));
}
.section-install-inline .inline-install-guide-actions .button > span:not(.install-link-arrow) {
  display:block;
  min-width:0;
}
.section-install-inline .inline-install-guide-actions .install-link-arrow {
  display:block;
  flex:0 0 auto;
  margin-left:auto;
  font-size:16px;
  font-weight:550;
  opacity:.86;
}
@media (max-width:1280px) {
  .section-install-inline .inline-install-guide-actions .button.install-download-link,
  .section-install-inline .inline-install-guide-actions .button.install-help-link {
    font-size:11.5px;
    padding:11px 10px;
    gap:8px;
  }
}
@media (max-width:600px) {
  .section-install-inline .inline-install-guide-actions .button.install-download-link,
  .section-install-inline .inline-install-guide-actions .button.install-help-link {
    min-height:49px;
    padding:12px 16px;
    justify-content:center;
    gap:11px;
    font-size:13px;
  }
  .section-install-inline .inline-install-guide-actions .install-link-arrow {
    margin-left:auto;
  }
}

/* 4. Visor de guía HD estilo galería: más espacio para la imagen, sin
 * borde pesado, sin barra de pie, con encabezado discreto y control de zoom.
 * Se navega verticalmente con rueda, arrastre de scroll, touch o teclado. */
.guide-lightbox {
  position:fixed;
  z-index:2000;
  inset:0;
  display:flex;
  align-items:stretch;
  justify-content:center;
  padding:0;
  background:transparent;
}
.guide-lightbox[hidden] {
  display:none !important;
}
.guide-lightbox-backdrop {
  position:absolute;
  inset:0;
  background:rgba(1,7,17,.92);
  backdrop-filter:blur(12px);
}
.guide-lightbox-dialog {
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  width:100%;
  max-width:100%;
  height:100dvh;
  min-height:0;
  max-height:100dvh;
  margin:0;
  padding:0;
  overflow:hidden;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:#f4faff;
}
.guide-lightbox-toolbar {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  flex:0 0 auto;
  width:min(calc(100% - 36px),1040px);
  min-height:67px;
  margin:12px auto 0;
  padding:10px 15px 10px 18px;
  border:1px solid rgba(103,160,205,.29);
  border-radius:14px;
  background:rgba(13,33,58,.94);
  box-shadow:0 12px 27px rgba(0,0,0,.2);
}
.guide-lightbox-heading {
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  gap:5px;
}
.guide-lightbox-eyebrow {
  display:block;
  font-size:9px;
  font-weight:850;
  letter-spacing:1.5px;
  color:#75e2ed;
  line-height:1.2;
}
.guide-lightbox-toolbar strong {
  display:block;
  max-width:100%;
  margin:0;
  color:#f2f9ff;
  font-size:15px;
  line-height:1.25;
  font-weight:780;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.guide-lightbox-controls {
  display:flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
}
.guide-lightbox-controls button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:36px;
  width:36px;
  height:36px;
  margin:0;
  padding:0;
  border:1px solid rgba(111,157,200,.43);
  border-radius:9px;
  background:rgba(24,58,89,.72);
  color:#f3f9ff;
  font-family:inherit;
  font-size:18px;
  font-weight:700;
  line-height:1;
  cursor:pointer;
  transition:border-color .15s,background .15s;
}
.guide-lightbox-controls button:hover:not(:disabled) {
  border-color:#87c9ee;
  background:rgba(33,91,135,.92);
}
.guide-lightbox-controls button:disabled {opacity:.4;cursor:default;}
.guide-lightbox-controls #guideLightboxClose {
  display:flex;
  justify-content:center;
  align-items:center;
  gap:9px;
  width:auto;
  min-width:88px;
  padding:0 13px;
  background:rgba(42,91,160,.9);
  border-color:rgba(112,171,243,.52);
  font-size:12px;
  font-weight:800;
}
.guide-lightbox-controls #guideLightboxClose:hover {
  background:rgba(47,112,199,.96);
}
.guide-lightbox-controls #guideLightboxClose svg {
  width:17px;
  height:17px;
  flex:0 0 17px;
}
.guide-lightbox-controls button:focus-visible,
.guide-lightbox-scroll:focus-visible {
  outline:2px solid #73e5ee;
  outline-offset:2px;
}
.guide-lightbox-scroll {
  display:block;
  flex:1 1 auto;
  width:min(calc(100% - 36px),1040px);
  min-height:0;
  margin:12px auto 12px;
  padding:5px 13px 34px;
  background:transparent;
  border:0;
  border-radius:12px;
  box-shadow:none;
  overflow:auto;
  overflow-anchor:none;
  overscroll-behavior:contain;
  text-align:center;
  scrollbar-width:thin;
  scrollbar-color:rgba(90,145,190,.6) transparent;
  scroll-behavior:auto;
}
.guide-lightbox-scroll::-webkit-scrollbar {width:7px;height:7px;}
.guide-lightbox-scroll::-webkit-scrollbar-track {background:transparent;}
.guide-lightbox-scroll::-webkit-scrollbar-thumb {
  border-radius:10px;
  background:rgba(92,147,190,.56);
}
.guide-lightbox-scroll img {
  display:block;
  width:min(100%,790px);
  height:auto;
  max-width:none;
  margin:0 auto;
  border:0;
  border-radius:11px;
  background:transparent;
  object-fit:contain;
  box-shadow:0 17px 45px rgba(0,0,0,.26);
}
.guide-lightbox-note {
  display:none !important;
}
@media (max-width:600px) {
  .guide-lightbox-toolbar {
    width:calc(100% - 12px);
    min-height:61px;
    margin:6px auto 0;
    padding:10px 9px 10px 12px;
    gap:7px;
    border-radius:12px;
  }
  .guide-lightbox-heading {gap:4px;}
  .guide-lightbox-eyebrow {font-size:8px;letter-spacing:.85px;}
  .guide-lightbox-toolbar strong {
    max-width:155px;
    font-size:12px;
    line-height:1.35;
  }
  .guide-lightbox-controls {gap:5px;}
  .guide-lightbox-controls button {
    min-width:33px;
    width:33px;
    height:33px;
    border-radius:9px;
    font-size:17px;
  }
  .guide-lightbox-controls #guideLightboxClose {
    min-width:34px;
    width:34px;
    height:33px;
    padding:0;
  }
  .guide-close-label {display:none;}
  .guide-lightbox-scroll {
    width:calc(100% - 12px);
    margin:8px auto 6px;
    padding:3px 4px 30px;
    border-radius:9px;
  }
  .guide-lightbox-scroll img {border-radius:9px;}
}
@media (prefers-reduced-motion:reduce) {
  .guide-lightbox-controls button {transition:none;}
}
