/* =========================================================
   BONIFICADO FORMACIÓN
   /assets/css/extapp.css

   CSS estructural para contenido incrustable.

   PRINCIPIOS:
   - Todo queda encapsulado dentro de .extapp
   - No modifica body, html ni elementos globales de WordPress
   - Hereda tipografías, colores y estilos generales del cliente
   - Solo controla estructura, layout y componentes propios
   ========================================================= */


/* =========================================================
   1. BASE
   ========================================================= */

.extapp {
  --ext-gap: 12px;
  --ext-gap-lg: 24px;
  --ext-radius: 12px;
  --ext-border: rgba(0, 0, 0, .12);
  --ext-bg: rgba(255, 255, 255, .92);
  --ext-muted: rgba(0, 0, 0, .65);
  --ext-shadow: 0 8px 24px rgba(0, 0, 0, .08);
  --ext-focus: rgba(0, 0, 0, .18);

  width: 100%;
  min-width: 0;
  font-family: inherit;
  color: inherit;
}

.extapp,
.extapp *,
.extapp *::before,
.extapp *::after {
  box-sizing: border-box;
}

.extapp img {
  max-width: 100%;
  height: auto;
}

.extapp .ext-hidden {
  display: none !important;
}

.extapp .ext-center {
  text-align: center;
}

.extapp .ext-muted {
  opacity: .72;
}


/* =========================================================
   2. LAYOUT GENERAL
   ========================================================= */

.extapp .ext-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.extapp .ext-main,
.extapp .ext-aside {
  min-width: 0;
}

@media (min-width: 992px) {
  .extapp .ext-layout {
    grid-template-columns: minmax(0, 1fr) 320px;
  }
}


/* =========================================================
   3. SECCIONES / CONTENEDORES
   ========================================================= */

.extapp .ext-section {
  width: 100%;
  min-width: 0;
}

.extapp .ext-section + .ext-section {
  margin-top: 1.5rem;
}

.extapp .ext-card {
  border: 1px solid var(--ext-border);
  border-radius: var(--ext-radius);
  background: var(--ext-bg);
  padding: 14px;
}

.extapp .ext-card__title {
  margin: 0 0 .75rem;
}


/* =========================================================
   4. FORMULARIOS
   ========================================================= */

.extapp .ext-form {
  width: 100%;
}

.extapp .ext-field {
  display: grid;
  gap: 6px;
  margin-bottom: var(--ext-gap);
}

.extapp .ext-label {
  font-weight: 600;
}

.extapp .ext-help {
  font-size: .9em;
  opacity: .7;
}

.extapp .ext-input,
.extapp .ext-select,
.extapp .ext-textarea {
  width: 100%;
  max-width: 100%;
  font: inherit;
  color: inherit;
}

.extapp .ext-textarea {
  min-height: 120px;
  resize: vertical;
}

.extapp .ext-input:focus-visible,
.extapp .ext-select:focus-visible,
.extapp .ext-textarea:focus-visible {
  outline: 2px solid var(--ext-focus);
  outline-offset: 2px;
}

.extapp .ext-choice {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-right: 12px;
}


/* =========================================================
   5. BOTONES
   ========================================================= */

.extapp .ext-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 9px 12px;
  margin: 10px;
  border: 1px solid var(--ext-border);
  border-radius: 10px;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
  text-decoration: none !important;
  white-space: nowrap;
}
.extapp .ext-btn a {
  text-decoration: none !important;
}
.extapp .ext-btn:hover {
  background: rgba(0, 0, 0, .05);
}

.extapp .ext-btn:focus-visible {
  outline: 2px solid var(--ext-focus);
  outline-offset: 2px;
}

.extapp .ext-btn--primary {
  background: rgba(0, 0, 0, .08);
}

.extapp .ext-btn--ghost {
  background: transparent;
}

.extapp .ext-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 1rem;
}


/* =========================================================
   6. ALERTAS
   ========================================================= */

.extapp .ext-alert {
  padding: 12px 14px;
  margin: 1rem 0;
  border: 1px solid var(--ext-border);
  border-radius: var(--ext-radius);
}

.extapp .ext-alert--info {
  background: rgba(0, 90, 180, .05);
}

.extapp .ext-alert--success {
  background: rgba(0, 128, 0, .06);
}

.extapp .ext-alert--warning {
  background: rgba(180, 120, 0, .07);
}

.extapp .ext-alert--danger {
  background: rgba(180, 0, 0, .06);
}


/* =========================================================
   7. LISTAS / NAVEGACIÓN
   ========================================================= */

.extapp .ext-list,
.extapp .ext-nav__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
}

.extapp .ext-list__item {
  margin: 0;
  padding: 0;
}


.ext-list__item a,
.ext-list__item a:hover,
.ext-list__item a:focus,
.ext-list__item a:visited {
    text-decoration: none;
}

.extapp .ext-list__link {
  display: block;
  width: 100%;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--ext-border);
  border-radius: var(--ext-radius);
  text-decoration: none;
  color: inherit;
  line-height: 1.2;
  overflow-wrap: break-word;
  word-break: normal;
}

.extapp .ext-list__link:hover {
  background: rgba(0, 0, 0, .04);
}

.extapp .ext-nav {
  border: 1px solid var(--ext-border);
  border-radius: var(--ext-radius);
  padding: 6px;
}

.extapp .ext-nav__summary {
  cursor: pointer;
  user-select: none;
  list-style: none;
  font-weight: 600;
  padding: 10px 12px;
}

.extapp .ext-nav__summary::-webkit-details-marker {
  display: none;
}

.extapp .ext-nav__list {
  margin-top: 6px;
}

.extapp.extapp--nav .ext-list__link {
  border: 0;
}

/* =========================================================
   LISTADO DE FAMILIAS
   ========================================================= */

.extapp.extapp--list {
    width: 100%;
}

/* Título de la sección */
.extapp.extapp--list > .extapp__title {
    margin: 20px 0 14px;
    padding: 0 0 10px;

    border-bottom: 2px solid #337ab7;

    color: #222;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
}

/* Lista */
.extapp.extapp--list .ext-list {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;

    margin: 0;
    padding: 0;

    list-style: none;
}

/* Elementos */
.extapp.extapp--list .ext-list__item {
    margin: 0;
    padding: 0;
}

/* Enlaces */
.extapp.extapp--list .ext-list__link,
.extapp.extapp--list .ext-list__link:visited {
    display: block;
    width: 100%;

    padding: 9px 11px;

    border: 1px solid var(--ext-border);
    border-radius: 6px;

    background: var(--ext-bg);
    color: #333;

    font-size: 14px;
    font-weight: 500;
    line-height: 1.25;

    text-decoration: none !important;

    box-sizing: border-box;

    transition:
        background .15s ease,
        border-color .15s ease,
        color .15s ease;
}

/* Hover */
.extapp.extapp--list .ext-list__link:hover {
    background: rgba(51, 122, 183, .06);
    border-color: #337ab7;
    color: #337ab7;

    text-decoration: none !important;
}

/* Teclado / accesibilidad */
.extapp.extapp--list .ext-list__link:focus {
    text-decoration: none !important;
}

.extapp.extapp--list .ext-list__link:focus-visible {
    outline: none;
    border-color: #337ab7;
    box-shadow: 0 0 0 3px var(--ext-focus);
}

/* =========================================================
   8. CARDS GENÉRICAS DE PORTADA
   Familias / categorías / sectores
   ========================================================= */

.extapp.extapp--portada {
  margin: 1rem 0;
}

.extapp.extapp--portada .extapp__scroller {
  display: flex;
  gap: 14px;
  overflow-x: auto;
  padding: 4px 2px 10px;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}

.extapp.extapp--portada .ext-card {
  flex: 0 0 auto;
  width: min(240px, 78vw);
  scroll-snap-align: start;
  display: grid;
  gap: 10px;
}

.extapp .ext-card__media {
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
}

.extapp .ext-card__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (min-width: 900px) {
  .extapp.extapp--portada .extapp__scroller {
    overflow: visible;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    scroll-snap-type: none;
  }

  .extapp.extapp--portada .ext-card {
    width: auto;
  }
}

@media (min-width: 1200px) {
  .extapp.extapp--portada .extapp__scroller {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}


/* =========================================================
   9. CATÁLOGO DE CURSOS
   ========================================================= */

.extapp .ext-catalog {
  width: 100%;
  min-width: 0;
}

.extapp .ext-catalog__header {
  margin-bottom: 1.5rem;
}

.extapp .ext-catalog__hero-image {
  margin-bottom: 1.5rem;
}

.extapp .ext-course-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1.5rem;
}

.extapp .ext-course-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  height: 100%;
  overflow: hidden;
  border: 1px solid var(--ext-border);
  border-radius: var(--ext-radius);
  background: transparent;
}

.extapp .ext-course-card__media {
  position: relative;
  overflow: hidden;
}

.extapp .ext-course-card__media img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.extapp .ext-course-card__content {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 1rem;
}

.extapp .ext-course-card__title {
  margin: 0 0 .75rem;
}

.extapp .ext-course-card__title a,
.extapp .ext-course-card__title a:hover,
.extapp .ext-course-card__title a:focus,
.extapp .ext-course-card__title a:visited {
    text-decoration: none;
}

.extapp .ext-course-card__meta {
  margin-bottom: 1rem;
}

.extapp .ext-course-card__actions {
  margin-top: auto;
}

.extapp .ext-course-card__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: .75rem;
  opacity: 0;
  background: rgba(0, 0, 0, .15);
  transition: opacity .2s ease;
}

.extapp .ext-course-card__media:hover .ext-course-card__overlay {
  opacity: 1;
}

.extapp .ext-course-card__overlay a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .92);
  text-decoration: none;
}

@media (hover: none) {
  .extapp .ext-course-card__overlay {
    opacity: 1;
    background: transparent;
    justify-content: flex-end;
    align-items: flex-end;
    padding: .75rem;
  }
}

@media (max-width: 620px) {
  .extapp .ext-course-grid {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   10. BUSCADOR DEL CATÁLOGO
   ========================================================= */

.extapp .ext-catalog-search {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: .75rem;
  margin-bottom: 1.5rem;
}

.extapp .ext-catalog-search__field {
  flex: 1 1 260px;
  min-width: 0;
}

.extapp .ext-catalog-search__field input {
  width: 100%;
}


/* =========================================================
   11. PAGINACIÓN
   ========================================================= */

.extapp .ext-catalog-pagination,
.extapp .ext-pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-top: 1.5rem;
}

.extapp .ext-catalog-pagination a,
.extapp .ext-pagination a {
  display: inline-block;
  margin-right: .35rem;
}

@media (max-width: 620px) {
  .extapp .ext-catalog-pagination,
  .extapp .ext-pagination {
    flex-direction: column;
    align-items: flex-start;
  }
}


/* =========================================================
   12. DATATABLE / CABECERA DE LISTADOS
   ========================================================= */

.extapp.ext-dt-header {
  display: grid;
  gap: 12px;
  align-items: end;
  margin-bottom: 12px;
}

.extapp .ext-dt-header__left,
.extapp .ext-dt-header__right {
  display: grid;
  gap: 6px;
}

.extapp .ext-dt-label {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.extapp .ext-dt-search {
  min-width: min(320px, 100%);
}

@media (min-width: 900px) {
  .extapp.ext-dt-header {
    grid-template-columns: 1fr 1fr;
  }

  .extapp .ext-dt-header__right {
    justify-items: end;
  }
}


/* =========================================================
   13. TABLAS
   ========================================================= */

.extapp .ext-table-wrap {
  width: 100%;
  overflow-x: auto;
}

.extapp .ext-table {
  width: 100%;
  border-collapse: collapse;
}

.extapp .ext-table th,
.extapp .ext-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--ext-border);
  text-align: left;
  vertical-align: top;
}

.extapp .ext-table th {
  font-weight: 600;
}


/* =========================================================
   14. DATEPICKER
   ========================================================= */

.extapp .ext-date {
  display: grid;
  gap: 6px;
}

.extapp .ext-date__group {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.extapp .ext-date__btn {
  padding: 9px 12px;
}


/* =========================================================
   15. DETALLE DEL CURSO
   ========================================================= */

.extapp.ext-course {
  display: grid;
  gap: 18px;
}

.extapp .ext-course__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 24px;
}

/* Título a la izquierda */
.extapp .ext-course__top .ext-course__title {
    order: 1;
    flex: 1;
    min-width: 0;
    margin: 0;
}

/* Botón Volver a la derecha */
.extapp .ext-course__top .ext-btn--ghost {
    order: 2;
    flex: 0 0 auto;
    white-space: nowrap;
}
@media (max-width: 700px) {

    .extapp .ext-course__top {
        align-items: flex-start;
        gap: 12px;
    }

    .extapp .ext-course__top .ext-course__title {
        font-size: 22px;
        line-height: 1.25;
    }

}
.extapp .ext-course__hero {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  gap: 16px;
}

.extapp .ext-course__media {
  min-width: 0;
}

.extapp .ext-course__img {
  display: block;
  width: 100%;
  height: auto;
}

.extapp .ext-badge {
  margin-bottom: 10px;
  padding: 10px 12px;
  border: 1px solid var(--ext-border);
  border-radius: var(--ext-radius);
}

.extapp .ext-tabs {
  border: 1px solid var(--ext-border);
  border-radius: var(--ext-radius);
  overflow: hidden;
}

.extapp .ext-tabs__list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 10px;
  border-bottom: 1px solid var(--ext-border);
}

.extapp .ext-tabs__tab {
  appearance: none;
  border: 1px solid var(--ext-border);
  border-radius: 999px;
  padding: 8px 10px;
  background: transparent;
  color: inherit;
  cursor: pointer;
}

.extapp .ext-tabs__tab.is-active {
  background: rgba(0, 0, 0, .07);
}

.extapp .ext-tabs__panels {
  padding: 14px;
}

.extapp .ext-prose {
  line-height: 1.55;
}

@media (max-width: 900px) {
  .extapp .ext-course__hero {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   16. BÚSQUEDA AVANZADA
   Compatibilidad con clases ya existentes
   ========================================================= */

.extapp .extapp-advanced-search {
  width: 100%;
  margin: 16px 0;
}

.extapp .extapp-card {
  border: 1px solid var(--ext-border);
  border-radius: var(--ext-radius);
  overflow: hidden;
}

.extapp .extapp-card__head {
  padding: 14px 16px;
  border-bottom: 1px solid var(--ext-border);
}

.extapp .extapp-title {
  margin: 0;
}

.extapp .extapp-grid {
  padding: 16px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.extapp .extapp-field--full {
  grid-column: 1 / -1;
}

.extapp .extapp-label {
  display: block;
  margin-bottom: 6px;
  font-weight: 600;
}

.extapp .extapp-input,
.extapp .extapp-select {
  width: 100%;
  max-width: 100%;
  font: inherit;
  color: inherit;
}

.extapp .extapp-help {
  margin-top: 6px;
  font-size: .9em;
  opacity: .7;
}

.extapp .extapp-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.extapp .extapp-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 9px 14px;
  border: 1px solid var(--ext-border);
  border-radius: 10px;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

.extapp .extapp-btn--primary {
  background: rgba(0, 0, 0, .08);
}

@media (max-width: 780px) {
  .extapp .extapp-grid {
    grid-template-columns: 1fr;
  }

  .extapp .extapp-actions {
    justify-content: stretch;
  }

  .extapp .extapp-btn {
    width: 100%;
  }
}


/* =========================================================
   17. UTILIDADES
   ========================================================= */

.extapp .ext-mt-1 { margin-top: .5rem; }
.extapp .ext-mt-2 { margin-top: 1rem; }
.extapp .ext-mt-3 { margin-top: 1.5rem; }

.extapp .ext-mb-1 { margin-bottom: .5rem; }
.extapp .ext-mb-2 { margin-bottom: 1rem; }
.extapp .ext-mb-3 { margin-bottom: 1.5rem; }

.extapp .ext-w-100 { width: 100%; }

.extapp hr.ext-sep {
  border: 0;
  border-top: 1px solid var(--ext-border);
  margin: 1rem 0;
}

.extapp .ext-company-login {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
  align-items: start;
}

@media (min-width: 768px) {
  .extapp .ext-company-login {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* =========================================================
   PLANIFICACIÓN DE TUTORÍAS
   ========================================================= */

.extapp .ext-weekdays {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem 1.25rem;
}

.extapp .ext-check {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  cursor: pointer;
}

.extapp .ext-password-field {
  display: flex;
  align-items: stretch;
  gap: .5rem;
}

.extapp .ext-password-field .ext-input {
  flex: 1;
}

@media (max-width: 600px) {
  .extapp .ext-password-field {
    flex-direction: column;
  }
}
/* =========================================================
   FORMULARIO SOLICITUD DE INFORMACION
   ========================================================= */

.extapp.ext-course-form {

    /* Intenta heredar el color principal del WordPress */
    --ext-form-accent:
        var(
            --e-global-color-primary,
            var(
                --wp--preset--color--primary,
                var(
                    --global-palette1,
                    #6b3fa0
                )
            )
        );

    width: 100%;
    max-width: 560px;

    margin: 20px auto;
    padding: 30px 32px 26px;

    position: relative;

    background: #fff;

    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 16px;

    box-shadow:
        0 12px 35px rgba(0, 0, 0, .08);

    overflow: hidden;
}


/* Barra superior */

.extapp.ext-course-form::before {
    content: "";

    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 5px;

    background: var(--ext-form-accent);
}


/* =========================================================
   TITULO DEL CURSO / CABECERA
   ========================================================= */

.extapp.ext-course-form h2,
.extapp.ext-course-form h3 {
    margin: 0 0 22px;

    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;

    color: inherit;
}


/* =========================================================
   FILAS DEL FORMULARIO
   ========================================================= */

.extapp.ext-course-form .ext-field,
.extapp.ext-course-form .form-group,
.extapp.ext-course-form p {
    margin: 0 0 15px;
}


/* =========================================================
   LABELS
   ========================================================= */

.extapp.ext-course-form label {
    display: block;

    margin: 0 0 6px;

    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;

    color: inherit;
}


/* =========================================================
   INPUTS / SELECT / TEXTAREA
   ========================================================= */

.extapp.ext-course-form input[type="text"],
.extapp.ext-course-form input[type="email"],
.extapp.ext-course-form input[type="tel"],
.extapp.ext-course-form input[type="number"],
.extapp.ext-course-form input[type="password"],
.extapp.ext-course-form input[type="search"],
.extapp.ext-course-form select,
.extapp.ext-course-form textarea {

    display: block;

    width: 100%;
    max-width: 100%;

    padding: 12px 15px;

    border: 1px solid rgba(0, 0, 0, .12);
    border-radius: 10px;

    background: rgba(0, 0, 0, .015);

    color: inherit;

    font: inherit;
    font-size: 14px;

    box-shadow: none;

    outline: none;

    transition:
        border-color .15s ease,
        box-shadow .15s ease,
        background .15s ease;
}


/* Altura de campos normales */

.extapp.ext-course-form input[type="text"],
.extapp.ext-course-form input[type="email"],
.extapp.ext-course-form input[type="tel"],
.extapp.ext-course-form input[type="number"],
.extapp.ext-course-form input[type="password"],
.extapp.ext-course-form input[type="search"],
.extapp.ext-course-form select {
    min-height: 47px;
}


/* Textarea */

.extapp.ext-course-form textarea {
    min-height: 180px;
    resize: vertical;
}


/* Placeholder */

.extapp.ext-course-form input::placeholder,
.extapp.ext-course-form textarea::placeholder {
    color: rgba(0, 0, 0, .40);
    opacity: 1;
}


/* Focus */

.extapp.ext-course-form input:focus,
.extapp.ext-course-form select:focus,
.extapp.ext-course-form textarea:focus {

    border-color: var(--ext-form-accent);

    background: #fff;

    box-shadow:
        0 0 0 3px color-mix(
            in srgb,
            var(--ext-form-accent) 15%,
            transparent
        );
}


/* =========================================================
   RADIO BUTTONS
   ========================================================= */

.extapp.ext-course-form input[type="radio"] {
    width: 17px;
    height: 17px;

    margin: 0 5px 0 0;

    vertical-align: middle;

    accent-color: var(--ext-form-accent);
}


.extapp.ext-course-form input[type="radio"] + label {
    display: inline;
}


/* =========================================================
   CHECKBOX
   ========================================================= */

.extapp.ext-course-form input[type="checkbox"] {

    width: 19px;
    height: 19px;

    margin: 0 7px 0 0;

    vertical-align: middle;

    accent-color: var(--ext-form-accent);
}


/* Textos asociados */

.extapp.ext-course-form .ext-check,
.extapp.ext-course-form .checkbox,
.extapp.ext-course-form .privacy {
    display: flex;

    align-items: flex-start;

    gap: 6px;

    margin: 14px 0;

    font-size: 13px;
    line-height: 1.45;
}


/* =========================================================
   ENLACES
   ========================================================= */

.extapp.ext-course-form a {
    color: var(--ext-form-accent);
}


/* =========================================================
   BOTON PRINCIPAL
   ========================================================= */

.extapp.ext-course-form button[type="submit"],
.extapp.ext-course-form input[type="submit"] {

    display: block;

    width: 100%;
    min-height: 49px;

    margin-top: 20px;
    padding: 12px 18px;

    border: 0;
    border-radius: 10px;

    background: var(--ext-form-accent);
    color: #fff;

    font: inherit;
    font-size: 15px;
    font-weight: 700;

    text-align: center;

    cursor: pointer;

    box-shadow: none;

    transition:
        opacity .15s ease,
        transform .15s ease,
        box-shadow .15s ease;
}


.extapp.ext-course-form button[type="submit"]:hover,
.extapp.ext-course-form input[type="submit"]:hover {

    opacity: .92;

    transform: translateY(-1px);

    box-shadow:
        0 6px 16px rgba(0, 0, 0, .12);
}


/* =========================================================
   BOTON SECUNDARIO: VACIAR FORMULARIO
   ========================================================= */

.extapp.ext-course-form button[type="reset"],
.extapp.ext-course-form input[type="reset"] {

    width: 100%;

    margin-top: 8px;
    padding: 10px 14px;

    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 10px;

    background: transparent;
    color: inherit;

    font: inherit;

    cursor: pointer;
}


/* =========================================================
   SECCION SITUACION LABORAL
   ========================================================= */

.extapp.ext-course-form .ext-form-section-title {

    margin: 22px 0 12px;
    padding-bottom: 8px;

    border-bottom: 1px solid rgba(0, 0, 0, .10);

    font-size: 17px;
    font-weight: 700;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 600px) {

    .extapp.ext-course-form {

        max-width: 100%;

        margin: 12px 0;

        padding:
            26px 18px
            22px;

        border-radius: 12px;
    }

    .extapp.ext-course-form textarea {
        min-height: 150px;
    }

}

/* =========================================================
   FORMULARIOS EMPRESA
   ========================================================= */

.extapp .ext-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.extapp .ext-form-grid--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.extapp .ext-address-grid {
  display: grid;
  grid-template-columns:
    minmax(110px, .8fr)
    minmax(220px, 3fr)
    repeat(5, minmax(55px, .55fr));
  gap: .5rem;
  align-items: center;
}

.extapp .ext-inline-field {
  display: flex;
  align-items: center;
  gap: .5rem;
}

.extapp .ext-inline-field .ext-input {
  flex: 1;
}

.extapp .ext-radio-group {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

@media (max-width: 800px) {

  .extapp .ext-form-grid,
  .extapp .ext-form-grid--3 {
    grid-template-columns: 1fr;
  }

  .extapp .ext-address-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .extapp .ext-address-grid__street {
    grid-column: 1 / -1;
  }

}

@media (max-width: 520px) {

  .extapp .ext-address-grid {
    grid-template-columns: 1fr;
  }

  .extapp .ext-address-grid__street {
    grid-column: auto;
  }

  .extapp .ext-inline-field {
    align-items: stretch;
    flex-direction: column;
  }

}
.extapp .ext-layout--with-left {
  display: grid;
  grid-template-columns: minmax(180px, 240px) minmax(0, 1fr) minmax(220px, 280px);
  gap: 1.5rem;
  align-items: start;
}

.extapp .ext-left,
.extapp .ext-aside {
  min-width: 0;
}

.extapp .ext-logo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 1rem;
  align-items: center;
  margin-bottom: 1.5rem;
}

.extapp .ext-logo-item {
  text-align: center;
}

.extapp .ext-logo-item img {
  max-width: 100%;
  height: auto;
}

@media (max-width: 1000px) {
  .extapp .ext-layout--with-left {
    grid-template-columns: 1fr;
  }
}
.extapp .ext-account-access {
    width: 100%;
    padding: 24px;
    text-align: center;
    box-sizing: border-box;
}

.extapp .ext-account-access__message {
    margin: 0 0 10px;
    font-weight: 600;
}

.extapp .ext-account-access__action {
    margin: 0;
}

.extapp .ext-link {
    text-decoration: underline;
    cursor: pointer;
}

/* =========================================================
   COMPONENTES DE CLASES PHP LEGACY MODERNIZADAS
   ========================================================= */


/* =========================================================
   1. PAGINACION
   splitPageResults
   ========================================================= */

.extapp .ext-pagination{
    display: flex;
    justify-content: center;
    width: 100%;
    margin: 24px 0;
}

.extapp .ext-pagination__list{
    display: inline-flex;
    align-items: stretch;
    flex-wrap: nowrap;

    margin: 0;
    padding: 0;

    list-style: none;

    border: 1px solid var(--ext-border);
    border-radius: 6px;

    background: var(--ext-bg);

    overflow: hidden;
}

.extapp .ext-pagination__item{
    margin: 0;
    padding: 0;
}

.extapp .ext-pagination__link{
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 36px;
    height: 36px;
    padding: 0 11px;

    border: 0;
    border-right: 1px solid var(--ext-border);
    border-radius: 0;

    background: transparent;
    color: inherit;

    font-size: 14px;
    line-height: 1;
    text-align: center;
    text-decoration: none;

    transition:
        background .15s ease,
        color .15s ease;
}

.extapp .ext-pagination__item:last-child .ext-pagination__link{
    border-right: 0;
}

.extapp a.ext-pagination__link:hover{
    background: rgba(0,0,0,.05);
    text-decoration: none;
}

.extapp a.ext-pagination__link:focus{
    outline: none;
}

.extapp a.ext-pagination__link:focus-visible{
    position: relative;
    z-index: 2;
    box-shadow: inset 0 0 0 2px var(--ext-focus);
}

.extapp .ext-pagination__item.is-active .ext-pagination__link,
.extapp .ext-pagination__item.active .ext-pagination__link{
    background: #337ab7;
    color: #fff;
    font-weight: 600;
}

.extapp .ext-pagination__item.is-disabled .ext-pagination__link,
.extapp .ext-pagination__item.disabled .ext-pagination__link{
    opacity: .45;
    cursor: default;
    pointer-events: none;
}

.extapp .ext-pagination__item--previous .ext-pagination__link,
.extapp .ext-pagination__item--next .ext-pagination__link{
    min-width: 36px;
    padding: 0 10px;
}

.extapp .ext-pagination__item--ellipsis .ext-pagination__link{
    cursor: default;
}

@media (max-width: 600px){

    .extapp .ext-pagination__link{
        min-width: 34px;
        height: 34px;
        padding: 0 9px;
        font-size: 13px;
    }

}

/* =========================================================
   2. MESSAGE STACK / ALERTAS
   messageStack
   ========================================================= */

.extapp .ext-message-stack{
    width: 100%;
    margin: 0 0 16px;
    border-collapse: separate;
    border-spacing: 0;
}

.extapp .ext-message-stack__cell{
    padding: 0;
    border: 0;
}

.extapp .ext-alert{
    width: 100%;
    padding: 12px 14px;

    border: 1px solid var(--ext-border);
    border-radius: var(--ext-radius);

    line-height: 1.45;
}

.extapp .ext-alert__icon{
    margin-right: 6px;
}

.extapp .ext-alert__label{
    font-weight: 700;
}

.extapp .ext-alert--error{
    color: #842029;
    background: #f8d7da;
    border-color: #f5c2c7;
}

.extapp .ext-alert--warning{
    color: #664d03;
    background: #fff3cd;
    border-color: #ffecb5;
}

.extapp .ext-alert--success{
    color: #0f5132;
    background: #d1e7dd;
    border-color: #badbcc;
}

.extapp .ext-alert--info{
    color: #055160;
    background: #cff4fc;
    border-color: #b6effb;
}


/* =========================================================
   3. MENSAJES DE FORMULARIO
   Form
   ========================================================= */

.extapp .ext-form-message{
    display: inline-block;
    margin-top: 5px;

    font-size: 13px;
    line-height: 1.35;
    font-weight: 600;
}

.extapp .ext-form-message--error{
    color: #b42318;
}

.extapp .ext-form-message--success{
    color: #157347;
}


/* =========================================================
   4. BOX
   clase box
   ========================================================= */

.extapp .ext-box{
    width: 100%;
    margin: 0 0 16px;

    border: 1px solid var(--ext-border);
    border-radius: var(--ext-radius);

    background: var(--ext-bg);
    box-shadow: var(--ext-shadow);

    overflow: hidden;
}

.extapp .ext-box table{
    width: 100%;
}

.extapp .ext-box__heading-row{
    border: 0;
}

.extapp .ext-box__heading{
    padding: 10px 12px;

    background: rgba(0,0,0,.05);

    font-weight: 700;
    line-height: 1.3;
}

.extapp .ext-box__heading--menu{
    padding: 9px 12px;
}

.extapp .ext-box__heading-link{
    color: inherit;
    text-decoration: none;
}

.extapp .ext-box__heading-link:hover{
    text-decoration: underline;
}

.extapp .ext-box__heading-link:focus{
    outline: none;
}

.extapp .ext-box__heading-link:focus-visible{
    border-radius: 3px;
    box-shadow: 0 0 0 3px var(--ext-focus);
}

.extapp .ext-box__content{
    padding: 10px 12px;
    vertical-align: top;
}

.extapp .ext-box__content--menu{
    padding: 8px 12px;
}

.extapp .ext-box--info{
    /* Modificador preparado para ajustes específicos */
}

.extapp .ext-box--menu{
    /* Modificador preparado para ajustes específicos */
}


/* =========================================================
   5. INFO BOX / TABLE BOX
   infoBox, infoBoxCateg, tableBoxCateg
   ========================================================= */

.extapp .ext-info-box,
.extapp .ext-content-box,
.extapp .ext-images-box,
.extapp .ext-product-listing,
.extapp .ext-category-box{
    max-width: 100%;
    box-sizing: border-box;
}

.extapp .ext-info-box{
    width: 100%;

    border: 1px solid var(--ext-border);
    border-radius: var(--ext-radius);

    background: var(--ext-bg);
}

.extapp .ext-info-box__contents{
    width: 100%;
}

.extapp .ext-info-box__text{
    padding: 8px 10px;
    line-height: 1.45;
    vertical-align: top;
}

.extapp .ext-info-box--category{
    width: 100%;
}

.extapp .ext-category-box{
    width: 100% !important;
    max-width: 100%;

    background: transparent !important;
}


/* =========================================================
   6. CABECERA INFO BOX
   infoBoxHeading
   ========================================================= */

.extapp .ext-info-box-heading{
    width: 100%;
    border-collapse: collapse;
}

.extapp .ext-info-box-heading__corner{
    padding: 0;
    white-space: nowrap;
}

.extapp .ext-info-box-heading__corner img{
    display: block;
}

.extapp .ext-info-box-heading__title{
    padding: 6px 10px;

    font-weight: 700;
    line-height: 1.3;
}

.extapp .ext-info-box-heading__arrow{
    display: inline-flex;
    align-items: center;
    justify-content: center;

    text-decoration: none;
}

.extapp .ext-info-box-heading__arrow img{
    display: block;
}


/* =========================================================
   7. CONTENT BOX
   contentBox
   ========================================================= */

.extapp .ext-content-box{
    width: 100%;

    border: 1px solid var(--ext-border);
    border-radius: var(--ext-radius);

    background: var(--ext-bg);
}

.extapp .ext-content-box__contents{
    width: 100%;
}


/* =========================================================
   8. CONTENT BOX HEADING
   contentBoxHeading
   ========================================================= */

.extapp .ext-content-box-heading{
    width: 100%;
    border-collapse: collapse;
}

.extapp .ext-content-box-heading__corner{
    padding: 0;
    white-space: nowrap;
}

.extapp .ext-content-box-heading__corner img{
    display: block;
}

.extapp .ext-content-box-heading__title{
    padding: 6px 10px;

    font-weight: 700;
    line-height: 1.3;
}


/* =========================================================
   9. ERROR BOX
   errorBox
   ========================================================= */

.extapp .ext-error-box{
    padding: 10px 12px;

    border: 1px solid #f5c2c7;
    border-radius: var(--ext-radius);

    background: #f8d7da;
    color: #842029;

    line-height: 1.45;
}


/* =========================================================
   10. PRODUCT LISTING BOX
   productListingBox
   ========================================================= */

.extapp .ext-product-listing{
    width: 100%;
    max-width: 100%;

    border-collapse: collapse;
}

.extapp .ext-product-listing td,
.extapp .ext-product-listing th{
    padding: 8px 10px;
    vertical-align: top;
}


/* =========================================================
   11. IMAGES BOX
   imagesBox
   ========================================================= */

.extapp .ext-images-box{
    width: 100%;
    max-width: 100%;
}

.extapp .ext-images-box__contents{
    width: 100%;
}

.extapp .ext-images-box img{
    max-width: 100%;
    height: auto;
}


/* =========================================================
   12. CALENDARIO
   Calendar
   ========================================================= */

.extapp .ext-calendar{
    width: 100%;
    max-width: 100%;

    font-size: 14px;
}

.extapp .ext-calendar__layout{
    width: 100%;
    border-collapse: collapse;
}

.extapp .ext-calendar__header{
    background: rgba(0,0,0,.05);
}

.extapp .ext-calendar__month{
    padding: 8px 10px;

    font-weight: 700;
    line-height: 1.3;
}

.extapp .ext-calendar__month-link{
    color: inherit;
    font-weight: 700;
    text-decoration: none;
}

.extapp .ext-calendar__month-link:hover{
    text-decoration: underline;
}

.extapp .ext-calendar__previous,
.extapp .ext-calendar__next{
    width: 38px;
    padding: 4px;
    text-align: center;
}

.extapp .ext-calendar__nav-link{
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 30px;
    height: 30px;

    border-radius: 50%;

    color: inherit;
    font-size: 20px;
    line-height: 1;
    text-decoration: none;
}

.extapp .ext-calendar__nav-link:hover{
    background: rgba(0,0,0,.07);
    text-decoration: none;
}

.extapp .ext-calendar__nav-link:focus{
    outline: none;
}

.extapp .ext-calendar__nav-link:focus-visible{
    box-shadow: 0 0 0 3px var(--ext-focus);
}

.extapp .ext-calendar__month-table{
    width: 100%;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 1px;
}

.extapp .ext-calendar__weekdays th{
    padding: 6px 3px;

    background: rgba(0,0,0,.05);

    font-size: 12px;
    font-weight: 700;
    text-align: center;
}

.extapp .ext-calendar__day{
    height: 38px;
    padding: 5px;

    border: 1px solid var(--ext-border);

    background: var(--ext-bg);

    text-align: left;
    vertical-align: bottom;

    transition: background .12s ease;
}

.extapp .ext-calendar__day--weekend{
    background: rgba(0,0,0,.025);
}

.extapp .ext-calendar__day--today{
    border-color: rgba(0,0,0,.35);
    font-weight: 700;
}

.extapp .ext-calendar__day--empty{
    border-color: transparent;
    background: transparent;
}

.extapp .ext-calendar__day-link{
    display: flex;
    align-items: flex-end;

    width: 100%;
    height: 100%;

    color: inherit;
    font-weight: inherit;
    text-decoration: none;
}

.extapp .ext-calendar__day-link:hover{
    text-decoration: underline;
}


/* =========================================================
   13. CALENDARIO ANUAL
   Calendar::getYearHTML()
   ========================================================= */

.extapp .ext-calendar-year{
    width: 100%;
}

.extapp .ext-calendar-year__heading{
    margin-bottom: 16px;

    font-size: 22px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
}

.extapp .ext-calendar-year__grid{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.extapp .ext-calendar-year__month{
    min-width: 0;

    border: 1px solid var(--ext-border);
    border-radius: var(--ext-radius);

    background: var(--ext-bg);

    overflow: hidden;
}


/* =========================================================
   14. RESPONSIVE
   ========================================================= */

@media (max-width: 900px){

    .extapp .ext-calendar-year__grid{
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}


@media (max-width: 600px){

    .extapp .ext-pagination__list{
        gap: 3px;
    }

    .extapp .ext-pagination__link{
        min-width: 34px;
        min-height: 34px;
        padding: 6px 8px;
        font-size: 13px;
    }

    .extapp .ext-pagination__item--previous .ext-pagination__link,
    .extapp .ext-pagination__item--next .ext-pagination__link{
        padding-left: 9px;
        padding-right: 9px;
    }

    .extapp .ext-calendar-year__grid{
        grid-template-columns: 1fr;
    }

    .extapp .ext-calendar__day{
        height: 34px;
        padding: 3px;
        font-size: 12px;
    }

    .extapp .ext-calendar__weekdays th{
        padding: 5px 2px;
        font-size: 11px;
    }

    .extapp .ext-box__heading,
    .extapp .ext-box__content{
        padding-left: 9px;
        padding-right: 9px;
    }

}

.extapp .ext-box__heading-table{
    width: 100%;
    border-collapse: collapse;
}

.extapp .ext-box__content-table{
    width: 100%;
    border-collapse: collapse;
}

/* =========================================================
   PAGINACION DEL CATALOGO - mostrar_cursos.php
   El HTML actual genera:
   <nav class="ext-catalog-pagination">
     <div>Anterior</div>
     <div>1 2 3...</div>
     <div>Siguiente</div>
   </nav>
   ========================================================= */

.extapp .ext-catalog-pagination{
    display: inline-flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
    gap: 0;

    width: auto;
    max-width: 100%;
    margin: 24px auto;

    border: 1px solid var(--ext-border);
    border-radius: 6px;
    background: var(--ext-bg);

    overflow: hidden;
}

/* Los tres div internos no deben crear columnas separadas. */
.extapp .ext-catalog-pagination > div{
    display: contents;
}

.extapp .ext-catalog-pagination a,
.extapp .ext-catalog-pagination strong{
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 36px;
    height: 36px;
    margin: 0;
    padding: 0 11px;

    border: 0;
    border-right: 1px solid var(--ext-border);
    border-radius: 0;

    background: transparent;
    color: inherit;

    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    text-align: center;
    text-decoration: none;

    box-sizing: border-box;
}

.extapp .ext-catalog-pagination a:hover{
    background: rgba(0,0,0,.05);
    text-decoration: none;
}

.extapp .ext-catalog-pagination a:focus{
    outline: none;
}

.extapp .ext-catalog-pagination a:focus-visible{
    position: relative;
    z-index: 2;
    box-shadow: inset 0 0 0 2px var(--ext-focus);
}

/* Página actual */
.extapp .ext-catalog-pagination strong{
    background: #337ab7;
    color: #fff;
    font-weight: 600;
}

/* El último elemento visible no necesita separador derecho. */
.extapp .ext-catalog-pagination > div:last-child a:last-child,
.extapp .ext-catalog-pagination > div:last-child strong:last-child{
    border-right: 0;
}

@media (max-width: 600px){
    .extapp .ext-catalog-pagination{
        max-width: 100%;
        overflow-x: auto;
    }

    .extapp .ext-catalog-pagination a,
    .extapp .ext-catalog-pagination strong{
        min-width: 34px;
        height: 34px;
        padding: 0 9px;
        font-size: 13px;
    }
}

/* =========================================================
   FORMULARIO SOLICITUD DE INFORMACION
   ========================================================= */

.extapp.ext-course-form{
  --ext-form-accent:
    var(
      --e-global-color-primary,
      var(
        --wp--preset--color--primary,
        var(--global-palette1, #6b3fa0)
      )
    );

  position: relative;
  width: 100%;
  max-width: 560px;
  margin: 20px auto;
  padding: 32px;

  overflow: hidden;
  box-sizing: border-box;

  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;

  box-shadow: 0 12px 35px rgba(0,0,0,.08);
}


/* Barra superior */

.extapp.ext-course-form::before{
  content: "";

  position: absolute;
  top: 0;
  left: 0;

  width: 100%;
  height: 5px;

  background: var(--ext-form-accent);
}


/* Cabecera */

.extapp .ext-course-form__header{
  margin: 0 0 22px;
}

.extapp .ext-course-form__title{
  margin: 0 0 8px;

  font-size: 21px;
  font-weight: 700;
  line-height: 1.25;
}

.extapp .ext-course-form__course{
  margin: 0;

  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
}

.extapp .ext-course-form__intro{
  margin: 8px 0 0;

  font-size: 13px;
  line-height: 1.45;
}


/* Campos */

.extapp .ext-course-form__field{
  margin: 0 0 15px;
}

.extapp .ext-course-form__field > label,
.extapp .ext-course-form__fieldset > legend{
  display: block;

  margin: 0 0 6px;
  padding: 0;

  color: inherit;

  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
}


/* Inputs */

.extapp .ext-course-form__field input[type="text"],
.extapp .ext-course-form__field input[type="email"],
.extapp .ext-course-form__field input[type="tel"],
.extapp .ext-course-form__field select,
.extapp .ext-course-form__field textarea{
  display: block;

  width: 100%;
  max-width: 100%;
  min-height: 47px;

  padding: 12px 15px;

  box-sizing: border-box;

  border: 1px solid rgba(0,0,0,.12);
  border-radius: 10px;

  background: rgba(0,0,0,.015);
  color: inherit;

  font: inherit;
  font-size: 14px;
  line-height: 1.4;

  box-shadow: none;
  outline: none;

  transition:
    border-color .15s ease,
    box-shadow .15s ease,
    background .15s ease;
}


/* Focus */

.extapp .ext-course-form__field input:focus,
.extapp .ext-course-form__field select:focus,
.extapp .ext-course-form__field textarea:focus{
  border-color: var(--ext-form-accent);

  background: #fff;

  box-shadow: 0 0 0 3px rgba(0,0,0,.06);
}


/* Situacion laboral */

.extapp .ext-course-form__fieldset{
  min-width: 0;

  margin: 4px 0 18px;
  padding: 0;

  border: 0;
}

.extapp .ext-course-form__options{
  display: flex;
  flex-wrap: wrap;

  gap: 10px 20px;
}

.extapp .ext-course-form__option{
  display: inline-flex;
  align-items: center;

  gap: 7px;

  margin: 0;

  font-size: 14px;
  font-weight: 500;

  cursor: pointer;
}

.extapp .ext-course-form__option input[type="radio"]{
  width: 18px;
  height: 18px;

  margin: 0;

  accent-color: var(--ext-form-accent);
}


/* Checkboxes */

.extapp .ext-course-form__check{
  display: flex;
  align-items: flex-start;

  gap: 8px;

  margin: 14px 0;
}

.extapp .ext-course-form__check input[type="checkbox"]{
  flex: 0 0 auto;

  width: 19px;
  height: 19px;

  margin: 1px 0 0;

  accent-color: var(--ext-form-accent);
}

.extapp .ext-course-form__check label{
  margin: 0;

  font-size: 13px;
  font-weight: 500;
  line-height: 1.45;
}


/* Enlaces de privacidad */

.extapp .ext-course-form__check a,
.extapp .ext-course-form__check a:visited{
  color: var(--ext-form-accent);

  font-weight: 600;
}


/* Boton */

.extapp .ext-course-form__actions{
  margin-top: 20px;
}

.extapp .ext-course-form__submit{
  display: block;

  width: 100%;
  min-height: 49px;

  margin: 0;
  padding: 12px 18px;

  border: 0;
  border-radius: 10px;

  background: var(--ext-form-accent);
  color: #fff;

  font: inherit;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.2;

  text-align: center;

  cursor: pointer;

  box-shadow: none;

  transition:
    opacity .15s ease,
    transform .15s ease,
    box-shadow .15s ease;
}

.extapp .ext-course-form__submit:hover{
  opacity: .92;

  transform: translateY(-1px);

  box-shadow: 0 6px 16px rgba(0,0,0,.12);
}

.extapp .ext-course-form__submit:focus{
  outline: none;
}

.extapp .ext-course-form__submit:focus-visible{
  box-shadow: 0 0 0 3px var(--ext-focus);
}


/* Alertas */

.extapp.ext-course-form .ext-alert{
  margin-bottom: 20px;
}


/* Movil */

@media (max-width: 600px){

  .extapp.ext-course-form{
    max-width: 100%;

    margin: 12px 0;
    padding: 27px 18px 22px;

    border-radius: 12px;
  }

  .extapp .ext-course-form__options{
    flex-direction: column;

    gap: 9px;
  }

}
/* =========================================================
   DOCUMENTACION PARA RESERVA DE PLAZA
   ========================================================= */

.extapp.ext-docs{
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
}


/* =========================================================
   CABECERA
   ========================================================= */

.extapp .ext-docs__header{
    display: flex;
    align-items: center;

    gap: 18px;

    margin-bottom: 28px;
    padding-bottom: 20px;

    border-bottom: 1px solid var(--ext-border);
}

.extapp .ext-docs__header-icon{
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 52px;

    width: 52px;
    height: 52px;

    border-radius: 12px;

    background: rgba(0,0,0,.055);

    font-size: 23px;
}

.extapp .ext-docs__title{
    margin: 0;

    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
}

.extapp .ext-docs__subtitle{
    margin: 6px 0 0;

    opacity: .70;

    font-size: 15px;
    line-height: 1.45;
}


/* =========================================================
   GRID PRINCIPAL
   ========================================================= */

.extapp .ext-docs__grid{
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0,1fr));

    gap: 20px;

    margin-bottom: 20px;
}


/* =========================================================
   TARJETAS
   ========================================================= */

.extapp .ext-docs-card{
    min-width: 0;

    padding: 22px;

    border: 1px solid var(--ext-border);
    border-radius: 14px;

    background: var(--ext-bg);

    box-shadow:
        0 8px 24px rgba(0,0,0,.05);
}

.extapp .ext-docs-card--wide{
    margin-bottom: 20px;
}

.extapp .ext-docs-card__header{
    display: flex;
    align-items: flex-start;

    gap: 12px;

    margin-bottom: 18px;
}

.extapp .ext-docs-card__icon{
    display: inline-flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    border-radius: 10px;

    background: rgba(0,0,0,.055);

    font-size: 18px;
}

.extapp .ext-docs-card__title{
    margin: 6px 0 0;

    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
}

.extapp .ext-docs-card__description{
    margin: 5px 0 0;

    opacity: .70;

    font-size: 13px;
    line-height: 1.4;
}


/* =========================================================
   LISTAS
   ========================================================= */

.extapp .ext-docs-list{
    display: grid;

    gap: 11px;

    margin: 0;
    padding: 0;

    list-style: none;
}

.extapp .ext-docs-list li{
    display: flex;
    align-items: flex-start;

    gap: 9px;

    margin: 0;
    padding: 0;

    line-height: 1.45;
}

.extapp .ext-docs-list li > i{
    margin-top: 3px;

    opacity: .65;

    font-size: 15px;
}

.extapp .ext-docs-list--columns{
    grid-template-columns:
        repeat(2, minmax(0,1fr));
}


/* =========================================================
   AVISO BONIFICACION
   ========================================================= */

.extapp .ext-docs-note{
    display: flex;
    align-items: flex-start;

    gap: 9px;

    margin-top: 18px;
    padding: 12px 14px;

    border-radius: 10px;

    background: rgba(0,0,0,.045);

    font-size: 13px;
    line-height: 1.45;
}

.extapp .ext-docs-note i{
    margin-top: 2px;
}


/* =========================================================
   ENVIO DOCUMENTACION
   ========================================================= */

.extapp .ext-docs-delivery{
    margin-top: 20px;
    padding: 22px;

    border: 1px solid var(--ext-border);
    border-radius: 14px;

    background: var(--ext-bg);
}

.extapp .ext-docs-delivery__header{
    display: flex;
    align-items: flex-start;

    gap: 13px;

    margin-bottom: 20px;
}

.extapp .ext-docs-delivery__header h2{
    margin: 0;

    font-size: 20px;
    font-weight: 700;
}

.extapp .ext-docs-delivery__header p{
    margin: 5px 0 0;

    opacity: .7;

    font-size: 14px;
}

.extapp .ext-docs-delivery__icon{
    display: inline-flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    border-radius: 10px;

    background: rgba(0,0,0,.055);
}

.extapp .ext-docs-delivery__content{
    display: grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap: 16px;
}

.extapp .ext-docs-delivery__method{
    display: flex;
    align-items: flex-start;

    gap: 12px;

    padding: 16px;

    border: 1px solid var(--ext-border);
    border-radius: 10px;
}

.extapp .ext-docs-delivery__method > i{
    margin-top: 3px;

    font-size: 18px;

    opacity: .65;
}

.extapp .ext-docs-delivery__method p{
    margin: 5px 0 0;

    line-height: 1.45;
}

.extapp .ext-docs-delivery__value{
    display: block;

    margin-top: 4px;

    font-weight: 700;
}

.extapp .ext-docs-delivery__address{
    margin-top: 5px;

    line-height: 1.45;
}


/* =========================================================
   PLAZO
   ========================================================= */

.extapp .ext-docs-deadline{
    display: flex;
    align-items: center;

    gap: 12px;

    margin-top: 20px;
    padding: 15px 18px;

    border-left: 4px solid currentColor;

    background: rgba(0,0,0,.04);

    border-radius: 8px;
}

.extapp .ext-docs-deadline i{
    font-size: 21px;
}

.extapp .ext-docs-deadline strong{
    display: block;
}

.extapp .ext-docs-deadline span{
    display: block;

    margin-top: 2px;

    font-size: 14px;
}


/* =========================================================
   AYUDA
   ========================================================= */

.extapp .ext-docs-help{
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 8px;

    margin-top: 20px;
    padding: 14px;

    font-weight: 600;
    text-align: center;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 760px){

    .extapp .ext-docs__grid,
    .extapp .ext-docs-delivery__content,
    .extapp .ext-docs-list--columns{
        grid-template-columns: 1fr;
    }

    .extapp .ext-docs__header{
        align-items: flex-start;
    }

    .extapp .ext-docs__title{
        font-size: 23px;
    }

    .extapp .ext-docs-card,
    .extapp .ext-docs-delivery{
        padding: 18px;
    }

}
/* =========================================================
   DOCUMENTACION - DISTRIBUCION EN DOS COLUMNAS
   ========================================================= */

.extapp .ext-docs__grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    align-items: stretch;
    margin-bottom: 20px;
}

.extapp .ext-docs__grid--secondary{
    margin-top: 0;
}


/* Las tarjetas ocupan toda la altura de su columna */

.extapp .ext-docs-card,
.extapp .ext-docs-delivery{
    height: 100%;
    box-sizing: border-box;
}


/* Envío de documentación ya está dentro del grid */

.extapp .ext-docs-delivery{
    margin-top: 0;
}


/* Correo electrónico y ordinario uno debajo del otro */

.extapp .ext-docs-delivery__content{
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}


/* La lista de bonificación también en vertical */

.extapp .ext-docs-list--columns{
    grid-template-columns: 1fr;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 760px){

    .extapp .ext-docs__grid{
        grid-template-columns: 1fr;
    }

}

/* =========================================================
   RECORDATORIO / RECUPERACION DE CONTRASENA
   ========================================================= */

.extapp.ext-password{
    width:100%;
    max-width:680px;
    margin:35px auto;
    padding:0 16px;
    box-sizing:border-box;
}


/* =========================================================
   TARJETA PRINCIPAL
   ========================================================= */

.extapp .ext-password__card{
    position:relative;
    overflow:hidden;

    padding:32px;

    border:1px solid var(--ext-border);
    border-radius:18px;

    background:#fff;

    box-shadow:
        0 6px 20px rgba(0,0,0,.06),
        0 20px 45px rgba(0,0,0,.05);

    box-sizing:border-box;
}


/* Línea superior decorativa */

.extapp .ext-password__card::before{
    content:"";

    position:absolute;
    top:0;
    left:0;

    width:100%;
    height:4px;

    background:
        var(
            --e-global-color-primary,
            var(
                --wp--preset--color--primary,
                var(--global-palette1,#6b3fa0)
            )
        );
}


/* =========================================================
   CABECERA
   ========================================================= */

.extapp .ext-password__header{
    display:flex;
    align-items:center;
    gap:18px;

    margin-bottom:26px;
}


.extapp .ext-password__icon{
    display:flex;
    align-items:center;
    justify-content:center;

    flex:0 0 58px;

    width:58px;
    height:58px;

    border-radius:15px;

    background:rgba(0,0,0,.055);

    font-size:25px;
}


.extapp .ext-password__heading{
    min-width:0;
}


.extapp .ext-password__title{
    margin:0;

    font-size:27px;
    line-height:1.2;
    font-weight:700;

    color:inherit;
}


.extapp .ext-password__subtitle{
    margin:6px 0 0;

    font-size:14px;
    line-height:1.45;

    opacity:.68;
}


/* =========================================================
   MENSAJES
   ========================================================= */

.extapp .ext-password__messages{
    margin-bottom:20px;
}


.extapp .ext-password__messages table{
    width:100%;
}


.extapp .ext-password__messages .messageStackError,
.extapp .ext-password__messages .messageStackSuccess{
    border-radius:10px;
}


/* =========================================================
   INTRODUCCION
   ========================================================= */

.extapp .ext-password__intro{
    margin-bottom:22px;

    font-size:15px;
    line-height:1.6;
}


.extapp .ext-password__intro p{
    margin:0;
}


/* =========================================================
   SELECTOR DE OPCION
   ========================================================= */

.extapp .ext-password__fieldset{
    margin:0;
    padding:0;

    border:0;
}


.extapp .ext-password__legend{
    display:block;

    width:100%;

    margin:0 0 12px;
    padding:0;

    font-size:14px;
    font-weight:700;
}


.extapp .ext-password__options{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));

    gap:12px;

    margin-bottom:22px;
}


.extapp .ext-password-option{
    position:relative;

    display:flex;
    align-items:center;

    gap:12px;

    min-width:0;

    padding:16px;

    cursor:pointer;

    border:1px solid var(--ext-border);
    border-radius:12px;

    background:#fff;

    transition:
        border-color .15s ease,
        box-shadow .15s ease,
        transform .15s ease,
        background .15s ease;
}


.extapp .ext-password-option:hover{
    transform:translateY(-1px);

    border-color:rgba(0,0,0,.22);

    box-shadow:0 8px 20px rgba(0,0,0,.07);
}


.extapp .ext-password-option:has(
    .ext-password-option__radio:checked
){
    border-color:
        var(
            --e-global-color-primary,
            var(
                --wp--preset--color--primary,
                var(--global-palette1,#6b3fa0)
            )
        );

    background:rgba(0,0,0,.025);

    box-shadow:0 0 0 2px rgba(0,0,0,.035);
}


.extapp .ext-password-option__radio{
    position:absolute;

    width:1px;
    height:1px;

    opacity:0;
    pointer-events:none;
}


.extapp .ext-password-option__icon{
    display:flex;
    align-items:center;
    justify-content:center;

    flex:0 0 42px;

    width:42px;
    height:42px;

    border-radius:10px;

    background:rgba(0,0,0,.055);

    font-size:18px;
}


.extapp .ext-password-option__content{
    display:block;

    min-width:0;
}


.extapp .ext-password-option__content strong{
    display:block;

    margin-bottom:4px;

    font-size:14px;
    line-height:1.3;
}


.extapp .ext-password-option__content small{
    display:block;

    font-size:12px;
    line-height:1.35;

    opacity:.65;
}


/* =========================================================
   PANEL DE DATOS
   ========================================================= */

.extapp .ext-password__panel{
    margin-top:4px;
    margin-bottom:22px;

    padding:18px;

    border:1px solid var(--ext-border);
    border-radius:12px;

    background:rgba(0,0,0,.018);
}


.extapp .ext-password__panel[hidden]{
    display:none !important;
}


.extapp .ext-password__field{
    width:100%;
}


.extapp .ext-password__label{
    display:block;

    margin:0 0 8px;

    font-size:14px;
    font-weight:700;
}


.extapp .ext-password__input-wrap{
    position:relative;
}


.extapp .ext-password__input-icon{
    position:absolute;

    top:50%;
    left:15px;

    transform:translateY(-50%);

    z-index:2;

    opacity:.48;

    pointer-events:none;
}


.extapp .ext-password__input{
    width:100% !important;

    height:48px;

    padding-left:43px !important;

    border-radius:10px !important;

    box-sizing:border-box;
}


/* =========================================================
   BOTONES
   ========================================================= */

.extapp .ext-password__actions{
    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:12px;

    margin-top:6px;
}


.extapp .ext-password__actions .ext-btn{
    min-height:46px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    gap:8px;

    padding:11px 20px;

    border-radius:10px;

    text-decoration:none !important;

    font-weight:600;

    cursor:pointer;
}


.extapp .ext-password__back{
    background:#fff;

    border:1px solid var(--ext-border);

    color:inherit !important;
}


.extapp .ext-password__back:hover{
    background:rgba(0,0,0,.035);
}


.extapp .ext-password__submit{
    min-width:170px;
}


/* =========================================================
   EXITO
   ========================================================= */

.extapp .ext-password-success{
    padding:20px 10px 12px;

    text-align:center;
}


.extapp .ext-password-success__icon{
    display:flex;
    align-items:center;
    justify-content:center;

    width:68px;
    height:68px;

    margin:0 auto 18px;

    border-radius:50%;

    background:rgba(35,150,85,.11);

    color:#238b53;

    font-size:28px;
}


.extapp .ext-password-success h2{
    margin:0 0 10px;

    font-size:22px;
}


.extapp .ext-password-success p{
    max-width:470px;

    margin:0 auto 22px;

    line-height:1.55;

    opacity:.72;
}


.extapp .ext-password-success__button{
    display:inline-flex;

    align-items:center;
    justify-content:center;

    gap:8px;

    text-decoration:none !important;
}


/* =========================================================
   PIE
   ========================================================= */

.extapp .ext-password__footer{
    display:flex;
    align-items:flex-start;
    justify-content:center;

    gap:8px;

    margin-top:28px;
    padding-top:18px;

    border-top:1px solid var(--ext-border);

    font-size:12px;
    line-height:1.45;

    text-align:center;

    opacity:.58;
}


.extapp .ext-password__footer i{
    margin-top:2px;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width:600px){

    .extapp.ext-password{
        margin:18px auto;
        padding:0 10px;
    }


    .extapp .ext-password__card{
        padding:24px 18px;
        border-radius:14px;
    }


    .extapp .ext-password__header{
        align-items:flex-start;
        gap:13px;
    }


    .extapp .ext-password__icon{
        flex-basis:48px;

        width:48px;
        height:48px;

        font-size:21px;
    }


    .extapp .ext-password__title{
        font-size:22px;
    }


    .extapp .ext-password__options{
        grid-template-columns:1fr;
    }


    .extapp .ext-password__actions{
        flex-direction:column-reverse;

        align-items:stretch;
    }


    .extapp .ext-password__actions .ext-btn{
        width:100%;

        box-sizing:border-box;
    }


    .extapp .ext-password__submit{
        min-width:0;
    }

}

/* =========================================================
   CURSOS - INSCRIPCION EMPRESA
   ========================================================= */

.extapp .ext-course-grid.ext-course-grid--inscripcion{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    grid-auto-flow:row !important;
    gap:22px !important;
    width:100% !important;
    max-width:100% !important;
    align-items:stretch !important;
    box-sizing:border-box !important;
}

.extapp .ext-course-grid.ext-course-grid--inscripcion > .ext-course-card.ext-course-card--inscripcion{
    display:flex !important;
    flex-direction:column !important;
    grid-column:auto !important;
    grid-row:auto !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    height:100% !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden;
    background:#fff;
    border:1px solid var(--ext-border);
    border-radius:var(--ext-radius);
    box-shadow:var(--ext-shadow);
    box-sizing:border-box !important;
    transition:transform .18s ease,box-shadow .18s ease;
}

.extapp .ext-course-grid--inscripcion > .ext-course-card--inscripcion:hover{
    transform:translateY(-2px);
    box-shadow:0 8px 24px rgba(0,0,0,.08),0 18px 45px rgba(0,0,0,.05);
}

.extapp .ext-course-card--inscripcion .ext-course-card__media{
    position:relative;
    width:100%;
    height:210px;
    flex:0 0 210px;
    overflow:hidden;
    background:#f3f3f3;
}

.extapp .ext-course-card--inscripcion .ext-course-card__media img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    transition:transform .25s ease;
}

.extapp .ext-course-card--inscripcion:hover .ext-course-card__media img{
    transform:scale(1.025);
}

.extapp .ext-course-card--inscripcion .ext-course-card__overlay{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(0,0,0,.30);
    opacity:0;
    transition:opacity .18s ease;
}

.extapp .ext-course-card--inscripcion .ext-course-card__media:hover .ext-course-card__overlay{
    opacity:1;
}

.extapp .ext-course-card--inscripcion .ext-course-card__overlay a{
    display:flex;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    border-radius:50%;
    background:#fff;
    color:#333 !important;
    font-size:16px;
    text-decoration:none !important;
    box-shadow:0 3px 12px rgba(0,0,0,.18);
}

.extapp .ext-course-card--inscripcion .ext-course-card__body{
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-width:0;
    padding:22px;
    box-sizing:border-box;
}

.extapp .ext-course-card--inscripcion .ext-course-card__title{
    margin:0 0 16px;
    padding:0;
    font-size:19px;
    line-height:1.35;
    font-weight:700;
    overflow-wrap:anywhere;
}

.extapp .ext-course-card--inscripcion .ext-course-card__title a,
.extapp .ext-course-card--inscripcion .ext-course-card__title a:visited{
    color:inherit !important;
    text-decoration:none !important;
}

.extapp .ext-course-card--inscripcion .ext-course-card__title a:hover,
.extapp .ext-course-card--inscripcion .ext-course-card__title a:focus{
    color:inherit !important;
    text-decoration:none !important;
    opacity:.75;
}

.extapp .ext-course-card--inscripcion .ext-course-card__details{
    display:flex;
    flex-direction:column;
    gap:0;
    margin:0 0 20px;
}

.extapp .ext-course-card--inscripcion .ext-course-card__detail{
    display:flex;
    align-items:center;
    gap:7px;
    min-width:0;
    min-height:32px;
    padding:6px 0;
    margin:0;
    box-sizing:border-box;
    font-size:13px;
    line-height:1.45;
}

.extapp .ext-course-card--inscripcion .ext-course-card__detail > i{
    flex:0 0 18px;
    width:18px;
    margin:0;
    text-align:center;
    font-size:13px;
    opacity:.62;
}

.extapp .ext-course-card--inscripcion .ext-course-card__detail-label{
    flex:0 0 auto;
    margin:0;
    font-size:13px;
    line-height:1.45;
    font-weight:700;
    text-transform:none;
    letter-spacing:normal;
    opacity:.72;
}

.extapp .ext-course-card--inscripcion .ext-course-card__detail-value{
    flex:1 1 auto;
    min-width:0;
    margin:0;
    font-size:13px;
    line-height:1.45;
    overflow-wrap:anywhere;
}

.extapp .ext-course-card--inscripcion .ext-course-card__action{
    margin-top:auto;
    padding-top:5px;
}

.extapp .ext-course-card--inscripcion .ext-course-card__enrol{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    width:100%;
    min-height:44px;
    padding:10px 16px;
    box-sizing:border-box;
    text-align:center;
    text-decoration:none !important;
}

.extapp .ext-course-card--inscripcion .ext-course-card__footer{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    padding:14px 22px;
    background:rgba(0,0,0,.018);
    border-top:1px solid var(--ext-border);
    box-sizing:border-box;
}

.extapp .ext-course-card--inscripcion .ext-course-card__footer-btn{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    width:100%;
    min-width:0;
    min-height:38px;
    padding:8px 12px;
    box-sizing:border-box;
    font-size:13px;
    line-height:1.3;
    font-weight:600;
    text-align:center;
    text-decoration:none !important;
}

.extapp .ext-course-card--inscripcion .ext-course-card__footer-btn:hover,
.extapp .ext-course-card--inscripcion .ext-course-card__footer-btn:focus{
    text-decoration:none !important;
}

@media (max-width:900px){
    .extapp .ext-course-grid.ext-course-grid--inscripcion{
        grid-template-columns:minmax(0,1fr) !important;
    }
}

@media (max-width:600px){
    .extapp .ext-course-grid.ext-course-grid--inscripcion{
        gap:16px !important;
    }

    .extapp .ext-course-card--inscripcion .ext-course-card__media{
        height:190px;
        flex-basis:190px;
    }

    .extapp .ext-course-card--inscripcion .ext-course-card__body{
        padding:18px;
    }

    .extapp .ext-course-card--inscripcion .ext-course-card__title{
        font-size:18px;
    }

    .extapp .ext-course-card--inscripcion .ext-course-card__footer{
        padding:12px 18px;
    }
}

@media (max-width:420px){
    .extapp .ext-course-card--inscripcion .ext-course-card__footer{
        grid-template-columns:1fr;
    }
}
/* =========================================================
   EMPRESA - POBLACION / CP / PROVINCIA
   ========================================================= */

.extapp .ext-form-grid--location{
	display:grid;
	grid-template-columns:minmax(0,1.5fr) minmax(110px,.55fr) minmax(0,1.25fr);
	gap:16px;
	align-items:end;
	width:100%;
}

.extapp .ext-form-grid--location > .ext-field{
	min-width:0;
	margin:0;
}

.extapp .ext-form-grid--location .ext-inline-field{
	display:flex;
	align-items:stretch;
	gap:8px;
	width:100%;
}

.extapp .ext-form-grid--location .ext-inline-field .ext-input{
	flex:1 1 auto;
	min-width:0;
}

.extapp .ext-form-grid--location .ext-inline-field .ext-btn{
	flex:0 0 auto;
	display:flex;
	align-items:center;
	justify-content:center;
}

.extapp .ext-form-grid--location .ext-input,
.extapp .ext-form-grid--location .ext-select{
	width:100%;
	box-sizing:border-box;
}

@media (max-width:800px){
	.extapp .ext-form-grid--location{
		grid-template-columns:1fr 140px;
	}

	.extapp .ext-form-grid--location > .ext-field:last-child{
		grid-column:1 / -1;
	}
}

@media (max-width:520px){
	.extapp .ext-form-grid--location{
		grid-template-columns:1fr;
	}

	.extapp .ext-form-grid--location > .ext-field:last-child{
		grid-column:auto;
	}
}
/* =========================================================
   FORMULARIOS - TRES CAMPOS EN UNA FILA
   ========================================================= */

.extapp .ext-form-grid--three{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:16px;
	align-items:end;
	width:100%;
}

.extapp .ext-form-grid--three > .ext-field{
	min-width:0;
	margin:0;
}

.extapp .ext-form-grid--three .ext-input,
.extapp .ext-form-grid--three .ext-select{
	width:100%;
	box-sizing:border-box;
}

@media (max-width:700px){
	.extapp .ext-form-grid--three{
		grid-template-columns:1fr;
	}
}

/* =========================================================
   SESIONES / HORARIO DEL CURSO
   ========================================================= */

.extapp.ext-sessions{
	width:100%;
	max-width:100%;
	padding:20px;
	box-sizing:border-box;
}

.extapp .ext-sessions__header{
	margin:0 0 24px;
	padding:22px;
	background:#fff;
	border:1px solid var(--ext-border);
	border-radius:var(--ext-radius);
	box-shadow:var(--ext-shadow);
}

.extapp .ext-sessions__heading{
	margin:0 0 20px;
	padding:0 0 18px;
	border-bottom:1px solid var(--ext-border);
}

.extapp .ext-sessions__eyebrow{
	display:flex;
	align-items:center;
	gap:7px;
	margin:0 0 7px;
	font-size:13px;
	font-weight:600;
	line-height:1.4;
	opacity:.65;
}

.extapp .ext-sessions__title{
	margin:0;
	padding:0;
	font-size:24px;
	font-weight:700;
	line-height:1.3;
	overflow-wrap:anywhere;
}

.extapp .ext-sessions__dates{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:14px;
}

.extapp .ext-sessions__date{
	display:flex;
	align-items:center;
	gap:12px;
	min-width:0;
	padding:14px 16px;
	background:var(--ext-bg);
	border:1px solid var(--ext-border);
	border-radius:10px;
}

.extapp .ext-sessions__date-icon{
	display:flex;
	align-items:center;
	justify-content:center;
	flex:0 0 38px;
	width:38px;
	height:38px;
	border-radius:50%;
	background:#fff;
	border:1px solid var(--ext-border);
	font-size:15px;
}

.extapp .ext-sessions__date-content{
	display:flex;
	flex-direction:column;
	min-width:0;
	gap:2px;
}

.extapp .ext-sessions__date-label{
	font-size:12px;
	font-weight:600;
	line-height:1.3;
	opacity:.62;
}

.extapp .ext-sessions__date-content strong{
	font-size:15px;
	line-height:1.3;
}

.extapp .ext-sessions__table-wrap{
	width:100%;
	overflow-x:auto;
	background:#fff;
	border:1px solid var(--ext-border);
	border-radius:var(--ext-radius);
	box-shadow:var(--ext-shadow);
}

.extapp .ext-sessions__table{
	width:100%;
	margin:0;
	border:0;
	border-collapse:collapse;
	border-spacing:0;
	background:#fff;
}

.extapp .ext-sessions__table thead th{
	padding:14px 18px;
	background:var(--ext-bg);
	border:0;
	border-bottom:1px solid var(--ext-border);
	font-size:13px;
	font-weight:700;
	line-height:1.4;
	text-align:left;
	vertical-align:middle;
}

.extapp .ext-sessions__table thead th i{
	width:18px;
	margin-right:5px;
	text-align:center;
	opacity:.65;
}

.extapp .ext-sessions__table tbody td{
	padding:13px 18px;
	border:0;
	border-bottom:1px solid var(--ext-border);
	font-size:14px;
	line-height:1.45;
	text-align:left;
	vertical-align:middle;
}

.extapp .ext-sessions__table tbody tr:last-child td{
	border-bottom:0;
}

.extapp .ext-sessions__table tbody tr:hover{
	background:rgba(0,0,0,.018);
}

.extapp .ext-sessions__day{
	width:190px;
	white-space:nowrap;
}

.extapp .ext-sessions__day > i{
	width:18px;
	margin-right:7px;
	text-align:center;
	opacity:.55;
}

.extapp .ext-sessions__schedule{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:8px 18px;
}

.extapp .ext-sessions__shift{
	display:inline-flex;
	align-items:center;
	gap:6px;
	white-space:nowrap;
}

.extapp .ext-sessions__shift > i{
	width:16px;
	text-align:center;
	opacity:.6;
}

@media (max-width:600px){
	.extapp.ext-sessions{
		padding:12px;
	}

	.extapp .ext-sessions__header{
		padding:18px;
	}

	.extapp .ext-sessions__title{
		font-size:20px;
	}

	.extapp .ext-sessions__dates{
		grid-template-columns:1fr;
	}

	.extapp .ext-sessions__table thead{
		display:none;
	}

	.extapp .ext-sessions__table,
	.extapp .ext-sessions__table tbody,
	.extapp .ext-sessions__table tr,
	.extapp .ext-sessions__table td{
		display:block;
		width:100%;
		box-sizing:border-box;
	}

	.extapp .ext-sessions__table tbody tr{
		padding:14px 16px;
		border-bottom:1px solid var(--ext-border);
	}

	.extapp .ext-sessions__table tbody tr:last-child{
		border-bottom:0;
	}

	.extapp .ext-sessions__table tbody td{
		padding:4px 0;
		border:0;
	}

	.extapp .ext-sessions__day{
		width:100%;
		margin-bottom:5px;
	}

	.extapp .ext-sessions__schedule{
		display:flex;
	}
}
/* =========================================================
   FICHA CURSO - CURSOS PROGRAMADOS
   ========================================================= */

.extapp .ext-programmed-course{
	width:100%;
	margin:18px 0 0;
	padding:20px;
	background:#fff;
	border:1px solid var(--ext-border);
	border-radius:var(--ext-radius);
	box-shadow:var(--ext-shadow);
	box-sizing:border-box;
}

.extapp .ext-programmed-course__dates{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:14px;
	margin:0 0 18px;
}

.extapp .ext-programmed-course__date{
	display:flex;
	align-items:center;
	gap:12px;
	min-width:0;
	padding:14px 16px;
	background:var(--ext-bg);
	border:1px solid var(--ext-border);
	border-radius:10px;
	box-sizing:border-box;
}

.extapp .ext-programmed-course__date-icon{
	display:flex;
	align-items:center;
	justify-content:center;
	flex:0 0 38px;
	width:38px;
	height:38px;
	border-radius:50%;
	background:#fff;
	border:1px solid var(--ext-border);
	font-size:15px;
}

.extapp .ext-programmed-course__date-content{
	display:flex;
	flex-direction:column;
	min-width:0;
	gap:2px;
}

.extapp .ext-programmed-course__label{
	display:block;
	margin:0 0 3px;
	font-size:12px;
	font-weight:600;
	line-height:1.3;
	opacity:.62;
}

.extapp .ext-programmed-course__date-content strong{
	font-size:15px;
	line-height:1.3;
}

.extapp .ext-programmed-course__details{
	display:flex;
	flex-direction:column;
	margin:0;
	padding:0;
	border-top:1px solid var(--ext-border);
}

.extapp .ext-programmed-course__detail{
	display:flex;
	align-items:center;
	gap:12px;
	min-width:0;
	padding:14px 2px;
	border-bottom:1px solid var(--ext-border);
	font-size:14px;
	line-height:1.45;
}

.extapp .ext-programmed-course__detail > i{
	flex:0 0 28px;
	width:28px;
	margin:0;
	text-align:center;
	font-size:16px;
	opacity:.58;
}

.extapp .ext-programmed-course__detail > div{
	flex:1 1 auto;
	min-width:0;
}

.extapp .ext-programmed-course__detail strong{
	font-weight:600;
	overflow-wrap:anywhere;
}

.extapp .ext-programmed-course__shifts{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:6px 18px;
}

.extapp .ext-programmed-course__shifts span{
	display:inline-block;
}

.extapp .ext-programmed-course__actions{
	display:flex;
	justify-content:flex-end;
	margin:18px 0 0;
}

.extapp .ext-programmed-course__sessions{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:7px;
	min-height:42px;
	padding:9px 18px;
	text-decoration:none !important;
}

.extapp .ext-programmed-course__sessions:hover,
.extapp .ext-programmed-course__sessions:focus{
	text-decoration:none !important;
}

@media (max-width:600px){
	.extapp .ext-programmed-course{
		padding:16px;
	}

	.extapp .ext-programmed-course__dates{
		grid-template-columns:1fr;
	}

	.extapp .ext-programmed-course__shifts{
		flex-direction:column;
		align-items:flex-start;
		gap:4px;
	}

	.extapp .ext-programmed-course__actions{
		justify-content:stretch;
	}

	.extapp .ext-programmed-course__sessions{
		width:100%;
		box-sizing:border-box;
	}
}/* =========================================================
   DATOS DE EMPRESA - NUEVA DISTRIBUCION
   ========================================================= */

.extapp .ext-form-grid--business-top{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:16px;
	align-items:end;
	width:100%;
}

.extapp .ext-form-grid--business-codes{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:16px;
	width:100%;
}

.extapp .ext-form-grid--code-description{
	display:grid;
	grid-template-columns:minmax(0,30%) minmax(0,70%);
	gap:12px;
	align-items:end;
	width:100%;
}

.extapp .ext-form-grid--iban-pyme{
	display:grid;
	grid-template-columns:minmax(0,1fr) 180px;
	gap:16px;
	align-items:end;
	width:100%;
}

.extapp .ext-form-grid--iban-pyme .ext-field--compact{
	padding:0;
	margin:0;
	min-height:0;
}

.extapp .ext-form-grid--iban-pyme .ext-field--compact .ext-label{
	margin-bottom:6px;
}

.extapp .ext-radio-group--inline{
	display:flex;
	align-items:center;
	gap:16px;
	min-height:42px;
	padding:0 4px;
}

.extapp .ext-form-grid--business-contact{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:16px;
	align-items:end;
	width:100%;
}

.extapp .ext-form-grid--business-bottom{
	display:grid;
	grid-template-columns:minmax(140px,.45fr) minmax(120px,.35fr);
	gap:16px;
	align-items:end;
	width:100%;
	max-width:520px;
}

.extapp .ext-form-grid--business-top > .ext-field,
.extapp .ext-form-grid--business-codes > .ext-field,
.extapp .ext-form-grid--code-description > .ext-field,
.extapp .ext-form-grid--iban-pyme > .ext-field,
.extapp .ext-form-grid--business-contact > .ext-field,
.extapp .ext-form-grid--business-bottom > .ext-field{
	min-width:0;
	margin:0;
}

.extapp .ext-form-grid--business-top .ext-input,
.extapp .ext-form-grid--business-top .ext-select,
.extapp .ext-form-grid--business-codes .ext-input,
.extapp .ext-form-grid--business-codes .ext-select,
.extapp .ext-form-grid--iban-pyme .ext-input,
.extapp .ext-form-grid--business-contact .ext-input,
.extapp .ext-form-grid--business-bottom .ext-input{
	width:100%;
	box-sizing:border-box;
}

@media (max-width:900px){
	.extapp .ext-form-grid--business-codes{
		grid-template-columns:1fr;
	}

	.extapp .ext-form-grid--iban-pyme{
		grid-template-columns:1fr 160px;
	}
}

@media (max-width:700px){
	.extapp .ext-form-grid--business-top,
	.extapp .ext-form-grid--business-contact,
	.extapp .ext-form-grid--business-bottom,
	.extapp .ext-form-grid--iban-pyme{
		grid-template-columns:1fr;
		max-width:none;
	}

	.extapp .ext-form-grid--code-description{
		grid-template-columns:minmax(100px,30%) minmax(0,70%);
	}
}

@media (max-width:480px){
	.extapp .ext-form-grid--code-description{
		grid-template-columns:1fr;
	}
}
/* =========================================================
   ASESORIA
   ========================================================= */

.extapp .ext-form-grid--advisor-main{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:16px;
	align-items:end;
	width:100%;
}

.extapp .ext-form-grid--advisor-secondary{
	display:grid;
	grid-template-columns:minmax(0,2fr) minmax(140px,1fr) minmax(140px,1fr);
	gap:16px;
	align-items:end;
	width:100%;
}

.extapp .ext-form-grid--advisor-main > .ext-field,
.extapp .ext-form-grid--advisor-secondary > .ext-field{
	min-width:0;
	margin:0;
}

.extapp .ext-form-grid--advisor-main .ext-input,
.extapp .ext-form-grid--advisor-secondary .ext-input{
	width:100%;
	box-sizing:border-box;
}


/* =========================================================
   REPRESENTANTE LEGAL
   ========================================================= */

.extapp .ext-form-grid--representative-top{
	display:grid;
	grid-template-columns:180px minmax(160px,240px);
	gap:16px;
	align-items:end;
	width:100%;
}

.extapp .ext-form-grid--representative-top .ext-field--compact{
	margin:0;
	padding:0;
	min-height:0;
}

.extapp .ext-form-grid--representative-top .ext-field--compact .ext-label{
	margin-bottom:6px;
}

.extapp .ext-form-grid--representative-top .ext-radio-group--inline{
	display:flex;
	align-items:center;
	gap:16px;
	min-height:42px;
	padding:0 4px;
}

.extapp .ext-form-grid--representative-contact{
	display:grid;
	grid-template-columns:minmax(200px,1.2fr) minmax(130px,.45fr) minmax(240px,1.5fr);
	gap:16px;
	align-items:end;
	width:100%;
}

.extapp .ext-form-grid--representative-contact > .ext-field{
	min-width:0;
	margin:0;
}

.extapp .ext-form-grid--representative-contact .ext-input{
	width:100%;
	box-sizing:border-box;
}

@media (max-width:800px){
	.extapp .ext-form-grid--advisor-secondary,
	.extapp .ext-form-grid--representative-contact{
		grid-template-columns:1fr;
	}

	.extapp .ext-form-grid--representative-top{
		grid-template-columns:1fr 1fr;
	}
}

@media (max-width:520px){
	.extapp .ext-form-grid--advisor-main,
	.extapp .ext-form-grid--representative-top{
		grid-template-columns:1fr;
	}
}
/* =========================================================
   ALTA ALUMNO - IDENTIFICACION
   ========================================================= */

.extapp .ext-form-grid--student-id{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:16px;
	align-items:start;
	width:100%;
}

.extapp .ext-form-grid--two{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:16px;
	align-items:end;
	width:100%;
}


/* =========================================================
   NOMBRE Y APELLIDOS
   ========================================================= */

.extapp .ext-form-grid--student-name{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:16px;
	align-items:end;
	width:100%;
}

.extapp .ext-form-grid--student-name > .ext-field{
	min-width:0;
	margin:0;
}


/* =========================================================
   SEXO Y FECHA DE NACIMIENTO
   ========================================================= */

.extapp .ext-form-grid--student-personal{
	display:grid;
	grid-template-columns:minmax(160px,.45fr) minmax(0,1.55fr);
	gap:16px;
	align-items:end;
	width:100%;
}

.extapp .ext-date-grid{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:8px;
	width:100%;
}

.extapp .ext-date-grid .ext-select{
	width:100%;
	min-width:0;
	box-sizing:border-box;
}


/* =========================================================
   DIRECCION - MISMO CRITERIO QUE EMPRESA
   ========================================================= */

.extapp .ext-address-grid{
	display:grid;
	grid-template-columns:120px minmax(360px,1fr) repeat(5,78px);
	gap:10px;
	align-items:center;
	width:100%;
}

.extapp .ext-address-grid .ext-select,
.extapp .ext-address-grid .ext-input{
	width:100%;
	min-width:0;
	max-width:none;
	box-sizing:border-box;
	margin:0;
}

.extapp .ext-address-grid__street{
	min-width:0;
}

@media (max-width:1200px){
	.extapp .ext-address-grid{
		grid-template-columns:120px minmax(280px,1fr) repeat(5,78px);
		gap:8px;
	}
}

@media (max-width:900px){
	.extapp .ext-address-grid{
		grid-template-columns:120px minmax(220px,1fr) repeat(5,70px);
		gap:7px;
	}
}

@media (max-width:700px){
	.extapp .ext-address-grid{
		grid-template-columns:1fr 1fr;
	}

	.extapp .ext-address-grid__street{
		grid-column:1 / -1;
	}
}


/* =========================================================
   RESTO ALTA ALUMNO
   ========================================================= */

.extapp .ext-form-grid--student-contact{
	display:grid;
	grid-template-columns:repeat(2,minmax(140px,220px));
	gap:16px;
	align-items:end;
	width:100%;
}

.extapp .ext-form-grid--student-labor{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:16px;
	align-items:end;
	width:100%;
}

.extapp .ext-form-grid--student-training{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:16px;
	align-items:end;
	width:100%;
}

.extapp .ext-form-grid--student-flags{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:16px;
	align-items:end;
	width:100%;
}

.extapp .ext-form-grid--student-online{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:16px;
	align-items:end;
	width:100%;
}

.extapp .ext-field-error{
	display:block;
	margin-top:5px;
	color:#b42318;
	font-size:12px;
	line-height:1.35;
}

.extapp .ext-form-required{
	margin:0 0 16px;
	font-size:13px;
	font-weight:600;
}

.extapp .ext-login-card{
	max-width:650px;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width:900px){

	.extapp .ext-form-grid--student-training,
	.extapp .ext-form-grid--student-flags{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}

}

@media (max-width:800px){

	.extapp .ext-form-grid--student-name{
		grid-template-columns:repeat(3,minmax(0,1fr));
	}

	.extapp .ext-form-grid--student-personal{
		grid-template-columns:1fr;
	}

	.extapp .ext-address-grid{
		grid-template-columns:minmax(100px,.55fr) minmax(0,2fr) 80px;
	}

	.extapp .ext-address-grid > :last-child{
		grid-column:1 / -1;
	}

	.extapp .ext-form-grid--location{
		grid-template-columns:1fr 130px;
	}

	.extapp .ext-form-grid--location > .ext-field:last-child{
		grid-column:1 / -1;
	}

}

@media (max-width:650px){

	.extapp .ext-form-grid--student-id,
	.extapp .ext-form-grid--two,
	.extapp .ext-form-grid--student-name,
	.extapp .ext-form-grid--student-labor,
	.extapp .ext-form-grid--student-training,
	.extapp .ext-form-grid--student-flags,
	.extapp .ext-form-grid--student-online{
		grid-template-columns:1fr;
	}

	.extapp .ext-address-grid,
	.extapp .ext-form-grid--location,
	.extapp .ext-form-grid--student-contact{
		grid-template-columns:1fr;
	}

	.extapp .ext-address-grid > :last-child,
	.extapp .ext-form-grid--location > .ext-field:last-child{
		grid-column:auto;
	}

}

@media (max-width:480px){

	.extapp .ext-date-grid{
		grid-template-columns:repeat(3,minmax(0,1fr));
		gap:5px;
	}

}
/* =========================================================
   ESTADOS
   ========================================================= */

.extapp .ext-status{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:7px;
	width:auto;
	min-height:34px;
	padding:7px 12px;
	border:1px solid var(--ext-border);
	border-radius:var(--ext-radius);
	background:var(--ext-bg);
	font-size:14px;
	font-weight:600;
	line-height:1.2;
	text-decoration:none;
	white-space:nowrap;
	box-sizing:border-box;
}

.extapp .ext-status i{
	flex:0 0 auto;
	font-size:14px;
	line-height:1;
}

.extapp .ext-status--success{
	color:#1f7a45;
	background:#edf8f1;
	border-color:#b9dfc8;
}

.extapp .ext-status--warning{
	color:#8a5a00;
	background:#fff8e6;
	border-color:#ead49a;
}

.extapp .ext-status--danger{
	color:#a12b2b;
	background:#fdf0f0;
	border-color:#e8b9b9;
}

.extapp .ext-status--info{
	color:#25638a;
	background:#eef7fc;
	border-color:#bddbea;
}

.extapp .ext-status--neutral{
	color:#5f6368;
	background:#f5f5f5;
	border-color:#d8d8d8;
}
/* =========================================================
   FICHA DE ACCIÓN FORMATIVA
   ========================================================= */

.extapp .ext-course{
	max-width:1180px;
	margin:0 auto;
}

/* CABECERA */

.extapp .ext-course__hero{
	position:relative;
	display:block;
	margin:0 0 22px;
	padding:32px 34px 28px;
	border:1px solid var(--ext-border);
	border-radius:var(--ext-radius);
	background:#fff;
	box-shadow:var(--ext-shadow);
	overflow:hidden;
}

.extapp .ext-course__hero:before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:4px;
	background:var(--ext-form-accent,var(--e-global-color-primary,#6b3fa0));
}

.extapp .ext-course__hero-content{
	display:block;
	padding:0;
}

.extapp .ext-course__eyebrow{
	display:flex;
	align-items:center;
	gap:7px;
	margin:0 0 10px;
	font-size:12px;
	font-weight:700;
	line-height:1.3;
	letter-spacing:.07em;
	text-transform:uppercase;
	color:#73777f;
}

.extapp .ext-course__eyebrow i{
	color:var(--ext-form-accent,var(--e-global-color-primary,#6b3fa0));
}

.extapp .ext-course__hero h1{
	max-width:950px;
	margin:0;
	padding:0;
	border:0;
	font-size:clamp(26px,3vw,38px);
	font-weight:700;
	line-height:1.16;
	letter-spacing:-.02em;
	color:#202124;
}

.extapp .ext-course__intro{
	max-width:820px;
	margin:13px 0 20px;
	font-size:15px;
	font-weight:400;
	line-height:1.6;
	color:#6b7078;
}

/* DATOS PRINCIPALES DE CABECERA */

.extapp .ext-course__facts{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:8px;
	margin-top:4px;
}

.extapp .ext-course__facts > span{
	display:inline-flex;
	align-items:center;
	gap:7px;
	min-height:34px;
	padding:7px 12px;
	border:1px solid #e3e5e8;
	border-radius:999px;
	background:#f8f9fa;
	font-size:13px;
	font-weight:600;
	line-height:1.2;
	color:#4f545b;
}

.extapp .ext-course__facts > span i{
	font-size:14px;
	color:#73777f;
}

.extapp .ext-course__facts .ext-price{
	border-color:var(--ext-form-accent,var(--e-global-color-primary,#6b3fa0));
	background:#fff;
	font-size:14px;
	font-weight:700;
	color:var(--ext-form-accent,var(--e-global-color-primary,#6b3fa0));
}

/* TARJETA PRINCIPAL */

.extapp .ext-course > .ext-card{
	padding:0;
	border:1px solid var(--ext-border);
	border-radius:var(--ext-radius);
	background:#fff;
	box-shadow:var(--ext-shadow);
	overflow:hidden;
}

/* =========================================================
   PESTAÑAS
   ========================================================= */

.extapp .ext-tabs__nav{
	display:flex;
	align-items:stretch;
	gap:0;
	margin:0;
	padding:0 20px;
	border-bottom:1px solid #e5e7ea;
	background:#fafafa;
}

.extapp .ext-tabs__button{
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:7px;
	min-height:56px;
	margin:0;
	padding:0 17px;
	border:0;
	background:transparent;
	font-family:inherit;
	font-size:14px;
	font-weight:600;
	line-height:1.2;
	color:#666b72;
	cursor:pointer;
	transition:color .15s ease,background-color .15s ease;
}

.extapp .ext-tabs__button:after{
	content:"";
	position:absolute;
	right:15px;
	bottom:0;
	left:15px;
	height:3px;
	border-radius:3px 3px 0 0;
	background:transparent;
}

.extapp .ext-tabs__button:hover{
	background:#f4f5f6;
	color:#222;
}

.extapp .ext-tabs__button:focus{
	outline:none;
}

.extapp .ext-tabs__button.is-active{
	background:#fff;
	color:#222;
}

.extapp .ext-tabs__button.is-active:after{
	background:var(--ext-form-accent,var(--e-global-color-primary,#6b3fa0));
}

.extapp .ext-tabs__button i{
	font-size:14px;
	color:#81858b;
}

.extapp .ext-tabs__button.is-active i{
	color:var(--ext-form-accent,var(--e-global-color-primary,#6b3fa0));
}

.extapp .ext-tabs__content{
	padding:28px 30px 32px;
}

.extapp .ext-tabs__panel{
	display:none;
	animation:extTabFade .18s ease;
}

.extapp .ext-tabs__panel.is-active{
	display:block;
}

@keyframes extTabFade{
	from{opacity:.35;transform:translateY(3px);}
	to{opacity:1;transform:translateY(0);}
}

/* =========================================================
   DATOS DEL CURSO
   ========================================================= */

.extapp .ext-course-info-grid{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:12px;
}

.extapp .ext-course-info-item{
	position:relative;
	display:flex;
	flex-direction:column;
	justify-content:center;
	gap:5px;
	min-height:76px;
	padding:14px 16px;
	border:1px solid #e6e8eb;
	border-radius:10px;
	background:#fafbfc;
}

.extapp .ext-course-info-item:hover{
	border-color:#d9dce0;
	background:#fff;
}

.extapp .ext-course-info-item--wide{
	grid-column:span 2;
}

.extapp .ext-course-info-label{
	display:block;
	font-size:11px;
	font-weight:700;
	line-height:1.2;
	letter-spacing:.055em;
	text-transform:uppercase;
	color:#858a91;
}

.extapp .ext-course-info-item strong{
	display:block;
	font-size:15px;
	font-weight:600;
	line-height:1.4;
	color:#292d32;
	overflow-wrap:anywhere;
}

/* =========================================================
   TÍTULOS DE SECCIÓN
   ========================================================= */

.extapp .ext-course-section-heading{
	display:flex;
	align-items:flex-start;
	gap:14px;
	margin:0 0 22px;
	padding-bottom:17px;
	border-bottom:1px solid #eceef0;
}

.extapp .ext-course-section-heading__icon{
	display:flex;
	flex:0 0 42px;
	align-items:center;
	justify-content:center;
	width:42px;
	height:42px;
	border-radius:10px;
	background:#f3f4f6;
	font-size:17px;
	color:var(--ext-form-accent,var(--e-global-color-primary,#6b3fa0));
}

.extapp .ext-course-section-heading h3{
	margin:0 0 3px;
	padding:0;
	font-size:19px;
	font-weight:700;
	line-height:1.3;
	color:#25282c;
}

.extapp .ext-course-section-heading p{
	margin:0;
	font-size:13px;
	line-height:1.5;
	color:#7a7f86;
}

/* =========================================================
   OBJETIVOS, CONTENIDOS Y OBSERVACIONES
   ========================================================= */

.extapp .ext-prose{
	max-width:950px;
	font-size:15px;
	font-weight:400;
	line-height:1.8;
	color:#3f4348;
}

.extapp .ext-prose h3{
	margin:0 0 14px;
	font-size:19px;
	font-weight:700;
	line-height:1.3;
	color:#25282c;
}

.extapp .ext-prose p{
	margin:0 0 14px;
}

.extapp .ext-prose ul,
.extapp .ext-prose ol{
	margin:14px 0 18px;
	padding-left:24px;
}

.extapp .ext-prose li{
	margin:0 0 8px;
	padding-left:3px;
}

.extapp .ext-empty{
	margin:0;
	padding:18px 20px;
	border:1px dashed #d8dadd;
	border-radius:9px;
	background:#fafafa;
	font-style:italic;
	color:#777;
}

/* OBSERVACIONES */

.extapp .ext-course .ext-prose.ext-mt-3{
	margin-top:24px;
	padding:20px 22px;
	border-left:3px solid var(--ext-form-accent,var(--e-global-color-primary,#6b3fa0));
	border-radius:0 8px 8px 0;
	background:#fafafa;
}

/* =========================================================
   SUBTÍTULOS
   ========================================================= */

.extapp .ext-course h3.ext-mt-3{
	margin:28px 0 14px;
	padding:0 0 10px;
	border-bottom:1px solid #eceef0;
	font-size:17px;
	font-weight:700;
	line-height:1.3;
	color:#30343a;
}

/* =========================================================
   TABLA DE EQUIPOS DIDÁCTICOS
   ========================================================= */

.extapp .ext-course .ext-table-wrap{
	margin-top:15px;
	border:1px solid #e4e6e8;
	border-radius:10px;
	overflow:hidden;
}

.extapp .ext-course .ext-table{
	width:100%;
	margin:0;
	border-collapse:collapse;
	background:#fff;
}

.extapp .ext-course .ext-table th{
	padding:12px 14px;
	border-bottom:1px solid #e4e6e8;
	background:#f6f7f8;
	font-size:12px;
	font-weight:700;
	letter-spacing:.025em;
	text-align:left;
	color:#555b62;
}

.extapp .ext-course .ext-table td{
	padding:13px 14px;
	border-bottom:1px solid #eceef0;
	font-size:14px;
	line-height:1.45;
	color:#393d42;
}

.extapp .ext-course .ext-table tbody tr:last-child td{
	border-bottom:0;
}

.extapp .ext-course .ext-table tbody tr:hover{
	background:#fafafa;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width:900px){

	.extapp .ext-course-info-grid{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}

	.extapp .ext-tabs__nav{
		padding:0 10px;
	}

	.extapp .ext-tabs__button{
		padding:0 12px;
	}

}

@media (max-width:700px){

	.extapp .ext-course__hero{
		padding:25px 22px 22px;
	}

	.extapp .ext-course__hero h1{
		font-size:26px;
	}

	.extapp .ext-course__intro{
		font-size:14px;
	}

	.extapp .ext-tabs__nav{
		display:grid;
		grid-template-columns:repeat(2,minmax(0,1fr));
		gap:6px;
		padding:12px;
	}

	.extapp .ext-tabs__button{
		justify-content:flex-start;
		min-height:42px;
		padding:9px 11px;
		border:1px solid #e2e4e7;
		border-radius:7px;
		background:#fff;
		text-align:left;
	}

	.extapp .ext-tabs__button:after{
		display:none;
	}

	.extapp .ext-tabs__button.is-active{
		border-color:var(--ext-form-accent,var(--e-global-color-primary,#6b3fa0));
	}

	.extapp .ext-tabs__content{
		padding:22px 18px 25px;
	}

	.extapp .ext-course-info-grid{
		grid-template-columns:1fr;
	}

	.extapp .ext-course-info-item--wide{
		grid-column:auto;
	}

}

@media (max-width:480px){

	.extapp .ext-course__hero{
		padding:23px 18px 19px;
	}

	.extapp .ext-course__hero h1{
		font-size:23px;
	}

	.extapp .ext-course__facts{
		display:grid;
		grid-template-columns:1fr;
	}

	.extapp .ext-course__facts > span{
		justify-content:flex-start;
		width:100%;
		border-radius:8px;
	}

	.extapp .ext-tabs__nav{
		grid-template-columns:1fr;
	}

	.extapp .ext-course-section-heading__icon{
		flex-basis:38px;
		width:38px;
		height:38px;
	}

}

/* =========================================================
   FORMULARIOS MOSTRADOS EN SHADOWBOX
   ========================================================= */

.extapp--shadowbox-form{
	width:100%;
	max-width:none;
	padding:18px;
	box-sizing:border-box;
}

.extapp--shadowbox-form .ext-main{
	width:100%;
	max-width:none;
}

.extapp--shadowbox-form .ext-form{
	width:100%;
	max-width:none;
}

.extapp--shadowbox-form .ext-card{
	width:100%;
	box-sizing:border-box;
}

.extapp--shadowbox-form .ext-input,
.extapp--shadowbox-form .ext-select,
.extapp--shadowbox-form .ext-textarea{
	width:100%;
	box-sizing:border-box;
}

.extapp--shadowbox-form .ext-form-grid--student-id{
	display:grid;
	grid-template-columns:minmax(0,1fr) minmax(0,1fr);
	gap:18px;
}

.extapp--shadowbox-form .ext-form-grid--student-name{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:18px;
}

.extapp--shadowbox-form .ext-form-grid--student-personal{
	display:grid;
	grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);
	gap:18px;
}

.extapp--shadowbox-form .ext-form-grid--location{
	display:grid;
	grid-template-columns:minmax(0,1fr) 110px minmax(0,1fr);
	gap:18px;
}

.extapp--shadowbox-form .ext-form-grid--student-contact{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:18px;
}

.extapp--shadowbox-form .ext-form-grid--student-labor{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:18px;
}

.extapp--shadowbox-form .ext-form-grid--student-training{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:18px;
}

.extapp--shadowbox-form .ext-form-grid--student-flags{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:18px;
}

.extapp--shadowbox-form .ext-form-grid--student-online{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:18px;
}

@media (max-width:700px){

	.extapp--shadowbox-form .ext-form-grid--student-id,
	.extapp--shadowbox-form .ext-form-grid--student-name,
	.extapp--shadowbox-form .ext-form-grid--student-personal,
	.extapp--shadowbox-form .ext-form-grid--location,
	.extapp--shadowbox-form .ext-form-grid--student-contact,
	.extapp--shadowbox-form .ext-form-grid--student-labor,
	.extapp--shadowbox-form .ext-form-grid--student-training,
	.extapp--shadowbox-form .ext-form-grid--student-flags,
	.extapp--shadowbox-form .ext-form-grid--student-online{
		grid-template-columns:1fr;
	}

}
.extapp .ext-main--full{
	width:100%;
	max-width:none;
	margin:0;
}
/* =========================================================
   FORMULARIOS DENTRO DE SHADOWBOX
   ========================================================= */

.extapp.extapp--shadowbox-form{
	width:100%;
	max-width:none;
	margin:0;
	padding:20px;
	box-sizing:border-box;
	font-family:Arial,Helvetica,sans-serif;
	font-size:14px;
	color:#333;
	background:#fff;
}

.extapp.extapp--shadowbox-form .ext-main{
	width:100%;
	max-width:none;
	margin:0;
	padding:0;
	box-sizing:border-box;
}

.extapp.extapp--shadowbox-form .ext-form{
	width:100%;
	max-width:none;
	margin:0;
	box-sizing:border-box;
}

.extapp.extapp--shadowbox-form .ext-card{
	width:100%;
	margin:0 0 20px 0;
	padding:22px;
	background:#fff;
	border:1px solid #e2e5e9;
	border-radius:12px;
	box-sizing:border-box;
}

.extapp.extapp--shadowbox-form .ext-card__title{
	margin:0 0 18px 0;
	padding:0;
	font-family:Arial,Helvetica,sans-serif;
	font-size:18px;
	font-weight:600;
	line-height:1.3;
	color:#333;
}

.extapp.extapp--shadowbox-form .ext-field{
	min-width:0;
	margin:0 0 16px 0;
	box-sizing:border-box;
}

.extapp.extapp--shadowbox-form .ext-label{
	display:block;
	margin:0 0 6px 0;
	padding:0;
	font-family:Arial,Helvetica,sans-serif;
	font-size:14px;
	font-weight:600;
	line-height:1.4;
	color:#333;
}

.extapp.extapp--shadowbox-form .ext-input,
.extapp.extapp--shadowbox-form .ext-select,
.extapp.extapp--shadowbox-form .ext-textarea{
	display:block;
	width:100%;
	min-width:0;
	margin:0;
	padding:10px 12px;
	border:1px solid #ccd2d8;
	border-radius:7px;
	background:#fff;
	color:#333;
	font-family:Arial,Helvetica,sans-serif;
	font-size:14px;
	font-weight:400;
	line-height:1.4;
	box-sizing:border-box;
	outline:none;
}

.extapp.extapp--shadowbox-form .ext-input,
.extapp.extapp--shadowbox-form .ext-select{
	height:42px;
}

.extapp.extapp--shadowbox-form .ext-textarea{
	min-height:100px;
	height:auto;
	resize:vertical;
}

.extapp.extapp--shadowbox-form .ext-input:focus,
.extapp.extapp--shadowbox-form .ext-select:focus,
.extapp.extapp--shadowbox-form .ext-textarea:focus{
	border-color:var(--ext-form-accent,#6b3fa0);
	box-shadow:0 0 0 3px rgba(107,63,160,.12);
}

.extapp.extapp--shadowbox-form .ext-form-grid{
	display:grid;
	width:100%;
	gap:16px;
	box-sizing:border-box;
}

.extapp.extapp--shadowbox-form .ext-form-grid--student-id{
	grid-template-columns:repeat(2,minmax(0,1fr));
}

.extapp.extapp--shadowbox-form .ext-form-grid--student-name{
	grid-template-columns:repeat(3,minmax(0,1fr));
}

.extapp.extapp--shadowbox-form .ext-form-grid--student-personal{
	grid-template-columns:minmax(0,1fr) minmax(0,2fr);
}

.extapp.extapp--shadowbox-form .ext-date-grid{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:10px;
	width:100%;
}

.extapp.extapp--shadowbox-form .ext-address-grid{
	display:grid;
	grid-template-columns:150px minmax(0,1fr) 90px 140px;
	gap:10px;
	width:100%;
}

.extapp.extapp--shadowbox-form .ext-form-grid--location{
	grid-template-columns:minmax(0,1fr) 120px minmax(0,1fr);
}

.extapp.extapp--shadowbox-form .ext-form-grid--student-contact{
	grid-template-columns:repeat(2,minmax(0,1fr));
}

.extapp.extapp--shadowbox-form .ext-form-grid--student-labor{
	grid-template-columns:repeat(2,minmax(0,1fr));
}

.extapp.extapp--shadowbox-form .ext-form-grid--student-training{
	grid-template-columns:repeat(3,minmax(0,1fr));
}

.extapp.extapp--shadowbox-form .ext-form-grid--student-flags{
	grid-template-columns:repeat(3,minmax(0,1fr));
}

.extapp.extapp--shadowbox-form .ext-form-grid--student-online{
	grid-template-columns:repeat(2,minmax(0,1fr));
}

.extapp.extapp--shadowbox-form .ext-inline-field{
	display:flex;
	align-items:stretch;
	gap:8px;
}

.extapp.extapp--shadowbox-form .ext-inline-field .ext-input{
	flex:1 1 auto;
}

.extapp.extapp--shadowbox-form .ext-btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:6px;
	min-height:42px;
	padding:9px 16px;
	border:1px solid #ccd2d8;
	border-radius:7px;
	background:#fff;
	color:#333;
	font-family:Arial,Helvetica,sans-serif;
	font-size:14px;
	font-weight:600;
	line-height:1.2;
	text-decoration:none;
	cursor:pointer;
	box-sizing:border-box;
}

.extapp.extapp--shadowbox-form .ext-btn--primary{
	border-color:var(--ext-form-accent,#6b3fa0);
	background:var(--ext-form-accent,#6b3fa0);
	color:#fff;
}

.extapp.extapp--shadowbox-form .ext-actions{
	display:flex;
	align-items:center;
	justify-content:flex-end;
	gap:10px;
	margin-top:20px;
}

.extapp.extapp--shadowbox-form .ext-field-error{
	margin-top:6px;
	font-size:13px;
	line-height:1.4;
}

@media(max-width:700px){

	.extapp.extapp--shadowbox-form{
		padding:12px;
	}

	.extapp.extapp--shadowbox-form .ext-card{
		padding:16px;
	}

	.extapp.extapp--shadowbox-form .ext-form-grid--student-id,
	.extapp.extapp--shadowbox-form .ext-form-grid--student-name,
	.extapp.extapp--shadowbox-form .ext-form-grid--student-personal,
	.extapp.extapp--shadowbox-form .ext-form-grid--location,
	.extapp.extapp--shadowbox-form .ext-form-grid--student-contact,
	.extapp.extapp--shadowbox-form .ext-form-grid--student-labor,
	.extapp.extapp--shadowbox-form .ext-form-grid--student-training,
	.extapp.extapp--shadowbox-form .ext-form-grid--student-flags,
	.extapp.extapp--shadowbox-form .ext-form-grid--student-online{
		grid-template-columns:1fr;
	}

	.extapp.extapp--shadowbox-form .ext-address-grid{
		grid-template-columns:1fr;
	}

}
/* =========================================================
   CONTROLES DE FORMULARIO EN SHADOWBOX
   ========================================================= */

.extapp.extapp--shadowbox-form input.ext-input,
.extapp.extapp--shadowbox-form select.ext-select,
.extapp.extapp--shadowbox-form textarea.ext-textarea{
	display:block !important;
	width:100% !important;
	min-width:0 !important;
	margin:0 !important;
	padding:10px 12px !important;
	border:1px solid #cfd4da !important;
	border-radius:7px !important;
	background:#fff !important;
	color:#333 !important;
	font-family:Arial,Helvetica,sans-serif !important;
	font-size:14px !important;
	font-weight:400 !important;
	line-height:1.4 !important;
	box-sizing:border-box !important;
	box-shadow:none !important;
	outline:none !important;
	-webkit-appearance:none;
	appearance:none;
}

.extapp.extapp--shadowbox-form input.ext-input,
.extapp.extapp--shadowbox-form select.ext-select{
	height:42px !important;
}

.extapp.extapp--shadowbox-form textarea.ext-textarea{
	min-height:100px !important;
	height:auto !important;
	resize:vertical;
}

.extapp.extapp--shadowbox-form input.ext-input:focus,
.extapp.extapp--shadowbox-form select.ext-select:focus,
.extapp.extapp--shadowbox-form textarea.ext-textarea:focus{
	border-color:var(--ext-form-accent,#6b3fa0) !important;
	box-shadow:0 0 0 3px rgba(107,63,160,.12) !important;
}

.extapp.extapp--shadowbox-form label.ext-label{
	display:block !important;
	margin:0 0 6px 0 !important;
	padding:0 !important;
	font-family:Arial,Helvetica,sans-serif !important;
	font-size:14px !important;
	font-weight:600 !important;
	line-height:1.4 !important;
	color:#333 !important;
}

.extapp.extapp--shadowbox-form select.ext-select{
	padding-right:34px !important;
	background-image:
		linear-gradient(45deg,transparent 50%,#555 50%),
		linear-gradient(135deg,#555 50%,transparent 50%) !important;
	background-position:
		calc(100% - 16px) 17px,
		calc(100% - 11px) 17px !important;
	background-size:5px 5px,5px 5px !important;
	background-repeat:no-repeat !important;
}

.extapp.extapp--shadowbox-form .ext-field{
	min-width:0 !important;
	margin-bottom:16px !important;
}

.extapp.extapp--shadowbox-form .ext-form-grid{
	gap:16px !important;
}

.extapp.extapp--shadowbox-form .ext-card{
	padding:20px !important;
}

.extapp.extapp--shadowbox-form .ext-card__title{
	margin:0 0 18px 0 !important;
	font-family:Arial,Helvetica,sans-serif !important;
	font-size:18px !important;
	font-weight:600 !important;
}
/* =========================================================
   FORMULARIO SHADOWBOX - VERSION COMPACTA
   ========================================================= */

.extapp.extapp--shadowbox-form{
	padding:12px !important;
}

.extapp.extapp--shadowbox-form .ext-card{
	margin-bottom:12px !important;
	padding:14px 16px !important;
	border-radius:10px !important;
}

.extapp.extapp--shadowbox-form .ext-card__title{
	margin-bottom:12px !important;
	font-size:17px !important;
}

.extapp.extapp--shadowbox-form .ext-field{
	margin-bottom:9px !important;
}

.extapp.extapp--shadowbox-form .ext-label{
	margin-bottom:4px !important;
	font-size:13px !important;
}

.extapp.extapp--shadowbox-form .ext-form-grid{
	gap:10px !important;
}

.extapp.extapp--shadowbox-form input.ext-input,
.extapp.extapp--shadowbox-form select.ext-select{
	height:38px !important;
	padding:7px 10px !important;
	font-size:14px !important;
}

.extapp.extapp--shadowbox-form textarea.ext-textarea{
	min-height:80px !important;
	padding:8px 10px !important;
}

.extapp.extapp--shadowbox-form .ext-date-grid,
.extapp.extapp--shadowbox-form .ext-address-grid{
	gap:8px !important;
}

.extapp.extapp--shadowbox-form .ext-inline-field{
	gap:6px !important;
}

.extapp.extapp--shadowbox-form .ext-actions{
	margin-top:12px !important;
	gap:8px !important;
}

.extapp.extapp--shadowbox-form .ext-btn{
	min-height:38px !important;
	padding:7px 13px !important;
}

.extapp.extapp--shadowbox-form .ext-field-error{
	margin-top:4px !important;
}

.extapp.extapp--shadowbox-form .ext-mb-3{
	margin-bottom:12px !important;
}