/* ==========================================================================
   Cursos ACTO — marca según el Manual de Identidad de ACTO
   Solo colores del manual: rojos #B90713 #D2111E #97040E #F64C57 y grises
   #FFFFFF #F2F2F2 #D1D1D1 #B1B1B1 #717171 #515151 #323232 #111111.
   Tipografía corporativa Muli (Mulish). Tokens desde theme.json con fallbacks.
   ========================================================================== */
:root {
  --acto-red:    var(--wp--preset--color--accent-1, #B90713);
  --acto-mid:    var(--wp--preset--color--accent-2, #D2111E);
  --acto-light:  var(--wp--preset--color--accent-3, #F64C57);
  --acto-dark:   var(--wp--preset--color--accent-4, #97040E);
  --acto-pale:   var(--wp--preset--color--accent-5, rgba(185, 7, 19, 0.08));
  --acto-gray:   var(--wp--preset--color--accent-6, #515151);
  --acto-ink:    var(--wp--preset--color--ink, #111111);
  --acto-text:   var(--wp--preset--color--contrast, #323232);
  --acto-line:   var(--wp--preset--color--line, #D1D1D1);
  --acto-surface:var(--wp--preset--color--base, #F2F2F2);
  --acto-radius: 10px;
  --acto-shadow: 0 6px 24px rgba(17, 17, 17, 0.10);
  --acto-head: "Mulish", sans-serif;
}

/* ---- Buttons ---- */
.llms-button-action, .llms-button-primary,
a.llms-button-action, a.llms-button-primary {
  background-color: var(--acto-red); border-color: var(--acto-red); color: #fff;
  border-radius: var(--acto-radius); font-family: var(--acto-head); font-weight: 700;
  padding: 0.75rem 1.5rem; transition: background-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.llms-button-action:hover, .llms-button-primary:hover {
  background-color: var(--acto-dark); border-color: var(--acto-dark); color: #fff;
  transform: translateY(-1px); box-shadow: var(--acto-shadow);
}
.llms-button-secondary {
  background: transparent; color: var(--acto-red); border: 1.5px solid var(--acto-red);
  border-radius: var(--acto-radius); font-weight: 700;
}
.llms-button-secondary:hover { background: var(--acto-pale); }
@media (prefers-reduced-motion: reduce) {
  .llms-button-action, .llms-button-primary { transition: none; }
  .llms-button-action:hover, .llms-button-primary:hover { transform: none; }
}

/* ---- Course catalog cards ---- */
.llms-loop-item {
  border: 1px solid var(--acto-line); border-radius: var(--acto-radius); overflow: hidden; background: #fff;
  transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.llms-loop-item:hover { box-shadow: var(--acto-shadow); transform: translateY(-2px); border-color: var(--acto-red); }
.llms-loop-item .llms-loop-title, .llms-loop-item .llms-loop-title a {
  color: var(--acto-ink); font-family: var(--acto-head); font-weight: 700;
}
.llms-loop-item .llms-loop-title a:hover { color: var(--acto-red); }

/* ---- Progress bar ---- */
.llms-progress .llms-progress-bar { background-color: var(--acto-pale); }
.llms-progress .progress-bar-complete { background-color: var(--acto-red); }

/* ---- Syllabus / lesson list ---- */
.llms-lesson-preview .llms-lesson-link { border-radius: 8px; }
.llms-lesson-preview.is-complete .llms-lesson-complete { color: var(--acto-red); }

/* ---- Quiz UI ---- */
.llms-quiz-wrapper .llms-progress .progress-bar-complete { background: var(--acto-red); }
.llms-question-wrapper .llms-question-title { color: var(--acto-ink); font-family: var(--acto-head); }
.llms-question-wrapper .llms-choice input:checked + label,
.llms-question-wrapper .llms-choice.llms-is-selected label { border-color: var(--acto-red); background: var(--acto-pale); }
.llms-quiz-results .llms-quiz-meta .llms-quiz-meta-value { color: var(--acto-red); }

/* ---- Student dashboard ---- */
.llms-sd-section .llms-sd-title,
.llms-my-achievements .llms-achievement-title { color: var(--acto-ink); font-family: var(--acto-head); }
.llms-sd-tabs .llms-active a { color: var(--acto-red); border-color: var(--acto-red); }

/* ---- Notices ---- */
.llms-notice.llms-success { border-left: 4px solid var(--acto-red); }
.llms-notice.llms-error { border-left: 4px solid var(--acto-mid); }

/* ==========================================================================
   Barra superior institucional + Header + Footer (estilo ACTO)
   ========================================================================== */
.acto-topbar {
  background: var(--acto-red); color: #fff; text-align: center;
  font-family: var(--acto-head); font-weight: 600; letter-spacing: .3px;
}
.acto-topbar p { margin: 0; padding: 8px 16px; font-size: 13px; color: #fff; }

.acto-header { position: sticky; top: 0; z-index: 100; box-shadow: 0 1px 0 var(--acto-line); }
.acto-header .acto-logo { display: inline-flex; align-items: center; gap: 10px; line-height: 0; text-decoration: none; }
.acto-header .acto-logo img { height: 44px; width: auto; display: block; }
.acto-header .acto-logo .acto-logo-sub {
  font-family: var(--acto-head); font-weight: 700; color: var(--acto-ink); font-size: 15px;
  border-left: 2px solid var(--acto-line); padding-left: 10px; line-height: 1.1;
}
.acto-header .acto-logo .acto-logo-sub small { display: block; font-weight: 500; font-size: 10.5px; color: var(--acto-gray); letter-spacing: .3px; }
.acto-header .acto-nav { gap: 1.5rem; }
.acto-nav .acto-nav-link { margin: 0; font-family: var(--acto-head); font-weight: 600; }
.acto-nav .acto-nav-link a { color: var(--acto-ink); text-decoration: none; }
.acto-nav .acto-nav-link a:hover { color: var(--acto-red); }

.acto-footer { background: var(--acto-ink) !important; margin-top: 3rem; padding: 3rem 1.5rem 1.5rem !important; }
.acto-footer, .acto-footer p, .acto-footer li { color: #F2F2F2; }
.acto-footer a { color: #fff; text-decoration: none; }
.acto-footer a:hover { color: var(--acto-light); text-decoration: underline; }
/* logo en negativo (blanco sobre #111111, p. 10 del manual): ya no necesita la caja blanca */
.acto-footer .acto-footer-logo { display: inline-block; }
.acto-footer .acto-footer-logo img { height: 44px; width: auto; display: block; }
.acto-footer .acto-footer-h { color: #fff; font-size: 1rem; margin: 0 0 .5rem; font-family: var(--acto-head); font-weight: 700; }
.acto-footer .acto-footer-list { list-style: none; margin: 0; padding: 0; line-height: 2; }
.acto-footer .acto-footer-tag { color: #D1D1D1; max-width: 34ch; margin-top: .75rem; }
.acto-footer .acto-footer-copy { color: #B1B1B1; border-top: 1px solid rgba(255,255,255,.14); padding-top: 1rem; margin-top: 2rem; font-size: 12.5px; }
.acto-footer .acto-footer-copy a { color: #FFFFFF; }
.acto-footer .acto-footer-copy { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem 1.5rem; }
.acto-footer .acto-footer-agencia { display: inline-flex; align-items: center; gap: .6rem; white-space: nowrap; }
.acto-footer .acto-footer-agencia img { height: 32px; width: auto; display: block; }

/* ==========================================================================
   Student dashboard header — métricas + continuar (Dirección A)
   ========================================================================== */
.acto-dash { margin-bottom: 2rem; }
.acto-dash-welcome { font-family: var(--acto-head); font-weight: 800; color: var(--acto-ink); font-size: clamp(1.4rem, 3vw, 1.9rem); margin: 0 0 1.25rem; }
.acto-dash-welcome::after { content: ""; display: block; width: 56px; height: 4px; background: var(--acto-red); border-radius: 2px; margin-top: .5rem; }

.acto-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-bottom: 1.75rem; }
@media (max-width: 680px) { .acto-metrics { grid-template-columns: 1fr; } }
.acto-metric { display: flex; align-items: center; gap: .9rem; background: #fff; border: 1px solid var(--acto-line); border-radius: 12px; padding: 1.1rem 1.25rem; box-shadow: 0 2px 10px rgba(17,17,17,.05); }
.acto-metric-ic { flex: 0 0 46px; height: 46px; width: 46px; display: grid; place-items: center; border-radius: 12px; background: var(--acto-pale); color: var(--acto-red); }
.acto-metric-val { font-family: var(--acto-head); font-weight: 800; font-size: 1.7rem; line-height: 1; color: var(--acto-ink); }
.acto-metric-lbl { color: var(--acto-gray); font-size: .86rem; margin-top: .2rem; }

.acto-continue { margin-bottom: 2rem; }
.acto-continue-label { font-family: var(--acto-head); font-weight: 700; text-transform: uppercase; letter-spacing: .08em; font-size: .78rem; color: var(--acto-red); margin-bottom: .6rem; }
.acto-continue-card { display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; background: linear-gradient(180deg,#fff, #fff) padding-box, var(--acto-surface); border: 1px solid var(--acto-line); border-left: 5px solid var(--acto-red); border-radius: 14px; padding: 1.3rem 1.5rem; box-shadow: var(--acto-shadow); }
.acto-continue-info { flex: 1 1 320px; min-width: 260px; }
.acto-continue-info h3 { font-family: var(--acto-head); font-weight: 700; color: var(--acto-ink); margin: 0 0 .7rem; font-size: 1.15rem; }
.acto-bar { height: 10px; background: var(--acto-pale); border-radius: 6px; overflow: hidden; }
.acto-bar span { display: block; height: 100%; background: var(--acto-red); border-radius: 6px; transition: width .5s ease; }
.acto-continue-pct { color: var(--acto-gray); font-size: .82rem; margin-top: .45rem; }
.acto-continue-btn { flex: 0 0 auto; background: var(--acto-red); color: #fff !important; font-family: var(--acto-head); font-weight: 700; text-decoration: none; padding: .8rem 1.8rem; border-radius: 9px; transition: background-color .18s ease, transform .18s ease; }
.acto-continue-btn:hover { background: var(--acto-dark); transform: translateY(-1px); }
@media (prefers-reduced-motion: reduce) { .acto-continue-btn:hover { transform: none; } .acto-bar span { transition: none; } }

/* ==========================================================================
   Catalog course card (Opción A) — cover degradado + badge + meta + botón
   ========================================================================== */
.acto-course-card { list-style: none; padding: 0 !important; overflow: hidden; display: flex; }
.acto-course-card .acto-cc { display: flex; flex-direction: column; width: 100%; text-decoration: none; color: inherit; }
.acto-cc-cover { position: relative; height: 152px; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, var(--acto-dark) 0%, var(--acto-red) 100%); }
.acto-cc-cover.has-thumb { background-size: cover; background-position: center; }
.acto-cc-cover.has-thumb::after { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(151,4,14,.85), rgba(185,7,19,.75)); }
.acto-cc-ic { position: relative; z-index: 1; opacity: .95; }
.acto-cc-badge { position: absolute; top: 12px; left: 12px; z-index: 2; background: #fff; color: var(--acto-red); font-family: var(--acto-head); font-weight: 700; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; padding: 4px 10px; border-radius: 999px; }
.acto-cc-cover-bar { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; height: 6px; background: rgba(255,255,255,.35); }
.acto-cc-cover-bar span { display: block; height: 100%; background: #fff; }
.acto-cc-body { display: flex; flex-direction: column; gap: .7rem; padding: 1.1rem 1.25rem 1.3rem; flex: 1 1 auto; }
.acto-cc-title { font-family: var(--acto-head); font-weight: 700; color: var(--acto-ink); font-size: 1.08rem; line-height: 1.3; margin: 0; transition: color .15s ease; }
.acto-course-card:hover .acto-cc-title { color: var(--acto-red); }
.acto-cc-meta { display: flex; flex-wrap: wrap; gap: .4rem .9rem; color: var(--acto-gray); font-size: .82rem; margin-top: auto; }
.acto-cc-chip { display: inline-flex; align-items: center; gap: .35rem; }
.acto-cc-chip svg { color: var(--acto-red); }
.acto-cc-btn { align-self: flex-start; margin-top: .5rem; background: var(--acto-red); color: #fff; font-family: var(--acto-head); font-weight: 700; font-size: .9rem; padding: .6rem 1.3rem; border-radius: 8px; transition: background-color .18s ease; }
.acto-course-card:hover .acto-cc-btn { background: var(--acto-dark); }

/* ==========================================================================
   Catálogo: ancho + grilla centrada, y hover-reveal de meta/botón
   ========================================================================== */
/* Reveal wrapper visible por defecto (panel del alumno + táctil) */
.acto-cc-reveal { display: flex; flex-direction: column; gap: .7rem; margin-top: auto; }
.acto-cc-meta { margin-top: 0; }
.acto-cc-btn { margin-top: 0; }

/* Widen del contenedor del archivo de cursos (sale del cap de 645px) */
.post-type-archive-course .wp-site-blocks > .is-layout-constrained:not(.acto-header):not(.acto-footer):not(.acto-topbar) > * { max-width: 1120px !important; }
.post-type-archive-course .llms-loop-list.llms-course-list {
  grid-template-columns: repeat(auto-fill, minmax(300px, 360px)) !important;
  justify-content: center;
  align-items: start;
  gap: 1.75rem !important;
}

/* Hover-reveal SOLO en el catálogo (archivo). Panel del alumno: siempre visible */
.post-type-archive-course .acto-cc-reveal {
  max-height: 0; opacity: 0; transform: translateY(6px); overflow: hidden;
  transition: max-height .28s ease, opacity .22s ease, transform .28s ease;
}
.post-type-archive-course .acto-course-card:hover .acto-cc-reveal,
.post-type-archive-course .acto-course-card:focus-within .acto-cc-reveal {
  max-height: 180px; opacity: 1; transform: none;
}
@media (hover: none) {
  .post-type-archive-course .acto-cc-reveal { max-height: none; opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .post-type-archive-course .acto-cc-reveal { transition: none; }
}

/* ==========================================================================
   Accesibilidad: foco visible (WCAG 2.2) para todos los interactivos
   El outline-offset deja un gap sobre el fondo, así el anillo rojo se ve
   incluso sobre botones rojos. En superficies oscuras el anillo es blanco.
   ========================================================================== */
:where(a, button, .wp-element-button, .wp-block-button__link,
  .llms-button-action, .llms-button-primary, .llms-button-secondary,
  .acto-cc, .acto-continue-btn, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--wp--preset--color--accent-1, #B90713);
  outline-offset: 2px;
  border-radius: 6px;
}
.acto-footer a:focus-visible,
.acto-topbar a:focus-visible,
.acto-continue-btn:focus-visible { outline-color: #ffffff; }

/* ==========================================================================
   Header: botón de login/sesión (ícono + texto)
   ========================================================================== */
.acto-header .wp-block-shortcode { margin: 0; }
.acto-login-btn { display: inline-flex; align-items: center; gap: .45rem; background: var(--acto-red); color: #fff !important; font-family: var(--acto-head); font-weight: 700; font-size: .95rem; text-decoration: none; padding: .5rem 1.05rem; border-radius: 999px; transition: background-color .18s ease, transform .18s ease; }
.acto-login-btn:hover { background: var(--acto-dark); transform: translateY(-1px); }
.acto-login-btn.is-ghost { background: transparent; color: var(--acto-ink) !important; border: 1.5px solid var(--acto-line); }
.acto-login-btn.is-ghost:hover { background: var(--acto-pale); border-color: var(--acto-red); color: var(--acto-red) !important; }
.acto-login-btn svg { width: 18px; height: 18px; }
@media (prefers-reduced-motion: reduce) { .acto-login-btn:hover { transform: none; } }

/* ==========================================================================
   Login / registro split-screen (estilo auth, marca ACTO)
   ========================================================================== */
body.acto-auth-page .wp-block-post-title,
body.acto-auth-page .llms-my-account > h2:first-child { display: none; }

/* EKG line */

/* Marquee chips */

/* Form column */

/* LifterLMS forms inside the auth column */

/* Separador antes del registro */

/* Responsive: una columna, panel arriba más compacto */

/* Auth: forzar los campos de LifterLMS a una sola columna, ancho completo */

/* Show-password toggle: que no empuje el layout */

/* Header nav: inline (flex) — el shortcode no trae las clases de layout del bloque */
.acto-header .acto-nav { display: flex; align-items: center; flex-wrap: wrap; gap: 1.25rem; justify-content: flex-end; }

/* Auth page: reducir el gran espaciado superior global solo aquí */
body.acto-auth-page main.wp-block-group { margin-top: 0 !important; }
body.acto-auth-page .wp-block-group.has-global-padding { padding-top: 1.5rem !important; }
body.acto-auth-page .entry-content { margin-top: 0 !important; }

/* ==========================================================================
   Login / Registro — toggle (login primero, registro tras enlace)
   ========================================================================== */
 /* usamos el H1 propio */

.acto-auth-toggle { margin-top: 1.4rem; padding-top: 1.2rem; border-top: 1px solid var(--acto-line); color: var(--acto-gray); font-size: .95rem; }
.acto-auth-toggle a { color: var(--acto-red); font-weight: 700; text-decoration: none; }
.acto-auth-toggle a:hover { text-decoration: underline; }

/* ==========================================================================
   Auth premium (research-applied): aurora + grano + EKG glow + stagger + botón
   Solo transform/opacity (60fps). Con fallback reduced-motion al final.
   ========================================================================== */

/* Aurora (reemplaza la textura de puntos) */

/* Grano (estático) */

/* EKG en dorado con glow (firma médica premium) */

/* Subrayado dorado del titular que se dibuja */

/* Revelado escalonado del formulario */

/* Botón premium: gradiente, hover lift, press rápido */

/* Foco de inputs más marca (halo wine) */

/* ==========================================================================
   Login 3D interactivo: canvas WebGL + tarjeta glass con tilt (v3)
   ========================================================================== */
body.acto-auth-page { overflow-x: hidden; }

/* Form on glass (light text) */

/* Button: gold-edged red gradient, high contrast on dark */

/* Fix: el formwrap no debe heredar el flex-center de .acto-auth-main en la tarjeta 3D */

/* ==========================================================================
   Login split-screen estilo referencia (ilustracion + tarjeta) + wizard
   ========================================================================== */
.acto-lg { box-sizing: border-box; position: relative; left: 50%; margin-left: -50vw; width: 100vw; min-height: min(86vh, 720px); display: grid; place-items: center; padding: clamp(1.5rem,4vw,3rem) 1rem; background: radial-gradient(1000px 600px at 80% 8%, rgba(185,7,19,.07), transparent 60%), linear-gradient(135deg,#F2F2F2,#F2F2F2); }
.acto-lg-card { display: grid; grid-template-columns: 1.05fr .95fr; width: min(1000px, 96vw); min-height: 560px; background: #fff; border-radius: 24px; overflow: hidden; box-shadow: 0 40px 90px -30px rgba(17,17,17,.35), 0 2px 8px rgba(17,17,17,.04); }
.acto-lg-art { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.4rem; padding: clamp(2rem,4vw,3rem); color: #fff; text-align: center; background: linear-gradient(160deg, var(--acto-red) 0%, var(--acto-red) 55%, var(--acto-dark) 100%); }
.acto-lg-illus { width: min(76%, 270px); }
.acto-lg-illus { position: relative; }
.acto-lg-illus svg { width: 100%; height: auto; display: block; }
/* ícono de la marca (isotipo de ACTO en blanco) en el centro de los círculos */
.acto-lg-illus .acto-lg-iso { position: absolute; left: 50%; top: 50%; width: 42%; height: auto; transform: translate(-50%, -50%); }
.acto-lg-copy { min-height: 72px; }
.acto-lg-art-title { font-family: var(--acto-head); font-weight: 800; font-size: 1.6rem; margin: 0; color: #fff; transition: opacity .28s ease; }
.acto-lg-art-sub { color: rgba(255,255,255,.84); margin: .4rem auto 0; font-size: .95rem; max-width: 30ch; transition: opacity .28s ease; }
.acto-lg-dots { display: flex; gap: .5rem; }
.acto-lg-dots span { width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,.4); transition: background .2s, width .2s; }
.acto-lg-dots span.is-active { background: #fff; width: 22px; border-radius: 5px; }

.acto-lg-main { display: flex; align-items: center; justify-content: center; padding: clamp(1.75rem,3.5vw,3rem); }
.acto-lg-formwrap { width: 100%; max-width: 360px; }
.acto-lg-title { font-family: var(--acto-head); font-weight: 800; color: var(--acto-ink); font-size: 1.7rem; text-align: center; margin: 0 0 .3rem; }
.acto-lg-sub { color: var(--acto-gray); text-align: center; margin: 0 0 1.5rem; font-size: .92rem; }

.acto-lg .llms-form-heading,
.acto-lg-formwrap .llms-person-login-form-wrapper > h4,
.acto-lg-formwrap .llms-new-person-form-wrapper > h4 { display: none; }

.acto-lg .llms-form-fields { display: block; margin: 0; }
.acto-lg .llms-form-fields .llms-form-field { width: 100% !important; max-width: 100% !important; float: none !important; clear: both !important; padding: 0 0 .9rem !important; margin: 0 !important; }
.acto-lg .llms-form-field label { font-family: var(--acto-head); font-weight: 600; color: var(--acto-ink); font-size: .85rem; margin-bottom: .3rem; display: block; }
.acto-lg .llms-form-field input { width: 100%; box-sizing: border-box; border: 1.5px solid var(--acto-line); border-radius: 10px; padding: .72rem .9rem .72rem 2.5rem; font-size: .98rem; background: #F2F2F2 no-repeat 12px center; transition: border-color .15s, box-shadow .15s, background-color .15s; }
.acto-lg .llms-form-field input:focus { border-color: var(--acto-red); background-color: #fff; box-shadow: 0 0 0 3px var(--acto-pale); outline: none; }
.acto-lg input[name="llms_login"], .acto-lg input[name="email_address"], .acto-lg input[name="email_address_confirm"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23717171' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 7-10 6L2 7'/%3E%3C/svg%3E"); }
.acto-lg input[type="password"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23717171' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E"); }
.acto-lg input[name="first_name"], .acto-lg input[name="last_name"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23717171' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M5 21a7 7 0 0 1 14 0'/%3E%3C/svg%3E"); }

.acto-lg .llms-forgot-password-link, .acto-lg a[href*="lost-password"] { display: block; text-align: right; font-size: .82rem; margin: -.3rem 0 .7rem; color: var(--acto-red); }
.acto-lg .llms-button-action, .acto-lg button[name="llms_login_button"], .acto-lg button[type="submit"] { width: 100%; justify-content: center; background: var(--acto-red); border: 0; border-radius: 10px; font-family: var(--acto-head); font-weight: 700; padding: .82rem 1.5rem; color: #fff; transition: background-color .18s, transform .12s; }
.acto-lg .llms-button-action:hover, .acto-lg button[type="submit"]:hover { background: var(--acto-dark); }
.acto-lg .llms-button-action:active, .acto-lg button[type="submit"]:active { transform: scale(.985); }

.acto-lg .acto-auth-toggle { text-align: center; margin-top: 1.3rem; padding-top: 1.1rem; border-top: 1px solid var(--acto-line); color: var(--acto-gray); font-size: .9rem; }
.acto-lg .acto-auth-toggle a { color: var(--acto-red); font-weight: 700; text-decoration: none; }
.acto-lg .acto-auth-toggle a:hover { text-decoration: underline; }

.acto-lg-formwrap .llms-new-person-form-wrapper { display: none; }
.acto-lg-formwrap.show-register .llms-person-login-form-wrapper { display: none; }
.acto-lg-formwrap.show-register .llms-new-person-form-wrapper { display: block; }

/* 3-step wizard */
.acto-wiz-steps { display: flex; align-items: center; gap: .3rem; margin: 0 0 1.3rem; }
.acto-wiz-step { display: flex; align-items: center; gap: .4rem; flex: 1; color: var(--acto-gray); }
.acto-wiz-num { width: 26px; height: 26px; flex: 0 0 26px; display: grid; place-items: center; border-radius: 50%; background: #F2F2F2; color: var(--acto-gray); font-family: var(--acto-head); font-weight: 700; font-size: .8rem; transition: all .2s; }
.acto-wiz-lbl { font-size: .76rem; font-weight: 600; }
.acto-wiz-step.is-active .acto-wiz-num, .acto-wiz-step.is-done .acto-wiz-num { background: var(--acto-red); color: #fff; }
.acto-wiz-step.is-done .acto-wiz-num { opacity: .55; }
.acto-wiz-step.is-active { color: var(--acto-ink); }
.llms-new-person-form .llms-form-field[data-wizstep] { display: none; }
.llms-new-person-form.acto-reg-step-1 [data-wizstep="1"],
.llms-new-person-form.acto-reg-step-2 [data-wizstep="2"],
.llms-new-person-form.acto-reg-step-3 [data-wizstep="3"] { display: block; }
.acto-wiz-nav { display: flex; gap: .6rem; margin-top: .2rem; }
.acto-wiz-nav .acto-wiz-next { flex: 1; background: var(--acto-red); color: #fff; border: 0; border-radius: 10px; font-family: var(--acto-head); font-weight: 700; padding: .82rem; cursor: pointer; transition: background-color .18s; }
.acto-wiz-nav .acto-wiz-next:hover { background: var(--acto-dark); }
.acto-wiz-nav .acto-wiz-back { background: transparent; color: var(--acto-gray); border: 1.5px solid var(--acto-line); border-radius: 10px; font-family: var(--acto-head); font-weight: 700; padding: .82rem 1.2rem; cursor: pointer; }

@media (max-width: 860px) {
  .acto-lg-card { grid-template-columns: 1fr; }
  .acto-lg-art { order: -1; padding: 2rem 1.5rem; gap: 1rem; }
  .acto-lg-illus { width: 150px; }
}

/* ==========================================================================
   Portada y ficha del curso: ocultar piezas de "entrada de blog" del tema padre
   ========================================================================== */
body.home .wp-block-post-title { display: none; }
body.single-course .wp-block-group:has(> .wp-block-post-author-name),
body.single-course .wp-block-group:has(> .wp-block-post-navigation-link),
body.single-course .wp-block-group:has(> .wp-block-query),
body.single-course .wp-block-query,
body.single-course .wp-block-post-navigation-link { display: none; }

/* Registro: aviso de tratamiento de datos en letra pequeña, como nota legal */
.acto-lg #llms-privacy-policy p { font-size: .78rem; line-height: 1.5; color: var(--acto-gray); margin: .2rem 0 .6rem; }

/* ==========================================================================
   Menú móvil (hamburguesa) + footer centrado en celular
   ========================================================================== */
.acto-menu-btn { display: none; }
@media (max-width: 781px) {
  .acto-header { padding-top: 14px !important; padding-bottom: 14px !important; }
  .acto-header > .alignwide { flex-wrap: nowrap !important; }
  .acto-header .acto-logo img { height: 40px; }
  .acto-menu-btn { display: inline-flex; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 44px; padding: 0 11px; margin: 0; border: 1.5px solid var(--acto-line); border-radius: 12px; background: #FFFFFF; cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .acto-menu-btn span { display: block; height: 2px; border-radius: 2px; background: var(--acto-ink); transition: transform .2s ease, opacity .2s ease; }
  .acto-menu-btn[aria-expanded="true"] { border-color: var(--acto-red); }
  .acto-menu-btn[aria-expanded="true"] span { background: var(--acto-red); }
  .acto-menu-btn[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .acto-menu-btn[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .acto-menu-btn[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .acto-menu-btn:focus { outline: none; }
  .acto-menu-btn:focus-visible { outline: 2px solid var(--acto-red); outline-offset: 2px; }
  .acto-header .acto-nav { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; align-items: stretch; gap: 0; padding: 8px 20px 20px; background: #FFFFFF; border-top: 1px solid var(--acto-line); box-shadow: 0 18px 30px -18px rgba(17,17,17,.3); }
  .acto-menu-abierto .acto-header .acto-nav { display: flex; }
  .acto-nav .acto-nav-link a { display: block; padding: 14px 4px; border-bottom: 1px solid #F2F2F2; font-size: 1.05rem; }
  .acto-header .acto-nav .acto-login-btn { display: flex; width: 100%; box-sizing: border-box; justify-content: center; margin-top: 16px; padding: .8rem 1rem; }

  .acto-footer, .acto-footer .wp-block-column { text-align: center; }
  .acto-footer .wp-block-columns { flex-wrap: wrap !important; gap: 28px 16px !important; }
  .acto-footer .wp-block-column:first-child { flex-basis: 100% !important; }
  .acto-footer .wp-block-column:not(:first-child) { flex: 1 1 0 !important; min-width: 0; }
  .acto-footer .acto-footer-tag { margin-inline: auto; }
  .acto-footer .acto-footer-list { font-size: .9rem; }
  .acto-footer .acto-footer-list li { overflow-wrap: break-word; }
  .acto-footer .acto-footer-copy { justify-content: center; text-align: center; }
}

/* Sin marco de foco al tocar o hacer clic (Safari, Firefox); con teclado (Tab) sí se muestra. */
html:not(.ai-teclado) :is(.ai, .acto-header, .acto-footer, .acto-topbar) :focus { outline: none !important; }
:is(.ai, .acto-header) :is(summary, a, button, [tabindex]) { -webkit-tap-highlight-color: transparent; }

/* Acceso con correo + documento: ayuda, «Recuérdame» y contacto ordenados */
.llms-person-login-form-wrapper .llms-form-field .llms-description { display: block; margin-top: 6px; font-style: normal; font-size: .86rem; line-height: 1.45; color: #717171; }
.llms-person-login-form-wrapper .llms-form-field.type-checkbox { display: flex !important; align-items: center; gap: 10px; text-align: left !important; margin: 4px 0 0 !important; }
.llms-person-login-form-wrapper .llms-form-field.type-checkbox input { margin: 0 !important; width: 18px; height: 18px; accent-color: #B90713; flex: none; }
.llms-person-login-form-wrapper .llms-form-field.type-checkbox label { margin: 0 !important; font-weight: 600; font-size: .93rem; cursor: pointer; }
.llms-person-login-form-wrapper .llms-form-field.type-html.align-right { text-align: left !important; width: 100% !important; float: none !important; margin-top: 10px !important; }
.llms-person-login-form-wrapper .llms-form-field.type-html .llms-description { font-size: .88rem; color: #515151; }
.llms-person-login-form-wrapper .llms-form-field.type-html a { color: #B90713; font-weight: 700; text-decoration: none; white-space: nowrap; }
.llms-new-person-form .llms-form-field .llms-description { display: block; margin-top: 6px; font-style: normal; font-size: .86rem; line-height: 1.45; color: #717171; }

/* Número de documento: ícono de documento (como el sobre del correo) y aviso de «solo números» */
.acto-lg input[name="documento"], .acto-lg input[name="llms_password"][type="text"] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23717171' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Ccircle cx='8.5' cy='11' r='2.2'/%3E%3Cpath d='M5.5 16.2c.6-1.6 1.7-2.4 3-2.4s2.4.8 3 2.4'/%3E%3Cpath d='M14.5 10h4M14.5 13.5h3'/%3E%3C/svg%3E"); letter-spacing: .04em; }
.acto-lg input.acto-doc-error { border-color: #B90713 !important; background-color: #FFF5F5 !important; }
.acto-doc-aviso { margin: 6px 0 0; font-size: .85rem; font-weight: 600; color: #B90713; max-height: 0; overflow: hidden; opacity: 0; transition: opacity .2s, max-height .2s; }
.acto-doc-aviso.is-on { max-height: 3em; opacity: 1; }

/* Mi panel: aviso de pago pendiente (2026-10-19) */
.acto-pago-aviso { display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; justify-content: space-between; background: #FFF; border: 1px solid var(--acto-line); border-left: 5px solid var(--acto-red); border-radius: 14px; padding: 1.3rem 1.5rem; box-shadow: var(--acto-shadow); margin: 1.4rem 0; }
.acto-pago-aviso > div { flex: 1 1 320px; }
.acto-pago-aviso h3 { margin: .5rem 0 .4rem; font-size: 1.15rem; }
.acto-pago-aviso p { margin: 0; color: #515151; }
.acto-pago-aviso-tag { display: inline-block; padding: 4px 11px; border-radius: 999px; background: rgba(185,7,19,.08); color: var(--acto-red); font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
/* Tarjeta de acceso: mismo margen a ambos lados en celular */
@media (max-width: 700px) { .acto-lg-card { width: 100%; } }