/* Academia Yamilet · Cursos v98
   Mejora móvil/tablet de Mis cursos y tarjeta Método MES®. */

@media (max-width:980px){
  body.pwa-dashboard-active .v71-courses-page{
    gap:14px!important;
    padding-bottom:calc(118px + env(safe-area-inset-bottom))!important;
  }

  body.pwa-dashboard-active .v71-courses-page>.v71-page-heading{
    display:grid!important;
    grid-template-columns:1fr auto!important;
    gap:10px 14px!important;
    align-items:end!important;
    padding:2px 2px 0!important;
  }
  body.pwa-dashboard-active .v71-courses-page>.v71-page-heading>div:first-child{max-width:none!important}
  body.pwa-dashboard-active .v71-courses-page>.v71-page-heading h1{
    margin:0!important;
    font-size:clamp(30px,8.2vw,40px)!important;
    line-height:1!important;
    letter-spacing:-.045em!important;
    color:#172825!important;
  }
  body.pwa-dashboard-active .v71-courses-page>.v71-page-heading p{
    margin:7px 0 0!important;
    max-width:560px!important;
    font-size:13px!important;
    line-height:1.45!important;
    color:#66756f!important;
  }
  body.pwa-dashboard-active .v71-courses-page>.v71-page-heading>.v71-btn{
    width:auto!important;
    min-height:38px!important;
    padding:0 13px!important;
    border-radius:12px!important;
    font-size:11px!important;
    white-space:nowrap!important;
  }

  /* Resumen en una sola fila compacta. */
  body.pwa-dashboard-active .v71-courses-page>.v71-overview{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
  }
  body.pwa-dashboard-active .v71-courses-page>.v71-overview .v71-summary-card{
    min-height:94px!important;
    padding:11px 7px!important;
    border-radius:16px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    align-items:center!important;
    gap:5px!important;
    text-align:center!important;
    background:rgba(255,255,255,.92)!important;
    border:1px solid rgba(18,63,53,.09)!important;
    box-shadow:0 8px 20px rgba(18,63,53,.035)!important;
  }
  body.pwa-dashboard-active .v71-courses-page>.v71-overview .v71-summary-icon{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    flex:0 0 34px!important;
    border-radius:11px!important;
    font-size:14px!important;
    margin:0 auto!important;
  }
  body.pwa-dashboard-active .v71-courses-page>.v71-overview .v71-summary-card strong{
    font-size:19px!important;
    line-height:1!important;
    color:#172825!important;
  }
  body.pwa-dashboard-active .v71-courses-page>.v71-overview .v71-summary-card small{
    font-size:9px!important;
    line-height:1.2!important;
    color:#70807a!important;
  }

  /* Encabezado de formación activa. */
  body.pwa-dashboard-active .v71-courses-page .v73-active-heading{
    margin:2px 2px 0!important;
    gap:4px!important;
  }
  body.pwa-dashboard-active .v71-courses-page .v73-active-heading span{
    font-size:9px!important;
    letter-spacing:.14em!important;
  }
  body.pwa-dashboard-active .v71-courses-page .v73-active-heading h2{
    font-size:20px!important;
    color:#172825!important;
  }
  body.pwa-dashboard-active .v71-courses-page .v73-active-heading small{
    font-size:11px!important;
    color:#718079!important;
  }

  /* Método MES como una sola tarjeta protagonista. */
  body.pwa-dashboard-active .v71-courses-page>.v71-course-grid,
  body.pwa-dashboard-active .v71-courses-page[data-v73-course-count="1"]>.v71-course-grid{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  body.pwa-dashboard-active .v71-courses-page .v71-course-card,
  body.pwa-dashboard-active .v71-courses-page[data-v73-course-count="1"] .v71-course-card{
    display:grid!important;
    grid-template-columns:1fr!important;
    min-height:0!important;
    overflow:hidden!important;
    border-radius:22px!important;
    border:1px solid rgba(18,63,53,.10)!important;
    background:#fff!important;
    box-shadow:0 14px 34px rgba(18,63,53,.07)!important;
    transform:none!important;
  }

  /* Forzamos la portada horizontal oficial y evitamos recortes raros. */
  body.pwa-dashboard-active .v71-courses-page .v71-course-cover,
  body.pwa-dashboard-active .v71-courses-page[data-v73-course-count="1"] .v71-course-cover{
    position:relative!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:16/9!important;
    background:
      linear-gradient(180deg,rgba(255,255,255,.02),rgba(13,75,67,.08)),
      url("../imagenes-academia-yamilet-final/10-metodo-mes-cover.webp") center/cover no-repeat!important;
  }
  body.pwa-dashboard-active .v71-courses-page .v71-course-cover img{display:none!important}
  body.pwa-dashboard-active .v71-courses-page .v71-course-cover>span{
    top:13px!important;
    left:13px!important;
    padding:7px 10px!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.94)!important;
    color:#0d4b43!important;
    font-size:9px!important;
    font-weight:800!important;
    letter-spacing:.08em!important;
    box-shadow:0 5px 16px rgba(18,63,53,.08)!important;
  }

  body.pwa-dashboard-active .v71-courses-page .v71-course-body,
  body.pwa-dashboard-active .v71-courses-page[data-v73-course-count="1"] .v71-course-body{
    padding:18px 18px 20px!important;
    gap:9px!important;
    justify-content:flex-start!important;
  }
  body.pwa-dashboard-active .v71-courses-page .v71-course-top{
    font-size:9px!important;
    line-height:1.2!important;
    letter-spacing:.08em!important;
    color:#a68128!important;
  }
  body.pwa-dashboard-active .v71-courses-page .v71-course-body h3,
  body.pwa-dashboard-active .v71-courses-page[data-v73-course-count="1"] .v71-course-body h3{
    margin:0!important;
    font-size:25px!important;
    line-height:1.08!important;
    letter-spacing:-.035em!important;
    color:#172825!important;
  }
  body.pwa-dashboard-active .v71-courses-page .v71-course-body p,
  body.pwa-dashboard-active .v71-courses-page[data-v73-course-count="1"] .v71-course-body p{
    margin:0!important;
    max-width:none!important;
    font-size:13px!important;
    line-height:1.48!important;
    color:#67756f!important;
    -webkit-line-clamp:2!important;
  }
  body.pwa-dashboard-active .v71-courses-page .v71-course-meta{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:6px!important;
    margin-top:2px!important;
  }
  body.pwa-dashboard-active .v71-courses-page .v71-course-meta>*{
    padding:6px 9px!important;
    border-radius:999px!important;
    background:#eef5f2!important;
    color:#315d54!important;
    font-size:9px!important;
    font-weight:750!important;
    line-height:1!important;
  }
  body.pwa-dashboard-active .v71-courses-page .v71-course-actions,
  body.pwa-dashboard-active .v71-courses-page[data-v73-course-count="1"] .v71-course-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:7px!important;
    margin-top:7px!important;
  }
  body.pwa-dashboard-active .v71-courses-page .v71-course-actions .primary{
    width:100%!important;
    min-height:48px!important;
    border-radius:14px!important;
    background:#0f5a4d!important;
    color:#fff!important;
    border-color:#0f5a4d!important;
    font-size:13px!important;
    font-weight:800!important;
    box-shadow:0 8px 18px rgba(15,90,77,.16)!important;
  }
  body.pwa-dashboard-active .v71-courses-page .v71-course-actions .ghost{
    display:none!important;
  }

  /* Próximamente más discreto para no competir con el curso activo. */
  body.pwa-dashboard-active .v71-courses-page>.v71-upcoming-section{
    margin-top:4px!important;
    padding-top:17px!important;
  }
  body.pwa-dashboard-active .v71-courses-page>.v71-upcoming-section .v71-section-heading h2{
    font-size:18px!important;
  }
  body.pwa-dashboard-active .v71-courses-page .v71-upcoming-cover{height:125px!important}
}

@media (max-width:390px){
  body.pwa-dashboard-active .v71-courses-page>.v71-overview .v71-summary-card{min-height:88px!important;padding:9px 5px!important}
  body.pwa-dashboard-active .v71-courses-page>.v71-overview .v71-summary-icon{width:30px!important;height:30px!important;min-width:30px!important;flex-basis:30px!important}
  body.pwa-dashboard-active .v71-courses-page>.v71-overview .v71-summary-card strong{font-size:17px!important}
  body.pwa-dashboard-active .v71-courses-page>.v71-overview .v71-summary-card small{font-size:8px!important}
  body.pwa-dashboard-active .v71-courses-page .v71-course-body h3{font-size:23px!important}
}
