/*
Theme Name: Blocksy Child - Bulleen Plaza
Theme URI: https://bulleenplaza.com.au
Description: Bulleen Plaza shopping centre child theme based on Blocksy
Author: Greys
Author URI: https://greys.co
Template: blocksy
Version: 1.0.3
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: blocksy-child
*/

/* ============================================
   Page Hero Banners (Events, Directory, Contact)
   ============================================ */
.bp-page-hero {
    position: relative;
    min-height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover;
    background-position: center;
    text-align: center;
}

.bp-page-hero .wp-block-cover__background {
    opacity: 0.55 !important;
}

/* Remove default black dim from page heroes — only the blue overlay should show */
.bp-page-hero .has-background-dim:not([class*="-background-color"]) {
    background-color: transparent !important;
}

.bp-page-hero h1 {
    color: #fff;
    font-weight: 800;
    text-transform: uppercase;
    font-size: clamp(2.5rem, 5vw, 4rem);
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

/* Hide Blocksy default page title on all pages (we use custom heroes) */
.page .entry-header,
.page .hero-section {
    display: none;
}

/* ============================================
   Transparent Header (overlays hero)
   ============================================ */
.has-transparent-header [data-vertical-spacing] {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.has-transparent-header #header {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 50;
}

.has-transparent-header #header [data-row] {
    background-color: transparent !important;
}

.has-transparent-header #header [data-row] a,
.has-transparent-header #header [data-row] .ct-menu > li > a {
    color: #ffffff !important;
}

.has-transparent-header #header [data-row] .ct-header-trigger {
    color: #ffffff !important;
}

/* Menu font size override (Blocksy default is 12px) */
[data-header*="type-1"] .ct-header [data-id="menu"] > ul > li > a {
  font-size: 16px;
}

/* ============================================
   Hero Curves Effect
   ============================================ */
.home .bp-home-hero {
    position: relative;
    margin-bottom: 0;
    overflow: hidden;
    isolation: isolate;
}

.home .bp-home-hero .wp-block-cover__inner-container {
    position: relative;
    z-index: 5;
}

.home .bp-home-hero::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 30vh;
    pointer-events: none;
    background: url("assets/home/hero.png") center bottom / 100% 100% no-repeat;
    z-index: 3;
}

.home .bp-home-hero::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 7vh;
    background: #0077c0;
    pointer-events: none;
    z-index: 2;
}

@media (max-width: 768px) {
    .home .bp-home-hero::before {
        height: 120px;
    }
    .home .bp-home-hero::after {
        height: 30px;
    }
}

/* ============================================
   Homepage Sections
   ============================================ */

/* What's On section */
.bp-whats-on .wp-block-columns {
    align-items: center;
}

.bp-whats-on .wp-block-image img {
    border-radius: 4px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

/* Dark button variant (overrides Blocksy theme button variables) */
.wp-block-button.bp-btn-dark .wp-block-button__link.wp-element-button {
    --theme-button-background-initial-color: #333333;
    --theme-button-background-hover-color: #1a1a1a;
    --theme-button-text-initial-color: #ffffff;
    --theme-button-text-hover-color: #ffffff;
    background-color: #333333 !important;
    color: #ffffff !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 700;
}

.wp-block-button.bp-btn-dark .wp-block-button__link.wp-element-button:hover {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
}

/* Retailers section */
.bp-retailers .wp-block-image {
    background: #fff;
    border-radius: 4px;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 80px;
}

.bp-retailers .wp-block-image img {
    width: auto !important;
    height: auto !important;
    object-fit: contain;
}

/* Category icons section */
.bp-categories .wp-block-image img {
    max-height: 64px;
    width: auto;
}

@media (max-width: 768px) {
    .bp-categories .wp-block-columns {
        flex-wrap: wrap !important;
    }
    .bp-categories .wp-block-columns .wp-block-column {
        flex-basis: calc(50% - 1rem) !important;
        flex-grow: 0 !important;
    }
    .home .bp-home-hero {
        min-height: 60vh !important;
    }
}

/* Photo gallery */
.bp-gallery {
    margin: 0;
    padding: 0;
}

.bp-gallery .wp-block-columns {
    margin-bottom: 0 !important;
    gap: 0 !important;
}

.bp-gallery .wp-block-column {
    margin: 0;
    padding: 0;
}

.bp-gallery .wp-block-image {
    margin: 0;
}

.bp-gallery .wp-block-image img {
    width: 100%;
    object-fit: cover;
    display: block;
    margin: 0;
}

/* ============================================
   Directory Store Grid
   ============================================ */
.bp-store-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    padding: 2rem 0;
}

@media (max-width: 1024px) {
    .bp-store-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .bp-store-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .bp-store-grid {
        grid-template-columns: 1fr;
    }
}

.bp-store-card {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.bp-store-card .wp-block-post-featured-image {
    margin-block-end: 0;
}

.bp-store-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.bp-store-card__image,
.bp-store-card .wp-block-post-featured-image img {
    width: 100%;
    height: 200px;
    object-fit: contain !important;
}

.bp-store-card__info {
    padding: 1rem;
}

.bp-store-card__logo {
    max-height: 40px;
    width: auto;
    margin-bottom: 0.5rem;
}

.bp-store-card__name,
.bp-store-card .wp-block-post-title {
    --theme-font-family: 'Montserrat', sans-serif;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 700;
    font-size: 0.95rem;
    margin: 0 0 0.25rem;
}

.bp-store-card__meta {
    font-size: 0.85rem;
    color: #666;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
    margin-top: 0.25rem;
}

.bp-store-card__details {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.bp-store-card__unit {
    font-weight: 600;
    color: #0077c0;
}

.bp-store-card__phone {
    color: #888;
}

.bp-store-card__website {
    color: #0077c0;
    text-decoration: underline;
}

/* ============================================
   Events Page
   ============================================ */
.bp-event-entry {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    align-items: start;
    padding: 2rem 0;
    border-bottom: 1px solid #e5e5e5;
}

.bp-event-entry:last-child {
    border-bottom: none;
}

@media (max-width: 768px) {
    .bp-event-entry {
        grid-template-columns: 1fr;
    }
}

.bp-event-entry .wp-block-post-featured-image img {
    max-height: 400px;
    width: auto;
    object-fit: contain;
    border-radius: 4px;
}

/* ============================================
   Footer
   ============================================ */
.ct-footer {
    position: relative;
    overflow: hidden !important;
    background: transparent !important;
}

.ct-footer [data-row="middle"] {
    position: relative;
    overflow: hidden;
    background-color: #5ca9d8 !important;
    color: #fff;
    padding: 2.35rem 0 2.1rem;
    margin-top: 0;
}

.ct-footer [data-row="middle"]::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("assets/home/footer.png") center bottom / 100% 100% no-repeat;
    pointer-events: none;
    z-index: 1;
}

.ct-footer [data-row="middle"] .ct-container {
    position: relative;
    z-index: 2;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 2.15rem;
    align-items: start;
}

.ct-footer [data-row="middle"] [data-column^="widget-area"] {
    min-width: 0;
}

.ct-footer [data-row="middle"] .widget {
    color: #fff;
}

.ct-footer [data-row="middle"] a {
    color: #fff;
    text-decoration: none;
    transition: opacity 0.2s;
}

.ct-footer [data-row="middle"] a:hover {
    opacity: 0.8;
}

.ct-footer [data-row="middle"] .widget-title,
.ct-footer [data-row="middle"] h2,
.ct-footer [data-row="middle"] h3 {
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 0.95rem;
    margin-top: 0;
    color: #fff;
    font-size: 1.3rem;
    letter-spacing: 0.35px;
}

.ct-footer [data-row="middle"] h4 {
    margin: 0.25rem 0 0.3rem;
    color: #fff;
    font-size: 0.76rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.45px;
}

.ct-footer [data-row="middle"] p {
    color: #fff;
    margin: 0 0 0.5rem;
}

.ct-footer [data-row="middle"] ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.ct-footer [data-row="middle"] ul li {
    color: #fff;
    margin-bottom: 0.75rem;
    line-height: 1.6;
}

.ct-footer [data-row="middle"] ul li:before {
    content: "→ ";
    margin-right: 0.5rem;
}

.ct-footer [data-row="middle"] .social-icons {
    display: flex;
    gap: 1rem;
    margin-top: 1rem;
}

.ct-footer [data-row="middle"] .social-icons a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    color: #fff;
    font-size: 1.25rem;
    transition: all 0.3s ease;
}

.ct-footer [data-row="middle"] .social-icons a:hover {
    background: rgba(255, 255, 255, 0.3);
    transform: translateY(-2px);
}

.ct-footer [data-row="middle"] .social-icons svg,
.ct-footer [data-row="middle"] .social-icons i {
    width: 20px;
    height: 20px;
}

.ct-footer [data-row="middle"] [data-column="widget-area-2"] p:last-child a {
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.45px;
}

.ct-footer [data-row="bottom"] {
    position: relative;
    z-index: 3;
    background: #0b5ea8 !important;
    color: rgba(255, 255, 255, 0.88);
    text-align: center;
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.55px;
}

.ct-footer [data-row="bottom"] .ct-container {
    justify-content: start;
}

.ct-footer [data-row="bottom"] a {
    color: rgba(255, 255, 255, 0.88);
    text-decoration: none;
}

.ct-footer [data-row="bottom"] a:hover {
    text-decoration: underline;
}

.ct-footer .ct-footer-copyright {
    color: rgba(255, 255, 255, 0.88);
    width: 100%;
    text-align: center;
}

@media (max-width: 900px) {
    .ct-footer [data-row="middle"] .ct-container {
        grid-template-columns: 1fr 1fr !important;
        gap: 1.9rem;
    }

    .ct-footer [data-row="middle"] [data-column="widget-area-2"] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 768px) {
    .ct-footer [data-row="middle"] .ct-container {
        grid-template-columns: 1fr !important;
        gap: 1.45rem;
    }

    .ct-footer [data-row="middle"] [data-column="widget-area-2"] {
        grid-column: auto;
    }

    .ct-footer [data-row="middle"] {
        padding: 1.95rem 0 2rem;
    }
}

/* ============================================
   General Utilities
   ============================================ */
.has-bp-blue-background-color {
    background-color: #0077c0 !important;
}

.text-uppercase {
    text-transform: uppercase;
}

.wp-block-button__link.wp-element-button {
    border-radius: 20px !important;
}