/*
Theme Name: CaterMate Child
Theme URI: https://catermate.au
Description: Child theme for CaterMate. Holds the site's self-hosted brand fonts and all custom CSS so that updates to Hello Elementor never overwrite them.
Author: CaterMate
Template: hello-elementor
Version: 1.0.0
Text Domain: catermate-child
*/

/* ==========================================================================
   1. Brand fonts (self-hosted, no third-party requests)
   Oswald is a variable font, so one file covers weights 500-700.
   ========================================================================== */

@font-face {
    font-family: 'Oswald';
    font-style: normal;
    font-weight: 500 700;
    font-display: swap;
    src: url('fonts/oswald-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Oswald';
    font-style: normal;
    font-weight: 500 700;
    font-display: swap;
    src: url('fonts/oswald-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Barlow';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('fonts/barlow-400-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Barlow';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('fonts/barlow-400-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Barlow';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('fonts/barlow-500-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Barlow';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('fonts/barlow-500-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Barlow';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('fonts/barlow-600-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Barlow';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('fonts/barlow-600-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Barlow';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('fonts/barlow-700-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Barlow';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('fonts/barlow-700-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ==========================================================================
   2. Smooth scrolling for the one-page anchor navigation
   ========================================================================== */

html {
    scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}

/* ==========================================================================
   3. Header: tablet / mobile burger menu

   NOTE: Elementor's "stretch" script sets the dropdown panel's width and left
   offset inline, measured against the widget wrapper (core CSS makes every
   widget position:relative). Never set width/left/right on the dropdown here
   or the panel collapses to the width of the burger icon.
   ========================================================================== */

@media (max-width: 1024px) {
    /* Burger last in the row; space-between then centres the call button. */
    .site-header-in .elementor-widget-nav-menu {
        order: 3;
        width: auto;
        flex: 0 0 auto;
        align-self: stretch;
        margin-block-end: 0;
        /* v4 markup has no .elementor-widget-container child, so the flex
           centring lives on the widget itself. Do not set align-items here:
           it shrinks the dropdown's static box, which Elementor measures
           when stretching the panel. */
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .site-header-in .elementor-menu-toggle {
        justify-content: flex-end;
        background-color: transparent;
        padding: 4px 0;
    }

    /* Open the panel below the bar, clearing the header's padding and border. */
    .site-header nav.elementor-nav-menu__container.elementor-nav-menu--dropdown {
        top: calc(100% + var(--cm-menu-offset, 21px)) !important;
        margin-top: 0;
        border-block-end: 1px solid #E3E5E9;
    }
}

/* Narrow phones: trim the call button so logo, call and burger fit one row. */
@media (max-width: 480px) {
    .site-header-in .header-call {
        font-size: 12.5px;
        letter-spacing: 0.04em;
        padding: 10px 14px;
    }
}

/* ==========================================================================
   4. Gravity Forms: booking form in CaterMate red
   ========================================================================== */

#gform_wrapper_1.gform-theme,
#gform_wrapper_1[data-form-index="0"].gform-theme {
    --gf-color-primary: #C8202F;
    --gf-color-primary-rgb: 200, 32, 47;
    --gf-color-primary-contrast: #FFFFFF;
    --gf-color-primary-darker: #A31824;
    --gf-color-primary-lighter: #A31824;
    --gf-ctrl-btn-bg-color-primary: #C8202F;
    --gf-ctrl-btn-bg-color-hover-primary: #A31824;
    --gf-ctrl-btn-bg-color-focus-primary: #A31824;
    --gf-ctrl-btn-border-color-primary: #C8202F;
    --gf-ctrl-btn-border-color-hover-primary: #A31824;
    --gf-ctrl-btn-border-color-focus-primary: #A31824;
    --gf-ctrl-btn-color-primary: #FFFFFF;
    --gf-ctrl-btn-color-hover-primary: #FFFFFF;
    --gf-ctrl-btn-color-focus-primary: #FFFFFF;
    --gf-ctrl-btn-radius: 4px;
    --gf-local-radius: 4px;
}

#gform_wrapper_1 .gform_footer button.gform_button,
#gform_wrapper_1 .gform-footer button.gform_button,
#gform_wrapper_1 .gform_footer input[type="submit"],
#gform_wrapper_1 button#gform_submit_button_1 {
    background-color: #C8202F;
    border: 0;
    border-radius: 4px;
    color: #FFFFFF;
    font-family: 'Oswald', sans-serif;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 16px 28px;
    width: 100%;
    cursor: pointer;
    transition: background-color .2s ease;
}

#gform_wrapper_1 .gform_footer button.gform_button:hover,
#gform_wrapper_1 .gform-footer button.gform_button:hover,
#gform_wrapper_1 .gform_footer input[type="submit"]:hover,
#gform_wrapper_1 button#gform_submit_button_1:hover,
#gform_wrapper_1 .gform_footer button.gform_button:focus,
#gform_wrapper_1 .gform-footer button.gform_button:focus,
#gform_wrapper_1 button#gform_submit_button_1:focus {
    background-color: #A31824;
    color: #FFFFFF;
}

#gform_wrapper_1 button#gform_submit_button_1:focus-visible {
    outline: 2px solid #1C1F24;
    outline-offset: 2px;
}
