/* =====================================================
   CAMPUS FEH EXPERIENCE
===================================================== */

.fehx-dashboard,
.fehx-course-experience,
.fehx-path{
  width:100%;
  max-width:1180px;
  margin:0 auto;
  color:#0f172a;
  box-sizing:border-box;
}

.fehx-dashboard *,
.fehx-course-experience *,
.fehx-path *{
  box-sizing:border-box;
}

/* Carga */

.fehx-loading{
  min-height:240px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:16px;
  border:1px solid #e2e8f0;
  border-radius:28px;
  background:#fff;
}

.fehx-loading span{
  width:38px;
  height:38px;
  border:4px solid #e2e8f0;
  border-top-color:#0f69b4;
  border-radius:50%;
  animation:fehx-spin .8s linear infinite;
}

@keyframes fehx-spin{
  to{transform:rotate(360deg);}
}

/* Botones */

.fehx-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  padding:0 24px;
  border-radius:999px;
  text-decoration:none !important;
  font-weight:900;
  line-height:1;
  transition:.22s ease;
  white-space:nowrap;
}

.fehx-btn--primary{
  background:#eb3c46 !important;
  color:#fff !important;
  box-shadow:0 12px 24px rgba(235,60,70,.22);
}

.fehx-btn--primary:hover{
  background:#d9333e !important;
  color:#fff !important;
  transform:translateY(-1px);
}

.fehx-btn--outline{
  border:1px solid rgba(255,255,255,.44);
  background:rgba(255,255,255,.08);
  color:#fff !important;
}

.fehx-btn--small{
  min-height:42px;
  padding:0 18px;
  font-size:.88rem;
}

/* Dashboard hero */

.fehx-dashboard-hero{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  padding:38px;
  border-radius:30px;
  background:
    linear-gradient(
      135deg,
      rgba(15,105,180,.96),
      rgba(7,20,38,.98)
    );
  box-shadow:0 22px 48px rgba(15,23,42,.15);
}

.fehx-dashboard-hero__user{
  display:flex;
  align-items:center;
  gap:22px;
}

.fehx-dashboard-hero__user img{
  width:92px;
  height:92px;
  object-fit:cover;
  border-radius:24px;
  border:3px solid rgba(255,255,255,.18);
}

.fehx-dashboard-hero span,
.fehx-dashboard-hero h1,
.fehx-dashboard-hero p{
  color:#fff !important;
}

.fehx-dashboard-hero span{
  font-size:.8rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.07em;
  opacity:.8;
}

.fehx-dashboard-hero h1{
  margin:5px 0 8px;
  font-size:clamp(2rem,3vw,3.2rem);
  line-height:1.05;
  font-weight:900;
}

.fehx-dashboard-hero p{
  margin:0;
  max-width:630px;
  line-height:1.65;
  opacity:.9;
}

/* Métricas */

.fehx-metrics{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:16px;
  margin:24px 0 54px;
}

.fehx-metrics article{
  padding:22px;
  border:1px solid #e2e8f0;
  border-radius:22px;
  background:#fff;
  box-shadow:0 12px 30px rgba(15,23,42,.05);
}

.fehx-metrics span{
  display:block;
  margin-bottom:8px;
  color:#64748b;
  font-size:.82rem;
  font-weight:700;
}

.fehx-metrics strong{
  display:block;
  color:#0f172a;
  font-size:1.85rem;
  font-weight:900;
}

/* Encabezados */

.fehx-section-heading{
  max-width:760px;
  margin:0 auto 32px;
  text-align:center;
}

.fehx-section-heading--left{
  margin-left:0;
  text-align:left;
}

.fehx-section-heading > span{
  display:inline-block;
  margin-bottom:8px;
  color:#0f69b4;
  font-size:.82rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.07em;
}

.fehx-section-heading h2{
  margin:0 0 12px;
  color:#0f172a !important;
  font-size:clamp(2rem,3vw,3rem);
  line-height:1.08;
  font-weight:900;
  letter-spacing:-.035em;
}

.fehx-section-heading p{
  margin:0;
  color:#64748b;
  line-height:1.75;
}

/* Cursos */

.fehx-dashboard-section{
  margin-bottom:54px;
}

.fehx-course-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}

.fehx-course-card{
  overflow:hidden;
  border:1px solid #e2e8f0;
  border-radius:26px;
  background:#fff;
  box-shadow:0 16px 38px rgba(15,23,42,.07);
}

.fehx-course-card__image{
  position:relative;
  display:block;
  height:190px;
  overflow:hidden;
  background:#eaf3fb;
}

.fehx-course-card__image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  transition:transform .35s ease;
}

.fehx-course-card:hover img{
  transform:scale(1.04);
}

.fehx-course-card__placeholder{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:2.5rem;
  font-weight:900;
  color:#0f69b4;
}

.fehx-course-card__status{
  position:absolute;
  top:14px;
  left:14px;
  padding:7px 12px;
  border-radius:999px;
  background:#eb3c46;
  color:#fff;
  font-size:.75rem;
  font-weight:900;
}

.fehx-course-card__body{
  padding:22px;
}

.fehx-course-card h3{
  margin:0 0 10px;
  font-size:1.15rem;
  line-height:1.35;
  font-weight:900;
}

.fehx-course-card h3 a{
  color:#0f172a !important;
  text-decoration:none !important;
}

.fehx-course-card__meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:18px;
}

.fehx-course-card__meta span{
  padding:6px 10px;
  border-radius:999px;
  background:#eff6ff;
  color:#0f69b4;
  font-size:.75rem;
  font-weight:800;
}

/* Progreso */

.fehx-progress{
  margin:18px 0;
}

.fehx-progress__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:8px;
  color:#64748b;
  font-size:.8rem;
}

.fehx-progress__header strong{
  color:#0f172a;
}

.fehx-progress__track{
  height:9px;
  overflow:hidden;
  border-radius:999px;
  background:#e2e8f0;
}

.fehx-progress__track span{
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#0f69b4,#eb3c46);
}

/* CTA dashboard */

.fehx-dashboard-cta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  padding:36px;
  border-radius:28px;
  background:
    linear-gradient(
      135deg,
      rgba(15,105,180,.96),
      rgba(7,20,38,.98)
    );
}

.fehx-dashboard-cta span,
.fehx-dashboard-cta h2,
.fehx-dashboard-cta p{
  color:#fff !important;
}

.fehx-dashboard-cta h2{
  margin:4px 0 8px;
  font-size:2rem;
}

.fehx-dashboard-cta p{
  margin:0;
  opacity:.88;
}

/* Ruta */

.fehx-path{
  padding:60px 0;
}

.fehx-path__timeline{
  max-width:920px;
  margin:0 auto;
  position:relative;
}

.fehx-path__timeline::before{
  content:"";
  position:absolute;
  top:30px;
  bottom:30px;
  left:28px;
  width:2px;
  background:linear-gradient(#0f69b4,#eb3c46);
}

.fehx-path__item{
  position:relative;
  display:grid;
  grid-template-columns:58px 1fr;
  gap:22px;
  margin-bottom:22px;
}

.fehx-path__number{
  position:relative;
  z-index:2;
  width:58px;
  height:58px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:18px;
  background:#0f69b4;
  color:#fff;
  font-size:1.2rem;
  font-weight:900;
  box-shadow:0 10px 20px rgba(15,105,180,.22);
}

.fehx-path__content{
  padding:24px;
  border:1px solid #e2e8f0;
  border-radius:22px;
  background:#fff;
  box-shadow:0 12px 30px rgba(15,23,42,.05);
}

.fehx-path__content h3{
  margin:0 0 13px;
  color:#0f172a !important;
  font-size:1.25rem;
  font-weight:900;
}

.fehx-path__content ul{
  margin:0;
  padding:0;
  list-style:none;
}

.fehx-path__content li{
  padding:10px 0;
  color:#475569;
  border-top:1px solid #eef2f7;
}

.fehx-path__content li span{
  display:inline-flex;
  margin-right:8px;
  padding:4px 8px;
  border-radius:999px;
  background:#eff6ff;
  color:#0f69b4;
  font-size:.7rem;
  font-weight:900;
}

/* Beneficios */

.fehx-benefits{
  padding:58px 0;
  background:#f8fafc;
}

.fehx-benefits__grid{
  max-width:1180px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:20px;
}

.fehx-benefits article{
  padding:26px;
  border:1px solid #e2e8f0;
  border-radius:24px;
  background:#fff;
}

.fehx-benefits article > span{
  display:inline-flex;
  width:46px;
  height:46px;
  align-items:center;
  justify-content:center;
  margin-bottom:16px;
  border-radius:15px;
  background:#eff6ff;
  color:#0f69b4;
  font-weight:900;
}

.fehx-benefits h3{
  margin:0 0 9px;
  color:#0f172a !important;
  font-size:1.1rem;
  font-weight:900;
}

.fehx-benefits p{
  margin:0;
  color:#64748b;
  line-height:1.7;
}

/* Recomendaciones */

.fehx-recommendations{
  padding:64px 0;
}

.fehx-recommendations__grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}

.fehx-recommendation{
  overflow:hidden;
  border:1px solid #e2e8f0;
  border-radius:24px;
  background:#fff;
}

.fehx-recommendation img,
.fehx-recommendation__placeholder{
  width:100%;
  height:180px;
  display:flex;
  align-items:center;
  justify-content:center;
  object-fit:cover;
  background:#eaf3fb;
}

.fehx-recommendation > div{
  padding:22px;
}

.fehx-recommendation span{
  color:#0f69b4;
  font-size:.75rem;
  font-weight:900;
}

.fehx-recommendation h3{
  margin:7px 0;
  font-size:1.1rem;
  line-height:1.35;
}

.fehx-recommendation h3 a{
  color:#0f172a !important;
  text-decoration:none !important;
}

.fehx-recommendation p{
  margin:0;
  color:#64748b;
}

/* Estados */

.fehx-empty,
.fehx-error,
.fehx-login-required{
  padding:44px 28px;
  border:1px solid #e2e8f0;
  border-radius:26px;
  background:#fff;
  text-align:center;
}

.fehx-login-required h2,
.fehx-empty h3,
.fehx-error h3{
  color:#0f172a !important;
}

/* Responsive */

@media(max-width:1024px){
  .fehx-metrics{
    grid-template-columns:repeat(3,1fr);
  }

  .fehx-course-grid,
  .fehx-recommendations__grid{
    grid-template-columns:repeat(2,1fr);
  }

  .fehx-benefits__grid{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:767px){
  .fehx-dashboard-hero,
  .fehx-dashboard-cta{
    flex-direction:column;
    align-items:flex-start;
    padding:28px 22px;
  }

  .fehx-dashboard-hero__user{
    flex-direction:column;
    align-items:flex-start;
  }

  .fehx-metrics{
    grid-template-columns:repeat(2,1fr);
  }

  .fehx-course-grid,
  .fehx-recommendations__grid,
  .fehx-benefits__grid{
    grid-template-columns:1fr;
  }

  .fehx-path__timeline::before{
    left:21px;
  }

  .fehx-path__item{
    grid-template-columns:44px 1fr;
    gap:14px;
  }

  .fehx-path__number{
    width:44px;
    height:44px;
    border-radius:14px;
  }
}
/* =====================================================
   CAMPUS FEH EXPERIENCE — FASE 3B
   CONTENIDOS, ESTADOS Y PROGRESO POR UNIDAD
===================================================== */

.fehx-topic-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:22px;
  margin-bottom:16px;
}

.fehx-topic-label{
  display:block;
  margin-bottom:5px;
  color:#0f69b4;
  font-size:.74rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.fehx-topic-header h3{
  margin:0 !important;
}

.fehx-topic-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:32px;
  padding:0 12px;
  border-radius:999px;
  font-size:.72rem;
  font-weight:900;
  white-space:nowrap;
}

.fehx-topic-status--completed{
  background:#dcfce7;
  color:#15803d;
}

.fehx-topic-status--in_progress{
  background:#dbeafe;
  color:#1d4ed8;
}

.fehx-topic-status--pending{
  background:#f1f5f9;
  color:#64748b;
}

.fehx-topic-status--empty{
  background:#fff7ed;
  color:#c2410c;
}

.fehx-topic-summary{
  margin:0 0 18px !important;
  color:#64748b !important;
  line-height:1.7;
}

.fehx-topic-items{
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
  border-top:1px solid #edf2f7;
}

.fehx-topic-item{
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
  border-bottom:1px solid #edf2f7;
}

.fehx-topic-item__link{
  display:grid;
  grid-template-columns:44px minmax(0,1fr) auto auto;
  align-items:center;
  gap:14px;
  padding:15px 4px;
  color:#0f172a !important;
  text-decoration:none !important;
  transition:
    background-color .2s ease,
    transform .2s ease;
}

.fehx-topic-item__link:hover{
  background:#f8fafc;
}

.fehx-topic-item__icon{
  width:40px;
  height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:13px;
  background:#eff6ff;
  color:#0f69b4;
  font-weight:900;
}

.fehx-topic-item__icon--quiz{
  background:#fef3c7;
  color:#b45309;
}

.fehx-topic-item__icon--assignment{
  background:#fce7f3;
  color:#be185d;
}

.fehx-topic-item__icon--zoom,
.fehx-topic-item__icon--meet{
  background:#ede9fe;
  color:#6d28d9;
}

.fehx-topic-item.is-completed
.fehx-topic-item__icon{
  background:#dcfce7;
  color:#15803d;
}

.fehx-topic-item__main{
  min-width:0;
}

.fehx-topic-item__type{
  display:block;
  margin-bottom:3px;
  color:#64748b;
  font-size:.7rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.fehx-topic-item__main strong{
  display:block;
  overflow:hidden;
  color:#0f172a !important;
  font-size:.94rem;
  line-height:1.4;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.fehx-topic-item__duration{
  color:#64748b;
  font-size:.76rem;
  font-weight:700;
  white-space:nowrap;
}

.fehx-topic-item__state{
  min-width:82px;
  color:#0f69b4;
  font-size:.75rem;
  font-weight:900;
  text-align:right;
  white-space:nowrap;
}

.fehx-topic-item.is-completed
.fehx-topic-item__state{
  color:#15803d;
}

.fehx-topic-empty{
  padding:18px;
  border-radius:15px;
  background:#f8fafc;
  color:#64748b;
  font-size:.88rem;
}

.fehx-topic-progress{
  margin-top:18px;
}

.fehx-topic-progress__meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:9px;
  color:#64748b;
  font-size:.78rem;
}

.fehx-topic-progress__meta strong{
  color:#0f172a;
  font-size:.84rem;
}

.fehx-topic-progress__track{
  height:9px;
  overflow:hidden;
  border-radius:999px;
  background:#e2e8f0;
}

.fehx-topic-progress__track span{
  display:block;
  height:100%;
  border-radius:inherit;
  background:
    linear-gradient(
      90deg,
      #0f69b4,
      #eb3c46
    );
  transition:width .45s ease;
}

.fehx-path__item--completed
.fehx-path__number{
  background:#16a34a;
  box-shadow:0 10px 22px rgba(22,163,74,.22);
}

.fehx-path__item--in_progress
.fehx-path__number{
  background:#0f69b4;
}

.fehx-path__item--pending
.fehx-path__number{
  background:#64748b;
}

.fehx-path__item--empty
.fehx-path__number{
  background:#cbd5e1;
  color:#475569;
}

/* Responsive */

@media(max-width:767px){

  .fehx-topic-header{
    flex-direction:column;
    gap:10px;
  }

  .fehx-topic-item__link{
    grid-template-columns:40px minmax(0,1fr);
  }

  .fehx-topic-item__duration,
  .fehx-topic-item__state{
    grid-column:2;
    text-align:left;
  }

  .fehx-topic-item__main strong{
    white-space:normal;
  }

  .fehx-topic-progress__meta{
    align-items:flex-start;
  }
}
.fehx-topic-item.is-locked{
  opacity:.72;
}

.fehx-topic-item.is-locked .fehx-topic-item__link{
  cursor:not-allowed;
}

.fehx-topic-item.is-locked .fehx-topic-item__icon{
  background:#f1f5f9;
  color:#64748b;
}

.fehx-topic-item.is-locked .fehx-topic-item__state{
  color:#64748b;
}

/* =====================================================
   CAMPUS FEH EXPERIENCE — FASE 3C
   BLOQUEO, SECUENCIA Y CONTINUACIÓN
===================================================== */

.fehx-continue-card{
  max-width:1180px;
  margin:0 auto 34px;
  padding:30px 34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  border-radius:28px;
  background:
    linear-gradient(
      135deg,
      rgba(15,105,180,.97),
      rgba(7,20,38,.98)
    );
  box-shadow:0 20px 44px rgba(15,23,42,.14);
}

.fehx-continue-card__content span{
  display:block;
  margin-bottom:6px;
  color:rgba(255,255,255,.76);
  font-size:.78rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.fehx-continue-card__content h2{
  margin:0 0 7px !important;
  color:#fff !important;
  font-size:clamp(1.5rem,2.6vw,2.4rem);
  font-weight:900;
}

.fehx-continue-card__content p{
  margin:0 !important;
  color:rgba(255,255,255,.88) !important;
}

.fehx-continue-card--completed{
  background:
    linear-gradient(
      135deg,
      #15803d,
      #064e3b
    );
}

.fehx-path__item.is-locked{
  opacity:.82;
}

.fehx-path__item.is-locked
.fehx-path__content{
  background:#f8fafc;
}

.fehx-path__item--locked
.fehx-path__number,
.fehx-path__item.is-locked
.fehx-path__number{
  background:#94a3b8;
  color:#fff;
  box-shadow:none;
}

.fehx-topic-lock-message{
  display:flex;
  align-items:flex-start;
  gap:13px;
  margin:0 0 18px;
  padding:16px;
  border:1px solid #e2e8f0;
  border-radius:16px;
  background:#f8fafc;
}

.fehx-topic-lock-message > span{
  font-size:1.25rem;
}

.fehx-topic-lock-message strong{
  display:block;
  margin-bottom:3px;
  color:#334155;
}

.fehx-topic-lock-message p{
  margin:0 !important;
  color:#64748b !important;
  font-size:.84rem;
  line-height:1.55;
}

.fehx-topic-item.is-locked{
  opacity:.68;
}

.fehx-topic-item.is-locked
.fehx-topic-item__link{
  cursor:not-allowed;
  pointer-events:none;
}

.fehx-topic-item.is-locked
.fehx-topic-item__icon{
  background:#f1f5f9;
  color:#64748b;
}

.fehx-topic-item__reason{
  display:block;
  margin-top:4px;
  color:#94a3b8;
  font-size:.72rem;
  font-weight:500;
}

.fehx-topic-status--locked{
  background:#f1f5f9;
  color:#64748b;
}

@media(max-width:767px){

  .fehx-continue-card{
    flex-direction:column;
    align-items:flex-start;
    padding:26px 22px;
  }

  .fehx-continue-card .fehx-btn{
    width:100%;
  }
}