/**
Theme Name: ERD
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: erd
Template: astra
*/

/* ========== BUSCADOR UNIFICADO (formación, foros, noticias, blog) ==========
   Todos comparten:
   - altura del input: 44px
   - tipografía: Open Sans 15px / 400
   - fondo: #fafafa, borde: 1px solid #e7e7e7
   - placeholder: #999, 15px
   - lupa decorativa a la derecha (sustituye iconos/botones nativos)
*/

/* Contenedor: position relative para alojar la lupa; resetea min-height/padding del widget */
body .facetwp-facet-buscador_cursos .facetwp-input-wrap,
body .erd-search__form,
body #bbpress-forums #bbp-search-form form,
body #bbp-search-form form,
body .bbp-search-form form,
body .hfe-search-form__container,
body .elementor-widget-search .e-search-form,
body .elementor-widget-search .e-search-input-wrapper {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    overflow: visible !important;
}

/* Lupa decorativa a la derecha */
body .facetwp-facet-buscador_cursos .facetwp-input-wrap::after,
body .erd-search__form::after,
body #bbpress-forums #bbp-search-form form::after,
body #bbp-search-form form::after,
body .bbp-search-form form::after,
body .hfe-search-form__container::after,
body .elementor-widget-search .e-search-form::after {
    content: '' !important;
    position: absolute !important;
    right: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 18px !important;
    height: 18px !important;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    pointer-events: none !important;
    z-index: 2 !important;
}

/* Input: altura, fondo, borde y tipografía idénticos en los 4 buscadores */
body .facetwp-facet-buscador_cursos input.facetwp-search,
body .erd-search__form input[type="search"],
body #bbp-search-form input[type="text"],
body #bbp-search-form input[name="bbp_search"],
body .bbp-search-form input[type="text"],
body .hfe-search-form__container .hfe-search-form__input,
body .elementor-widget-search .e-search-input,
body .elementor-widget-search input.e-search-input {
    display: block !important;
    width: 100% !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    line-height: 44px !important;
    border: 1px solid #e7e7e7 !important;
    border-radius: 0 !important;
    background: #fafafa !important;
    background-color: #fafafa !important;
    padding: 0 38px 0 15px !important;
    font-family: 'Open Sans', sans-serif !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    color: #333 !important;
    outline: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    min-width: 0 !important;
    max-width: none !important;
    box-sizing: border-box !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    text-align: left !important;
}

body .facetwp-facet-buscador_cursos input.facetwp-search:focus,
body .erd-search__form input[type="search"]:focus,
body #bbp-search-form input[type="text"]:focus,
body .bbp-search-form input[type="text"]:focus,
body .hfe-search-form__container .hfe-search-form__input:focus,
body .elementor-widget-search .e-search-input:focus {
    border-color: #ccc !important;
    background: #fff !important;
    background-color: #fff !important;
    outline: none !important;
}

/* Placeholder: mismo color y tamaño en los 4 buscadores */
body .facetwp-facet-buscador_cursos input.facetwp-search::placeholder,
body .erd-search__form input[type="search"]::placeholder,
body #bbp-search-form input[type="text"]::placeholder,
body .bbp-search-form input[type="text"]::placeholder,
body .hfe-search-form__container .hfe-search-form__input::placeholder,
body .elementor-widget-search .e-search-input::placeholder {
    color: #999 !important;
    font-family: 'Open Sans', sans-serif !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    opacity: 1 !important;
}

/* Compatibilidad navegadores antiguos */
body .facetwp-facet-buscador_cursos input.facetwp-search::-webkit-input-placeholder,
body #bbp-search-form input[type="text"]::-webkit-input-placeholder,
body .bbp-search-form input[type="text"]::-webkit-input-placeholder,
body .hfe-search-form__container .hfe-search-form__input::-webkit-input-placeholder,
body .elementor-widget-search .e-search-input::-webkit-input-placeholder {
    color: #999 !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    opacity: 1 !important;
}
body .facetwp-facet-buscador_cursos input.facetwp-search::-moz-placeholder,
body #bbp-search-form input[type="text"]::-moz-placeholder,
body .bbp-search-form input[type="text"]::-moz-placeholder,
body .hfe-search-form__container .hfe-search-form__input::-moz-placeholder,
body .elementor-widget-search .e-search-input::-moz-placeholder {
    color: #999 !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    opacity: 1 !important;
}

/* Ocultar iconos/botones nativos (la lupa decorativa los reemplaza) */
body .facetwp-facet-buscador_cursos .facetwp-icon,
body .erd-search__form button,
body #bbp-search-form input[type="submit"],
body #bbp-search-form button,
body .bbp-search-form input[type="submit"],
body .hfe-search-form__container .hfe-search-submit,
body .hfe-search-form__container button[type="submit"],
body .hfe-search-form__container button#clear-with-button, /* botón "limpiar" de HFE: absoluto a right:-30px, desbordaba 6 px la página en móvil (/noticias/) */
body .elementor-widget-search .e-search-submit,
body .elementor-widget-search button[type="submit"],
body .elementor-widget-search .e-search-label {
    display: none !important;
}

/* ========== PDF VIEWER (Dynamic.ooo - Catálogo de cursos) ========== */
.dce-pdf-controls {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
}

.dce-pdf-navigation-controls {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.dce-pdf-download-controls {
    margin-left: auto !important;
}

/* Igualar alturas: input igual que botones (~44px con padding por defecto) */
.dce-pdf-controls .dce-pdf-go-previous,
.dce-pdf-controls .dce-pdf-go-next,
.dce-pdf-controls .dce-pdf-download {
    height: 44px !important;
    box-sizing: border-box !important;
}

.dce-pdf-controls .dce-pdf-current-page {
    height: 44px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    padding: 0 8px !important;
    line-height: 44px !important;
    vertical-align: middle !important;
}

/* Botón Descargar: fondo amarillo, letras negras */
.dce-pdf-controls .dce-pdf-download {
    background-color: #f3a600 !important;
    color: #000 !important;
    border-color: #f3a600 !important;
}

.dce-pdf-controls .dce-pdf-download:hover,
.dce-pdf-controls .dce-pdf-download:focus {
    background-color: #d99500 !important;
    color: #000 !important;
    border-color: #d99500 !important;
}

/* ========== ULTIMATE MEMBER: errores de campo en naranja ========== */
.um .um-field-error,
.um-field-error {
    background: #FFB600 !important;
    background-color: #FFB600 !important;
    color: #000 !important;
}

.um .um-field-error:after,
.um-field-error:after {
    border-bottom-color: #FFB600 !important;
    border-top-color: #FFB600 !important;
}

.um .um-field-arrow i,
.um-field-arrow i,
.um .um-field-arrow,
.um-field-arrow {
    color: #FFB600 !important;
}

.um p.um-notice.err,
p.um-notice.err {
    background: #FFB600 !important;
    background-color: #FFB600 !important;
    color: #000 !important;
}

.um p.um-notice.err a,
p.um-notice.err a,
.um p.um-notice.err i,
p.um-notice.err i {
    color: #000 !important;
}

/* ── Botones UNIFORMES: sin mayúsculas forzadas y SIN letter-spacing ──
   Astra aplica a TODOS los botones, vía su tipografía global de botones
   (font-extras-button), letter-spacing:2px y text-transform:uppercase. Aquí
   neutralizamos AMBOS para que todos los botones de la web se vean iguales: mismo
   espaciado entre letras (normal, como "Usar Rincoins") y el texto tal cual está
   escrito en el HTML. Cubre theme, Astra, WooCommerce, Elementor, Ultimate Member,
   LearnDash y los botones custom del theme (foros, cupón). Si aparece algún botón
   no contemplado, añadir su selector a esta lista. */
.button,
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.wp-block-button__link,
.wp-element-button,
.ast-button,
.ast-custom-button,
.ast-header-woo-cart .ast-button,
.menu-toggle,
.elementor-button,
.elementor-button-link,
.elementor-field-type-submit button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce .button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-page a.button,
.woocommerce-page button.button,
a.checkout-button,
.wc-block-components-button,
.um .um-button,
.um-button,
.learndash-wrapper .ld-button,
.ld-button,
.wpProQuiz_button,
.erd-btn-quote,
.erd-btn-respond {
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* ── Cupón (checkout Y carrito): input y botón a la misma altura ──
   Usamos #coupon_code (id → gana en especificidad a Astra) para el input, que es el
   mismo en carrito y checkout; y el botón por su name dentro de su contenedor. */
#coupon_code,
.woocommerce #coupon_code,
.woocommerce-page #coupon_code,
.woocommerce .coupon button[name="apply_coupon"],
.woocommerce-page .coupon button[name="apply_coupon"],
.woocommerce form.checkout_coupon button[name="apply_coupon"],
.woocommerce-page form.checkout_coupon button[name="apply_coupon"] {
    height: 50px !important;
    min-height: 50px !important;
    box-sizing: border-box !important;
    vertical-align: middle !important;
}
.woocommerce .coupon button[name="apply_coupon"],
.woocommerce-page .coupon button[name="apply_coupon"],
.woocommerce form.checkout_coupon button[name="apply_coupon"],
.woocommerce-page form.checkout_coupon button[name="apply_coupon"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1.2 !important;
}

/* ── Carrito: título "Carrito" — margen superior 60px + estilo igual al resto de h1
   (Open Sans 600, 32px/45px, #333) ── */
body.woocommerce-cart .entry-header .entry-title,
body.woocommerce-cart h1.entry-title {
    margin-top: 60px !important;
    font-family: "Open Sans", sans-serif !important;
    font-style: normal !important;
    font-weight: 600 !important;
    font-size: 32px !important;
    line-height: 45px !important;
    color: rgb(51, 51, 51) !important;
}

/* ── Carrito: miniatura del producto COMPLETA (sin recortar), con su proporción ──
   La imagen del vídeo de Vimeo es 16:9; se muestra entera (ancho fijo, alto auto). */
.woocommerce table.cart td.product-thumbnail img,
.woocommerce-cart-form .cart_item td.product-thumbnail img,
.woocommerce .cart_item .product-thumbnail img {
    width: 100px !important;
    max-width: 100px !important;
    height: auto !important;
    object-fit: contain !important;
    border-radius: 4px;
}

/* ── Comentarios del blog (widget Elementor "Post Comments"): al 100% del ancho del
   contenido. Astra/WP indentan y limitan el área de comentarios (padding lateral en
   .comment-respond / .ast-comment-list, max-width en .comments-area); lo neutralizamos
   SOLO dentro del widget para que el formulario y los comentarios queden alineados con
   el texto del artículo. Se preserva el sangrado de las respuestas anidadas (.children). */
.elementor-widget-post-comments #comments,
.elementor-widget-post-comments .comments-area,
.elementor-widget-post-comments #respond,
.elementor-widget-post-comments .comment-respond,
.elementor-widget-post-comments .comment-form,
.elementor-widget-post-comments .comment-list,
.elementor-widget-post-comments .ast-comment-list,
.elementor-widget-post-comments .comment-list > li.depth-1,
.elementor-widget-post-comments .ast-comment-list > li.depth-1 {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}
.elementor-widget-post-comments .comment-form-comment,
.elementor-widget-post-comments .comment-form textarea,
.elementor-widget-post-comments textarea#comment {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* ── Listado de cursos: descripción (descripcion_corta) a 3 líneas máx. con "…".
   Widget text-editor id 8d52992 de la plantilla "Listado de cursos" (#2366). Si el
   texto supera 3 renglones se recorta con puntos suspensivos. */
.elementor-element-8d52992 .elementor-widget-container {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
    line-clamp: 3 !important;
    overflow: hidden !important;
    /* Reservar SIEMPRE el alto de 3 líneas para que todas las tarjetas alineen el
       botón "Ver curso" y el precio aunque la descripción sea más corta. */
    line-height: 1.5 !important;
    min-height: 4.5em !important;
}
.elementor-element-8d52992 .elementor-widget-container p {
    margin-bottom: 0 !important;
}

/* ── Listado de cursos: TÍTULO a 2 líneas exactas para que todas las tarjetas tengan
   la misma altura (evita descuadres). Los títulos de 1 línea reservan el alto de 2;
   los de >2 líneas se recortan con "…". Widget theme-post-title id aa609a8 (#2366). */
.elementor-element-aa609a8 .elementor-heading-title,
.elementor-element-aa609a8 .elementor-widget-container > * {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    overflow: hidden !important;
    line-height: 1.3 !important;
    min-height: 2.6em !important;
}
/* Hueco uniforme bajo el título del listado: que no dependa de la 2ª línea reservada
   del min-height, así las tarjetas con título de 2 líneas también separan la descripción. */
.elementor-element-aa609a8 {
    margin-bottom: 14px !important;
}

/* ── Checkout: subrayar el enlace "Haz clic aquí..." del aviso de cupón ──
   Para que se vea que es clicable (Astra quita el subrayado de los enlaces). */
.woocommerce-form-coupon-toggle .woocommerce-info a.showcoupon,
.woocommerce .woocommerce-info a.showcoupon,
.woocommerce-page .woocommerce-info a.showcoupon,
a.showcoupon {
    text-decoration: underline !important;
}

/* ── Perfil UM: avatar más pequeño (2026-06-11) ──
   UM lo pinta a 190px; se reduce VISUALMENTE por CSS (cambiar el tamaño en UM
   generaría URLs de miniaturas -140x140 que no existen para las fotos ya
   subidas). El aro del rango (erd-um-rank-frame, inc/integrations-um.php) se
   posiciona en % dentro del mismo contenedor, así que escala solo. */
.um-profile .um-profile-photo,
.um .um-profile-photo {
    width: 140px !important;
    height: 140px !important;
    min-height: 0 !important;
}
.um-profile .um-profile-photo a.um-profile-photo-img,
.um .um-profile-photo a.um-profile-photo-img {
    width: 140px !important;
    height: 140px !important;
}
.um-profile .um-profile-photo img,
.um .um-profile-photo img {
    width: 140px !important;
    height: 140px !important;
    max-width: 140px !important;
}

/* ========== PAGINACIÓN UNIFICADA (2026-09-12: "todas las paginaciones como la de /formacion/") ==========
   Referencia = widget Posts de Elementor en /formacion/, /blog/, /noticias/ y /eventos/ (ajustes nativos del widget:
   números, Open Sans 22 px, 16 px entre números, 30 px por encima, activa #F3A600): centrada, números en el gris del
   texto, la página ACTUAL en un cuadrado amarillo con el número en blanco. El mismo formato para las paginaciones que no
   son de Elementor: la de la búsqueda general (`.erd-pagination`, inc/search-tweaks.php) y las de bbPress
   (bbpress-custom.css, con la especificidad que exige bbp-default). Todas usan las clases `.page-numbers` de WordPress. */
.elementor-pagination .page-numbers.current,
.elementor-pagination span.current,
.page-numbers.current {
    background-color: #F3A600 !important;
    color: #fff !important;
    border-radius: 4px;
    padding: 4px 11px;
}
.erd-pagination,
.woocommerce nav.woocommerce-pagination { text-align: center; margin: 30px 0 0; }
.woocommerce nav.woocommerce-pagination ul.page-numbers { border: 0; display: inline; }
.woocommerce nav.woocommerce-pagination ul.page-numbers li { border: 0; display: inline; }
.erd-pagination .page-numbers,
.woocommerce nav.woocommerce-pagination ul.page-numbers li .page-numbers { display: inline-block; margin: 0 8px; padding: 0; border: 0; background: transparent; font-family: 'Open Sans', sans-serif; font-size: 22px; font-weight: 400; line-height: 1.3; color: #222; text-decoration: none; }
.woocommerce nav.woocommerce-pagination ul.page-numbers li .page-numbers.current { background-color: #F3A600; color: #fff; border-radius: 4px; padding: 4px 11px; }
.erd-pagination a.page-numbers:hover { color: #36aae0; }
.erd-pagination .page-numbers.dots { color: #8a94a0; }
@media (max-width: 768px) {
    .erd-pagination .page-numbers { margin: 0 5px; font-size: 18px; }
    .erd-pagination .page-numbers.current { padding: 3px 9px; }
}

/* Más aire (interlineado) en los textos descriptivos y mensajes de los formularios
   de Ultimate Member: recuperar contraseña, "revisa tu bandeja de entrada", etc.
   El texto vive en un div (a veces con style inline) dentro de .um-field-block. */
.um .um-field-type_block .um-field-block,
.um .um-field-type_block .um-field-block > div,
.um .um-field-type_block .um-field-block p,
.um-password .um-field-block,
.um-password .um-field-block > div,
.um-password .um-field-block p {
    line-height: 2.15 !important;
}
.um .um-field-type_block {
    margin-bottom: 10px !important;
}

/* ===== Progreso de cápsula (LearnDash): CASILLA completada / no completada =====
   Markup propio (inc/ld-mark-complete-button.php): <button class="erd-ld-toggle erd-ld-toggle--todo|--done">
   con icono + texto principal + pista, en lugar del <input type=submit> de LearnDash. Desde el 2026-09-08
   (pedido del cliente) NO parece un botón sino una casilla de verificación: cuadrado con borde gris
   (pendiente) o verde con ✓ (completada) + etiqueta; la pista solo queda en el aria-label. El <button>
   se conserva porque envía el formulario de LearnDash. `body` + !important para ganar al Customizer de
   LearnDash y a los estilos de botón de Astra. */
body .learndash-wrapper .sfwd-mark-complete .erd-ld-toggle.erd-ld-toggle,
body .erd-ld-toggle.erd-ld-toggle {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 4px 0 !important;
    border-radius: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #2c3e50 !important;
    font-family: inherit !important;
    font-size: 15px !important;
    line-height: 1.25 !important;
    text-align: left !important;
    text-transform: none !important;
    white-space: normal !important;
    cursor: pointer !important;
    box-shadow: none !important;
    outline: 0 !important;
}
/* La casilla: el icono (○ / ✓) se convierte en un cuadrado; en pendiente el ○ se oculta (color transparente) */
body .erd-ld-toggle .erd-ld-toggle-icon {
    flex: 0 0 auto; width: 22px; height: 22px; box-sizing: border-box;
    display: inline-flex; align-items: center; justify-content: center;
    border: 2px solid #9aa5b1; border-radius: 4px; background: #fff;
    font-size: 15px; line-height: 1; font-weight: 700; color: transparent;
    transition: background .15s ease, border-color .15s ease;
}
body .erd-ld-toggle.erd-ld-toggle--done .erd-ld-toggle-icon { background: #2e7d32; border-color: #2e7d32; color: #fff; }
body .erd-ld-toggle:hover .erd-ld-toggle-icon,
body .erd-ld-toggle:focus-visible .erd-ld-toggle-icon { border-color: #36AAE0; }
body .erd-ld-toggle.erd-ld-toggle--done:hover .erd-ld-toggle-icon { background: #276b2a; border-color: #276b2a; }
body .erd-ld-toggle .erd-ld-toggle-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
body .erd-ld-toggle .erd-ld-toggle-text strong { font-weight: 600; }
body .erd-ld-toggle .erd-ld-toggle-text small { display: none; }
body .erd-ld-toggle.erd-ld-toggle:hover { color: #36AAE0 !important; }
body .erd-ld-toggle.erd-ld-toggle:disabled { opacity: .55 !important; cursor: not-allowed !important; }
/* La etiqueta en UNA sola línea (pedido 2026-09-08): LearnDash da a cada bloque de acciones del pie
   (.ld-content-action: anterior / completar / siguiente) un ancho fijo de 200px y partía "Marcar cápsula como
   completada" en dos líneas → el bloque de la casilla se ajusta a su contenido y el texto no se parte. */
body .learndash-wrapper .ld-content-actions .ld-content-action:has(.sfwd-mark-complete) { flex: 0 1 auto !important; }
body .erd-ld-toggle .erd-ld-toggle-text strong { white-space: nowrap; }
/* Quitar el check (✓) que learndash.css añade con ::after a los formularios: el icono ya va en el botón. */
.learndash-wrapper .sfwd-mark-complete::after,
.learndash-wrapper .sfwd-mark-incomplete::after,
.learndash-wrapper .sfwd-mark-incomplete.sfwd-mark-complete::after {
    content: none !important;
    display: none !important;
}

/* ===== Ficha de curso (plantilla Elementor #2038): los dos CTA del pie en UNA fila =====
   "Suscríbete y tendrás acceso a todos los cursos" (widget button b9ab849) a la IZQUIERDA y
   "Añadir curso completo + precio" ([buy_full_course_button], widget shortcode c4380db) a su
   DERECHA. Suscripción en azul oscuro #0073AA (el del widget) y el del curso en el azul claro
   #36AAE0 de los botones de precio de las cápsulas (pedido 2026-09-03; el color base lo pone el
   shortcode en inc/shortcodes-learndash.php). En Elementor el container 8c9e54e es
   una COLUMNA al 50% alineada a la derecha y 06f76d8 un hueco vacío al 50%: aquí 8c9e54e
   pasa a FILA al 100% con dos mitades iguales y se oculta el hueco. Va por CSS (viaja con el
   deploy) en vez de tocar _elementor_data (BBDD, habría que replicarlo en dev/prod). `body`
   delante para ganar a uploads/elementor/css/post-2038.css. Si se reconstruye la plantilla
   cambian los ids (mismo riesgo que erd_hide_subscribe_all_button_css). */
body .elementor-2038 .elementor-element.elementor-element-06f76d8 {
    display: none !important;
}
body .elementor-2038 .elementor-element.elementor-element-8c9e54e {
    --width: 100% !important;
    --flex-direction: row !important;
    --align-items: stretch !important;
    --justify-content: space-between !important;
    --gap: 24px !important;
    --row-gap: 24px !important;
    --column-gap: 24px !important;
}
body .elementor-2038 .elementor-element.elementor-element-8c9e54e > .elementor-element {
    flex: 1 1 0 !important;
    width: auto !important;
    max-width: none !important;
}
body .elementor-2038 .elementor-element.elementor-element-b9ab849 { order: 1 !important; }
body .elementor-2038 .elementor-element.elementor-element-c4380db { order: 2 !important; }
/* Los dos botones ocupan toda su mitad y el mismo alto (la fila estira a los hijos) */
body .elementor-2038 .elementor-element.elementor-element-8c9e54e > .elementor-element > .elementor-widget-container,
body .elementor-2038 .elementor-element.elementor-element-b9ab849 .elementor-button-wrapper {
    height: 100% !important;
}
body .elementor-2038 .elementor-element.elementor-element-b9ab849 .elementor-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    box-sizing: border-box !important;
    background-color: #0073AA !important;
}
/* Botón del curso: mismo padding que el de suscripción, texto a la izquierda y precio a la derecha */
body .elementor-2038 .elementor-element.elementor-element-c4380db .erd-btn-course-full {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
    width: 100% !important;
    height: 100% !important;
    padding: 20px !important;
    box-sizing: border-box !important;
    background: #36AAE0 !important;
    text-align: left !important;
}
body .elementor-2038 .elementor-element.elementor-element-c4380db .erd-btn-course-full .erd-price {
    margin-left: auto !important;
    white-space: nowrap;
}
/* Misma tipografía en los dos botones (el de Elementor va a 15px "sm"; el del shortcode heredaba el
   tamaño del cuerpo, más grande): 15px / 600 en ambos, precio incluido. */
body .elementor-2038 .elementor-element.elementor-element-b9ab849 .elementor-button,
body .elementor-2038 .elementor-element.elementor-element-b9ab849 .elementor-button .elementor-button-text,
body .elementor-2038 .elementor-element.elementor-element-c4380db .erd-btn-course-full,
body .elementor-2038 .elementor-element.elementor-element-c4380db .erd-btn-course-full .erd-price,
body .elementor-2038 .elementor-element.elementor-element-c4380db .erd-btn-course-full .erd-price * {
    font-family: inherit !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
}
@media (max-width: 767px) {
    body .elementor-2038 .elementor-element.elementor-element-8c9e54e {
        --flex-direction: column !important;
    }
}

/* ========== RESULTADOS DE LA BÚSQUEDA GENERAL (/?s=) (2026-09-12) ==========
   Plantilla search.php + erd_search_render() (inc/search-tweaks.php). Lista de resultados de contenido mixto (cursos,
   cápsulas, debates, respuestas, blog, noticias, eventos): miniatura a la izquierda si la hay, etiqueta del tipo con un
   color por grupo, contexto (curso de la cápsula, foro, categoría), título, fragmento con el término en <mark>, fecha.
   Cabecera: título, recuento, buscador (estilo unificado de arriba) y chips por grupo con recuento. */
.erd-search { max-width: 1140px; margin: 0 auto; padding: 0 0 60px; box-sizing: border-box; } /* mismo ancho y laterales que la barra de migas */
@media (max-width: 1180px) { .erd-search { padding-left: 40px; padding-right: 40px; } }
.erd-search__title { font-size: 32px; line-height: 1.25; margin: 0 0 6px; }
.erd-search__count { margin: 0 0 18px; font-size: 15px; color: #6b7280; }
.erd-search__form { max-width: 560px; margin: 0 0 16px !important; }
.erd-search__types { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 8px; }
.erd-search__type { display: inline-block; padding: 6px 14px; border: 1px solid #dfe5ea; border-radius: 20px; background: #fff; color: #36aae0; font-size: 14px; line-height: 1.4; text-decoration: none; transition: background .15s, color .15s; }
.erd-search__type:hover, .erd-search__type:focus { background: #f2f7fa; color: #2b8fbf; text-decoration: none; }
.erd-search__type.is-active { background: #F3A600; border-color: #F3A600; color: #fff; }
.erd-search__n { opacity: .8; margin-left: 2px; }
.erd-search__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid #ececec; }
.erd-search__item { display: flex; gap: 22px; padding: 22px 0; border-bottom: 1px solid #ececec; }
.erd-search__thumb { flex: 0 0 168px; }
.erd-search__thumb img { display: block; width: 168px; height: 106px; object-fit: cover; border-radius: 6px; }
.erd-search__body { flex: 1 1 auto; min-width: 0; }
.erd-search__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0 0 6px; font-size: 12px; letter-spacing: .3px; color: #6b7280; }
.erd-search__badge { display: inline-block; padding: 2px 9px; border-radius: 4px; background: #eef2f5; color: #4b5563; font-weight: 700; text-transform: uppercase; }
.erd-search__badge--formacion { background: #fff1d1; color: #9a5f00; }
.erd-search__badge--foros { background: #e6f5fb; color: #1f7fb0; }
.erd-search__badge--blog { background: #eaf7ee; color: #1d7a3b; }
.erd-search__badge--noticias { background: #f1eafb; color: #5b3aa8; }
.erd-search__badge--eventos { background: #fde9ea; color: #b02a37; }
.erd-search__context { color: #6b7280; text-decoration: none; }
a.erd-search__context:hover { color: #36aae0; }
.erd-search__item-title { font-size: 20px; line-height: 1.3; margin: 0 0 6px; }
.erd-search__item-title a { color: #222; text-decoration: none; }
.erd-search__item-title a:hover { color: #36aae0; }
.erd-search__excerpt { margin: 0 0 8px; font-size: 15px; line-height: 1.6; color: #4b5563; }
.erd-search mark { background: #fff1c2; color: inherit; padding: 0 2px; border-radius: 2px; }
.erd-search__foot { font-size: 13px; color: #8a94a0; }
.erd-search__empty { padding: 24px 0 0; font-size: 16px; }
@media (max-width: 768px) {
    .erd-search { padding-left: 24px; padding-right: 24px; }
    .erd-search__title { font-size: 26px; }
    .erd-search__form { max-width: none; }
    .erd-search__item { gap: 14px; padding: 18px 0; }
    .erd-search__thumb { flex-basis: 96px; }
    .erd-search__thumb img { width: 96px; height: 64px; }
    .erd-search__item-title { font-size: 17px; }
    .erd-search__excerpt { font-size: 14px; }
}

/* ========== MIGAS DE PAN DE TODA LA WEB (2026-09-12; dentro del bloque de contenido desde el 13-09) ==========
   Una sola fuente (Rank Math, activado y con los recorridos por sección en inc/breadcrumbs.php), un solo estilo y un
   solo BreadcrumbList por página. Marcado: <div class="erd-breadcrumbs …"><nav class="rank-math-breadcrumb"><p>
   <a>Inicio</a> <span class="separator">›</span> … <span class="last">Actual</span></p></nav></div>.
   Tres colocaciones, todas con el MISMO aire (pedido del usuario): 18 px arriba y 32 abajo en escritorio/tablet, 14 y
   24 en móvil, medido del texto de la miga al título / primer bloque; el aire lo pone SIEMPRE la miga y lo que sigue
   empieza a 0.
   - `.erd-breadcrumbs--in`: DENTRO del primer bloque de contenido de Elementor, como primer hijo de su primera pila
     (inc/breadcrumbs.php): hereda el fondo, el ancho y los márgenes del bloque, sin banda aparte (pedido del usuario,
     13-09). Los contenedores y secciones de esa cadena pierden el relleno superior (`:has()`), y el hueco `gap` del
     contenedor se descuenta del aire inferior con `var(--row-gap)` (custom property que Elementor define en `.e-con` y
     que la miga hereda; fuera de un contenedor vale 0).
   - `.erd-breadcrumbs--edge`: bloque en CAJA centrada seguido de un bloque a todo el ancho (intro de eventos/formación/
     comunidad, vídeo del curso): hijo directo del bloque, antes de su caja, con el texto en el margen del contenido de
     la página (el que marca ese bloque ancho: a 1777 px la caja de 1140 empieza a 318 y las tarjetas a 100 → la miga
     a 100), descontando el relleno lateral del bloque (`--padding-left/right` de Elementor; `--erd-host-pl/pr*` en
     secciones). Variables `--erd-pm/pmr*` desde el PHP.
   - `.erd-breadcrumbs--mimic`: barra DELANTE del bloque cuando la miga no cabe dentro (fila con columnas parciales:
     registros) o no se localiza el hueco: imita el fondo y los márgenes con las variables que le escribe el PHP
     (--erd-bg; --erd-max = caja centrada; --erd-pl/pr = relleno del bloque fuera de la caja; --erd-bpl/bpr = relleno
     de sus hijos dentro de la caja; sufijos -t y -m para tablet y móvil, cortes de Elementor 1024/767).
   - `.erd-breadcrumbs--bar`: barra al principio de #primary en las páginas que no pinta Elementor (carrito, checkout,
     perfil y Mi cuenta de UM, 404, búsqueda): sigue el ancho de #primary (contenedor de Astra) para alinearse con el
     contenido; con #primary a todo el ancho (plantilla "Page Builder": 404, búsqueda) usa la caja de 1140 px centrada
     de `.erd-search`, con 40 px laterales en tablet y 24 en móvil.
   - En los foros la miga va en el flujo (buscador · miga · título) con sus propias clases de posición (inc/bbpress.php).
   - Móvil: una sola línea con scroll horizontal si no cabe (solo CSS, mismo marcado y enlaces: sin efecto en SEO); barra
     de scroll oculta; el padding derecho va en el <p> porque el final del scroll no cuenta el del contenedor.
   - Lo que sigue a la barra de #primary empieza a 0: #primary pierde su margen superior de 4em (perfil UM), el título
     de las páginas con plantilla "Page Builder" de Astra el `margin-top: 4em` de `.ast-page-builder-template
     .entry-header`, el 404 el de `.ast-404-layout-1` y el carrito los 60 px de su regla propia. Las secciones de
     Elementor que abren cada página ya llevan el relleno superior a 0 (fixer `_fix_elementor_movil_2026_09_12.php`);
     las demás lo pierden con el `:has()` de arriba. */
.erd-breadcrumbs { font-size: 14px; line-height: 1.5; color: #52677a; text-align: left; }
.erd-breadcrumbs .rank-math-breadcrumb p { margin: 0; }
.erd-breadcrumbs a { color: #36aae0; text-decoration: none; }
.erd-breadcrumbs a:hover, .erd-breadcrumbs a:focus { color: #2b8fbf; text-decoration: underline; }
.erd-breadcrumbs .separator { color: #b0bac4; margin: 0 2px; }
.erd-breadcrumbs .last { color: #52677a; }
/* Dentro del bloque de Elementor (primer hijo de una pila: contenedor en columna, .e-con-inner o .elementor-widget-wrap) */
.erd-breadcrumbs--in { width: 100%; flex: 0 0 auto; box-sizing: border-box; padding: 18px 0 max(0px, calc(32px - var(--row-gap, 0px))); }
.e-grid > .erd-breadcrumbs--in, .e-grid > .e-con-inner > .erd-breadcrumbs--in { grid-column: 1 / -1; }
.e-con:has(.erd-breadcrumbs--in), .e-con:has(> .erd-breadcrumbs--edge) { --padding-top: 0px !important; }
.elementor-section:has(.erd-breadcrumbs--in), .elementor-section:has(> .erd-breadcrumbs--edge) { padding-top: 0 !important; }
.elementor-column:has(> .elementor-widget-wrap > .erd-breadcrumbs--in) > .elementor-widget-wrap { padding-top: 0 !important; }
/* Al borde de un bloque en caja (hijo directo del bloque, antes de su caja): el texto en el margen del contenido de la
   página (--erd-pm*, lo escribe el PHP) descontando el relleno lateral del propio bloque (--padding-left/right que
   Elementor define en cada contenedor y la miga hereda; en secciones va en --erd-host-pl/pr*). */
.erd-breadcrumbs--edge { width: 100%; flex: 0 0 auto; box-sizing: border-box; padding: 18px max(0px, calc(var(--erd-pmr, 0px) - var(--erd-host-pr, var(--padding-right, 0px)))) 32px max(0px, calc(var(--erd-pm, 0px) - var(--erd-host-pl, var(--padding-left, 0px)))); }
@media (max-width: 1024px) {
    .erd-breadcrumbs--edge { padding-left: max(0px, calc(var(--erd-pm-t, 0px) - var(--erd-host-pl-t, var(--padding-left, 0px)))); padding-right: max(0px, calc(var(--erd-pmr-t, 0px) - var(--erd-host-pr-t, var(--padding-right, 0px)))); }
    .erd-breadcrumbs--in { padding-left: var(--erd-inset-t, 0px); padding-right: var(--erd-inset-t, 0px); } /* solo si la caja no deja relleno (--erd-inset-t lo escribe el PHP) */
}
@media (max-width: 767px) {
    .erd-breadcrumbs--edge { padding: 14px max(0px, calc(var(--erd-pmr-m, 0px) - var(--erd-host-pr-m, var(--padding-right, 0px)))) 24px max(0px, calc(var(--erd-pm-m, 0px) - var(--erd-host-pl-m, var(--padding-left, 0px)))); }
    .erd-breadcrumbs--in { padding-left: var(--erd-inset-m, 0px); padding-right: var(--erd-inset-m, 0px); }
}
/* Barra delante del bloque imitando su fondo y sus márgenes */
.erd-breadcrumbs--mimic { background: var(--erd-bg, transparent); padding: 18px var(--erd-pr, 0px) 32px var(--erd-pl, 0px); box-sizing: border-box; }
.erd-breadcrumbs--mimic > .erd-breadcrumbs__box { max-width: var(--erd-max, none); margin: 0 auto; padding: 0 var(--erd-bpr, 0px) 0 var(--erd-bpl, 0px); box-sizing: border-box; }
.erd-breadcrumbs--mimic + .e-con { --padding-top: 0px !important; }
.erd-breadcrumbs--mimic + .elementor-section { padding-top: 0 !important; }
@media (max-width: 1024px) {
    .erd-breadcrumbs--mimic { padding-left: var(--erd-pl-t, 0px); padding-right: var(--erd-pr-t, 0px); }
    .erd-breadcrumbs--mimic > .erd-breadcrumbs__box { padding-left: var(--erd-bpl-t, 0px); padding-right: var(--erd-bpr-t, 0px); }
}
@media (max-width: 767px) {
    .erd-breadcrumbs--mimic { padding: 14px var(--erd-pr-m, 0px) 24px var(--erd-pl-m, 0px); }
    .erd-breadcrumbs--mimic > .erd-breadcrumbs__box { padding-left: var(--erd-bpl-m, 0px); padding-right: var(--erd-bpr-m, 0px); }
}
/* Barra de #primary (páginas sin Elementor): el ancho de #primary; caja de 1140 si #primary va a todo el ancho */
.erd-breadcrumbs--bar { padding: 18px 0 32px; box-sizing: border-box; }
#primary:has(> .erd-breadcrumbs--bar) { margin-top: 0; }
body.ast-page-builder-template #primary > .erd-breadcrumbs--bar { max-width: 1140px; margin: 0 auto; }
@media (max-width: 1180px) { body.ast-page-builder-template #primary > .erd-breadcrumbs--bar { padding-left: 40px; padding-right: 40px; } }
body.ast-page-builder-template #primary > .erd-breadcrumbs--bar + main .entry-header { margin-top: 0; }
#primary > .erd-breadcrumbs--bar + .error-404 .ast-404-layout-1 { margin-top: 0; }
body.woocommerce-cart #primary > .erd-breadcrumbs--bar + main .entry-header .entry-title { margin-top: 0 !important; } /* pisa los 60 px del bloque "Carrito: título" */
@media (max-width: 768px) {
    .erd-breadcrumbs--in { padding-top: 14px; padding-bottom: max(0px, calc(24px - var(--row-gap, 0px))); }
    .erd-breadcrumbs--bar { padding: 14px 0 24px; }
    body.ast-page-builder-template #primary > .erd-breadcrumbs--bar { padding: 14px 24px 24px; }
    .erd-breadcrumbs .rank-math-breadcrumb { overflow-x: auto; overflow-y: hidden; white-space: nowrap; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
    .erd-breadcrumbs .rank-math-breadcrumb::-webkit-scrollbar { display: none; }
    .erd-breadcrumbs .rank-math-breadcrumb p { display: inline-block; white-space: nowrap; padding-right: 24px; }
}

/* ========== CABECERA MÓVIL/TABLET: padding vertical del logo (2026-09-12) ==========
   Astra pone `.ast-site-identity { padding: 1em 0 }` (15 px arriba y abajo) en su CSS estático y el Personalizador no
   tiene control para ello (el Header Builder solo expone el MARGEN del logo). Al subir el logo de 74 a 100 px de ancho
   (30 px de alto; fixer tools/responsive/_fix_astra_header_movil_2026_09_12.php) la barra pasaba de 64 a 72 px: con
   11 px la fila vuelve a los 52 px de antes. Solo la cabecera móvil/tablet (.ast-mobile-header-wrap, < 922 px). */
.ast-mobile-header-wrap .ast-site-identity { padding-top: 11px; padding-bottom: 11px; }
/* Móviles estrechos (≤ 380 px; 360 es el ancho más común en Android): logo 100 + carrito + botón «Registro» + hamburguesa
   suman 355 px en una barra de 328 útiles → la hamburguesa salía cortada y la página tenía scroll lateral (11 px). Astra
   no distingue este tramo (solo tablet/móvil): logo a 88 px aquí y botón «Registro» compacto en inc/integrations-um.php. */
@media (max-width: 380px) {
    .ast-header-break-point .site-logo-img .custom-logo-link img, .ast-header-break-point .site-logo-img img { max-width: 88px; }
}

/* ========== FILTROS DE /formacion/ (página 2091): cabeceras en negrita (2026-09-08) ==========
   Las cabeceras "Solución" / "Productos" / "Categoría" las pinta el widget "FacetWP Facet" de Elementor
   (plugin facetwp-elementor, <div class="facet-wrap"><span>Cabecera</span><div class="facetwp-facet">…):
   el primer hijo del wrap es la cabecera (la etiqueta HTML se elige en el widget), el otro es el facet. */
body.page-id-2091 .facet-wrap > :not(.facetwp-facet) {
    font-weight: 700;
}
/* La casilla "Gratuitos (33)" es el propio facet de tipo checkbox (plugin facetwp, checkboxes.php:
   <div class="facetwp-checkbox">Gratuitos <span class="facetwp-counter">(33)</span></div>), sin cabecera aparte. */
body.page-id-2091 .facetwp-facet-gratuitos .facetwp-checkbox {
    font-weight: 700;
}
/* Filtros en tablet/móvil (2026-09-12): lo que no tiene control en Elementor ni en FacetWP. FacetWP pone
   `margin-bottom: 40px` a cada faceta (front.css) y deja el <select> a ancho automático: apiladas en móvil, cada
   faceta iba ~100 px por debajo de la anterior y cada desplegable con un ancho distinto; en tablet el último se salía
   de su columna. Los paddings y huecos de los contenedores van en la propia página (fixer
   tools/responsive/_fix_elementor_movil_2026_09_12.php). */
@media (max-width: 1024px) {
    body.page-id-2091 .facet-wrap .facetwp-facet,
    body.page-id-2091 .elementor-widget-facetwp-facet .facetwp-facet { margin-bottom: 0; }
    body.page-id-2091 .facetwp-facet select.facetwp-dropdown { width: 100%; max-width: 100%; }
}

/* ========== TARJETAS DE CURSO (plantilla loop 2366): reparto del alto (2026-09-08) ==========
   El grid iguala la altura de las tarjetas y el alto sobrante se repartía entre las TRES cajas de la tarjeta
   (flex-grow: 1 de los contenedores de Elementor): en las tarjetas cortas aparecía un hueco entre el vídeo y la
   fila "alumnos / autor" (Natalia vs Jon). Solo crece la caja del contenido (599410a): el vídeo queda pegado a
   la fila y los botones siguen abajo. Medido con Chromium: gap vídeo→alumnos pasa de 20-52 px a 20 px fijo. */
.ecs-posts .ecs-post-loop > .elementor-2366 > .e-con { flex-grow: 0 !important; }
.ecs-posts .ecs-post-loop > .elementor-2366 > .e-con.elementor-element-599410a { flex-grow: 1 !important; }

/* ========== TARJETAS DE CURSO (plantilla loop 2366, listado /formacion/): botón según acceso (2026-09-08) ==========
   WC Memberships añade a cada tarjeta la clase access-granted (el usuario ya puede ver el curso: comprado suelto,
   suscripción global o curso gratuito) o access-restricted. Pedido del cliente: comprado = gris con hover azul;
   no comprado = azul con hover gris (los mismos dos colores globales que ya usa el botón: azul #36aae0 y el
   secundario #54595F, que era su hover). Especificidad 0,5,0 > la regla de Elementor (0,4,0). */
.elementor-2366.access-granted .elementor-element.elementor-element-067f629 .elementor-button {
    background-color: #54595F;
    color: #FFFFFF;
}
.elementor-2366.access-granted .elementor-element.elementor-element-067f629 .elementor-button:hover,
.elementor-2366.access-granted .elementor-element.elementor-element-067f629 .elementor-button:focus {
    background-color: #36aae0;
    color: #FFFFFF;
}
.elementor-2366.access-restricted .elementor-element.elementor-element-067f629 .elementor-button {
    background-color: #36aae0;
    color: #FFFFFF;
}
.elementor-2366.access-restricted .elementor-element.elementor-element-067f629 .elementor-button:hover,
.elementor-2366.access-restricted .elementor-element.elementor-element-067f629 .elementor-button:focus {
    background-color: #54595F;
    color: #FFFFFF;
}

/* ========== LOGIN (formulario de Ultimate Member, /login/): aire entre "Mantenerme conectado" y los botones (2026-09-08) ==========
   La casilla "Mantenerme conectado" va DENTRO del bloque de botones (.um-col-alt), antes de Acceder/Registro: el margen se
   pone a la casilla (un margen al bloque movería también la casilla). Medido con Chromium: 8 px → 24 px. */
.um.um-login .um-col-alt .um-field.um-field-c {
    margin-bottom: 24px !important;
}


/* ══════════════════════════════════════════════════════════════════════════════════════════
   BOTONES DE TODA LA WEB: un único redondeo de 8px (decisión del cliente 2026-09-10; la referencia es el
   botón "Ver todos los foros" del bloque de foros de la home). Astra tiene 4px en el personalizador y cada
   plugin (Ultimate Member, WooCommerce, LearnDash, bbPress, Elementor) trae el suyo: aquí se unifican con
   !important. Excluidos a propósito: los chips de filtro del portal del líder (.erd-filter-btn, píldora) y
   los botones-icono de su tabla (.erd-btn-icon, 8px propio en group-management.css). Los botones con estilo
   inline (aviso "Completa tu perfil", botón "Ver curso") llevan 8px en su PHP porque el inline !important
   no se puede pisar desde aquí.
   ══════════════════════════════════════════════════════════════════════════════════════════ */
.ast-button, .ast-custom-button, .button, a.button,
button:not(.erd-filter-btn):not(.erd-btn-icon),
input[type="submit"], input[type="button"], input[type="reset"],
.wp-block-button__link, .elementor-button, .um-button, .um-modal-btn,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #place_order,
.ld-button, .learndash-wrapper .ld-button, #bbpress-forums button, .bbp-submit-wrapper button,
.erd-btn, .erd-fact-btn, .erd-coupon-inline .erd-coupon-apply, .erd-invitado__boton, .actividad-boton-foros,
.erd-sub-upgrade, .erd-sub-renew, .erd-item-link, .erd-group-management .erd-btn-export,
#mycred-partial-payment-woo #mycred-range-action input[type="submit"] {
    border-radius: 8px !important;
}

/* Excepciones y ajustes de la regla anterior (cliente, 2026-09-10):
   - Los botones de la LISTA de cápsulas de la ficha del curso (widget Posts de Elementor: "9,90 €" y
     "Acceder a la cápsula") van en CUADRADO; el mismo botón "Añadir" en la ficha de la cápsula sí lleva los 8px
     (cliente, 2026-09-10). Va después de la regla global y con más especificidad para ganarle.
   - Sin borde: Astra pone a todos sus botones un borde de 1px del color 5 (blanco) que en los botones azules de
     Elementor ("Suscríbete y tendrás acceso…") y en los del theme (.erd-btn, "Añadir curso completo") se veía como
     un filete claro. */
.elementor-widget-posts .erd-btn { border-radius: 0 !important; } /* "9,90 €" (btn-comprar-capsula) y "Acceder a la cápsula" (btn-acceder-capsula) */
.elementor-button, .erd-btn { border-width: 0 !important; }



/* ══════════════════════════════════════════════════════════════════════════════════════════
   ENTRADAS MIGRADAS DE SITEFINITY (blog y noticias): bloques de código (cliente, 2026-09-10).
   El origen traía <pre><code> con colores inline pensados para fondo OSCURO (#c4bd97, #ffffff, #4bacc6, #e36c09…)
   y el fondo se perdió en la migración (Astra pinta <pre> en gris claro): texto claro sobre gris claro, ilegible.
   Fondo oscuro tipo editor; los colores inline siguen valiendo y los más oscuros (#1f497d, #7030a0, #c00000,
   #0070c0, #c0504d) se aclaran. Los <pre> anidados los desanida inc/blog-migrated-content.php, que también fija
   el ancho máximo de las imágenes migradas. Algún autor envolvía el código en <div class="code-block"> negro con
   padding y radio inline: se neutraliza para que no haya doble marco.
   ══════════════════════════════════════════════════════════════════════════════════════════ */
body.single-post pre, body.single-noticiaserd pre {
    background: #1e1e1e; color: #d4d4d4; padding: 16px 20px; margin: 0 0 1.5em; border: 0; border-radius: 0;
    overflow-x: auto; font-family: Consolas, "Courier New", monospace; font-size: 13px; line-height: 1.6;
    white-space: pre-wrap; word-break: break-word; tab-size: 4;
}
body.single-post pre pre, body.single-noticiaserd pre pre { background: none; padding: 0; margin: 0; border: 0; }
body.single-post pre code, body.single-noticiaserd pre code {
    background: none; color: inherit; padding: 0; font-size: inherit; font-family: inherit; border: 0;
}
body.single-post .code-block, body.single-noticiaserd .code-block {
    background: none !important; padding: 0 !important; border-radius: 0 !important;
}
body.single-post .code-block pre, body.single-noticiaserd .code-block pre { margin-bottom: 0; }
body.single-post pre span[style*="#1f497d" i], body.single-noticiaserd pre span[style*="#1f497d" i] { color: #6fa8dc !important; }
body.single-post pre span[style*="#0070c0" i], body.single-noticiaserd pre span[style*="#0070c0" i] { color: #4fc1ff !important; }
body.single-post pre span[style*="#7030a0" i], body.single-noticiaserd pre span[style*="#7030a0" i] { color: #c586c0 !important; }
body.single-post pre span[style*="#c00000" i], body.single-noticiaserd pre span[style*="#c00000" i] { color: #f14c4c !important; }
body.single-post pre span[style*="#c0504d" i], body.single-noticiaserd pre span[style*="#c0504d" i] { color: #e06c75 !important; }

/* Imágenes del BLOG (cliente, 2026-09-10): todas centradas, como mucho el 90 % del ancho del contenido y con
   lightbox de Elementor. Las clases las pone inc/blog-migrated-content.php (erd_blog_images_center_lightbox):
   `erd-post-img` en la imagen y `erd-post-img__link` en el enlace que la envuelve. El max-width NO lleva
   !important para que el ancho de Sitefinity (inline, `max-width:min(Npx,90%)`) siga mandando; display/float/
   margin sí, para anular los `float:left` y márgenes inline del origen (las imágenes ya no llevan texto alrededor). */
body.single-post a.erd-post-img__link { display: block; margin: 0 0 1em; text-align: center; line-height: 0; }
body.single-post img.erd-post-img {
    display: block !important; float: none !important; margin: 0 auto !important;
    max-width: 90%; height: auto !important; vertical-align: middle;
}
body.single-post p > img.erd-post-img, body.single-post p > a.erd-post-img__link { margin-top: .5em; }
body.single-post a.erd-post-img__link[data-elementor-open-lightbox="yes"] img.erd-post-img { cursor: zoom-in; }
/* Al pulsar con el ratón el enlace (bloque a todo el ancho) queda enfocado y Astra le pinta un recuadro punteado
   de lado a lado al cerrar el lightbox: solo se marca el foco de teclado. */
body.single-post a.erd-post-img__link:focus:not(:focus-visible) { outline: none; box-shadow: none; }
body.single-post a.erd-post-img__link:focus-visible { outline: 2px solid var(--ast-global-color-0, #36aae0); outline-offset: 2px; }

/* ========== BARRA DE PROGRESO DE LA FICHA DE CURSO (widget ld-course-infobar, plantilla 2038) (2026-09-13) ==========
   Pedido del usuario: «revisa esta barra, no se nota mucho debido a los colores». Los COLORES son ajustes nativos y aquí
   NO se tocan: pista y relleno en Personalizador → Design Upgrade Pro → Progress Bar (opción `ldx3_design_upgrade`,
   global para todas las barras de LearnDash; el plugin los impone con !important, así que los controles de color del
   widget de Elementor no valen), y fondo de la caja + texto "X de Y" en el propio widget (Estilo → Enrolled). Fixer:
   tools/responsive/_fix_elementor_curso_2026_09_13.php. Aquí solo lo que ningún control expone: borde, radio y relleno
   de la caja blanca. `body` delante para ganar a learndash.css. Solo el infobar del curso. */
body .elementor-widget-ld-course-infobar .learndash-wrapper .ld-course-status.ld-course-status-enrolled { border: 1px solid #dcdcdc; border-radius: 6px; padding: 14px 20px; }
body .elementor-widget-ld-course-infobar .learndash-wrapper .ld-course-status .ld-progress { margin: 0; }
body .elementor-widget-ld-course-infobar .learndash-wrapper .ld-progress .ld-progress-steps { white-space: nowrap; }

/* ========== CÁPSULAS DEL CURSO EN MÓVIL (widget Posts de la ficha de curso, tarjeta 2611) (2026-09-13) ==========
   Pedido del usuario: «maquetación más profesional y usable en responsive». Los rellenos, anchos y la separación entre
   tarjetas son ajustes nativos de Elementor (fixer tools/responsive/_fix_elementor_curso_2026_09_13.php, solo claves
   _mobile). Aquí lo que no tiene control: el enlace-botón lo pinta el shortcode del theme (inc/shortcodes-learndash.php)
   como inline-flex al ancho del texto; en móvil ocupa todo el ancho de la tarjeta (apilado bajo «Ver vídeo»), centrado
   y con 44 px de alto mínimo (área táctil), tanto «Acceder a la cápsula» como el «9,90 €» de compra. */
@media (max-width: 767px) {
    .elementor-widget-posts .ecs-post-loop .btn-acceder-capsula,
    .elementor-widget-posts .ecs-post-loop .btn-comprar-capsula { width: 100%; justify-content: center; min-height: 44px; padding-top: 8px; padding-bottom: 8px; box-sizing: border-box; }
    .elementor-widget-posts .ecs-post-loop .elementor-widget-shortcode .elementor-shortcode { width: 100%; }
}

/* ========== ICONOS DE LAS SUSCRIPCIONES (/comunidad-suscripcion/, página 3058) (2026-09-13) ==========
   Pedido del usuario: los iconos de datos/iconos (SVG 400×400, uno por plan) entre el NOMBRE y el PRECIO de cada tabla
   de precios, y como imagen de portada del producto de cada suscripción (esto último lo hace el fixer
   tools/migracion/_fix_suscripciones_iconos_2026_09_13.php: sube los SVG a Medios y los pone de miniatura en los
   productos 2825/2829/2830 y las renovaciones 21253/21254). El widget "Tabla de precios" de Elementor Pro no tiene
   hueco para una imagen entre título y precio, así que va como ::after de la cabecera (`.elementor-price-table__header`
   = título), por ID de widget dentro de la página 3058. Los SVG viajan con el theme (assets/img/suscripciones/).
   Si la tabla se reconstruye en Elementor cambia el ID y hay que actualizar aquí (mismo riesgo que las reglas de 2038). */
.elementor-3058 .elementor-widget-price-table .elementor-price-table__header::after { content: ''; display: block; width: 110px; height: 110px; margin: 18px auto 0; background: transparent no-repeat center / contain; } /* 18 px al título; el precio lleva 18 px arriba (relleno del bloque de precio, fixer) → icono centrado entre ambos */
.elementor-3058 .elementor-element-ffa42a4 .elementor-price-table__header::after { background-image: url(assets/img/suscripciones/Susc-Usuario-Gratuito.svg); }        /* USUARIO (gratuito) */
.elementor-3058 .elementor-element-18daa54 .elementor-price-table__header::after { background-image: url(assets/img/suscripciones/Susc-Miembro-Independiente.svg); }   /* MIEMBRO INDEPENDIENTE */
.elementor-3058 .elementor-element-af293b2 .elementor-price-table__header::after { background-image: url(assets/img/suscripciones/Susc-Empresa-Cliente-Final.svg); }   /* Empresa CLIENTE FINAL */
.elementor-3058 .elementor-element-4df3384 .elementor-price-table__header::after { background-image: url(assets/img/suscripciones/Susc-Empresa-Partner.svg); }         /* Empresa PARTNER */
@media (max-width: 767px) { .elementor-3058 .elementor-widget-price-table .elementor-price-table__header::after { width: 90px; height: 90px; } }

/* ========== DESGLOSE DE TOTALES DEL PEDIDO: fila «Base imponible» destacada (cliente, 2026-09-14) ==========
   Página «pedido recibido» (confirmación de compra) y «ver pedido» de Mi cuenta: plantilla order/order-details.php de
   WooCommerce, que escapa la etiqueta de cada fila y no le pone clase; inc/order-totals.php envuelve el importe de la
   base en <span class="erd-base-imponible"> y la fila se localiza con :has(). Misma presentación que el email
   (woocommerce/emails/email-styles.php, clase order-totals-base-imponible) y que la pestaña Recibos del perfil
   (<style> de inc/mycred-ranks.php, fila erd-total-base-imponible). */
body .woocommerce-table--order-details tfoot tr:has(.erd-base-imponible) th,
body .woocommerce-table--order-details tfoot tr:has(.erd-base-imponible) td {
    background: #fff6df !important;
    border-top: 2px solid #F3A600 !important;   /* !important: en «pedido recibido» Astra Addon (order-received.css) fija peso 400 y borde gris con 5 clases (.woocommerce-order-received … table.shop_table tfoot th) */
    border-bottom: 2px solid #F3A600 !important;
    color: #3f3f3f !important;
    font-weight: 700 !important;
}
body .woocommerce-table--order-details tfoot tr:has(.erd-base-imponible) td { font-size: 1.05em; }

/* ========== PÁGINA 404 (cliente, 2026-09-16) ==========
   Plantilla 404.php del theme: bloque azul de marca a todo el ancho con el robot «desconectando cables»
   (assets/img/404-desconectando-cables.webp), la frase y un enlace por cada elemento del menú principal (primer nivel).
   La miga de pan se queda en su barra clara encima (astra_primary_content_top). #primary va a todo el ancho en la 404
   (plantilla «Page Builder» de Astra), así que el bloque llega a los bordes sin trucos de 100vw. */
.erd-404 { background: #36AAE0; color: #fff; margin: 0; padding: 40px 24px 64px; text-align: center; box-sizing: border-box; }
.erd-404__inner { max-width: 1140px; margin: 0 auto; }
.erd-404__img { display: block; width: min(300px, 60vw); height: auto; margin: 0 auto 28px; }
.erd-404__code { color: #fff; opacity: .85; font-size: 14px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; margin: 0 0 10px; }
.erd-404__title { color: #fff; font-size: 30px; font-weight: 700; line-height: 1.3; margin: 0 0 32px; }
.erd-404__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.erd-404__link, .erd-404__link:visited {
    display: inline-block; background: #fff; color: #36AAE0; font-size: 15px; font-weight: 600; line-height: 1.2;
    padding: 12px 30px; border-radius: 8px; text-decoration: none; transition: background .15s ease, color .15s ease;
}
.erd-404__link:hover, .erd-404__link:focus { background: #F3A600; color: #fff; text-decoration: none; }
@media (max-width: 767px) {
    .erd-404 { padding: 28px 16px 44px; }
    .erd-404__img { margin-bottom: 20px; }
    .erd-404__title { font-size: 22px; margin-bottom: 24px; }
    .erd-404__links { gap: 8px; }
    .erd-404__link, .erd-404__link:visited { font-size: 14px; padding: 10px 18px; }
}