/* Estilos complementarios para Plataforma ENLACES - Escuela América Marchigüe */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background-color: #f8fafc;
}

/* Transiciones suaves */
.transition-card {
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.transition-card:hover {
  transform: translateY(-2px);
}

/* Scrollbar personalizado */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #f1f5f9;
}
::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* Animación de pulso para modo escáner */
@keyframes scannerPulse {
  0% { transform: scale(1); opacity: 0.8; }
  50% { transform: scale(1.03); opacity: 1; }
  100% { transform: scale(1); opacity: 0.8; }
}

.scanner-active-border {
  animation: scannerPulse 2s infinite ease-in-out;
}

/* Estilos de impresión para etiquetas A4 y Credenciales */
@media print {
  * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* Ocultar elementos de navegación y UI que no van a la hoja */
  header, nav, #subdomain-banner, .no-print, button, .modal, #toast-container,
  #view-sala, #view-tablets, #view-kiosko, #view-ajustes {
    display: none !important;
  }

  body, html {
    background: white !important;
    color: #0f172a !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;
  }

  /* El contenedor principal DEBE ser visible para que se imprima su contenido */
  #main-content {
    display: block !important;
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  #view-impresion {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
  }

  #print-output-container {
    display: block !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
  }

  /* Grid de etiquetas de tablets para hoja A4 / Carta */
  .labels-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 10px !important;
    width: 100% !important;
    page-break-inside: auto !important;
  }

  .label-card {
    border: 1.5px dashed #475569 !important;
    border-radius: 8px !important;
    padding: 8px 6px !important;
    text-align: center !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    background: white !important;
  }

  /* Grid de credenciales docentes en A4 / Carta */
  .cards-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
    width: 100% !important;
    page-break-inside: auto !important;
  }

  .teacher-id-card {
    border: 2px solid #0f172a !important;
    border-radius: 12px !important;
    padding: 14px !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    background: white !important;
  }

  /* Ocultar tarjetas deseleccionadas al imprimir */
  .print-unselected {
    display: none !important;
  }
}

/* Estado deseleccionado en pantalla */
.print-unselected {
  opacity: 0.35;
  filter: grayscale(0.9);
  transition: all 0.2s ease;
}