{"id":6629,"date":"2026-02-26T21:39:58","date_gmt":"2026-02-26T21:39:58","guid":{"rendered":"https:\/\/utla.edu.sv\/2026\/?p=6629"},"modified":"2026-04-28T22:51:31","modified_gmt":"2026-04-28T22:51:31","slug":"calendario-academico-ciclo-01-2026","status":"publish","type":"post","link":"https:\/\/utla.edu.sv\/2026\/?p=6629","title":{"rendered":"CALENDARIO ACAD\u00c9MICO CICLO 01-2026"},"content":{"rendered":"\n<!-- ====================================================\n     CALENDARIO ACAD\u00c9MICO CICLO I-2026 \u2014 UTLA\n     Bloque HTML listo para WordPress (HTML personalizado)\n==================================================== -->\n\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Be+Vietnam+Pro:wght@300;400;500;600;700;800&#038;display=swap\" rel=\"stylesheet\">\n\n<style>\n.utla-cal *, .utla-cal *::before, .utla-cal *::after {\n  box-sizing: border-box; margin: 0; padding: 0;\n}\n.utla-cal {\n  --azul:         #003153;\n  --azul-lite:    #e8eef4;\n  --burdeos:      #6d222e;\n  --burdeos-lite: #f5e8ea;\n  --burdeos-med:  #d4a0a8;\n  --celeste:      #81c3d7;\n  --verde:        #226f54;\n  --verde-lite:   #e6f2ee;\n  --amarillo:     #b07a10;\n  --amarillo-lite:#fdf3e3;\n  --gris-bg:      #f2f5f8;\n  --gris-clar:    #e5eaf1;\n  --texto:        #1c2b3a;\n  --texto-2:      #4a5f72;\n\n  font-family: 'Be Vietnam Pro', sans-serif;\n  color: var(--texto);\n  background: var(--gris-bg);\n  line-height: 1.6;\n  width: 100vw !important;\n  max-width: 100vw !important;\n  min-width: 100vw !important;\n  position: relative !important;\n  left: 50% !important;\n  right: 50% !important;\n  margin-left: -50vw !important;\n  margin-right: -50vw !important;\n  overflow-x: hidden;\n  padding-bottom: 72px;\n}\n\n\/* \u2550\u2550 HERO \u2550\u2550 *\/\n.utla-cal__hero {\n  background: var(--azul);\n  padding: 54px 6% 0;\n  position: relative;\n  overflow: hidden;\n}\n.utla-cal__hero::before {\n  content: '';\n  position: absolute; inset: 0;\n  background:\n    radial-gradient(ellipse 55% 70% at 95% 10%, rgba(129,195,215,.12) 0%, transparent 70%),\n    radial-gradient(ellipse 40% 60% at 5%  90%, rgba(109,34,46,.15)  0%, transparent 70%);\n  pointer-events: none;\n}\n.utla-cal__hero::after {\n  content: '';\n  position: absolute; top:0; right:0;\n  width: 40%; height: 100%;\n  background-image: radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px);\n  background-size: 22px 22px;\n  pointer-events: none;\n}\n.utla-cal__hero-inner {\n  max-width: 1200px; margin: 0 auto;\n  position: relative; z-index: 1;\n  display: flex; align-items: flex-end;\n  justify-content: space-between; gap: 32px;\n}\n.utla-cal__hero-text { padding-bottom: 48px; }\n.utla-cal__badge {\n  display: inline-flex; align-items: center; gap: 8px;\n  background: rgba(129,195,215,.18);\n  border: 1px solid rgba(129,195,215,.35);\n  color: var(--celeste);\n  font-size: 10.5px; font-weight: 700;\n  letter-spacing: .14em; text-transform: uppercase;\n  padding: 5px 14px; border-radius: 20px; margin-bottom: 18px;\n}\n.utla-cal__badge::before {\n  content: ''; width: 6px; height: 6px;\n  border-radius: 50%; background: var(--celeste);\n}\n.utla-cal__hero h1 {\n  font-size: clamp(24px,3.5vw,40px); font-weight: 800;\n  color: #fff; line-height: 1.1; letter-spacing: -.03em; margin-bottom: 14px;\n}\n.utla-cal__hero h1 em { font-style: normal; color: var(--celeste); }\n.utla-cal__hero-sub { font-size: 15px; color: rgba(255,255,255,.65); max-width: 500px; line-height: 1.65; }\n.utla-cal__hero-stats { display: flex; gap: 4px; padding-bottom: 48px; flex-shrink: 0; }\n.utla-cal__hero-stat {\n  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);\n  border-radius: 8px; padding: 16px 18px; text-align: center; color: #fff; min-width: 80px;\n}\n.utla-cal__hero-stat-num { font-size: 26px; font-weight: 800; letter-spacing: -.03em; line-height: 1; }\n.utla-cal__hero-stat-lbl { font-size: 10px; font-weight: 600; opacity: .6; margin-top: 4px; letter-spacing: .04em; text-transform: uppercase; }\n\n\/* \u2550\u2550 FRANJA \u2550\u2550 *\/\n.utla-cal__divider {\n  background: var(--burdeos); padding: 14px 6%;\n}\n.utla-cal__divider-inner {\n  max-width: 1200px; margin: 0 auto;\n  display: flex; align-items: center; gap: 12px;\n}\n.utla-cal__divider-icon {\n  width: 32px; height: 32px; border-radius: 6px;\n  background: rgba(255,255,255,.15);\n  display: flex; align-items: center; justify-content: center; flex-shrink: 0;\n}\n.utla-cal__divider-icon svg { width: 16px; height: 16px; fill: #fff; }\n.utla-cal__divider-text { font-size: 12px; font-weight: 600; color: rgba(255,255,255,.7); }\n.utla-cal__divider-text strong { color: #fff; }\n\n\/* \u2550\u2550 CUERPO \u2550\u2550 *\/\n.utla-cal__body {\n  max-width: 1200px; margin: 0 auto; padding: 48px 6% 0;\n}\n\n\/* Layout de dos columnas *\/\n.utla-cal__layout {\n  display: grid;\n  grid-template-columns: 1fr 380px;\n  gap: 32px;\n  align-items: start;\n}\n\n\/* \u2500\u2500 Encabezado de secci\u00f3n \u2500\u2500 *\/\n.utla-cal__section-head {\n  display: flex; align-items: center; gap: 14px; margin-bottom: 24px;\n}\n.utla-cal__section-line {\n  width: 4px; height: 36px; background: var(--burdeos); border-radius: 2px; flex-shrink: 0;\n}\n.utla-cal__section-title { font-size: 18px; font-weight: 800; color: var(--azul); letter-spacing: -.02em; }\n.utla-cal__section-sub { font-size: 13px; color: var(--texto-2); margin-top: 3px; }\n\n\/* \u2550\u2550 TIMELINE DE EVENTOS \u2550\u2550 *\/\n.utla-cal__timeline { display: flex; flex-direction: column; gap: 0; }\n\n.utla-cal__event {\n  display: flex; gap: 16px; position: relative; cursor: default;\n}\n.utla-cal__event:not(:last-child)::after {\n  content: '';\n  position: absolute;\n  left: 19px; top: 38px; bottom: 0;\n  width: 2px;\n  background: linear-gradient(to bottom, var(--gris-clar) 60%, transparent);\n}\n.utla-cal__event-left {\n  display: flex; flex-direction: column;\n  align-items: center; flex-shrink: 0; padding-top: 2px;\n}\n.utla-cal__event-dot {\n  width: 40px; height: 40px; border-radius: 50%;\n  background: #fff; border: 2px solid var(--gris-clar);\n  display: flex; align-items: center; justify-content: center;\n  flex-shrink: 0; position: relative; z-index: 1;\n  transition: background .2s, border-color .2s;\n}\n.utla-cal__event-dot svg { width: 16px; height: 16px; fill: var(--texto-2); transition: fill .2s; }\n\n.utla-cal__event:hover .utla-cal__event-dot {\n  background: var(--azul); border-color: var(--azul);\n}\n.utla-cal__event:hover .utla-cal__event-dot svg { fill: #fff; }\n\n\/* Dot activo (evento en curso hoy) *\/\n.utla-cal__event.is-active .utla-cal__event-dot {\n  background: var(--burdeos); border-color: var(--burdeos);\n}\n.utla-cal__event.is-active .utla-cal__event-dot svg { fill: #fff; }\n.utla-cal__event.is-past .utla-cal__event-dot {\n  background: var(--gris-clar); border-color: var(--gris-clar);\n}\n.utla-cal__event.is-past .utla-cal__event-dot svg { fill: #888; }\n\n.utla-cal__event-body {\n  background: #fff; border: 1px solid var(--gris-clar);\n  border-radius: 12px; padding: 14px 18px;\n  margin-bottom: 10px; flex: 1;\n  transition: box-shadow .2s, border-color .2s;\n}\n.utla-cal__event:hover .utla-cal__event-body {\n  box-shadow: 0 6px 20px rgba(0,49,83,.09);\n  border-color: var(--celeste);\n}\n.utla-cal__event.is-active .utla-cal__event-body {\n  border-color: var(--burdeos-med);\n  background: var(--burdeos-lite);\n}\n.utla-cal__event.is-past .utla-cal__event-body { opacity: .6; }\n\n.utla-cal__event-name {\n  font-size: 13.5px; font-weight: 700; color: var(--texto); line-height: 1.3;\n}\n.utla-cal__event.is-active .utla-cal__event-name { color: var(--burdeos); }\n.utla-cal__event-date {\n  font-size: 12px; color: var(--texto-2); margin-top: 4px; font-weight: 500;\n}\n.utla-cal__event-tag {\n  display: inline-block;\n  font-size: 10px; font-weight: 700; letter-spacing: .08em;\n  text-transform: uppercase; padding: 2px 8px;\n  border-radius: 4px; margin-top: 6px;\n}\n.utla-cal__event-tag.en-curso  { background: var(--burdeos-lite); color: var(--burdeos); }\n.utla-cal__event-tag.proximo   { background: var(--amarillo-lite); color: var(--amarillo); }\n.utla-cal__event-tag.pasado    { background: var(--gris-clar);     color: #666; }\n\n\/* \u2550\u2550 CALENDARIO INTERACTIVO \u2550\u2550 *\/\n.utla-cal__widget {\n  position: sticky;\n  top: 24px;\n}\n.utla-cal__widget-card {\n  background: #fff;\n  border: 1px solid var(--gris-clar);\n  border-radius: 16px;\n  overflow: hidden;\n  margin-bottom: 16px;\n}\n.utla-cal__widget-head {\n  background: var(--azul);\n  padding: 18px 20px;\n  display: flex; align-items: center; justify-content: space-between;\n}\n.utla-cal__widget-month {\n  font-size: 16px; font-weight: 800; color: #fff; letter-spacing: -.02em;\n}\n.utla-cal__widget-nav {\n  display: flex; gap: 4px;\n}\n.utla-cal__nav-btn {\n  width: 30px; height: 30px; border-radius: 6px;\n  background: rgba(255,255,255,.12); border: none; cursor: pointer;\n  display: flex; align-items: center; justify-content: center;\n  color: #fff; font-size: 14px; font-weight: 700;\n  transition: background .15s;\n  font-family: 'Be Vietnam Pro', sans-serif;\n}\n.utla-cal__nav-btn:hover { background: rgba(255,255,255,.25); }\n\n.utla-cal__grid-head {\n  display: grid; grid-template-columns: repeat(7,1fr);\n  background: var(--azul-lite);\n}\n.utla-cal__grid-head span {\n  text-align: center; font-size: 10px; font-weight: 700;\n  color: var(--texto-2); letter-spacing: .06em;\n  text-transform: uppercase; padding: 8px 2px;\n}\n.utla-cal__grid-days {\n  display: grid; grid-template-columns: repeat(7,1fr);\n  gap: 1px; background: var(--gris-clar); padding: 1px;\n}\n.utla-cal__day {\n  background: #fff; aspect-ratio: 1;\n  display: flex; flex-direction: column;\n  align-items: center; justify-content: center;\n  font-size: 12px; font-weight: 600; color: var(--texto-2);\n  cursor: pointer; position: relative;\n  transition: background .15s;\n  min-height: 40px;\n}\n.utla-cal__day:hover { background: var(--azul-lite); color: var(--azul); }\n.utla-cal__day.empty { background: #fafbfd; cursor: default; }\n.utla-cal__day.other-month { color: #ccc; }\n\n\/* Hoy *\/\n.utla-cal__day.is-today {\n  background: var(--azul) !important;\n  color: #fff !important;\n  font-weight: 800;\n}\n\n\/* Tiene evento *\/\n.utla-cal__day.has-event::after {\n  content: '';\n  position: absolute;\n  bottom: 5px;\n  width: 5px; height: 5px;\n  border-radius: 50%;\n  background: var(--burdeos);\n}\n.utla-cal__day.is-today.has-event::after { background: var(--celeste); }\n\n\/* Rango *\/\n.utla-cal__day.in-range {\n  background: var(--burdeos-lite) !important;\n  color: var(--burdeos) !important;\n}\n.utla-cal__day.range-start, .utla-cal__day.range-end {\n  background: var(--burdeos) !important;\n  color: #fff !important;\n}\n.utla-cal__day.range-start.range-end {\n  background: var(--burdeos) !important;\n}\n\n\/* Panel de evento del d\u00eda seleccionado *\/\n.utla-cal__day-detail {\n  padding: 16px 20px;\n  border-top: 1px solid var(--gris-clar);\n  min-height: 70px;\n}\n.utla-cal__day-detail-empty {\n  font-size: 12.5px; color: var(--texto-2);\n  text-align: center; padding: 20px 0;\n  font-style: italic;\n}\n.utla-cal__day-detail-item {\n  display: flex; gap: 10px; align-items: flex-start;\n  padding: 8px 0; border-bottom: 1px solid var(--gris-clar);\n}\n.utla-cal__day-detail-item:last-child { border-bottom: none; padding-bottom: 0; }\n.utla-cal__day-detail-dot {\n  width: 8px; height: 8px; border-radius: 50%;\n  background: var(--burdeos); margin-top: 5px; flex-shrink: 0;\n}\n.utla-cal__day-detail-text {\n  font-size: 12.5px; font-weight: 600; color: var(--texto); line-height: 1.4;\n}\n.utla-cal__day-detail-date {\n  font-size: 11px; color: var(--texto-2); margin-top: 2px;\n}\n\n\/* Leyenda *\/\n.utla-cal__legend {\n  background: #fff; border: 1px solid var(--gris-clar);\n  border-radius: 12px; padding: 16px 18px;\n}\n.utla-cal__legend-title {\n  font-size: 11px; font-weight: 700; letter-spacing: .1em;\n  text-transform: uppercase; color: var(--texto-2); margin-bottom: 12px;\n}\n.utla-cal__legend-item {\n  display: flex; align-items: center; gap: 8px;\n  font-size: 12.5px; color: var(--texto-2); margin-bottom: 8px;\n}\n.utla-cal__legend-item:last-child { margin-bottom: 0; }\n.utla-cal__legend-dot {\n  width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0;\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   RESPONSIVE\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n@media (max-width: 1024px) {\n  .utla-cal__layout { grid-template-columns: 1fr; }\n  .utla-cal__widget { position: static; }\n}\n@media (max-width: 640px) {\n  .utla-cal__hero { padding: 36px 5% 0; }\n  .utla-cal__hero h1 { font-size: 26px; }\n  .utla-cal__hero-text { padding-bottom: 32px; }\n  .utla-cal__hero-stats { display: none; }\n  .utla-cal__body { padding: 28px 4% 0; }\n}\n<\/style>\n\n<div class=\"utla-cal\">\n\n  <!-- HERO -->\n  <div class=\"utla-cal__hero\">\n    <div class=\"utla-cal__hero-inner\">\n      <div class=\"utla-cal__hero-text\">\n        <div class=\"utla-cal__badge\">Registro Acad\u00e9mico<\/div>\n        <h1>Calendario Acad\u00e9mico <em>Ciclo I \u2014 2026<\/em><\/h1>\n        <p class=\"utla-cal__hero-sub\">Fechas oficiales de matr\u00edcula, parciales, vacaciones y tr\u00e1mites acad\u00e9micos de la Universidad T\u00e9cnica Latinoamericana.<\/p>\n      <\/div>\n      <div class=\"utla-cal__hero-stats\">\n        <div class=\"utla-cal__hero-stat\">\n          <div class=\"utla-cal__hero-stat-num\">24<\/div>\n          <div class=\"utla-cal__hero-stat-lbl\">Eventos<\/div>\n        <\/div>\n        <div class=\"utla-cal__hero-stat\">\n          <div class=\"utla-cal__hero-stat-num\" id=\"utla-days-left\">\u2014<\/div>\n          <div class=\"utla-cal__hero-stat-lbl\">D\u00edas al fin<\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n\n  <!-- FRANJA -->\n  <div class=\"utla-cal__divider\">\n    <div class=\"utla-cal__divider-inner\">\n      <div class=\"utla-cal__divider-icon\">\n        <svg viewBox=\"0 0 24 24\"><path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z\"\/><\/svg>\n      <\/div>\n      <span class=\"utla-cal__divider-text\">Haz clic en cualquier d\u00eda del calendario para ver los eventos. Los d\u00edas <strong>marcados en rojo<\/strong> tienen actividades programadas.<\/span>\n    <\/div>\n  <\/div>\n\n  <!-- CUERPO -->\n  <div class=\"utla-cal__body\">\n    <div class=\"utla-cal__layout\">\n\n      <!-- COLUMNA IZQUIERDA: timeline -->\n      <div>\n        <div class=\"utla-cal__section-head\">\n          <div class=\"utla-cal__section-line\"><\/div>\n          <div>\n            <div class=\"utla-cal__section-title\">Eventos del Ciclo<\/div>\n            <div class=\"utla-cal__section-sub\">Todas las fechas y actividades programadas<\/div>\n          <\/div>\n        <\/div>\n        <div class=\"utla-cal__timeline\" id=\"utla-timeline\"><\/div>\n      <\/div>\n\n      <!-- COLUMNA DERECHA: calendario -->\n      <div class=\"utla-cal__widget\">\n        <div class=\"utla-cal__section-head\">\n          <div class=\"utla-cal__section-line\"><\/div>\n          <div>\n            <div class=\"utla-cal__section-title\">Calendario<\/div>\n            <div class=\"utla-cal__section-sub\">Toca un d\u00eda para ver eventos<\/div>\n          <\/div>\n        <\/div>\n\n        <div class=\"utla-cal__widget-card\">\n          <div class=\"utla-cal__widget-head\">\n            <div class=\"utla-cal__widget-month\" id=\"utla-month-label\">\u2014<\/div>\n            <div class=\"utla-cal__widget-nav\">\n              <button class=\"utla-cal__nav-btn\" id=\"utla-prev\">\u2039<\/button>\n              <button class=\"utla-cal__nav-btn\" id=\"utla-next\">\u203a<\/button>\n            <\/div>\n          <\/div>\n          <div class=\"utla-cal__grid-head\">\n            <span>Do<\/span><span>Lu<\/span><span>Ma<\/span>\n            <span>Mi<\/span><span>Ju<\/span><span>Vi<\/span><span>Sa<\/span>\n          <\/div>\n          <div class=\"utla-cal__grid-days\" id=\"utla-grid\"><\/div>\n          <div class=\"utla-cal__day-detail\" id=\"utla-detail\">\n            <div class=\"utla-cal__day-detail-empty\">Selecciona un d\u00eda para ver sus eventos<\/div>\n          <\/div>\n        <\/div>\n\n        <div class=\"utla-cal__legend\">\n          <div class=\"utla-cal__legend-title\">Leyenda<\/div>\n          <div class=\"utla-cal__legend-item\">\n            <div class=\"utla-cal__legend-dot\" style=\"background:var(--azul)\"><\/div>\n            Hoy\n          <\/div>\n          <div class=\"utla-cal__legend-item\">\n            <div class=\"utla-cal__legend-dot\" style=\"background:var(--burdeos)\"><\/div>\n            D\u00eda con evento\n          <\/div>\n          <div class=\"utla-cal__legend-item\">\n            <div class=\"utla-cal__legend-dot\" style=\"background:var(--burdeos-lite);border:1.5px solid var(--burdeos-med)\"><\/div>\n            Rango de evento\n          <\/div>\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/div>\n<\/div>\n\n<script>\n(function () {\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     DATOS DEL CALENDARIO\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  var EVENTS = [\n    {\n      id: 1,\n      name: 'Matr\u00edcula Abierta',\n      start: '2025-11-09', end: '2026-01-17',\n      icon: 'M9 11H7v2h2v-2zm4 0h-2v2h2v-2zm4 0h-2v2h2v-2zm2-7h-1V2h-2v2H8V2H6v2H5C3.89 4 3.01 4.9 3.01 6L3 20c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V9h14v11z',\n      category: 'matricula'\n    },\n    {\n      id: 2,\n      name: 'Inscripci\u00f3n Ordinaria',\n      start: '2025-11-15', end: '2026-01-17',\n      icon: 'M14 2H6c-1.1 0-2 .9-2 2v16c0 1.1.89 2 2 2h12c1.1 0 2-.9 2-2V8l-6-6zm4 18H6V4h7v5h5v11zM8 15h8v2H8zm0-4h8v2H8z',\n      category: 'inscripcion'\n    },\n    {\n      id: 3,\n      name: 'Cancelaci\u00f3n de Matr\u00edcula y 1\u00aa Cuota',\n      start: '2026-01-17', end: '2026-01-17',\n      icon: 'M11.8 10.9c-2.27-.59-3-1.2-3-2.15 0-1.09 1.01-1.85 2.7-1.85 1.78 0 2.44.85 2.5 2.1h2.21c-.07-1.72-1.12-3.3-3.21-3.81V3h-3v2.16c-1.94.42-3.5 1.68-3.5 3.61 0 2.31 1.91 3.46 4.7 4.13 2.5.6 3 1.48 3 2.41 0 .69-.49 1.79-2.7 1.79-2.06 0-2.87-.92-2.98-2.1h-2.2c.12 2.19 1.76 3.42 3.68 3.83V21h3v-2.15c1.95-.37 3.5-1.5 3.5-3.55 0-2.84-2.43-3.81-4.7-4.4z',\n      category: 'pago'\n    },\n    {\n      id: 4,\n      name: 'Inicio de Clases',\n      start: '2026-01-19', end: '2026-01-19',\n      icon: 'M12 3L1 9l11 6 9-4.91V17h2V9M5 13.18v4L12 21l7-3.82v-4L12 17l-7-3.82z',\n      category: 'clases'\n    },\n    {\n      id: 5,\n      name: 'Inscripci\u00f3n Extraordinaria',\n      start: '2026-01-19', end: '2026-02-14',\n      icon: 'M14 2H6c-1.1 0-2 .9-2 2v16c0 1.1.89 2 2 2h12c1.1 0 2-.9 2-2V8l-6-6zm4 18H6V4h7v5h5v11z',\n      category: 'inscripcion'\n    },\n    {\n      id: 6,\n      name: 'Cancelaci\u00f3n de Cuota N\u00b0 2',\n      start: '2026-02-18', end: '2026-02-18',\n      icon: 'M11.8 10.9c-2.27-.59-3-1.2-3-2.15 0-1.09 1.01-1.85 2.7-1.85 1.78 0 2.44.85 2.5 2.1h2.21c-.07-1.72-1.12-3.3-3.21-3.81V3h-3v2.16c-1.94.42-3.5 1.68-3.5 3.61 0 2.31 1.91 3.46 4.7 4.13 2.5.6 3 1.48 3 2.41 0 .69-.49 1.79-2.7 1.79-2.06 0-2.87-.92-2.98-2.1h-2.2c.12 2.19 1.76 3.42 3.68 3.83V21h3v-2.15c1.95-.37 3.5-1.5 3.5-3.55 0-2.84-2.43-3.81-4.7-4.4z',\n      category: 'pago'\n    },\n    {\n      id: 7,\n      name: 'Primeros Parciales',\n      start: '2026-02-14', end: '2026-02-21',\n      icon: 'M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z',\n      category: 'examen'\n    },\n    {\n      id: 8,\n      name: 'Ex\u00e1menes Diferidos del Parcial N\u00b0 1',\n      start: '2026-03-01', end: '2026-03-01',\n      icon: 'M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z',\n      category: 'examen'\n    },\n    {\n      id: 9,\n      name: 'Retiro de Asignaturas',\n      start: '2026-03-14', end: '2026-03-14',\n      icon: 'M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z',\n      category: 'tramite'\n    },\n    {\n      id: 10,\n      name: 'Cancelaci\u00f3n de Cuota N\u00b0 3',\n      start: '2026-03-18', end: '2026-03-18',\n      icon: 'M11.8 10.9c-2.27-.59-3-1.2-3-2.15 0-1.09 1.01-1.85 2.7-1.85 1.78 0 2.44.85 2.5 2.1h2.21c-.07-1.72-1.12-3.3-3.21-3.81V3h-3v2.16c-1.94.42-3.5 1.68-3.5 3.61 0 2.31 1.91 3.46 4.7 4.13 2.5.6 3 1.48 3 2.41 0 .69-.49 1.79-2.7 1.79-2.06 0-2.87-.92-2.98-2.1h-2.2c.12 2.19 1.76 3.42 3.68 3.83V21h3v-2.15c1.95-.37 3.5-1.5 3.5-3.55 0-2.84-2.43-3.81-4.7-4.4z',\n      category: 'pago'\n    },\n    {\n      id: 11,\n      name: 'Segundos Parciales',\n      start: '2026-03-21', end: '2026-03-28',\n      icon: 'M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z',\n      category: 'examen'\n    },\n    {\n      id: 12,\n      name: 'Vacaciones de Semana Santa',\n      start: '2026-03-29', end: '2026-04-04',\n      icon: 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 14l-4-4 1.41-1.41L11 13.17l6.59-6.59L19 8l-8 8z',\n      category: 'vacaciones'\n    },\n    {\n      id: 13,\n      name: 'Ex\u00e1menes Diferidos del Parcial N\u00b0 2',\n      start: '2026-04-12', end: '2026-04-12',\n      icon: 'M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z',\n      category: 'examen'\n    },\n    {\n      id: 14,\n      name: 'Cancelaci\u00f3n de Cuota N\u00b0 4',\n      start: '2026-04-18', end: '2026-04-18',\n      icon: 'M11.8 10.9c-2.27-.59-3-1.2-3-2.15 0-1.09 1.01-1.85 2.7-1.85 1.78 0 2.44.85 2.5 2.1h2.21c-.07-1.72-1.12-3.3-3.21-3.81V3h-3v2.16c-1.94.42-3.5 1.68-3.5 3.61 0 2.31 1.91 3.46 4.7 4.13 2.5.6 3 1.48 3 2.41 0 .69-.49 1.79-2.7 1.79-2.06 0-2.87-.92-2.98-2.1h-2.2c.12 2.19 1.76 3.42 3.68 3.83V21h3v-2.15c1.95-.37 3.5-1.5 3.5-3.55 0-2.84-2.43-3.81-4.7-4.4z',\n      category: 'pago'\n    },\n    {\n      id: 15,\n      name: 'XLV Aniversario de la UTLA',\n      start: '2026-05-01', end: '2026-05-01',\n      icon: 'M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.62L12 2 9.19 8.62 2 9.24l5.45 4.73L5.82 21z',\n      category: 'especial'\n    },\n    {\n      id: 16,\n      name: 'Terceros Parciales',\n      start: '2026-05-02', end: '2026-05-09',\n      icon: 'M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z',\n      category: 'examen'\n    },\n    {\n      id: 17,\n      name: 'Ex\u00e1menes Diferidos del Parcial N\u00b0 3',\n      start: '2026-05-17', end: '2026-05-17',\n      icon: 'M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z',\n      category: 'examen'\n    },\n    {\n      id: 18,\n      name: 'Cancelaci\u00f3n de Cuota N\u00b0 5',\n      start: '2026-05-18', end: '2026-05-18',\n      icon: 'M11.8 10.9c-2.27-.59-3-1.2-3-2.15 0-1.09 1.01-1.85 2.7-1.85 1.78 0 2.44.85 2.5 2.1h2.21c-.07-1.72-1.12-3.3-3.21-3.81V3h-3v2.16c-1.94.42-3.5 1.68-3.5 3.61 0 2.31 1.91 3.46 4.7 4.13 2.5.6 3 1.48 3 2.41 0 .69-.49 1.79-2.7 1.79-2.06 0-2.87-.92-2.98-2.1h-2.2c.12 2.19 1.76 3.42 3.68 3.83V21h3v-2.15c1.95-.37 3.5-1.5 3.5-3.55 0-2.84-2.43-3.81-4.7-4.4z',\n      category: 'pago'\n    },\n    {\n      id: 19,\n      name: 'Finalizaci\u00f3n de Clases',\n      start: '2026-06-05', end: '2026-06-05',\n      icon: 'M12 3L1 9l11 6 9-4.91V17h2V9M5 13.18v4L12 21l7-3.82v-4L12 17l-7-3.82z',\n      category: 'clases'\n    },\n    {\n      id: 20,\n      name: 'Cancelaci\u00f3n de Cuota N\u00b0 6',\n      start: '2026-06-06', end: '2026-06-06',\n      icon: 'M11.8 10.9c-2.27-.59-3-1.2-3-2.15 0-1.09 1.01-1.85 2.7-1.85 1.78 0 2.44.85 2.5 2.1h2.21c-.07-1.72-1.12-3.3-3.21-3.81V3h-3v2.16c-1.94.42-3.5 1.68-3.5 3.61 0 2.31 1.91 3.46 4.7 4.13 2.5.6 3 1.48 3 2.41 0 .69-.49 1.79-2.7 1.79-2.06 0-2.87-.92-2.98-2.1h-2.2c.12 2.19 1.76 3.42 3.68 3.83V21h3v-2.15c1.95-.37 3.5-1.5 3.5-3.55 0-2.84-2.43-3.81-4.7-4.4z',\n      category: 'pago'\n    },\n    {\n      id: 21,\n      name: 'Ex\u00e1menes Finales',\n      start: '2026-06-06', end: '2026-06-13',\n      icon: 'M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-5 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z',\n      category: 'examen'\n    },\n    {\n      id: 22,\n      name: 'Ex\u00e1menes Diferidos del Examen Final',\n      start: null, end: null,\n      dateLabel: 'No se realizan',\n      icon: 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z',\n      category: 'examen'\n    },\n    {\n      id: 23,\n      name: 'Entrega de Notas Finales',\n      start: '2026-06-30', end: '2026-06-30',\n      icon: 'M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z',\n      category: 'tramite'\n    },\n    {\n      id: 24,\n      name: 'Solicitud de Cambio de Carrera',\n      start: '2026-06-06', end: '2026-07-04',\n      icon: 'M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z',\n      category: 'tramite'\n    }\n  ];\n\n  \/* \u2500\u2500 Helpers \u2500\u2500 *\/\n  function parseDate(str) {\n    if (!str) return null;\n    var p = str.split('-');\n    return new Date(+p[0], +p[1] - 1, +p[2]);\n  }\n  function toISO(d) {\n    return d.getFullYear() + '-' +\n      String(d.getMonth()+1).padStart(2,'0') + '-' +\n      String(d.getDate()).padStart(2,'0');\n  }\n  function formatDate(str) {\n    if (!str) return '';\n    var months = ['ene','feb','mar','abr','may','jun','jul','ago','sep','oct','nov','dic'];\n    var p = str.split('-');\n    return +p[2] + ' ' + months[+p[1]-1] + ' ' + p[0];\n  }\n  function isoToday() { return toISO(new Date()); }\n\n  \/* \u2500\u2500 Estado del evento \u2500\u2500 *\/\n  function eventStatus(ev) {\n    if (!ev.start) return 'n\/a';\n    var today = new Date(); today.setHours(0,0,0,0);\n    var s = parseDate(ev.start); s.setHours(0,0,0,0);\n    var e = parseDate(ev.end);   e.setHours(23,59,59,999);\n    if (today >= s && today <= e) return 'active';\n    if (today > e) return 'past';\n    return 'upcoming';\n  }\n\n  \/* \u2500\u2500 D\u00edas con evento \u2500\u2500 *\/\n  function getDaysWithEvents() {\n    var map = {};\n    EVENTS.forEach(function(ev) {\n      if (!ev.start) return;\n      var cur = parseDate(ev.start);\n      var end = parseDate(ev.end);\n      while (cur <= end) {\n        var key = toISO(cur);\n        if (!map[key]) map[key] = [];\n        map[key].push(ev);\n        cur.setDate(cur.getDate() + 1);\n      }\n    });\n    return map;\n  }\n  var eventMap = getDaysWithEvents();\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     TIMELINE\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  function buildTimeline() {\n    var tl = document.getElementById('utla-timeline');\n    if (!tl) return;\n    var html = '';\n    EVENTS.forEach(function(ev) {\n      var status = ev.start ? eventStatus(ev) : 'n\/a';\n      var cls = status === 'active' ? 'is-active' : (status === 'past' ? 'is-past' : '');\n      var dateStr = ev.dateLabel\n        ? ev.dateLabel\n        : (ev.start === ev.end\n            ? formatDate(ev.start)\n            : 'Del ' + formatDate(ev.start) + ' al ' + formatDate(ev.end));\n      var tagHtml = '';\n      if (status === 'active')   tagHtml = '<span class=\"utla-cal__event-tag en-curso\">En curso<\/span>';\n      if (status === 'upcoming') tagHtml = '<span class=\"utla-cal__event-tag proximo\">Pr\u00f3ximo<\/span>';\n      if (status === 'past')     tagHtml = '<span class=\"utla-cal__event-tag pasado\">Finalizado<\/span>';\n      html += '<div class=\"utla-cal__event ' + cls + '\">' +\n        '<div class=\"utla-cal__event-left\"><div class=\"utla-cal__event-dot\">' +\n        '<svg viewBox=\"0 0 24 24\"><path d=\"' + ev.icon + '\"\/><\/svg>' +\n        '<\/div><\/div>' +\n        '<div class=\"utla-cal__event-body\">' +\n        '<div class=\"utla-cal__event-name\">' + ev.name + '<\/div>' +\n        '<div class=\"utla-cal__event-date\">' + dateStr + '<\/div>' +\n        tagHtml +\n        '<\/div><\/div>';\n    });\n    tl.innerHTML = html;\n  }\n\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n     CALENDARIO\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n  var MONTHS = ['Enero','Febrero','Marzo','Abril','Mayo','Junio',\n                'Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre'];\n\n  var today       = new Date();\n  var curYear     = today.getFullYear();\n  var curMonth    = today.getMonth();   \/\/ 0-based\n  var selectedDay = null;\n\n  function renderCalendar() {\n    var label  = document.getElementById('utla-month-label');\n    var grid   = document.getElementById('utla-grid');\n    if (!label || !grid) return;\n\n    label.textContent = MONTHS[curMonth] + ' ' + curYear;\n\n    var firstDay = new Date(curYear, curMonth, 1).getDay(); \/\/ 0=Dom\n    var daysInMonth = new Date(curYear, curMonth + 1, 0).getDate();\n    var todayISO = isoToday();\n\n    var html = '';\n\n    \/\/ D\u00edas vac\u00edos al inicio\n    for (var i = 0; i < firstDay; i++) {\n      html += '<div class=\"utla-cal__day empty\"><\/div>';\n    }\n\n    for (var d = 1; d <= daysInMonth; d++) {\n      var iso = curYear + '-' + String(curMonth+1).padStart(2,'0') + '-' + String(d).padStart(2,'0');\n      var cls = 'utla-cal__day';\n      if (iso === todayISO)    cls += ' is-today';\n      if (eventMap[iso])       cls += ' has-event';\n\n      \/\/ Rangos de color\n      EVENTS.forEach(function(ev) {\n        if (!ev.start || !ev.end) return;\n        if (iso > ev.start && iso < ev.end) cls += ' in-range';\n        if (iso === ev.start &#038;&#038; ev.start !== ev.end) cls += ' range-start';\n        if (iso === ev.end   &#038;&#038; ev.start !== ev.end) cls += ' range-end';\n      });\n\n      html += '<div class=\"' + cls + '\" data-date=\"' + iso + '\">' + d + '<\/div>';\n    }\n    grid.innerHTML = html;\n\n    \/\/ Eventos de clic\n    grid.querySelectorAll('.utla-cal__day[data-date]').forEach(function(el) {\n      el.addEventListener('click', function() {\n        grid.querySelectorAll('.utla-cal__day').forEach(function(x) {\n          x.style.outline = '';\n        });\n        el.style.outline = '2px solid #6d222e';\n        selectedDay = el.getAttribute('data-date');\n        renderDetail(selectedDay);\n      });\n    });\n\n    \/\/ Si hab\u00eda d\u00eda seleccionado y sigue en este mes, restaurar\n    if (selectedDay) renderDetail(selectedDay);\n  }\n\n  function renderDetail(iso) {\n    var detail = document.getElementById('utla-detail');\n    if (!detail) return;\n    var evs = eventMap[iso];\n    if (!evs || !evs.length) {\n      detail.innerHTML = '<div class=\"utla-cal__day-detail-empty\">Sin eventos para este d\u00eda<\/div>';\n      return;\n    }\n    var html = '';\n    evs.forEach(function(ev) {\n      var dateStr = ev.start === ev.end\n        ? formatDate(ev.start)\n        : 'Del ' + formatDate(ev.start) + ' al ' + formatDate(ev.end);\n      html += '<div class=\"utla-cal__day-detail-item\">' +\n        '<div class=\"utla-cal__day-detail-dot\"><\/div>' +\n        '<div><div class=\"utla-cal__day-detail-text\">' + ev.name + '<\/div>' +\n        '<div class=\"utla-cal__day-detail-date\">' + dateStr + '<\/div><\/div>' +\n        '<\/div>';\n    });\n    detail.innerHTML = html;\n  }\n\n  \/* D\u00edas al fin del ciclo *\/\n  function setDaysLeft() {\n    var el = document.getElementById('utla-days-left');\n    if (!el) return;\n    var end = parseDate('2026-06-30');\n    var now = new Date(); now.setHours(0,0,0,0);\n    var diff = Math.ceil((end - now) \/ 86400000);\n    el.textContent = diff > 0 ? diff : '0';\n  }\n\n  \/* Navegaci\u00f3n *\/\n  document.getElementById('utla-prev').addEventListener('click', function() {\n    curMonth--;\n    if (curMonth < 0) { curMonth = 11; curYear--; }\n    renderCalendar();\n  });\n  document.getElementById('utla-next').addEventListener('click', function() {\n    curMonth++;\n    if (curMonth > 11) { curMonth = 0; curYear++; }\n    renderCalendar();\n  });\n\n  \/* Mostrar hoy al hacer clic en la fecha del header *\/\n  document.getElementById('utla-month-label').style.cursor = 'pointer';\n  document.getElementById('utla-month-label').addEventListener('click', function() {\n    var t = new Date();\n    curYear = t.getFullYear(); curMonth = t.getMonth();\n    renderCalendar();\n  });\n\n  \/* Init *\/\n  buildTimeline();\n  renderCalendar();\n  setDaysLeft();\n})();\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Registro Acad\u00e9mico Calendario Acad\u00e9mico Ciclo I \u2014 2026 Fechas oficiales de matr\u00edcula, parciales, vacaciones y tr\u00e1mites acad\u00e9micos de la Universidad T\u00e9cnica Latinoamericana. 24 Eventos \u2014 D\u00edas al fin Haz clic en cualquier d\u00eda del calendario para ver los eventos. Los d\u00edas marcados en rojo tienen actividades programadas. Eventos del Ciclo Todas las fechas y actividades [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"single-full","format":"standard","meta":{"footnotes":""},"categories":[28],"tags":[],"class_list":["post-6629","post","type-post","status-publish","format-standard","hentry","category-academico"],"_links":{"self":[{"href":"https:\/\/utla.edu.sv\/2026\/index.php?rest_route=\/wp\/v2\/posts\/6629","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/utla.edu.sv\/2026\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/utla.edu.sv\/2026\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/utla.edu.sv\/2026\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/utla.edu.sv\/2026\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=6629"}],"version-history":[{"count":14,"href":"https:\/\/utla.edu.sv\/2026\/index.php?rest_route=\/wp\/v2\/posts\/6629\/revisions"}],"predecessor-version":[{"id":6864,"href":"https:\/\/utla.edu.sv\/2026\/index.php?rest_route=\/wp\/v2\/posts\/6629\/revisions\/6864"}],"wp:attachment":[{"href":"https:\/\/utla.edu.sv\/2026\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=6629"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/utla.edu.sv\/2026\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=6629"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/utla.edu.sv\/2026\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=6629"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}