/* ==========================================================================
   REGIONS & GENERAL
   ========================================================================== */

.region-top-content:has(#block-news-center-page-title) {
    display: none;
}

.region-content {
    margin-bottom: var(--gap);
}

.region-front-content {
    flex-wrap: wrap;
}

/* Center the content of non-section blocks in the front-page main region
   (e.g. Special Sections widget, Business Directory e-edition). Section
   blocks are excluded — they have their own grid layout. */
.region-front-content > .block:not(:has(.front-page-sections)) {
    text-align: center;
}

/* The shared .section-tag-heading carries a left margin elsewhere; clear it
   so the widget heading centers with the rest of the content. */
.region-front-content > .block:not(:has(.front-page-sections)) .section-tag-heading {
    margin-left: 0;
}

/* The front-page widget embeds (Special Sections, Business Directory
   e-edition) are cross-origin iframes hard-coded to height=450, but their
   carousels are shorter, leaving blank space inside the iframe (the publisher
   page's own background) that we can't reach. Size the iframe element itself
   so the card hugs the carousel. Each embed has its own carousel height. */
#block-tiempos-specialsectionswidget iframe {
    height: 360px;
}

#block-tiempos-businessdirectoryeedition iframe {
    height: 260px;
}

.view-footer {
    display: flex;
    justify-content: center;
}

article .node__content .premium_content_teaser {
    margin-left: -0.3rem;
}

/* ==========================================================================
   FRONTPAGE MAIN GRID
   ========================================================================== */

.frontpage {
    display: grid;
    grid-template-columns: 30% 1fr;
    grid-column-gap: var(--gap);
}

.frontpage .views-field-field-image img {
    width: 100%;
}

/* ==========================================================================
   FRONTPAGE VIEW - SHARED
   ========================================================================== */

.view-id-frontpage {
    margin-bottom: var(--gap);
}

.view-id-frontpage .view-content > div {
    box-shadow: var(--card-shadow);
    border: var(--card-border);
    border-radius: var(--card-radius);
    overflow: hidden;
    margin-bottom: var(--gap);
}

/* Featured only - no attachment (use page display to avoid matching nested attachment view) */
.view-id-frontpage.view-display-id-page_1:not(:has(.attachment)) .view-content article .node__content {
    padding: var(--gap);
}

/* With attachment - add padding to content items */
.view-id-frontpage:has(.attachment) .view-content > div {
    padding: var(--section-padding);
}

.view-id-frontpage:has(.attachment) .view-content > div:first-child .views-field-field-image {
    padding: 0.5rem 0 0;
}

/* ==========================================================================
   FRONTPAGE VIEW - FEATURED (FIRST ITEM)
   ========================================================================== */

.view-id-frontpage .view-content > div .content-container {
    padding: 0.5rem 0 0;
}

.view-id-frontpage .view-content > div:first-child .premium_content_teaser {
    width: 250px;
    margin: 1rem 0 0 0.6rem;
}

.view-id-frontpage.view-display-id-page_1 .node--view-mode-featured .image-container img {
    display: block;
    margin: auto;
}

/* ==========================================================================
   FRONTPAGE VIEW - ATTACHMENT
   ========================================================================== */

.view-id-frontpage .attachment .views-row {
    clear: both;
    margin-bottom: var(--gap);
    width: 100%;
}

.frontpage .attachment .views-row:last-child {
    margin-bottom: 0;
}

.view-id-frontpage .attachment .image-container {
    /*aspect-ratio: 8 / 5;
    overflow: hidden;
    position: relative;*/
}

.view-id-frontpage .attachment .image-container a {
    display: block;
    width: 100%;
    height: 100%;
}

.view-id-frontpage .attachment .image-container .caption {
    display: none;
}

.view-id-frontpage .attachment .image-container img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

/* ==========================================================================
   FRONTPAGE VIEW - COLUMNS LAYOUT
   ========================================================================== */

/* Left-hand column (attachment) */
.view-id-frontpage.columns > .attachment {
    display: flex;
    flex: 1 1 0;
    flex-wrap: wrap;
    padding: 0 calc(0.75rem * 2) 0 0;
}

.view-id-frontpage.columns > .attachment .view-content > div {
    clear: both;
}

.view-id-frontpage.columns > .attachment .view-content h2 {
    font-size: 1.1rem;
    line-height: 1.4rem;
}

.view-id-frontpage.columns > .attachment .view-content .node--view-mode-teaser {
    margin-bottom: 0;
}

.view-id-frontpage.columns > .attachment .view-content .node--view-mode-teaser h2 {
    font-size: 1.1rem;
    line-height: 1.4rem;
}

.view-id-frontpage.columns > .attachment .view-content .node--view-mode-teaser .field--name-body {
    margin-bottom: 0;
    line-height: 1.3rem;
}

.view-id-frontpage.columns > .attachment .view-content .node--view-mode-teaser .field--name-body p {
    line-height: 1.3rem;
}

/* Center column (featured content) */
.view-id-frontpage.columns > .view-content {
    display: flex;
    flex: 2 1 0;
    flex-wrap: wrap;
    padding: 0;
    height: fit-content;
}

.view-id-frontpage.columns > .view-content > div > a,
.view-id-frontpage.columns > .view-content .views-field-field-image a {
    margin: auto;
    display: table;
}

.view-id-frontpage.columns > .view-content h2 {
    line-height: 1.8rem;
}

.view-id-frontpage.columns > .view-content .node--view-mode-featured .field--name-body {
    margin-bottom: 0;
}

/* ==========================================================================
   FRONT PAGE SECTIONS
   ========================================================================== */

.front-page-sections .view-content {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: var(--gap);
}

.front-page-sections footer {
    margin: var(--gap) 0 0 !important;
    grid-column-start: 1;
    grid-column-end: 4;
    display: flex;
    justify-content: center;
}

.front-page-sections h2.field-content {
    font-size: 1.1rem;
    line-height: 1.4rem;
}

/* Center the image in its container in ALL states (works whether or not the
   front_page_sections JS/CSS is loaded). The equalized-height layout, radius
   and vignette live in front_page_sections.css, loaded only when the "Enable
   front page sections Javascript" setting is on. */
.front-page-sections .image-container {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ==========================================================================
   MEDIA QUERIES
   ========================================================================== */

@media screen and (min-width: 1024px) {
    /* Card style for every block in the front-page main region — applied at
       the block level (the outer .block), so the card wraps the whole block
       including its heading, and no inner div carries its own shadow/border.
       Uses the card vars, so it follows the card-shadows theme setting. */
    .region-front-content > .block {
        box-shadow: var(--card-shadow);
        border: var(--card-border);
        border-radius: var(--card-radius);
        overflow: hidden;
        padding: var(--section-padding);
        margin-bottom: var(--section-margin-bottom);
    }
}

@media screen and (max-width: 1023px) {
    .region-sidebar {
        justify-content: center;
    }

    .frontpage {
        display: flex;
        flex-direction: column-reverse;
        flex-wrap: wrap;
    }

    .frontpage .attachment {
        margin-top: var(--gap);
        margin-right: 0;
        display: flex;
        flex-wrap: wrap;
    }

    .view-id-frontpage:has(.attachment) {
        display: flex;
        flex-direction: column-reverse;
        flex-wrap: nowrap;
    }

    /* .view to override margin-bottom from style.css */
    .view-id-frontpage.view .view-content > div {
        box-shadow: none;
        border: 0;
        border-radius: unset;
        overflow: hidden;
        margin-bottom: 0 !important;
    }

    .view-id-frontpage:has(.attachment) .view-content > div:first-child .views-field-field-image {
        padding: 0;
    }

    .view-id-frontpage.view-display-id-page_1:not(:has(.attachment)) .view-content article .node__content {
        padding: 0;
    }

    /* With attachment - add padding to content items */
    .view-id-frontpage:has(.attachment) .view-content > div {
        padding: 0 var(--gap) var(--gap) var(--gap);
    }

    .front-page-sections {
        grid-template-columns: 1fr;
    }

    .front-page-sections .views-row {
        margin-bottom: var(--gap);
    }

    .front-page-sections footer {
        grid-column-end: 1;
    }

    .section-tag-heading {
        margin-left: 0.75rem;
    }
}
