/**
 * Academia Pro — estilos de bloques
 *
 * Usa 1:1 las CSS custom properties del tema activo (omar-block-theme):
 * --accent, --ink, --ink-soft, --bg, --bg-soft, --line, --accent-soft,
 * --dark, --dark-ink, --dark-muted, --radius, --font-sans
 * No se redeclaran aquí: si el tema cambia de paleta, estos bloques se actualizan solos.
 * Aprobado en boceto — Artifact "Boceto Academia" (2026-09-23).
 */

/* ═══ BOTONES compartidos con el tema ═══ */
.academia-btn{
  display:inline-flex; align-items:center; gap:9px;
  padding:14px 26px; border-radius:100px;
  font-size:15px; font-weight:600; border:1px solid transparent;
  transition:background .3s, color .3s, border-color .3s;
}
.academia-btn svg{width:15px;height:15px;transition:transform .3s;}
.academia-btn:hover svg{transform:translateX(4px);}
.academia-btn-primary{background:var(--ink); color:var(--bg);}
.academia-btn-primary:hover{background:var(--accent); color:#fff;}
.academia-btn-ghost{border-color:var(--line); color:var(--ink); background:transparent;}
.academia-btn-ghost:hover{border-color:var(--ink);}

/* ═══════════════════════════════════════════════
   BLOQUE: academia/grid-cursos
   ═══════════════════════════════════════════════ */
.academia-chip-row{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:clamp(24px,4vw,36px);}
.academia-chip{
  font-size:13px; font-weight:600; padding:9px 18px;
  border:1px solid var(--line); border-radius:100px; color:var(--ink-soft);
  background:#fff; transition:border-color .25s, color .25s, background .25s;
}
.academia-chip.is-active,
.academia-chip:hover{background:var(--ink); color:var(--bg); border-color:var(--ink);}

.academia-cursos-grid{
  display:grid; grid-template-columns:repeat(var(--academia-cols, 3), minmax(0,1fr));
  gap:clamp(16px,2vw,24px);
}
.academia-curso-card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; display:flex; flex-direction:column;
  transition:box-shadow .4s, transform .4s;
  min-width:0;
}
.academia-curso-card:hover{box-shadow:0 24px 60px -30px rgba(16,16,20,0.25); transform:translateY(-2px);}
.academia-curso-card a{color:inherit; text-decoration:none;}
.academia-curso-thumb{position:relative; aspect-ratio:16/10; overflow:hidden; background:linear-gradient(155deg,#E4E9FF 0%,#EFEEEA 65%);}
.academia-curso-thumb img{width:100%; height:100%; object-fit:cover;}
.academia-curso-thumb .academia-tag{
  position:absolute; top:14px; left:14px; z-index:2;
  font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  padding:7px 13px; border-radius:100px;
  background:rgba(246,245,242,0.9); backdrop-filter:blur(6px); color:var(--ink);
}
.academia-curso-thumb .academia-price{
  position:absolute; top:14px; right:14px; z-index:2;
  font-size:12px; font-weight:700; padding:7px 14px; border-radius:100px;
  background:var(--ink); color:var(--bg);
}
.academia-curso-thumb .academia-price.is-gratis{background:var(--accent); color:#fff;}
.academia-curso-meta{padding:clamp(18px,2vw,24px); display:flex; flex-direction:column; gap:10px; flex:1;}
.academia-curso-meta h3{font-size:1.2rem; letter-spacing:-0.02em; line-height:1.2; margin:0;}
.academia-curso-stats{display:flex; gap:14px; font-size:13px; color:var(--ink-soft); flex-wrap:wrap;}
.academia-curso-stats span{display:flex; align-items:center; gap:5px;}
.academia-curso-stats svg{width:14px;height:14px; flex-shrink:0;}
.academia-curso-progreso{margin-top:auto; padding-top:12px; border-top:1px solid var(--line);}
.academia-bar-track{height:6px; border-radius:100px; background:var(--bg-soft); overflow:hidden; margin-bottom:8px;}
.academia-bar-fill{height:100%; background:var(--accent); border-radius:inherit; display:block;}
.academia-curso-progreso .academia-pct{font-size:12.5px; font-weight:600; color:var(--ink-soft);}
.academia-curso-cta{margin-top:auto; padding-top:14px;}
.academia-curso-cta .academia-btn{width:100%; justify-content:center; padding:12px 20px; font-size:14px;}
.academia-cursos-empty{color:var(--ink-soft); padding:40px 0; text-align:center;}

@media (max-width:960px){ .academia-cursos-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:640px){ .academia-cursos-grid{grid-template-columns:minmax(0,1fr);} }

/* ═══════════════════════════════════════════════
   BLOQUE: academia/panel-alumno
   ═══════════════════════════════════════════════ */
.academia-panel-shell{background:#F1F2F5; border:1px solid var(--line); border-radius:var(--radius); padding:20px; overflow:hidden;}
.academia-panel-top{display:flex; align-items:center; gap:8px; margin-bottom:20px;}
.academia-panel-dot{width:9px;height:9px;border-radius:50%;background:#D8DAE0;}
.academia-panel-url{
  margin-left:8px; display:inline-flex; align-items:center; gap:8px;
  background:#fff; border:1px solid var(--line); border-radius:100px;
  padding:7px 16px; font-size:12.5px; color:var(--ink-soft); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.academia-panel-url svg{width:12px;height:12px;color:var(--accent); flex-shrink:0;}

.academia-kpi-row{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:14px;}
.academia-kpi-card{background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px 18px 16px; display:flex; flex-direction:column; gap:4px; min-width:0;}
.academia-kpi-label{font-size:12.5px; color:var(--ink-soft);}
.academia-kpi-num{font-size:clamp(24px,2.4vw,30px); font-weight:700; letter-spacing:-0.02em; font-variant-numeric:tabular-nums;}
.academia-kpi-num .academia-accent{color:var(--accent);}

.academia-continuar{background:#fff; border:1px solid var(--line); border-radius:16px; padding:22px;}
.academia-continuar-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; gap:12px;}
.academia-continuar-head h4{font-size:15px; font-weight:600; margin:0;}
.academia-continuar-head span{font-size:13px; color:var(--ink-soft);}
.academia-progreso-item{display:grid; grid-template-columns:44px minmax(0,1fr) auto; gap:14px; align-items:center; padding:12px 0; border-top:1px solid var(--line);}
.academia-progreso-item:first-child{border-top:0; padding-top:0;}
.academia-progreso-item a{color:inherit; text-decoration:none; display:contents;}
.academia-progreso-avatar{width:44px; height:44px; border-radius:12px; background:var(--accent-soft); display:flex; align-items:center; justify-content:center; color:var(--accent); flex-shrink:0;}
.academia-progreso-avatar svg{width:20px;height:20px;}
.academia-progreso-info{min-width:0;}
.academia-progreso-info h5{font-size:14.5px; font-weight:600; margin:0 0 6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.academia-progreso-info .academia-bar-track{max-width:280px;}
.academia-progreso-pct{font-size:14px; font-weight:700; font-variant-numeric:tabular-nums; color:var(--ink-soft); white-space:nowrap;}
.academia-panel-empty{color:var(--ink-soft); padding:20px 0;}
.academia-panel-login{color:var(--ink-soft); padding:20px 0;}

@media (max-width:960px){ .academia-kpi-row{grid-template-columns:repeat(2,minmax(0,1fr));} }

/* ═══════════════════════════════════════════════
   BLOQUE: academia/reproductor-clase
   ═══════════════════════════════════════════════ */
.academia-player-grid{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:24px; align-items:start;}
.academia-player-main{display:flex; flex-direction:column; gap:20px; min-width:0;}
.academia-player-video{position:relative; aspect-ratio:16/9; border-radius:var(--radius); overflow:hidden; background:var(--dark); cursor:pointer;}
.academia-player-video img.academia-video-poster{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.55;}
.academia-player-video iframe{position:absolute; inset:0; width:100%; height:100%; border:0;}
.academia-player-video .academia-play-btn{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:72px; height:72px; border-radius:50%; border:0; cursor:pointer;
  background:rgba(246,245,242,0.94); display:flex; align-items:center; justify-content:center;
  transition:transform .3s, background .3s; z-index:2;
}
.academia-player-video:hover .academia-play-btn{transform:translate(-50%,-50%) scale(1.06); background:var(--accent);}
.academia-player-video:hover .academia-play-btn svg{color:#fff;}
.academia-player-video .academia-play-btn svg{width:24px;height:24px;color:var(--ink);margin-left:3px;transition:color .3s;}
.academia-player-video .academia-duration{position:absolute; bottom:14px; right:14px; font-size:12px; font-weight:600; background:rgba(16,16,20,0.55); color:#fff; padding:5px 10px; border-radius:6px; font-variant-numeric:tabular-nums; z-index:2;}
.academia-player-video .academia-source-badge{
  position:absolute; top:14px; left:14px; z-index:2;
  display:inline-flex; align-items:center; gap:7px;
  font-size:12px; font-weight:600; color:#fff;
  background:rgba(16,16,20,0.5); backdrop-filter:blur(6px);
  padding:6px 12px 6px 8px; border-radius:100px;
}
.academia-player-video .academia-source-badge svg{width:16px;height:16px;color:#FF0000; flex-shrink:0;}

.academia-player-info .academia-curso-link{font-size:13px; font-weight:600; color:var(--accent); letter-spacing:.02em; text-decoration:none;}
.academia-player-info h2{font-size:clamp(1.5rem,2.4vw,2rem); margin:10px 0 0; letter-spacing:-0.02em; line-height:1.15;}
.academia-player-info p{color:var(--ink-soft); margin-top:10px; max-width:60ch; font-size:15px;}

.academia-lesson-controls{display:flex; flex-direction:column; gap:14px; margin-top:22px; padding:18px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.academia-lesson-nav{display:flex; gap:10px;}
.academia-nav-btn{flex:1; min-width:0; display:flex; align-items:center; justify-content:center; gap:8px; padding:14px 16px; border-radius:100px; border:1.5px solid var(--line); background:#fff; color:var(--ink); font-size:14.5px; font-weight:700; text-decoration:none; transition:border-color .25s, background .25s;}
.academia-nav-btn.is-disabled{opacity:.35; pointer-events:none;}
.academia-nav-btn svg{width:16px;height:16px;flex-shrink:0;transition:transform .25s;}
.academia-nav-btn:hover{border-color:var(--ink); background:var(--bg-soft);}
.academia-nav-btn.academia-prev:hover svg{transform:translateX(-3px);}
.academia-nav-btn.academia-next:hover svg{transform:translateX(3px);}

.academia-lesson-secondary{display:flex; flex-wrap:wrap; gap:10px;}
.academia-complete-toggle, .academia-resource-btn{display:inline-flex; align-items:center; gap:8px; padding:10px 18px; border-radius:100px; font-size:13.5px; font-weight:600; border:1px solid transparent; transition:background .25s, color .25s, border-color .25s; text-decoration:none;}
.academia-complete-toggle svg, .academia-resource-btn svg{width:15px;height:15px;}
.academia-complete-toggle{background:var(--accent-soft); color:var(--accent); cursor:pointer;}
.academia-complete-toggle:hover{background:var(--accent); color:#fff;}
.academia-complete-toggle.is-done{background:var(--accent); color:#fff;}
.academia-resource-btn{background:#fff; border-color:var(--line); color:var(--ink);}
.academia-resource-btn:hover{border-color:var(--ink); background:var(--bg-soft);}

.academia-player-sidebar{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:8px; max-height:520px; overflow:auto;}
.academia-sidebar-head{padding:14px 14px 10px; font-size:12.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-soft);}
.academia-sidebar-head:not(:first-child){margin-top:6px; border-top:1px solid var(--line); padding-top:16px;}
.academia-lesson-item{display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:12px; transition:background .2s; text-decoration:none; color:inherit;}
.academia-lesson-item:hover{background:var(--bg-soft);}
.academia-lesson-item.is-current{background:var(--accent-soft);}
.academia-lesson-item .academia-lesson-icon{width:28px; height:28px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; border:1.5px solid var(--line); color:var(--ink-soft); font-size:12px; font-weight:700;}
.academia-lesson-item.is-done .academia-lesson-icon{background:var(--accent); border-color:var(--accent); color:#fff;}
.academia-lesson-item.is-current .academia-lesson-icon{border-color:var(--accent); color:var(--accent);}
.academia-lesson-item .academia-lesson-icon svg{width:13px;height:13px;}
.academia-lesson-body{flex:1; min-width:0;}
.academia-lesson-body h6{font-size:13.5px; font-weight:600; line-height:1.3; margin:0 0 3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.academia-lesson-item.is-current .academia-lesson-body h6{color:var(--accent);}
.academia-lesson-body span{font-size:12px; color:var(--ink-soft);}

@media (max-width:960px){
  .academia-player-grid{grid-template-columns:minmax(0,1fr);}
  .academia-player-sidebar{max-height:none;}
}
@media (max-width:640px){
  .academia-nav-btn{font-size:13.5px; padding:13px 10px;}
}

/* ═══════════════════════════════════════════════
   BLOQUE: academia/examen
   ═══════════════════════════════════════════════ */
.academia-block-examen .academia-player-main{gap:24px;}
.academia-exam-meta{color:var(--ink-soft); font-size:14px; margin-top:8px;}

.academia-exam-question{
  background:#fff; border:1px solid var(--line); border-radius:16px;
  padding:clamp(18px,2vw,24px); margin-top:18px;
}
.academia-exam-question h4{font-size:16px; font-weight:600; line-height:1.4; display:flex; gap:12px; margin:0 0 14px;}
.academia-q-num{
  flex-shrink:0; width:26px; height:26px; border-radius:50%;
  background:var(--accent-soft); color:var(--accent);
  display:flex; align-items:center; justify-content:center;
  font-size:13px; font-weight:700;
}
.academia-q-options{display:flex; flex-direction:column; gap:2px;}
.academia-q-option{
  display:flex; align-items:center; gap:10px;
  padding:11px 14px; border-radius:10px; font-size:14.5px;
  cursor:pointer; transition:background .2s;
}
.academia-q-option:hover{background:var(--bg-soft);}
.academia-q-option input{accent-color:var(--accent); width:17px; height:17px; flex-shrink:0;}

.academia-exam-form > .academia-btn{margin-top:22px;}

.academia-exam-result{
  display:flex; align-items:flex-start; gap:14px;
  background:var(--accent-soft); border-radius:16px; padding:18px 20px; margin-top:18px;
}
.academia-exam-result svg{width:24px; height:24px; flex-shrink:0; color:var(--accent); margin-top:2px;}
.academia-exam-result strong{display:block; font-size:16px; margin-bottom:4px;}
.academia-exam-result span{font-size:14px; color:var(--ink-soft);}
.academia-exam-result.is-fail{background:#FDEEEE;}
.academia-exam-result.is-fail svg{color:#B32D2E;}
#academia-exam-retry{margin-top:14px;}

.academia-lesson-item.is-exam .academia-lesson-icon{color:var(--accent); border-color:var(--accent-soft); background:var(--accent-soft);}

/* ═══════════════════════════════════════════════
   BLOQUE: academia/foro
   ═══════════════════════════════════════════════ */
.academia-block-foro{max-width:760px;}
.academia-forum-head{display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:18px;}
.academia-forum-head h3{font-size:1.4rem; margin:0; letter-spacing:-0.02em;}
.academia-forum-head span{font-size:13px; color:var(--ink-soft);}

.academia-forum-form{display:flex; flex-direction:column; gap:10px; margin-bottom:26px;}
.academia-forum-form textarea{
  width:100%; padding:12px 14px; border:1px solid var(--line); border-radius:14px;
  font-family:var(--font-sans); font-size:14.5px; color:var(--ink); resize:vertical;
  background:#fff; transition:border-color .2s;
}
.academia-forum-form textarea:focus{outline:none; border-color:var(--accent);}
.academia-forum-form .academia-btn{align-self:flex-start;}
.academia-forum-reply-form{margin:10px 0 14px 52px;}

.academia-forum-threads{display:flex; flex-direction:column; gap:20px;}
.academia-forum-thread{border-top:1px solid var(--line); padding-top:20px;}
.academia-forum-thread:first-child{border-top:0; padding-top:0;}

.academia-forum-post{display:flex; gap:14px; align-items:flex-start;}
.academia-forum-post.is-reply{margin-top:14px; margin-left:52px;}
.academia-forum-avatar{flex-shrink:0; line-height:0;}
.academia-forum-avatar img{border-radius:50%; display:block;}
.academia-forum-body{flex:1; min-width:0;}
.academia-forum-meta{display:flex; align-items:center; gap:10px; margin-bottom:4px; flex-wrap:wrap;}
.academia-forum-meta strong{font-size:14.5px;}
.academia-forum-meta span{font-size:12.5px; color:var(--ink-soft);}
.academia-forum-content{font-size:14.5px; line-height:1.6; color:var(--ink); margin:0;}

.academia-forum-reply-toggle{
  margin-top:8px; background:none; border:0; padding:0;
  font-size:13px; font-weight:600; color:var(--ink-soft); cursor:pointer;
  transition:color .2s;
}
.academia-forum-reply-toggle:hover{color:var(--accent);}

@media (max-width:640px){
  .academia-forum-post.is-reply, .academia-forum-reply-form{margin-left:24px;}
}

/* ═══════════════════════════════════════════════
   BLOQUE: academia/descargables
   ═══════════════════════════════════════════════ */
.academia-block-descargables{max-width:760px;}
.academia-block-descargables h3{font-size:1.4rem; margin:0 0 18px; letter-spacing:-0.02em;}
.academia-resources-group{margin-bottom:24px;}
.academia-resources-group h4{font-size:14px; font-weight:700; letter-spacing:.04em; color:var(--ink-soft); margin:0 0 10px;}
.academia-resources-list{display:flex; flex-direction:column; gap:8px;}

.academia-resource-row{
  display:flex; align-items:center; gap:14px;
  background:#fff; border:1px solid var(--line); border-radius:14px;
  padding:14px 16px; text-decoration:none; color:inherit;
  transition:border-color .2s, background .2s;
}
.academia-resource-row:hover{border-color:var(--accent); background:var(--accent-soft);}
.academia-resource-icon{
  flex-shrink:0; width:38px; height:38px; border-radius:10px;
  background:var(--accent-soft); color:var(--accent);
  display:flex; align-items:center; justify-content:center;
}
.academia-resource-icon svg{width:18px; height:18px;}
.academia-resource-info{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px;}
.academia-resource-info strong{font-size:14.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.academia-resource-info span{font-size:12.5px; color:var(--ink-soft);}
.academia-resource-download{width:18px; height:18px; flex-shrink:0; color:var(--ink-soft);}
.academia-resource-row:hover .academia-resource-download{color:var(--accent);}

@media (prefers-reduced-motion:reduce){
  .academia-btn, .academia-btn svg, .academia-curso-card, .academia-nav-btn svg, .academia-play-btn{transition-duration:0.01ms !important;}
}