/* ==========================================================================
   OBSERVATORIO DE EDUCACIÓN SUPERIOR (OES) — ESTILOS GLOBALES & TEMAS
   ========================================================================== */

/* 1. Reset y tipografía global */
body {
  font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background-color: #f8fafc;
  color: #1e293b;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[x-cloak] {
  display: none !important;
}

/* 2. Microinteracciones globales */
a, button {
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 3. Barras de desplazamiento sutiles y elegantes */
.overflow-y-auto::-webkit-scrollbar {
  width: 5px;
}

.overflow-y-auto::-webkit-scrollbar-track {
  background: transparent;
}

.overflow-y-auto::-webkit-scrollbar-thumb {
  background-color: #e2e8f0;
  border-radius: 10px;
}

.overflow-y-auto::-webkit-scrollbar-thumb:hover {
  background-color: #cbd5e1;
}

/* 4. Efecto Hover para Cards Institucionales */
.card-hover-effect {
  position: relative;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.2s ease;
  overflow: hidden;
  border-color: #e2e8f0;
}

.card-hover-effect:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 24px -8px rgba(15, 23, 42, 0.08), 0 4px 6px -2px rgba(15, 23, 42, 0.03);
  border-color: #cbd5e1;
}

/* 5. Acentos temáticos de 3.5px en el borde superior de cada tarjeta */
.card-hover-effect::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3.5px;
  z-index: 10;
}

.card-theme-1::before { background: linear-gradient(90deg, #3b82f6, #60a5fa); } /* Rectores & Reguladores (Azul) */
.card-theme-2::before { background: linear-gradient(90deg, #10b981, #34d399); } /* Universidades (Esmeralda) */
.card-theme-3::before { background: linear-gradient(90deg, #6366f1, #818cf8); } /* Marco Normativo (Índigo) */
.card-theme-4::before { background: linear-gradient(90deg, #a855f7, #c084fc); } /* Informes Oficiales (Púrpura) */
.card-theme-5::before { background: linear-gradient(90deg, #06b6d4, #22d3ee); } /* Redes Sociales (Cian) */
.card-theme-6::before { background: linear-gradient(90deg, #f43f5e, #fb7185); } /* Designaciones (Rosa) */
.card-theme-7::before { background: linear-gradient(90deg, #0284c7, #38bdf8); } /* Internacional (Sky) */
.card-theme-chart::before { background: linear-gradient(90deg, #2563eb, #38bdf8); } /* Gráfica Chart.js */

/* 6. Mejoras en filas de noticias y sumillas */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.line-clamp-1 {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Card 8: Menciones y Gráfica */
.card-theme-8, .card-theme-chart { 
  border-top: 4px solid #2563eb !important; 
}