/*======================================
Theme Name: Banana Ball
Theme URI: https://myproejctsolution.net/
Description: Custom Divi child theme for Fan's First Entertainment.
Version: 1.2
Author: My Project Solution
Author URI: http://myprojectsolution.net
Template: Divi
======================================*/


/* You can add your own CSS styles here. Use !important to overwrite styles if needed. */

h1, h2, h3, h4 {
    font-family: 'Bebas Neue', sans-serif;
}

/* Force Twitter icon to X icon */
.et-social-twitter a.icon:before {
	content: "e61b";
	font-family: "Font Awesome 6 Brands" !important;
}


/* Custom Header CSS */
.fa-location-dot {
	color: var(--accent, #EDA804);
	text-align: right;
	font-family: Font Awesome 6 Free;
	font-size: 36px;
	font-style: normal;
	font-weight: 900;
	line-height: normal;
	letter-spacing: -0.9px;
	text-transform: uppercase;
}

.header-phone {
	color: var(--blue, #172651);
	text-align: right;
	font-family: 'Bebas Neue', sans-serif;
	font-size: 40px;
	font-style: normal;
	font-weight: 800;
	line-height: 83.5%; /* 33.4px */
	letter-spacing: 0.8px;
	text-transform: uppercase;
}

/* Mobile Header icons */
.header-icons {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 100%;
  }
.header-logos {
    display: flex;
    align-items: center;
    gap: 2rem;
    margin-right: 3rem;
}
.header-contact {
    display: flex;
    align-items: center;
    gap: 1rem;
}
.header-phone {
    padding: 0;
}

/* ---- Responsive images (keep Unsplash links, just scale on screen) ---- */
#page-container {
    overflow-x: hidden;
}

.et_pb_image_wrap img,
.et_pb_image_container img,
.entry-featured-image-url img,
.et_pb_post img,
img.bb-slider__image {
    max-width: 100%;
    height: auto;
}

/* ---- Mobile typography & layout ---- */
@media only screen and (max-width: 980px) {
    body,
    .et_pb_text,
    .et_pb_blurb p,
    .bb-section__description,
    .bb-section__description p,
    .et_pb_post p {
        font-size: 16px !important;
        line-height: 1.55 !important;
        letter-spacing: normal !important;
        word-spacing: normal !important;
        white-space: normal !important;
    }

    /* Hub ticket/schedule/rules cards were crushed at 48% width */
    .mob-2-row {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 24px !important;
    }

    .mob-2-row .et_pb_column {
        max-width: 100% !important;
        width: 100% !important;
        margin-bottom: 8px !important;
    }

    .mob-2-row .et_pb_blurb_container h4 {
        font-size: 22px !important;
        line-height: 1.2 !important;
        margin-bottom: 8px !important;
    }

    .mob-2-row .et_pb_blurb_container p {
        padding: 0 12px !important;
    }

    .et_pb_image_0_tb_header .et_pb_image_wrap img {
        height: auto !important;
        max-height: 56px !important;
        width: auto !important;
    }

    .et_pb_icon_0_tb_footer .et_pb_icon_wrap .et-pb-icon,
    .et_pb_icon_1_tb_footer .et_pb_icon_wrap .et-pb-icon,
    .et_pb_icon_2_tb_footer .et_pb_icon_wrap .et-pb-icon,
    .et_pb_icon_3_tb_footer .et_pb_icon_wrap .et-pb-icon {
        font-size: 48px !important;
    }

    /* Teams page only — don't squash rules-page cards */
    .page-id-169 [class*="dipi_hover_box"] .dipi-hover-box-content,
    .page-id-169 [class*="dipi_hover_box"] .dipi-hover-box-hover,
    .page-id-169 [class*="dipi_hover_box"] .dipi-hover-box-container {
        min-height: 260px !important;
        height: 260px !important;
    }

    .page-id-169 [class*="dipi_hover_box"] .dipi-hover-box-heading {
        font-size: 34px !important;
        line-height: 1.15 !important;
        letter-spacing: 1px !important;
    }

    /* Rules page: keep flip cards tall and readable */
    .page-id-92856 [class*="dipi_hover_box"] .dipi-hover-box-content,
    .page-id-92856 [class*="dipi_hover_box"] .dipi-hover-box-hover,
    .page-id-92856 [class*="dipi_hover_box"] .dipi-hover-box-container {
        min-height: 320px !important;
        height: auto !important;
    }

    .page-id-92856 [class*="dipi_hover_box"] .dipi-hover-box-content .dipi-hover-box-heading {
        font-size: clamp(1.4rem, 5vw, 2.4rem) !important;
        line-height: 1.15 !important;
        letter-spacing: 1px !important;
        white-space: normal !important;
    }

    .page-id-92856 [class*="dipi_hover_box"] .dipi-hover-box-hover .dipi-desc {
        font-size: 16px !important;
        line-height: 1.45 !important;
        white-space: normal !important;
    }

    .bb-section__heading {
        line-height: 1.15 !important;
        letter-spacing: 2px !important;
    }

    .bb-marquee__item {
        white-space: nowrap;
        padding: 0 20px !important;
    }

    /* Mobile header: allow dropdown to extend below bar without stretching header */
    header.et-l--header {
        position: relative;
        z-index: 99999;
    }

    header.et-l--header .et_pb_section_1_tb_header,
    header.et-l--header .et_pb_row_1_tb_header,
    header.et-l--header .et_pb_menu_1_tb_header .et_pb_menu_inner_container,
    header.et-l--header .et_pb_menu_1_tb_header .et_pb_menu__wrap {
        overflow: visible !important;
    }

    .et_pb_menu_1_tb_header .et_pb_menu_inner_container {
        position: relative;
    }

    .et_pb_menu_1_tb_header .et_mobile_nav_menu {
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        z-index: 100002;
    }

    /* Full-width navy dropdown panel (matches original theme) */
    .et_pb_menu_1_tb_header .et_mobile_menu,
    .et_pb_menu_1_tb_header .et_mobile_menu ul {
        background-color: #1C2653 !important;
        border-top: 3px solid #FDCE07 !important;
        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18);
        list-style: none !important;
        margin: 0 !important;
        padding: 8px 0 !important;
    }

    .et_pb_menu_1_tb_header .et_mobile_menu {
        position: absolute;
        top: 100%;
        left: 50%;
        transform: translateX(-50%);
        width: 100vw;
        max-width: 100vw;
        margin-left: calc(-50vw + 50%) !important;
        margin-top: 4px;
        z-index: 100001;
    }

    .et_pb_menu_1_tb_header .et_mobile_menu li {
        display: block;
        width: 100%;
        margin: 0 !important;
        padding: 0 !important;
        border-bottom: 1px solid rgba(253, 206, 7, 0.15);
    }

    .et_pb_menu_1_tb_header .et_mobile_menu li:last-child {
        border-bottom: none;
    }

    .et_pb_menu_1_tb_header .et_mobile_menu li a {
        display: block;
        color: #FDCE07 !important;
        font-family: 'Bebas Neue', sans-serif;
        font-size: 22px !important;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 2px;
        line-height: 1.3 !important;
        padding: 14px 24px !important;
        text-align: center;
        white-space: normal !important;
    }

    .et_pb_menu_1_tb_header .et_mobile_menu li.current-menu-item a,
    .et_pb_menu_1_tb_header .et_mobile_menu li.current_page_item a {
        color: #FFFFFF !important;
    }

    /* Tablet/desktop header menu dropdown */
    .et_pb_menu_0_tb_header .et_mobile_menu,
    .et_pb_menu_0_tb_header .et_mobile_menu ul {
        background-color: #FFFFFF !important;
        border-top: 3px solid #fecf08 !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    }

    .et_pb_menu_0_tb_header .et_mobile_menu li a {
        color: #000000 !important;
        font-family: 'Bebas Neue', sans-serif;
        font-size: 20px !important;
        text-transform: uppercase;
        letter-spacing: 2px;
        padding: 12px 20px !important;
        text-align: center;
    }

    .et_pb_menu .et_mobile_menu {
        position: absolute;
        z-index: 100000;
    }

    .et_mobile_nav_menu {
        display: block !important;
        position: relative;
        z-index: 100001;
    }

    .mobile_menu_bar,
    .mobile_nav {
        cursor: pointer;
        pointer-events: auto !important;
        position: relative;
        z-index: 100002;
        -webkit-tap-highlight-color: transparent;
    }

    .et_pb_menu .et_mobile_menu li a {
        display: block;
        line-height: 1.4 !important;
        white-space: normal !important;
    }
}

@media only screen and (max-width: 767px) {
    .et_pb_heading_0 .et_pb_heading_container h1,
    .et_pb_heading_0 .et_pb_heading_container h2 {
        font-size: clamp(2rem, 9vw, 3.2rem) !important;
        line-height: 1.15 !important;
        letter-spacing: 2px !important;
        padding: 0 12px;
    }

    .et_pb_image_1 .et_pb_image_wrap img,
    .et_pb_image_0 .et_pb_image_wrap img {
        max-width: 100% !important;
        width: 100% !important;
        height: auto !important;
    }
}