/*
Theme Name:   Astra Child - Goodman Orthodontics
Theme URI:    https://goodortho.com/
Description:  Custom Astra child theme for Goodman Orthodontics (goodortho.com) - Manhattan & Riverdale, NY.
Author:       OrthoMarketing.com
Author URI:   https://orthomarketing.com/
Template:     astra
Version:      1.0.0
Text Domain:  goodortho-child
*/

/* =====================================================
   BRAND COLOR VARIABLES
   Pulled from live site design (navy / teal / cream)
   Update hex values here if brand guide differs
===================================================== */
:root {
    --gd-navy: #1B4E70;         /* primary deep blue - header, hero, footer */
    --gd-navy-dark: #123A56;    /* darker navy for gradients / hover states */
    --gd-teal: #2AABC4;         /* "ortho" wordmark teal / accent */
    --gd-teal-dark: #1E8CA1;    /* teal hover state */
    --gd-cream: #F4E4D6;        /* warm section background (reviews, footer top) */
    --gd-white: #FFFFFF;
    --gd-text-dark: #1B2A33;
    --gd-star-gold: #F5B400;
}

/* =====================================================
   GLOBAL BRAND OVERRIDES
===================================================== */
body {
    color: var(--gd-text-dark);
}

a {
    color: var(--gd-teal);
}
a:hover {
    color: var(--gd-teal-dark);
}

/* Buttons - "Schedule a Consultation" style CTAs */
.ast-button,
button,
.wp-block-button__link,
input[type="submit"],
.elementor-button {
    background-color: var(--gd-navy) !important;
    border-color: var(--gd-navy) !important;
    color: var(--gd-white) !important;
    border-radius: 30px !important;
    transition: background-color .2s ease-in-out;
}
.ast-button:hover,
button:hover,
.wp-block-button__link:hover,
input[type="submit"]:hover,
.elementor-button:hover {
    background-color: var(--gd-teal-dark) !important;
    border-color: var(--gd-teal-dark) !important;
}

/* Secondary / outline CTA variant (e.g. "Read More", ghost buttons) */
.gd-btn-outline {
    background-color: transparent !important;
    border: 2px solid var(--gd-white) !important;
    color: var(--gd-white) !important;
}

/* Section background helpers, in case theme builder needs classes */
.gd-bg-navy {
    background-color: var(--gd-navy);
    color: var(--gd-white);
}
.gd-bg-cream {
    background-color: var(--gd-cream);
}

/* Star ratings */
.gd-stars,
.elementor-star-rating .elementor-star-full,
.elementor-star-rating .elementor-star-fill {
    color: var(--gd-star-gold);
}

/* =====================================================
   STICKY MOBILE CALL BAR
===================================================== */
.gd-sticky-call-bar {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    background-color: var(--gd-navy);
    box-shadow: 0 -2px 10px rgba(0,0,0,0.15);
}
.gd-sticky-call-bar .gd-call-bar-inner {
    display: flex;
    align-items: stretch;
}
.gd-sticky-call-bar a {
    flex: 1 1 50%;
    text-align: center;
    color: var(--gd-white);
    text-decoration: none;
    font-weight: 700;
    font-size: 15px;
    padding: 14px 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.gd-sticky-call-bar a.gd-call-new {
    background-color: var(--gd-teal);
}
.gd-sticky-call-bar a.gd-call-current {
    background-color: var(--gd-navy-dark);
    border-left: 1px solid rgba(255,255,255,.2);
}
.gd-sticky-call-bar svg {
    width: 16px;
    height: 16px;
    fill: currentColor;
    flex: none;
}

@media (max-width: 767px) {
    .gd-sticky-call-bar {
        display: block;
    }
    /* prevent Elementor "Chat with us" bubble and this bar from overlapping */
    body {
        padding-bottom: 54px;
    }
    .elementor-location-popup,
    .chat-widget-bubble {
        bottom: 60px !important;
    }
}

/* =====================================================
   HEADER SCROLL SHADOW STATE
   .gd-scrolled class toggled by scroll-shadow.js
===================================================== */
#masthead,
.site-header {
    transition: box-shadow .25s ease-in-out;
}
#masthead.gd-scrolled,
.site-header.gd-scrolled {
    box-shadow: 0 2px 12px rgba(0,0,0,0.12);
}

/* =====================================================
   GRAVITY FORMS BRAND STYLING
===================================================== */
.gform_wrapper .gfield_label {
    color: var(--gd-navy);
    font-weight: 600;
}
.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper textarea,
.gform_wrapper select {
    border: 1px solid #d5d5d5 !important;
    border-radius: 6px !important;
}
.gform_wrapper input[type="text"]:focus,
.gform_wrapper input[type="email"]:focus,
.gform_wrapper input[type="tel"]:focus,
.gform_wrapper textarea:focus {
    border-color: var(--gd-teal) !important;
    outline: none;
    box-shadow: 0 0 0 2px rgba(42,171,196,0.25);
}
.gform_wrapper .gform_footer input[type="submit"] {
    background-color: var(--gd-teal) !important;
    border-color: var(--gd-teal) !important;
}
.gform_wrapper .gform_footer input[type="submit"]:hover {
    background-color: var(--gd-teal-dark) !important;
}
.gform_confirmation_message {
    background-color: var(--gd-cream);
    border-left: 4px solid var(--gd-teal);
    padding: 16px 20px;
    border-radius: 6px;
}