<template>
      <NavbarModerno />
  <section class="convocatorias-modern">
    <div class="section-container">
      <div class="section-header">
        <div class="header-with-badge">
          <h2 class="section-title">CEPREUNA</h2>
          <a-badge count="Modalidad" class="new-badge" />
        </div>
        <p class="section-subtitle">
          Examen de admisión del Centro Preuniversitario
        </p>
      </div>

      <a-card class="main-convocatoria-card">
        <div class="card-badge">CEPREUNA</div>

        <div class="convocatoria-header">
          <div>
            <h3>Examen de Admisión del Centro Preuniversitario</h3>
            <p class="convocatoria-date">Convocatoria: una vez por semestre</p>
          </div>
          <!-- <a-tag class="status-tag" color="success">CEPREUNA</a-tag> -->
        </div>

        <a-alert
          type="info"
          show-icon
          class="soft-alert"
          message="Dirigido a estudiantes que concluyeron el quinto año de secundaria y cursaron el ciclo preparatorio del Centro Preuniversitario de la UNA-Puno."
        />

        <a-divider class="custom-divider" />

        <a-card class="soft-card" size="small">
          <h4 class="subheading">Evaluación</h4>
          <p class="text">
            El postulante rinde un examen de conocimientos con contenidos alineados al perfil del ingresante
            establecido por la UNA-Puno, en la fecha indicada en el cronograma de admisión.
          </p>
        </a-card>


        <a-card class="soft-card" size="small">
          <h4 class="subheading">Requisitos y documentos</h4>
          <a-list size="small" :split="false" class="info-list">
            <a-list-item>
              Presentar la constancia de no adeudar al CEPREUNA y DNI vigente.
            </a-list-item>
            <a-list-item>
              Presentar los documentos exigidos por el reglamento para esta modalidad (según requisitos generales).
            </a-list-item>
          </a-list>
        </a-card>
      </a-card>
    </div>
  </section>

  <FooterModerno />
</template>

<script setup>
import NavbarModerno from '../../nabvar.vue'
import FooterModerno from '../../Footer.vue'


</script>

<style scoped>
/* Diseño tipo Convocatorias (sin mayúsculas globales) */
.convocatorias-modern {
  position: relative;
  padding: 40px 0;
  font-family: "Times New Roman", Times, serif;
  background: #fbfcff;
  overflow: hidden;
}
.convocatorias-modern::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image:
    repeating-linear-gradient(to right, rgba(13, 27, 82, 0.06) 0, rgba(13, 27, 82, 0.06) 1px, transparent 1px, transparent 24px),
    repeating-linear-gradient(to bottom, rgba(13, 27, 82, 0.06) 0, rgba(13, 27, 82, 0.06) 1px, transparent 1px, transparent 24px);
  opacity: 0.55;
}
.section-container { position: relative; z-index: 1; max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.section-header { text-align: center; margin-bottom: 40px; }
.header-with-badge { display: inline-flex; align-items: center; justify-content: center; gap: 14px; }
.section-title { font-size: 2.4rem; font-weight: 700; color: #0d1b52; margin: 0; }
.section-subtitle { font-size: 1.125rem; color: #666; max-width: 760px; margin: 14px auto 0; }

.new-badge :deep(.ant-badge-count) {
  background: linear-gradient(45deg, #ff6b6b, #ffd700);
  box-shadow: 0 2px 8px rgba(255, 107, 107, 0.3);
  border-radius: 999px;
}

.main-convocatoria-card { position: relative; border: none; box-shadow: 0 10px 34px rgba(0,0,0,0.08); border-radius: 16px; }
.main-convocatoria-card :deep(.ant-card-body) { padding: 28px; }

.card-badge {
  position: absolute; top: -12px; left: 24px;
  background: linear-gradient(45deg, #1890ff, #52c41a);
  color: white; padding: 6px 16px; border-radius: 999px;
  font-size: 0.75rem; font-weight: 700;
}

.convocatoria-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; margin-bottom: 14px; }
.convocatoria-header h3 { margin: 0; font-size: 1.55rem; color: #1a237e; }
.convocatoria-date { color: #666; margin: 6px 0 0; font-size: 0.95rem; }

.status-tag { font-weight: 700; padding: 4px 12px; border-radius: 999px; white-space: nowrap; }

.custom-divider { margin: 18px 0; }
.soft-alert { border-radius: 12px; }

.soft-card { border-radius: 12px; border: 1px solid rgba(0,0,0,0.06); margin-top: 12px; }
.subheading { margin: 0 0 6px; color: #1a237e; font-weight: 700; }
.text { margin: 0; color: #666; line-height: 1.7; }
.info-list :deep(.ant-list-item) { padding: 8px 0; border: none; color: #666; }
</style>
