/*
Theme Name:		 Homhero - Burleigh Child
Theme URI:		 https://homhero.com.au/
Description:     Miami Child is a child theme of Burleigh, created by Homhero
Author:			 HOMHERO
Author URI:		 https://homhero.com.au/
Template:		 homhero-burleigh
Version:		 1.0.3
Text Domain:     homhero-burleigh-child
*/

:root {
    /* Colors */
    --global--color-primary: var(--wp--preset--color--sage);
    --global--color-primary-hover: #3d2d25;
    --global--color-secondary: var(--wp--preset--color--forest);
    --global--color-secondary-hover: #3d2d25;
    --global--color-tertiary: var(--wp--preset--color--dark-green);
    --global--color-tertiary-hover: #3d2d25;
    --text-color: #4a4a4a;
    --heading-color: #3a3a3a;
    --entry-header--color: var(--heading-color);

    /* Global Variables */
    --global--border-radius: 4px;
    --global--box-shadow: 0 2px 4px rgba(0,0,0,0.15);
    --global--box-shadow-hover: 0 2px 8px rgba(0,0,0,0.15);

    /* Font Family */
    --global--font-primary: "Marcellus", "Cinzel", serif;
    --global--font-secondary: "Martel Sans", "Helvetica Neue", sans-serif;

    /* Font Size */
    --global--font-size-base: 1rem;
    --global--font-size-xs: 1rem;
    --global--font-size-sm: 1.125rem;
    --global--font-size-md: 1.25rem;
    --global--font-size-lg: 1.5rem;
    --global--font-size-xl: 2rem;
    --global--font-size-xxl: 3rem;
    --global--font-size-xxxl: 4rem;
    --global--font-size-page-title: var(--global--font-size-xl);
    --global--letter-spacing: normal;

    --heading--font-size-h6: var(--global--font-size-xs);
    --heading--font-size-h5: var(--global--font-size-sm);
    --heading--font-size-h4: var(--global--font-size-lg);
    --heading--font-size-h3: calc(1.25 * var(--global--font-size-lg));
    --heading--font-size-h2: var(--global--font-size-lg);
    --heading--font-size-h1: var(--global--font-size-page-title);

    --heading--font-weight-page-title: 400;

    --heading--font-weight: 400;
    --heading--font-weight-strong: 400;

    /* Logo */

    --branding--logo--max-width: 300px;
    --branding--logo--max-height: 50px;
    --branding--logo--max-width-mobile: 200px;
    --branding--logo--max-height-mobile: 70px;

    /* Primary Menu */

    --primary-nav--font-size: 0.889em;
    --primary-nav--font-size-mobile: 0.778em;
    --primary-nav--font-size-sub-menu: 0.889em;
    --primary-nav--font-weight: 600;
    --primary-nav--color-link:var(--wp--preset--color--sage);
    --primary-nav--color-link-hover:var(--wp--preset--color--forest);

    /* Buttons */

    --button--border-width: 2px;
    --button--border-radius: var(--global--border-radius); 
    /* Footer */

    --footer--color-link: #f4f0ec; 
    --nav-background-colour: #fff;
} 

/**
 * Root Media Query Variables
 */

@media only screen and (min-width: 822px) {

    :root {
        --responsive--aligndefault-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 1240px);
        --responsive--alignwide-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 1600px);
    }
}

/* Child Styles */

h1,
h2,
h3,
h4,
h5,
h6 {
    margin-bottom: 1em;
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4 {
    color: var(--wp--preset--color--forest);
}

.featuredListingHero > .overlay-text,
.featuredListingHero > .overlay-text::before {
    background-color:#fafafa;
}

.home.no-widgets .site-footer {
    margin-top: 0;
}

.home #content {
    margin-bottom:0;
}

.primary-navigation > div > .menu-wrapper > li > .sub-menu:after {
    border-color: var(--nav-background-colour) transparent;
}

.primary-navigation > div > .menu-wrapper > li > .sub-menu li {
    background: var(--nav-background-colour);
    box-shadow: 0 3px 8px rgba(0,0,0,0.2);
}

@media only screen and (min-width: 482px) {

    .primary-navigation > div > .menu-wrapper > li > .sub-menu {
        padding-top:1px;
        border:1px solid var(--nav-background-colour);
    }

    .primary-navigation > div > .menu-wrapper > li > .sub-menu:before,
    .primary-navigation > div > .menu-wrapper > li > .sub-menu:after {
        border-color: #fff transparent;
    }
}

.primary-navigation > div > .menu-wrapper > li > .sub-menu li:hover a {
    background-color: var(--wp--preset--color--forest);
    color:#fff;
    text-decoration:none;
}

.wpcf7 label {
    width:100%;
}