/*
 Theme Name:   Beverly Fertility
 Theme URI:    https://beverlyfertility.com
 Description:  A premium, bespoke theme crafted exclusively for Beverly Hills Fertility — delivering an elegant, patient-centered digital experience with refined typography, brand-consistent color systems, and seamless Elementor integration.
 Author:       BHF Design Team
 Author URI:   https://beverlyfertility.com
 Template:     be-happy
 Version:      1.0.0
 Tags:         fertility, medical, premium, elementor, responsive, custom
 Text Domain:  beverlyfertility
 License:      Proprietary
 License URI:  https://beverlyfertility.com
*/

/*
 * Beverly Fertility Theme
 * © 2025 Beverly Hills Fertility. All rights reserved.
 * Unauthorized reproduction or distribution is strictly prohibited.
 *
 * Built with care for every family's journey.
 */

/* ================================================
   Brand Color System
   ================================================ */

:root {
    /* Primary Brand Colors */
    --bhf-primary:        #92423F;  /* Deep Rose Red - buttons, headings, highlights */
    --bhf-primary-light:  #CD9290;  /* Soft Rose Pink - hover states, secondary elements */
    --bhf-primary-pale:   #F6CAC8;  /* Pale Blush - background sections */

    /* Dark Tones */
    --bhf-dark:           #182F47;  /* Deep Navy - navigation, footer background */
    --bhf-dark-2:         #1D2327;  /* Deep Black - secondary dark background */
    --bhf-dark-text:      #212529;  /* Charcoal - primary body text */
    --bhf-dark-3:         #2C3338;  /* Dark Gray - secondary dark tone */

    /* Neutral Tones */
    --bhf-gray:           #5E5E5E;  /* Mid Gray - body copy */
    --bhf-gray-dark:      #3E3E3E;  /* Dark Gray - headings */
    --bhf-gray-light:     #A8A8A8;  /* Light Gray - secondary text */
    --bhf-border:         #DFDFDF;  /* Border Color */

    /* Light Tones */
    --bhf-white:          #FFFFFF;
    --bhf-off-white:      #F6F7F8;  /* Off White - light background */
    --bhf-cream:          #FAFAFA;  /* Cream - subtle background */
}

/* ================================================
   Elementor Global Color Variables Override
   ================================================ */

:root {
    --e-global-color-primary:    #92423F !important;
    --e-global-color-secondary:  #182F47 !important;
    --e-global-color-text:       #212529 !important;
    --e-global-color-accent:     #CD9290 !important;
}

/* ================================================
   Be Happy Theme — 粉紅色覆蓋（強制）
   ================================================ */

/* 原主題用的粉紅色 #e91e8c / #f857a6 / #FF4778 全部換掉 */
*,
*::before,
*::after {
    --theme-color: #92423F;
}

/* ================================================
   Buttons — 全面覆蓋
   ================================================ */

.elementor-button.elementor-size-sm,
.elementor-button.elementor-size-md,
.elementor-button.elementor-size-lg,
.elementor-button.elementor-size-xl,
.elementor-button,
a.elementor-button,
button.elementor-button,
.btn,
.button,
a.grd-btn,
input[type="submit"],
button[type="submit"],
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
    background-color: #92423F !important;
    border-color: #92423F !important;
    color: #ffffff !important;
}

.elementor-button:hover,
a.elementor-button:hover,
.btn:hover,
.button:hover,
a.grd-btn:hover,
input[type="submit"]:hover,
button[type="submit"]:hover,
.wp-block-button__link:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover {
    background-color: #CD9290 !important;
    border-color: #CD9290 !important;
    color: #ffffff !important;
}

/* ================================================
   Links
   ================================================ */

a {
    color: #92423F !important;
}

a:hover {
    color: #CD9290 !important;
}

/* nav 連結不要強制變色（避免破版） */
nav a,
.elementor-nav-menu a,
.site-navigation a {
    color: inherit !important;
}

/* ================================================
   Headings
   ================================================ */

h1, h2, h3, h4, h5, h6,
.elementor-widget-heading .elementor-heading-title {
    color: #212529 !important;
}

/* accent 色標題（Features、About Us 等小標） */
.elementor-widget-heading .elementor-heading-title[style*="color"],
span[style*="color: rgb(233"],
span[style*="color:#e91"],
span[style*="color: #e91"],
span[style*="color:#f85"],
span[style*="color: #f85"] {
    color: #92423F !important;
}

/* ================================================
   Navigation / Header
   ================================================ */

.elementor-nav-menu,
header,
.site-header,
nav,
#masthead,
.navbar {
    background-color: #182F47 !important;
}

/* ================================================
   Footer
   ================================================ */

footer,
.site-footer,
#colophon {
    background-color: #182F47 !important;
    color: #ffffff !important;
}

/* ================================================
   Icon & SVG 顏色
   ================================================ */

.elementor-icon,
.elementor-icon i,
.elementor-icon svg {
    color: #92423F !important;
    fill: #92423F !important;
}

/* ================================================
   Section 背景色（淡粉 → 淡藍灰）
   ================================================ */

/* Be Happy 主題的淡粉紅背景 section */
section[style*="background-color: rgb(255, 235"],
section[style*="background-color: rgb(252, 228"],
.elementor-section[style*="background-color: rgb(255, 235"],
.elementor-section[style*="background-color: rgb(252, 228"] {
    background-color: #F6F7F8 !important;
}

/* ================================================
   WooCommerce
   ================================================ */

.woocommerce span.onsale,
.woocommerce .woocommerce-message,
.woocommerce .widget_price_filter .ui-slider .ui-slider-range {
    background-color: #92423F !important;
}

/* ================================================
   Map Floating Button (Homepage Only)
   ================================================ */

#bhf-map-btn {
    position: fixed;
    bottom: 90px;
    right: 30px;
    width: 60px;
    height: 60px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 9999;
    backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    transition: background 0.3s ease;
}

#bhf-map-btn:hover {
    background: rgba(255, 255, 255, 0.35);
}

#bhf-map-btn svg {
    width: 26px;
    height: 26px;
    color: #ffffff;
}

#bhf-map-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99999;
    align-items: flex-start;
    justify-content: center;
}

#bhf-map-container {
    position: relative;
    width: 100%;
    max-width: 900px;
    height: 320px;
    margin-top: 0;
    background: #fff;
}

#bhf-map-close {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 10;
    background: #333;
    color: #fff;
    border: none;
    padding: 6px 14px;
    cursor: pointer;
    font-size: 14px;
    border-radius: 4px;
}

#bhf-map-close:hover {
    background: #555;
}

/* ================================================
   Custom Styles — Add Below This Line
   ================================================ */