/*
Theme Name: Bacdall
Description: Tema personalizado desarrollado por PML Latam para BacDall, basado en Hello Elementor. Diseñado y optimizado específicamente para adaptarse a la identidad visual, estructura, contenidos y funcionalidades del sitio web de BacDall.
Template: hello-elementor
Version: 1.0.6
*/


/* ==========================================================
   BACDALL BLOG - SINGLE POST
   Desarrollado por PML Latam
   ========================================================== */


/* ==========================================================
   RESET SINGLE
   ========================================================== */

body.single-post .site-main.bacdall-single-post {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #ffffff !important;
}

body.single-post .bacdall-single-post::before,
body.single-post .bacdall-single-post::after {
    display: none !important;
    content: none !important;
}


/* ==========================================================
   HERO / PARALLAX
   ========================================================== */

body.single-post .bacdall-post-hero {
    position: relative !important;
    display: block !important;

    width: 100vw !important;
    height: 500px !important;
    min-height: 500px !important;

    margin: 0 0 0 calc(50% - 50vw) !important;
    padding: 0 !important;

    overflow: hidden !important;

    background-color: #293C58;

    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: cover !important;

    /*
     * EFECTO PARALLAX
     * La fotografía permanece fija mientras
     * la página se desplaza.
     */
    background-attachment: fixed !important;
}


/* ==========================================================
   OVERLAY HERO
   #293C58 / 50%
   ========================================================== */

body.single-post .bacdall-post-hero-overlay {
    position: absolute !important;
    inset: 0 !important;

    z-index: 1 !important;

    width: 100% !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    background: rgba(41, 60, 88, 0.50) !important;

    pointer-events: none;
}


/* ==========================================================
   CONTENIDO HERO
   Alineado con sidebar
   ========================================================== */

body.single-post .bacdall-post-hero-content {
    position: relative !important;
    z-index: 2 !important;

    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;

    width: calc(100% - 40px) !important;
    max-width: 1255px !important;

    height: 500px !important;

    margin: 0 auto !important;
    padding: 0 !important;
}


/* ==========================================================
   CATEGORÍA HERO
   ========================================================== */

body.single-post .bacdall-post-category {
    display: block !important;

    margin: 0 0 18px 0 !important;
    padding: 0 !important;
}

body.single-post .bacdall-post-category a {
    display: inline-block;

    color: #ffffff !important;

    font-size: 15px;
    line-height: 1.2;
    font-weight: 700;

    letter-spacing: 0.7px;

    text-transform: uppercase;
    text-decoration: none !important;
}

body.single-post .bacdall-post-category a:hover {
    color: #ffffff !important;
    text-decoration: none !important;
}

body.single-post .bacdall-post-category::after {
    content: "";

    display: block;

    width: 75px;
    height: 2px;

    margin-top: 8px;

    background: #f20d2f;
}


/* ==========================================================
   TÍTULO HERO
   ========================================================== */

body.single-post .bacdall-post-title {
    display: block !important;

    width: 100% !important;
    max-width: 720px !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #ffffff !important;

    font-size: clamp(38px, 3.15vw, 54px) !important;
    line-height: 1.07 !important;
    font-weight: 700 !important;

    letter-spacing: -0.7px !important;
}


/* ==========================================================
   LAYOUT PRINCIPAL
   ========================================================== */

body.single-post .bacdall-post-layout {
    display: grid;

    grid-template-columns: 280px minmax(0, 1fr);

    gap: 55px;

    width: calc(100% - 40px);
    max-width: 1255px;

    margin: 50px auto 0;
    padding: 0;

    align-items: start;

    background: #ffffff;
}


/* ==========================================================
   SIDEBAR
   ========================================================== */

body.single-post .bacdall-post-sidebar {
    width: 100%;
    min-width: 0;

    margin: 0;
    padding: 0;

    color: #293C58;
}


/* ==========================================================
   WIDGETS
   ========================================================== */

body.single-post .bacdall-post-sidebar .widget,
body.single-post .bacdall-post-sidebar .bacdall-widget {

    width: 100%;

    margin: 0 0 32px 0;
    padding: 0;
}


/* ==========================================================
   TÍTULOS SIDEBAR
   ========================================================== */

body.single-post .bacdall-post-sidebar h2,
body.single-post .bacdall-post-sidebar h3,
body.single-post .bacdall-post-sidebar .widget-title,
body.single-post .bacdall-post-sidebar .bacdall-widget-title,
body.single-post .bacdall-post-sidebar .wp-block-heading {

    margin: 0 0 14px 0;
    padding: 0 0 10px 0;

    color: #293C58 !important;

    font-size: 14px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;

    text-transform: uppercase;

    border-bottom: 1px solid #cfc6b6;
}


/* ==========================================================
   BUSCADOR
   BLOQUE MODERNO + WIDGET CLÁSICO
   ========================================================== */

/*
 * Contenedores posibles de WordPress
 */

body.single-post .bacdall-post-sidebar .wp-block-search,
body.single-post .bacdall-post-sidebar .widget_search {

    width: 100%;

    margin: 0 0 32px 0 !important;
    padding: 0 !important;
}


/* Ocultar label/título BUSCAR */

body.single-post .bacdall-post-sidebar .wp-block-search__label,
body.single-post .bacdall-post-sidebar .widget_search .widget-title {

    display: none !important;
}


/* FORMULARIO */

body.single-post .bacdall-post-sidebar .search-form,
body.single-post .bacdall-post-sidebar .wp-block-search__inside-wrapper {

    position: relative !important;

    display: block !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;
}


/* ==========================================================
   INPUT BUSCADOR
   ========================================================== */

body.single-post .bacdall-post-sidebar .search-field,
body.single-post .bacdall-post-sidebar .wp-block-search__input {

    display: block !important;

    width: 100% !important;
    height: 44px !important;

    margin: 0 !important;

    padding: 0 48px 0 18px !important;

    box-sizing: border-box !important;

    color: #293C58 !important;

    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 400 !important;

    background: #f4f5f6 !important;

    border: 1px solid #e0e3e6 !important;
    border-radius: 24px !important;

    outline: none !important;
    box-shadow: none !important;
}


body.single-post .bacdall-post-sidebar .search-field::placeholder,
body.single-post .bacdall-post-sidebar .wp-block-search__input::placeholder {

    color: #929cac !important;

    opacity: 1;
}


body.single-post .bacdall-post-sidebar .search-field:focus,
body.single-post .bacdall-post-sidebar .wp-block-search__input:focus {

    background: #ffffff !important;

    border-color: #293C58 !important;

    outline: none !important;
    box-shadow: none !important;
}


/* ==========================================================
   BOTÓN BUSCADOR
   ========================================================== */

body.single-post .bacdall-post-sidebar .search-submit,
body.single-post .bacdall-post-sidebar .wp-block-search__button {

    position: absolute !important;

    top: 50% !important;
    right: 6px !important;

    transform: translateY(-50%) !important;

    display: block !important;

    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    color: transparent !important;

    font-size: 0 !important;
    line-height: 0 !important;

    background: transparent !important;

    border: 0 !important;
    border-radius: 50% !important;

    box-shadow: none !important;

    cursor: pointer;

    z-index: 10;
}


/* ==========================================================
   LUPA CSS
   ========================================================== */

body.single-post .bacdall-post-sidebar .search-submit::before,
body.single-post .bacdall-post-sidebar .wp-block-search__button::before {

    content: "" !important;

    position: absolute !important;

    top: 7px !important;
    left: 7px !important;

    width: 12px !important;
    height: 12px !important;

    border: 2px solid #7d8999 !important;
    border-radius: 50% !important;

    box-sizing: border-box !important;
}


body.single-post .bacdall-post-sidebar .search-submit::after,
body.single-post .bacdall-post-sidebar .wp-block-search__button::after {

    content: "" !important;

    position: absolute !important;

    top: 19px !important;
    left: 18px !important;

    width: 7px !important;
    height: 2px !important;

    background: #7d8999 !important;

    border-radius: 2px !important;

    transform: rotate(45deg) !important;

    transform-origin: left center !important;
}


/* Ocultar SVG generado por WP */

body.single-post .bacdall-post-sidebar .wp-block-search__button svg {
    display: none !important;
}


/* HOVER LUPA */

body.single-post .bacdall-post-sidebar .search-submit:hover,
body.single-post .bacdall-post-sidebar .wp-block-search__button:hover {

    background: #293C58 !important;
}


body.single-post .bacdall-post-sidebar .search-submit:hover::before,
body.single-post .bacdall-post-sidebar .wp-block-search__button:hover::before {

    border-color: #ffffff !important;
}


body.single-post .bacdall-post-sidebar .search-submit:hover::after,
body.single-post .bacdall-post-sidebar .wp-block-search__button:hover::after {

    background: #ffffff !important;
}


/* ==========================================================
   CATEGORÍAS
   ========================================================== */

body.single-post .bacdall-post-sidebar select {

    display: block;

    width: 100%;
    height: 42px;

    margin: 0;

    padding: 0 38px 0 14px;

    box-sizing: border-box;

    color: #293C58;

    font-family: inherit;
    font-size: 14px;

    background-color: #ffffff;

    border: 1px solid #d3d7dc;
    border-radius: 4px;

    box-shadow: none;

    cursor: pointer;
}


body.single-post .bacdall-post-sidebar select:focus {

    border-color: #293C58;

    outline: none;
}


/* ==========================================================
   LISTAS SIDEBAR
   ========================================================== */

body.single-post .bacdall-post-sidebar ul {

    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;
}


body.single-post .bacdall-post-sidebar li {

    margin: 0 0 10px 0 !important;
    padding: 0 !important;

    color: #293C58;

    font-size: 14px;
    line-height: 1.4;
}


/* ==========================================================
   LINKS SIDEBAR
   ========================================================== */

body.single-post .bacdall-post-sidebar a {

    color: #293C58 !important;

    font-size: 14px;

    line-height: 1.4;

    text-decoration: none !important;

    transition: color 0.2s ease;
}


body.single-post .bacdall-post-sidebar a:hover {

    color: #ed1530 !important;

    text-decoration: none !important;
}


/* ==========================================================
   ÚLTIMAS NOVEDADES
   ========================================================== */

body.single-post .bacdall-post-sidebar .wp-block-latest-posts {

    margin: 0 !important;
    padding: 0 !important;
}


body.single-post .bacdall-post-sidebar .wp-block-latest-posts li {

    position: relative;

    margin: 0 0 12px 0 !important;

    padding: 0 0 0 12px !important;
}


body.single-post .bacdall-post-sidebar .wp-block-latest-posts li::before {

    content: "";

    position: absolute;

    top: 8px;
    left: 0;

    width: 4px;
    height: 4px;

    background: #ed1530;

    border-radius: 50%;
}


/* ==========================================================
   CONTENIDO PRINCIPAL
   ========================================================== */

body.single-post .bacdall-post-main {

    width: 100%;
    min-width: 0;

    margin: 0;
    padding: 0;
}


body.single-post .bacdall-post-content {

    width: 100%;

    margin: 0;
    padding: 0;
}


body.single-post .bacdall-post-content img {

    max-width: 100%;

    height: auto;
}


/* ==========================================================
   TAGS
   ========================================================== */

body.single-post .bacdall-post-footer {
    margin-top: 45px;
}


body.single-post .bacdall-post-tags {
    line-height: 1.6;
}


body.single-post .bacdall-tags-title {

    margin-right: 8px;

    font-weight: 700;
}


/* ==========================================================
   BIO AUTOR
   ========================================================== */

body.single-post .bacdall-author-box {

    display: flex;

    gap: 20px;

    margin-top: 45px;
    padding-top: 30px;

    border-top: 1px solid #dddddd;
}


body.single-post .bacdall-author-avatar img {
    border-radius: 50%;
}


body.single-post .bacdall-author-info {
    flex: 1;
}


body.single-post .bacdall-author-label {

    margin-bottom: 5px;

    font-size: 12px;
    font-weight: 700;

    text-transform: uppercase;
}


body.single-post .bacdall-author-name {

    margin: 0 0 10px 0;
}


body.single-post .bacdall-author-description p:last-child {

    margin-bottom: 0;
}


/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 1024px) {

    body.single-post .bacdall-post-hero {

        height: 460px !important;
        min-height: 460px !important;

        /*
         * En tablets evitamos background fixed.
         */
        background-attachment: scroll !important;
    }


    body.single-post .bacdall-post-hero-content {

        width: calc(100% - 40px) !important;

        height: 460px !important;
    }


    body.single-post .bacdall-post-title {

        max-width: 650px !important;

        font-size: 44px !important;
    }


    body.single-post .bacdall-post-layout {

        grid-template-columns: 240px minmax(0, 1fr);

        gap: 40px;
    }

}


/* ==========================================================
   TABLET VERTICAL
   ========================================================== */

@media (max-width: 900px) {

    body.single-post .bacdall-post-layout {

        grid-template-columns: 1fr;

        gap: 40px;

        width: calc(100% - 40px);
    }


    body.single-post .bacdall-post-main {
        order: 1;
    }


    body.single-post .bacdall-post-sidebar {
        order: 2;
    }

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 767px) {

    body.single-post .bacdall-post-hero {

        width: 100vw !important;

        height: 360px !important;
        min-height: 360px !important;

        margin: 0 0 0 calc(50% - 50vw) !important;

        /*
         * Fixed suele fallar en navegadores móviles.
         */
        background-attachment: scroll !important;

        background-position: center center !important;
        background-size: cover !important;
    }


    body.single-post .bacdall-post-hero-overlay {

        height: 100% !important;
    }


    body.single-post .bacdall-post-hero-content {

        width: calc(100% - 32px) !important;
        max-width: none !important;

        height: 360px !important;
        min-height: 360px !important;

        margin: 0 auto !important;
    }


    body.single-post .bacdall-post-category {

        margin-bottom: 14px !important;
    }


    body.single-post .bacdall-post-category a {

        font-size: 12px !important;
    }


    body.single-post .bacdall-post-category::after {

        width: 80px;

        margin-top: 8px;
    }


    body.single-post .bacdall-post-title {

        width: 100% !important;
        max-width: 460px !important;

        font-size: 31px !important;
        line-height: 1.08 !important;

        letter-spacing: -0.3px !important;
    }


    body.single-post .bacdall-post-layout {

        width: calc(100% - 32px);

        margin-top: 35px;
    }


    body.single-post .bacdall-post-sidebar {

        width: 100%;

        margin-top: 10px;
    }

}


/* ==========================================================
   MOBILE CHICO
   ========================================================== */

@media (max-width: 480px) {

    body.single-post .bacdall-post-hero {

        height: 340px !important;
        min-height: 340px !important;
    }


    body.single-post .bacdall-post-hero-content {

        width: calc(100% - 30px) !important;

        height: 340px !important;
        min-height: 340px !important;
    }


    body.single-post .bacdall-post-title {

        font-size: 29px !important;
        line-height: 1.08 !important;
    }


    body.single-post .bacdall-author-box {

        flex-direction: column;
    }

}

/* ==========================================================
   SEARCH - BACDALL
   Version: 1.0.3
   ========================================================== */

/* Imágenes de los resultados */
body.search .page-content article > a {
	display: block;
	overflow: hidden;
	border-radius: 25px;
}

body.search .page-content article > a img {
	display: block;
	width: 100%;
	border-radius: 25px;
}

/* Más separación entre un resultado y el siguiente */
body.search .page-content article {
	margin-bottom: 90px;
}

/* La descripción queda un poco más separada */
body.search .page-content article .entry-excerpt {
	margin-bottom: 50px;
}

/* ==========================================================
   ESPACIO INFERIOR SINGLE POST
   Version: 1.0.5
   ========================================================== */

body.single-post .bacdall-post-layout {
	padding-bottom: 50px !important;
}

/* ==========================================================
   ÍNDICE DE CONTENIDO - BACDALL
   Version: 1.0.6
   ========================================================== */

body.single-post nav.bacdall-toc {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 0 50px 0 !important;
    padding: 25px !important;
    background-color: rgba(41, 60, 88, 0.15) !important;
    border: 1px solid rgba(41, 60, 88, 0.50) !important;
    border-radius: 20px !important;
}

body.single-post nav.bacdall-toc h3.bacdall-toc-title {
    display: block !important;
    margin: 0 0 15px 0 !important;
    padding: 0 !important;
    color: #293C58 !important;
    font-family: inherit !important;
    font-size: 22px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
}

body.single-post nav.bacdall-toc ul.bacdall-toc-list {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

body.single-post nav.bacdall-toc li.bacdall-toc-item {
    display: block !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    font-family: inherit !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    list-style: none !important;
}

body.single-post nav.bacdall-toc li.bacdall-toc-item:last-child {
    margin-bottom: 0 !important;
}

body.single-post nav.bacdall-toc li.bacdall-toc-item a {
    color: #293C58 !important;
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    text-decoration: none !important;
    transition: color 0.2s ease, opacity 0.2s ease !important;
}

body.single-post nav.bacdall-toc li.bacdall-toc-item a:hover,
body.single-post nav.bacdall-toc li.bacdall-toc-item a:focus {
    color: rgba(41, 60, 88, 0.50) !important;
    text-decoration: none !important;
}

@media (max-width: 767px) {
    body.single-post nav.bacdall-toc {
        padding: 20px !important;
        margin-bottom: 40px !important;
    }

    body.single-post nav.bacdall-toc h3.bacdall-toc-title {
        font-size: 20px !important;
    }

    body.single-post nav.bacdall-toc li.bacdall-toc-item {
        font-size: 15px !important;
    }
}
