/*
 * BuenTheme — layout.css
 * Maquetación de página, anchos de fila y alineación de títulos. Se carga en todo el sitio y en el editor.
 * Extraído de style.css en 2.6.148. No se borró ninguna regla.
 */

/* ==========================================================================
   SISTEMA DE DISEÑO DE PÁGINAS Y MAQUETACIÓN PREMIUM (KADENCE STYLE)
   ========================================================================== */

/* 1. Página Diseño (Contenedores y Anchos) */
/* Narrow: acotar main y su contenido (no el header/footer full-bleed). */
body.buentheme-layout-narrow .wp-site-blocks > main,
body.buentheme-layout-narrow .wp-site-blocks > main.is-layout-constrained > :where(:not(.alignfull):not(.alignleft):not(.alignright)),
body.buentheme-layout-narrow .wp-block-post-content > :where(:not(.alignfull):not(.alignleft):not(.alignright)),
body.buentheme-layout-narrow .entry-content > :where(:not(.alignfull):not(.alignleft):not(.alignright)) {
    max-width: var(--buentheme-narrow-width, 720px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

body.buentheme-layout-full_width .wp-site-blocks {
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
body.buentheme-layout-full_width .wp-site-blocks > main {
    max-width: 100% !important;
}

/* 2. Estilo del Contenido (Caja / Boxed vs Sin Caja) */
body.buentheme-style-boxed {
    background-color: #f1f5f9 !important;
}
body.buentheme-style-boxed .wp-site-blocks > main {
    background-color: #ffffff;
    max-width: var(--wp--style--global--content-size, 1290px);
    margin: 40px auto !important;
    /* Solo vertical: L/R lo gobiernan content_padding / template_padding (no hardcodear 40px). */
    padding-top: 50px !important;
    padding-bottom: 50px !important;
    border-radius: 12px;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.05), 0 8px 10px -6px rgba(0, 0, 0, 0.05);
    border: 1px solid #e2e8f0;
}
@media (prefers-color-scheme: dark) {
    body.buentheme-style-boxed {
        background-color: #0f172a !important;
    }
    body.buentheme-style-boxed .wp-site-blocks > main {
        background-color: #1e293b;
        border-color: #334155;
        box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3);
    }
}

/* 3. Espaciado Vertical del Contenido (Paddings) */
body.buentheme-spacing-yes .wp-site-blocks > main {
    padding-top: var(--wp--preset--spacing--50) !important;
    padding-bottom: var(--wp--preset--spacing--50) !important;
}
body.buentheme-spacing-no .wp-site-blocks > main {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
body.buentheme-spacing-top_only .wp-site-blocks > main {
    padding-top: var(--wp--preset--spacing--50) !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}
body.buentheme-spacing-bottom_only .wp-site-blocks > main {
    padding-top: 0 !important;
    padding-bottom: var(--wp--preset--spacing--50) !important;
    margin-top: 0 !important;
}

/* 4. Soporte para Diseños con Barra Lateral (Left / Right Sidebar) */
body.buentheme-layout-left_sidebar .wp-site-blocks > main,
body.buentheme-layout-right_sidebar .wp-site-blocks > main {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    max-width: var(--wp--style--global--content-size, 1290px);
    margin: 40px auto !important;
    /* L/R vía content_padding del dashboard (no hardcodear 20px). */
    padding-left: var(--buentheme-global-padding, 30px);
    padding-right: var(--buentheme-global-padding, 30px);
    box-sizing: border-box;
}

@media (min-width: 992px) {
    body.buentheme-layout-right_sidebar .wp-site-blocks > main {
        grid-template-columns: 8fr 3fr;
    }
    body.buentheme-layout-left_sidebar .wp-site-blocks > main {
        grid-template-columns: 3fr 8fr;
    }
    body.buentheme-layout-right_sidebar .wp-site-blocks > main > .buentheme-dynamic-sidebar {
        grid-column: 2;
        grid-row: 1 / -1;
    }
    body.buentheme-layout-right_sidebar .wp-site-blocks > main > *:not(.buentheme-dynamic-sidebar) {
        grid-column: 1;
    }
    body.buentheme-layout-left_sidebar .wp-site-blocks > main > .buentheme-dynamic-sidebar {
        grid-column: 1;
        grid-row: 1 / -1;
    }
    body.buentheme-layout-left_sidebar .wp-site-blocks > main > *:not(.buentheme-dynamic-sidebar) {
        grid-column: 2;
    }
}

/* Sidebar Estético Decorativo Genérico Autogenerado */
.buentheme-dynamic-sidebar {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 30px;
    height: fit-content;
}
@media (prefers-color-scheme: dark) {
    .buentheme-dynamic-sidebar {
        background-color: #1e293b;
        border-color: #334155;
    }
}
.buentheme-dynamic-sidebar h3 {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 15px;
    color: var(--wp--preset--color--text-1, #0f172a);
    border-bottom: 2px solid #2563eb;
    padding-bottom: 8px;
    margin-top: 0;
}
.buentheme-dynamic-sidebar ul {
    list-style: none;
    padding: 0;
    margin: 0 0 25px 0;
}
.buentheme-dynamic-sidebar ul:last-child {
    margin-bottom: 0;
}
.buentheme-dynamic-sidebar ul li {
    margin-bottom: 12px;
    font-size: 14px;
}
.buentheme-dynamic-sidebar ul li a {
    color: var(--wp--preset--color--accent-1, #2563eb);
    text-decoration: none;
    transition: color 0.15s ease;
}
.buentheme-dynamic-sidebar ul li a:hover {
    text-decoration: underline;
}

/* ==========================================================================
   OPTIMIZACIÓN DE ANCHOS Y SINCRONIZACIÓN DE MAQUETACIÓN FSE & ROW BLOCKS
   ========================================================================== */

/* 1. Full width: el contenedor main puede ser 100%; el ANCHO de contenido
   de los hijos lo define content-size (sección E), no se fuerza 100% aquí.
   Solo alignfull debe romper el límite. */
body.buentheme-layout-full_width .wp-site-blocks,
body.buentheme-layout-full_width .wp-site-blocks > main,
body.buentheme-layout-full_width .wp-block-post-content,
body.buentheme-layout-full_width .is-layout-constrained {
    max-width: 100% !important;
}

/* Hijos alignfull / filas full-bleed en modo full width */
body.buentheme-layout-full_width .is-layout-constrained > .alignfull,
body.buentheme-layout-full_width .wp-block-post-content > .alignfull,
body.buentheme-layout-full_width .is-layout-constrained > .buentheme-row-container.alignfull,
body.buentheme-layout-full_width .is-layout-constrained > .buentheme-row.alignfull {
    max-width: 100% !important;
    width: 100% !important;
}

/* 2. Sincronización de 'Heredar ancho máximo del tema' (has-inherit-width) según el diseño de página */

/*
 * CANÓNICO — «Heredar el ancho máximo del tema»:
 * El INNER se acota a contentSize del dashboard/Global Styles.
 * El OUTER de la fila puede ser 100% (fondo edge-to-edge).
 *
 * Importante cabecera vs página:
 * - En main constrained, un hijo max-width:100% aún se ve “acotado” por el padre.
 * - En .buentheme-header-wrapper el padre es el viewport: max-width:100% estira el
 *   contenido de la cabecera y parece que “Heredar” no aplica. Por eso esta regla
 *   es global + !important (misma semántica en página y cabecera).
 */
.buentheme-row-inner-wrapper.has-inherit-width,
.buentheme-row__inner.has-inherit-width {
    max-width: var(--wp--style--global--content-size, 1290px) !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

/* Diseño estrecho: heredar = narrow-width del tema */
body.buentheme-layout-narrow .buentheme-row-inner-wrapper.has-inherit-width,
body.buentheme-layout-narrow .buentheme-row__inner.has-inherit-width {
    max-width: var(--buentheme-narrow-width, 720px) !important;
}

/* Nested: siempre 100% del padre (no re-aplicar content-size) */
.buentheme-row-inner-wrapper.has-inherit-width.is-nested-inner,
.buentheme-row__inner.has-inherit-width.is-nested-inner,
.buentheme-row.is-nested-row > .buentheme-row__inner.has-inherit-width,
.buentheme-row-container.is-nested-row > .buentheme-row-inner-wrapper.has-inherit-width {
    max-width: 100% !important;
}

/* A. Diseño Estrecho (Narrow) — outer de filas en post-content */
body.buentheme-layout-narrow .wp-block-post-content > .buentheme-row-container:not(.has-custom-content-width) {
    max-width: var(--buentheme-narrow-width, 720px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* B. Diseño Normal / Por Defecto */
/*
 * main / post-content a 100%: el ancho lo marcan los hijos via layout constrained de WP
 * (contentSize de theme.json, Estilos globales o del bloque en la plantilla).
 * NO forzar max-width !important en hijos de .is-layout-constrained: eso pisa el
 * contentSize del editor de plantilla.
 */
body.buentheme-layout-normal .wp-site-blocks > main,
body:not([class*="buentheme-layout-"]) .wp-site-blocks > main,
body.buentheme-layout-normal .wp-block-post-content,
body:not([class*="buentheme-layout-"]) .wp-block-post-content {
    max-width: 100% !important;
}

/* Fallback solo fuera de layout constrained (p. ej. main con layout default). */
body.buentheme-layout-normal .wp-block-post-content:not(.is-layout-constrained) > .buentheme-row-container:not(.alignfull):not(.has-custom-content-width),
body:not([class*="buentheme-layout-"]) .wp-block-post-content:not(.is-layout-constrained) > .buentheme-row-container:not(.alignfull):not(.has-custom-content-width),
body.buentheme-layout-normal .wp-site-blocks > main:not(.is-layout-constrained) > .buentheme-row-container:not(.alignfull):not(.has-custom-content-width),
body:not([class*="buentheme-layout-"]) .wp-site-blocks > main:not(.is-layout-constrained) > .buentheme-row-container:not(.alignfull):not(.has-custom-content-width) {
    max-width: var(--wp--style--global--content-size, 1290px);
    margin-left: auto;
    margin-right: auto;
}

/* Ancho personalizado de Disposición de la fila: outer full, inner con max-width exacto.
   Selectores amplios (no solo hijo directo de post-content) + is-layout-constrained.
   Debe ganar a body.buentheme-layout-full_width .is-layout-constrained > * { max-width:100% }. */
body .buentheme-row.has-custom-content-width,
body .buentheme-row-container.has-custom-content-width,
body .wp-block-buentheme-advanced-grid.has-custom-content-width,
body .is-layout-constrained > .buentheme-row.has-custom-content-width,
body .is-layout-constrained > .buentheme-row-container.has-custom-content-width,
body .is-layout-constrained > .wp-block-buentheme-advanced-grid.has-custom-content-width,
body .wp-block-post-content > .buentheme-row-container.has-custom-content-width,
body .wp-block-post-content > .buentheme-row.has-custom-content-width,
body .entry-content > .buentheme-row-container.has-custom-content-width,
body .entry-content > .buentheme-row.has-custom-content-width,
body.buentheme-layout-full_width .wp-block-post-content > .buentheme-row.has-custom-content-width,
body.buentheme-layout-full_width .wp-block-post-content > .buentheme-row-container.has-custom-content-width,
body.buentheme-layout-full_width .is-layout-constrained > .buentheme-row.has-custom-content-width,
body.buentheme-layout-full_width .is-layout-constrained > .buentheme-row-container.has-custom-content-width,
body.buentheme-layout-full_width .is-layout-constrained > .wp-block-buentheme-advanced-grid.has-custom-content-width {
    max-width: none !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
body .buentheme-row-inner-wrapper.has-custom-max-width,
body .buentheme-row__inner.has-custom-max-width,
body .is-layout-constrained .buentheme-row-inner-wrapper.has-custom-max-width,
body .is-layout-constrained .buentheme-row__inner.has-custom-max-width,
body.buentheme-layout-full_width .buentheme-row-inner-wrapper.has-custom-max-width,
body.buentheme-layout-full_width .buentheme-row__inner.has-custom-max-width,
body.buentheme-layout-narrow .buentheme-row-inner-wrapper.has-custom-max-width,
body.buentheme-layout-narrow .buentheme-row__inner.has-custom-max-width {
    /* Preferir valor en px del var; el style inline del save también aporta maxWidth */
    max-width: var(--bt-row-custom-max, var(--bt-row-max-w-d, var(--bt-row-max-w, 1290px))) !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

/* Alineación de celdas: no forzar height 100% en secciones cuando valign ≠ stretch */
body .buentheme-row.has-valign-start .buentheme-row__grid > .buentheme-dynamic-section,
body .buentheme-row.has-valign-center .buentheme-row__grid > .buentheme-dynamic-section,
body .buentheme-row.has-valign-end .buentheme-row__grid > .buentheme-dynamic-section,
body .buentheme-row-container.has-valign-start .buentheme-row-layout > .buentheme-dynamic-section,
body .buentheme-row-container.has-valign-center .buentheme-row-layout > .buentheme-dynamic-section,
body .buentheme-row-container.has-valign-end .buentheme-row-layout > .buentheme-dynamic-section {
    height: auto !important;
    min-height: 0 !important;
    align-self: auto !important;
}

/*
 * Alto mínimo de fila: la cadena outer→inner→grid rellena el min-height
 * para que align-items (valign) posicione las celdas dentro de la altura.
 * Solo con .has-min-height (valor > 0). Con 0/vacío: .is-height-auto → hug content.
 */
body .buentheme-row.is-height-auto,
body .buentheme-row-container.is-height-auto,
body .buentheme-row:not(.has-min-height),
body .buentheme-row-container:not(.has-min-height) {
    min-height: 0 !important;
    height: auto !important;
}
body .buentheme-row.has-min-height,
body .buentheme-row-container.has-min-height {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
}
body .buentheme-row.has-min-height > .buentheme-row__inner,
body .buentheme-row.has-min-height > .buentheme-row-inner-wrapper,
body .buentheme-row-container.has-min-height > .buentheme-row-inner-wrapper {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-height: 0 !important;
    box-sizing: border-box !important;
}
body .buentheme-row.has-min-height > .buentheme-row__inner > .buentheme-row__grid,
body .buentheme-row.has-min-height > .buentheme-row__inner > .buentheme-row-layout,
body .buentheme-row-container.has-min-height > .buentheme-row-inner-wrapper > .buentheme-row-layout {
    flex: 1 1 auto !important;
    min-height: 100% !important;
    height: 100% !important;
    width: 100% !important;
    grid-template-rows: var(--bt-row-rows-d, minmax(0, 1fr)) !important;
    /* NEVER force stretch — it inflates auto/stacked tracks and looks like a huge row-gap
       on the frontend while the editor (inline !important) looked correct. */
    align-content: var(--bt-row-align-content, start) !important;
    grid-auto-rows: var(--bt-row-auto-rows, var(--bt-row-auto-rows-d, auto)) !important;
}

/* Stacked / 1-col + min-height: hug content; gap is only row-gap (editor = front). */
body .buentheme-row[data-bt-structure="stacked"].has-min-height > .buentheme-row__inner > .buentheme-row__grid,
body .buentheme-row[data-bt-structure="stacked"].has-min-height > .buentheme-row__inner > .buentheme-row-layout,
body .buentheme-row[data-bt-structure="stacked"].has-min-height > .buentheme-row-inner-wrapper > .buentheme-row-layout,
body .buentheme-row.has-1-columns.has-min-height > .buentheme-row__inner > .buentheme-row__grid,
body .buentheme-row.has-1-columns.has-min-height > .buentheme-row__inner > .buentheme-row-layout,
body .buentheme-row.has-1-columns.has-min-height > .buentheme-row-inner-wrapper > .buentheme-row-layout,
body .buentheme-row-container[data-bt-structure="stacked"].has-min-height > .buentheme-row-inner-wrapper > .buentheme-row-layout,
body .buentheme-row-container.has-1-columns.has-min-height > .buentheme-row-inner-wrapper > .buentheme-row-layout {
    grid-template-rows: none !important;
    grid-auto-rows: auto !important;
    align-content: var(--bt-row-align-content, start) !important;
}

/*
 * Alineación horizontal de celdas (justify-items): las secciones traen width:100%
 * y rellenan la pista → start/center/end no se ven. Forzar width:auto + justify-self.
 */
body .buentheme-row.has-justify-start .buentheme-row__grid,
body .buentheme-row.has-justify-start .buentheme-row-layout,
body .buentheme-row-container.has-justify-start .buentheme-row-layout {
    justify-items: start !important;
}
body .buentheme-row.has-justify-center .buentheme-row__grid,
body .buentheme-row.has-justify-center .buentheme-row-layout,
body .buentheme-row-container.has-justify-center .buentheme-row-layout {
    justify-items: center !important;
}
body .buentheme-row.has-justify-end .buentheme-row__grid,
body .buentheme-row.has-justify-end .buentheme-row-layout,
body .buentheme-row-container.has-justify-end .buentheme-row-layout {
    justify-items: end !important;
}
body .buentheme-row.has-justify-start .buentheme-row__grid > .buentheme-dynamic-section,
body .buentheme-row.has-justify-center .buentheme-row__grid > .buentheme-dynamic-section,
body .buentheme-row.has-justify-end .buentheme-row__grid > .buentheme-dynamic-section,
body .buentheme-row.has-justify-start .buentheme-row-layout > .buentheme-dynamic-section,
body .buentheme-row.has-justify-center .buentheme-row-layout > .buentheme-dynamic-section,
body .buentheme-row.has-justify-end .buentheme-row-layout > .buentheme-dynamic-section,
body .buentheme-row-container.has-justify-start .buentheme-row-layout > .buentheme-dynamic-section,
body .buentheme-row-container.has-justify-center .buentheme-row-layout > .buentheme-dynamic-section,
body .buentheme-row-container.has-justify-end .buentheme-row-layout > .buentheme-dynamic-section {
    width: auto !important;
    max-width: 100% !important;
}
body .buentheme-row.has-justify-start .buentheme-row__grid > .buentheme-dynamic-section,
body .buentheme-row.has-justify-start .buentheme-row-layout > .buentheme-dynamic-section,
body .buentheme-row-container.has-justify-start .buentheme-row-layout > .buentheme-dynamic-section {
    justify-self: start !important;
}
body .buentheme-row.has-justify-center .buentheme-row__grid > .buentheme-dynamic-section,
body .buentheme-row.has-justify-center .buentheme-row-layout > .buentheme-dynamic-section,
body .buentheme-row-container.has-justify-center .buentheme-row-layout > .buentheme-dynamic-section {
    justify-self: center !important;
}
body .buentheme-row.has-justify-end .buentheme-row__grid > .buentheme-dynamic-section,
body .buentheme-row.has-justify-end .buentheme-row-layout > .buentheme-dynamic-section,
body .buentheme-row-container.has-justify-end .buentheme-row-layout > .buentheme-dynamic-section {
    justify-self: end !important;
}

/* C. Diseño Ancho Completo (Full Width) */
/* Outer de filas en el contenido: edge-to-edge (fondo fluido). */
body.buentheme-layout-full_width .wp-block-post-content > .buentheme-row-container,
body.buentheme-layout-full_width .wp-block-post-content > .buentheme-row,
body.buentheme-layout-full_width .wp-site-blocks > main > .buentheme-row-container,
body.buentheme-layout-full_width .wp-site-blocks > main > .buentheme-row {
    max-width: 100% !important;
    width: 100% !important;
}
/*
 * INNER con «Heredar»: SIEMPRE content-size (no 100%).
 * Antes se forzaba max-width:100% y en cabeceras (padre = viewport) el contenido
 * se iba a todo el ancho; en páginas el main constrained enmascaraba el bug.
 * Para contenido 100% fluido: desactivar herencia y usar ancho personalizado alto
 * o sin tope.
 */
body.buentheme-layout-full_width .buentheme-row-inner-wrapper.has-inherit-width,
body.buentheme-layout-full_width .buentheme-row__inner.has-inherit-width {
    max-width: var(--wp--style--global--content-size, 1290px) !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/*
 * Cabecera personalizada: mismas reglas de herencia que el contenido.
 * Refuerzo de especificidad (el wrapper es full-bleed por diseño).
 */
.buentheme-header-wrapper .buentheme-row-inner-wrapper.has-inherit-width,
.buentheme-header-wrapper .buentheme-row__inner.has-inherit-width {
    max-width: var(--wp--style--global--content-size, 1290px) !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}
body.buentheme-layout-narrow .buentheme-header-wrapper .buentheme-row-inner-wrapper.has-inherit-width,
body.buentheme-layout-narrow .buentheme-header-wrapper .buentheme-row__inner.has-inherit-width {
    max-width: var(--buentheme-narrow-width, 720px) !important;
}
/* Outer de filas de cabecera: siempre fluidas (fondo de zona top/main/bottom). */
.buentheme-header-wrapper .buentheme-row-container,
.buentheme-header-wrapper .buentheme-row {
    max-width: 100% !important;
    width: 100% !important;
}

/*
 * 3. Padding lateral — tokens del dashboard (clases body).
 *
 * Fuente de verdad en px: #buentheme-padding-inline (page-settings.php v5).
 * Aquí solo: tokens CSS + reglas de respaldo (mismas reglas que el inline).
 *
 * ┌────────────────────────────┬──────────────────────────────────────────┐
 * │ Ajuste dashboard           │ Dónde se aplica                          │
 * ├────────────────────────────┼──────────────────────────────────────────┤
 * │ Páginas / main             │ <main> páginas NO-WC (no full_width).    │
 * │ (content_padding*)         │ full_width → main 0 (padding en filas).  │
 * ├────────────────────────────┼──────────────────────────────────────────┤
 * │ Plantillas WC / pie        │ Catálogo: loop outer + títulos.          │
 * │ (template_padding*)        │ Cart/checkout/ficha: main. Pie: siempre. │
 * └────────────────────────────┴──────────────────────────────────────────┘
 *
 * Breakpoints: móvil ≤781 · tablet 782–1079 · escritorio ≥1080.
 */

/* --- Tokens: escritorio --- */
body.buentheme-padding-none { --buentheme-global-padding: 0px; }
body.buentheme-padding-sm   { --buentheme-global-padding: 15px; }
body.buentheme-padding-md   { --buentheme-global-padding: 30px; }
body.buentheme-padding-lg   { --buentheme-global-padding: 45px; }
body.buentheme-padding-xl   { --buentheme-global-padding: 60px; }

body.buentheme-padding-t-none { --buentheme-global-padding-tablet: 0px; }
body.buentheme-padding-t-sm   { --buentheme-global-padding-tablet: 15px; }
body.buentheme-padding-t-md   { --buentheme-global-padding-tablet: 30px; }
body.buentheme-padding-t-lg   { --buentheme-global-padding-tablet: 45px; }
body.buentheme-padding-t-xl   { --buentheme-global-padding-tablet: 60px; }

body.buentheme-padding-m-none { --buentheme-global-padding-mobile: 0px; }
body.buentheme-padding-m-sm   { --buentheme-global-padding-mobile: 15px; }
body.buentheme-padding-m-md   { --buentheme-global-padding-mobile: 30px; }
body.buentheme-padding-m-lg   { --buentheme-global-padding-mobile: 45px; }
body.buentheme-padding-m-xl   { --buentheme-global-padding-mobile: 60px; }

body.buentheme-tpl-pad-none { --buentheme-template-edge-padding: 0px; }
body.buentheme-tpl-pad-sm   { --buentheme-template-edge-padding: 15px; }
body.buentheme-tpl-pad-md   { --buentheme-template-edge-padding: 30px; }
body.buentheme-tpl-pad-lg   { --buentheme-template-edge-padding: 45px; }
body.buentheme-tpl-pad-xl   { --buentheme-template-edge-padding: 60px; }

body.buentheme-tpl-pad-t-none { --buentheme-template-edge-padding-tablet: 0px; }
body.buentheme-tpl-pad-t-sm   { --buentheme-template-edge-padding-tablet: 15px; }
body.buentheme-tpl-pad-t-md   { --buentheme-template-edge-padding-tablet: 30px; }
body.buentheme-tpl-pad-t-lg   { --buentheme-template-edge-padding-tablet: 45px; }
body.buentheme-tpl-pad-t-xl   { --buentheme-template-edge-padding-tablet: 60px; }

body.buentheme-tpl-pad-m-none { --buentheme-template-edge-padding-mobile: 0px; }
body.buentheme-tpl-pad-m-sm   { --buentheme-template-edge-padding-mobile: 15px; }
body.buentheme-tpl-pad-m-md   { --buentheme-template-edge-padding-mobile: 30px; }
body.buentheme-tpl-pad-m-lg   { --buentheme-template-edge-padding-mobile: 45px; }
body.buentheme-tpl-pad-m-xl   { --buentheme-template-edge-padding-mobile: 60px; }

/* --- Reasignar tokens efectivos por viewport --- */
@media (min-width: 782px) and (max-width: 1079px) {
    body {
        --buentheme-global-padding: var(--buentheme-global-padding-tablet, 15px);
        --buentheme-template-edge-padding: var(--buentheme-template-edge-padding-tablet, 15px);
        --buentheme-wc-edge-pad: var(--buentheme-template-edge-padding, 15px);
    }
}
@media (max-width: 781px) {
    body {
        --buentheme-global-padding: var(--buentheme-global-padding-mobile, 15px);
        --buentheme-template-edge-padding: var(--buentheme-template-edge-padding-mobile, 15px);
        --buentheme-wc-edge-pad: var(--buentheme-template-edge-padding, 15px);
    }
}

/*
 * Respaldo (vars). El CSS inline v5 escribe px del dashboard con !important
 * y gana a Global Styles / LiteSpeed. Mantener selectores alineados con PHP.
 */

/* Páginas normales (no WC), no full_width. */
body:not(.buentheme-layout-full_width):not(.buentheme-wc-catalog):not(.woocommerce-shop):not(.post-type-archive-product):not(.tax-product_cat):not(.tax-product_tag):not(.tax-product_brand):not(.single-product):not(.woocommerce-cart):not(.woocommerce-checkout):not(.woocommerce-order-received):not(.search-results.woocommerce):not(.buentheme-wc-single-product) .wp-site-blocks > main:not(.buentheme-wc-catalog-main):not(.buentheme-wc-cart-main):not(.buentheme-wc-checkout-main):not(.buentheme-wc-order-confirmation-main):not(.buentheme-wc-product-search-main):not(.buentheme-single-product-main) {
    padding-left: var(--buentheme-global-padding, 30px) !important;
    padding-right: var(--buentheme-global-padding, 30px) !important;
    box-sizing: border-box !important;
}

/* full_width no-WC → main 0. */
body.buentheme-layout-full_width:not(.buentheme-wc-catalog):not(.woocommerce-shop):not(.post-type-archive-product):not(.tax-product_cat):not(.tax-product_tag):not(.tax-product_brand):not(.single-product):not(.woocommerce-cart):not(.woocommerce-checkout):not(.woocommerce-order-received):not(.search-results.woocommerce):not(.buentheme-wc-single-product) .wp-site-blocks > main {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Catálogo: main 0; loop outer + títulos con template_padding.
 * NO padear .wc-block-product-template (appearance fuerza padding:0 en el grid). */
body.buentheme-wc-catalog .wp-site-blocks > main,
body.woocommerce-shop .wp-site-blocks > main,
body.post-type-archive-product .wp-site-blocks > main,
body.tax-product_cat .wp-site-blocks > main,
body.tax-product_tag .wp-site-blocks > main,
body.tax-product_brand .wp-site-blocks > main,
body.search-results.woocommerce .wp-site-blocks > main,
.wp-site-blocks > main.buentheme-wc-catalog-main,
.wp-site-blocks > main.buentheme-wc-product-search-main {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.buentheme-wc-catalog .buentheme-wc-catalog-root,
body.buentheme-wc-catalog .wp-block-woocommerce-product-collection,
body.woocommerce-shop .buentheme-wc-catalog-root,
body.woocommerce-shop .wp-block-woocommerce-product-collection,
body.post-type-archive-product .buentheme-wc-catalog-root,
body.post-type-archive-product .wp-block-woocommerce-product-collection,
body.tax-product_cat .buentheme-wc-catalog-root,
body.tax-product_cat .wp-block-woocommerce-product-collection,
body.tax-product_tag .buentheme-wc-catalog-root,
body.tax-product_tag .wp-block-woocommerce-product-collection,
body.tax-product_brand .buentheme-wc-catalog-root,
body.tax-product_brand .wp-block-woocommerce-product-collection,
body.search-results.woocommerce .buentheme-wc-catalog-root,
body.search-results.woocommerce .wp-block-woocommerce-product-collection,
.buentheme-wc-catalog-main > .buentheme-wc-catalog-root,
.buentheme-wc-catalog-main > .wp-block-woocommerce-product-collection,
.buentheme-wc-product-search-main > .buentheme-wc-catalog-root,
.buentheme-wc-product-search-main > .wp-block-woocommerce-product-collection {
    padding-left: var(--buentheme-template-edge-padding, 15px) !important;
    padding-right: var(--buentheme-template-edge-padding, 15px) !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
}

body.buentheme-wc-catalog main > .wp-block-query-title,
body.buentheme-wc-catalog main > .wp-block-term-description,
body.buentheme-wc-catalog main > .wp-block-woocommerce-store-notices,
body.buentheme-wc-catalog main > .wp-block-heading,
body.woocommerce-shop main > .wp-block-query-title,
body.woocommerce-shop main > .wp-block-term-description,
body.woocommerce-shop main > .wp-block-woocommerce-store-notices,
body.woocommerce-shop main > .wp-block-heading,
body.post-type-archive-product main > .wp-block-query-title,
body.post-type-archive-product main > .wp-block-term-description,
body.tax-product_cat main > .wp-block-query-title,
body.tax-product_cat main > .wp-block-term-description,
body.tax-product_tag main > .wp-block-query-title,
body.tax-product_tag main > .wp-block-term-description,
.buentheme-wc-catalog-main > .wp-block-query-title,
.buentheme-wc-catalog-main > .wp-block-term-description,
.buentheme-wc-catalog-main > .wp-block-woocommerce-store-notices,
.buentheme-wc-catalog-main > .wp-block-heading,
.buentheme-wc-product-search-main > .wp-block-query-title {
    padding-left: var(--buentheme-template-edge-padding, 15px) !important;
    padding-right: var(--buentheme-template-edge-padding, 15px) !important;
    box-sizing: border-box !important;
}

/* Carrito / checkout / ficha: padding en el main. */
body.woocommerce-cart .wp-site-blocks > main,
body.woocommerce-checkout .wp-site-blocks > main,
body.woocommerce-order-received .wp-site-blocks > main,
body.single-product .wp-site-blocks > main,
body.buentheme-wc-single-product .wp-site-blocks > main,
.wp-site-blocks > main.buentheme-wc-cart-main,
.wp-site-blocks > main.buentheme-wc-checkout-main,
.wp-site-blocks > main.buentheme-wc-order-confirmation-main,
.wp-site-blocks > main.buentheme-single-product-main {
    padding-left: var(--buentheme-template-edge-padding, 15px) !important;
    padding-right: var(--buentheme-template-edge-padding, 15px) !important;
    box-sizing: border-box !important;
}

/* Hijos de ficha/cart: sin pad extra (el main ya aporta el aire). */
.buentheme-wc-cart-main > :where(:not(.alignfull)),
.buentheme-wc-checkout-main > :where(:not(.alignfull)),
.buentheme-wc-order-confirmation-main > :where(:not(.alignfull)),
.buentheme-single-product-main > .wp-block-columns,
.buentheme-single-product-main > .buentheme-product-tabs-section,
.buentheme-single-product-main > .buentheme-product-related {
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}

/* Pie: template_padding. NO padear template-parts genéricos (cabecera). */
.wp-site-blocks > footer,
.wp-site-blocks > footer.alignfull,
.wp-site-blocks > footer.wp-block-template-part,
.wp-site-blocks .wp-block-template-part > footer,
.wp-site-blocks footer.wp-block-group,
.wp-site-blocks footer.alignfull,
footer.wp-block-group.alignfull:not(.buentheme-header-wrapper),
footer.wp-block-group:not(.buentheme-header-wrapper),
.buentheme-footer-wrapper,
.wp-site-blocks > .buentheme-footer-wrapper,
.wp-site-blocks > .wp-block-template-part.buentheme-footer-wrapper {
    padding-left: var(--buentheme-template-edge-padding, 15px) !important;
    padding-right: var(--buentheme-template-edge-padding, 15px) !important;
    box-sizing: border-box !important;
}

/* Cabecera: nunca hereda padding de plantillas WC/pie. */
.wp-site-blocks > .buentheme-header-wrapper,
.wp-site-blocks > .wp-block-template-part.buentheme-header-wrapper,
.buentheme-header-wrapper.wp-block-template-part,
.buentheme-header-wrapper {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.buentheme-layout-full_width .wp-block-post-title {
    max-width: var(--wp--style--global--content-size, 1290px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ==========================================================================
   SINCRONIZACIÓN DE MAQUETACIÓN Y ALINEACIÓN DE TÍTULO (FSE)
   ========================================================================== */

/* A. Diseño Estrecho (Narrow) */
body.buentheme-layout-narrow .wp-block-post-title {
    max-width: var(--buentheme-narrow-width, 720px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* B. Diseño Normal (Default) — solo títulos FUERA de constrained (WP ya los acota dentro). */
body.buentheme-layout-normal .wp-site-blocks > main:not(.is-layout-constrained) > .wp-block-post-title,
body:not([class*="buentheme-layout-"]) .wp-site-blocks > main:not(.is-layout-constrained) > .wp-block-post-title {
    max-width: var(--wp--style--global--content-size, 1290px);
    margin-left: auto;
    margin-right: auto;
}

/* C. Diseño Ancho Completo (Full Width) */
body.buentheme-layout-full_width .wp-block-post-title {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: var(--buentheme-global-padding, 30px) !important;
    padding-right: var(--buentheme-global-padding, 30px) !important;
}

/* D. Alineación Horizontal del Título (Global y Específica) */
body.buentheme-title-align-left .wp-block-post-title,
body.buentheme-title-align-left .wp-block-query-title {
    text-align: left !important;
}
body.buentheme-title-align-center .wp-block-post-title,
body.buentheme-title-align-center .wp-block-query-title {
    text-align: center !important;
}
body.buentheme-title-align-right .wp-block-post-title,
body.buentheme-title-align-right .wp-block-query-title {
    text-align: right !important;
}

body.buentheme-hide-page-title .wp-block-query-title,
body.buentheme-hide-page-title .wp-site-blocks > main > .wp-block-post-title {
    display: none !important;
}

body.buentheme-layout-narrow .wp-block-query-title {
    max-width: var(--buentheme-narrow-width, 720px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
body.buentheme-layout-normal .wp-site-blocks > main:not(.is-layout-constrained) > .wp-block-query-title,
body:not([class*="buentheme-layout-"]) .wp-site-blocks > main:not(.is-layout-constrained) > .wp-block-query-title {
    max-width: var(--wp--style--global--content-size, 1290px);
    margin-left: auto;
    margin-right: auto;
}
body.buentheme-layout-full_width .wp-block-query-title {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
}

/*
 * E. Contenido principal (páginas WC + constrained).
 *
 * La cabecera acota con filas (has-inherit-width / max-w). El main del producto
 * usa layout constrained: hay que acotar sus HIJOS con content-size resuelto
 * en el punto de uso (hereda contentSize local del bloque si existe).
 * Sin esta regla, columnas/galería/tabs van edge-to-edge y la cabecera no.
 */
body.buentheme-layout-normal .wp-site-blocks > main.is-layout-constrained > :where(:not(.alignfull):not(.alignleft):not(.alignright):not(.alignwide)),
body:not([class*="buentheme-layout-"]) .wp-site-blocks > main.is-layout-constrained > :where(:not(.alignfull):not(.alignleft):not(.alignright):not(.alignwide)),
body.buentheme-layout-normal .wp-site-blocks > main.buentheme-single-product-main > :where(:not(.alignfull):not(.alignleft):not(.alignright):not(.alignwide)),
body.buentheme-layout-normal .wp-site-blocks > main.buentheme-wc-catalog-main > :where(:not(.alignfull):not(.alignleft):not(.alignright):not(.alignwide)),
body.buentheme-layout-normal .wp-site-blocks > main.buentheme-wc-cart-main > :where(:not(.alignfull):not(.alignleft):not(.alignright):not(.alignwide)),
body.buentheme-layout-normal .wp-site-blocks > main.buentheme-wc-checkout-main > :where(:not(.alignfull):not(.alignleft):not(.alignright):not(.alignwide)),
body.buentheme-layout-normal .wp-site-blocks > main.buentheme-wc-order-confirmation-main > :where(:not(.alignfull):not(.alignleft):not(.alignright):not(.alignwide)),
body.buentheme-layout-normal .wp-site-blocks > main.buentheme-wc-product-search-main > :where(:not(.alignfull):not(.alignleft):not(.alignright):not(.alignwide)),
body:not([class*="buentheme-layout-"]) .wp-site-blocks > main.buentheme-single-product-main > :where(:not(.alignfull):not(.alignleft):not(.alignright):not(.alignwide)),
body:not([class*="buentheme-layout-"]) .wp-site-blocks > main.buentheme-wc-catalog-main > :where(:not(.alignfull):not(.alignleft):not(.alignright):not(.alignwide)),
body:not([class*="buentheme-layout-"]) .wp-site-blocks > main.buentheme-wc-cart-main > :where(:not(.alignfull):not(.alignleft):not(.alignright):not(.alignwide)),
body:not([class*="buentheme-layout-"]) .wp-site-blocks > main.buentheme-wc-checkout-main > :where(:not(.alignfull):not(.alignleft):not(.alignright):not(.alignwide)) {
    max-width: var(--wp--style--global--content-size, 1290px) !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

/* alignwide → wide size (o content-size si no hay wide) */
body.buentheme-layout-normal .wp-site-blocks > main.is-layout-constrained > .alignwide,
body:not([class*="buentheme-layout-"]) .wp-site-blocks > main.is-layout-constrained > .alignwide,
body.buentheme-layout-normal .wp-site-blocks > main.buentheme-single-product-main > .alignwide,
body.buentheme-layout-normal .wp-site-blocks > main.buentheme-wc-cart-main > .alignwide,
body.buentheme-layout-normal .wp-site-blocks > main.buentheme-wc-checkout-main > .alignwide,
body:not([class*="buentheme-layout-"]) .wp-site-blocks > main > .alignwide {
    max-width: var(--wp--style--global--wide-size, var(--wp--style--global--content-size, 1290px)) !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

/* Refuerzo ficha de producto (columnas / tabs / relacionados) */
.buentheme-single-product-main > .wp-block-columns,
.buentheme-single-product-main > .buentheme-product-tabs-section,
.buentheme-single-product-main > .buentheme-product-related {
    max-width: var(--wp--style--global--content-size, 1290px) !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

/*
 * Ficha: el main ya aporta template_padding; no duplicar en hijos.
 * (Si template_padding = none, el main ya va a 0; hijos siguen sin pad extra.)
 */
.buentheme-single-product-main > .wp-block-columns,
.buentheme-single-product-main > .buentheme-product-tabs-section,
.buentheme-single-product-main > .buentheme-product-related {
    padding-left: 0;
    padding-right: 0;
}

body.buentheme-layout-narrow .wp-site-blocks > main.is-layout-constrained > :where(:not(.alignfull):not(.alignleft):not(.alignright)),
body.buentheme-layout-narrow .wp-site-blocks > main > .wp-block-woocommerce-product-collection,
body.buentheme-layout-narrow .wp-site-blocks > main > .buentheme-wc-catalog-root,
body.buentheme-layout-narrow .wp-site-blocks > main > .wp-block-query.buentheme-wc-catalog-root,
body.buentheme-layout-narrow .wp-site-blocks > main > .wp-block-term-description,
body.buentheme-layout-narrow .wp-site-blocks > main > .wp-block-woocommerce-cart,
body.buentheme-layout-narrow .wp-site-blocks > main > .wp-block-woocommerce-checkout,
body.buentheme-layout-narrow .wp-site-blocks > main > .wp-block-columns,
body.buentheme-layout-narrow .wp-site-blocks > main > .wp-block-heading,
body.buentheme-layout-narrow .wp-site-blocks > main > .wp-block-group:not(.alignfull),
body.buentheme-layout-narrow .buentheme-single-product-main > .wp-block-columns,
body.buentheme-layout-narrow .buentheme-single-product-main > .buentheme-product-tabs-section,
body.buentheme-layout-narrow .buentheme-single-product-main > .buentheme-product-related {
    max-width: var(--buentheme-narrow-width, 720px) !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/*
 * Full width del dashboard: filas pueden ir edge-to-edge, pero el contenido
 * de producto/tienda sigue el content-size (como la cabecera con inherit).
 * Solo alignfull rompe el límite.
 */
body.buentheme-layout-full_width .wp-site-blocks > main.is-layout-constrained > :where(:not(.alignfull):not(.alignleft):not(.alignright):not(.alignwide)),
body.buentheme-layout-full_width .wp-site-blocks > main.buentheme-single-product-main > :where(:not(.alignfull):not(.alignleft):not(.alignright):not(.alignwide)),
body.buentheme-layout-full_width .buentheme-single-product-main > .wp-block-columns,
body.buentheme-layout-full_width .buentheme-single-product-main > .buentheme-product-tabs-section,
body.buentheme-layout-full_width .buentheme-single-product-main > .buentheme-product-related {
    max-width: var(--wp--style--global--content-size, 1290px) !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
}

body.buentheme-layout-full_width .wp-site-blocks > main.is-layout-constrained > .alignwide,
body.buentheme-layout-full_width .wp-site-blocks > main > .alignwide {
    max-width: var(--wp--style--global--wide-size, var(--wp--style--global--content-size, 1290px)) !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

body.buentheme-layout-full_width .wp-site-blocks > main.is-layout-constrained > .alignfull,
body.buentheme-layout-full_width .wp-block-woocommerce-product-collection.alignfull {
    max-width: 100% !important;
    width: 100% !important;
}

body.buentheme-layout-narrow .wp-site-blocks > main > .wp-block-heading {
    max-width: var(--buentheme-narrow-width, 720px) !important;
}
/* full_width: títulos en main usan content_padding (no template WC). */
body.buentheme-layout-full_width .wp-site-blocks > main > .wp-block-heading {
    max-width: var(--wp--style--global--content-size, 1290px) !important;
    padding-left: var(--buentheme-global-padding, 0px) !important;
    padding-right: var(--buentheme-global-padding, 0px) !important;
    box-sizing: border-box !important;
}

/* En tienda/ficha full_width el título de archivo sigue template_padding. */
body.buentheme-layout-full_width.woocommerce-shop .wp-site-blocks > main > .wp-block-heading,
body.buentheme-layout-full_width.post-type-archive-product .wp-site-blocks > main > .wp-block-heading,
body.buentheme-layout-full_width.tax-product_cat .wp-site-blocks > main > .wp-block-heading,
body.buentheme-layout-full_width.tax-product_tag .wp-site-blocks > main > .wp-block-heading,
body.buentheme-layout-full_width.buentheme-wc-catalog .wp-site-blocks > main > .wp-block-heading {
    padding-left: var(--buentheme-template-edge-padding, 15px) !important;
    padding-right: var(--buentheme-template-edge-padding, 15px) !important;
}

body.buentheme-title-align-left .wp-block-term-description,
body.buentheme-title-align-left .wp-site-blocks > main > .wp-block-heading {
    text-align: left !important;
}
body.buentheme-title-align-center .wp-block-term-description,
body.buentheme-title-align-center .wp-site-blocks > main > .wp-block-heading {
    text-align: center !important;
}
body.buentheme-title-align-right .wp-block-term-description,
body.buentheme-title-align-right .wp-site-blocks > main > .wp-block-heading {
    text-align: right !important;
}

body.buentheme-wc-catalog.buentheme-style-boxed .wp-site-blocks > main > .wp-block-woocommerce-product-collection,
body.buentheme-wc-catalog.buentheme-style-boxed .wp-site-blocks > main > .buentheme-wc-catalog-root {
    background-color: transparent;
}

/*
 * Boxed: acota el main (no los hijos constrained).
 * layout-normal pone main a 100% !important — reafirmar caja con content-size global.
 */
body.buentheme-style-boxed.buentheme-layout-normal .wp-site-blocks > main,
body.buentheme-style-boxed:not([class*="buentheme-layout-"]) .wp-site-blocks > main {
    max-width: var(--wp--style--global--content-size, 1290px) !important;
}