/* Add this line if WooCommerce is used on this site */
/* @import "woo-style.css"; */
@import "imt-css/new-style.css";

/* Child theme fonts */
:root {
    --font-family--default: 'novel-sans-pro';
    --font-family--h--1: 'novel-pro';
    --font-family--h--2: var(--font-family--h--1);
    --font-family--h--3: var(--font-family--h--1);
    --font-family--h--4: var(--font-family--h--1);
    --font-family--h--5: var(--font-family--h--1);
    --font-family--h--6: var(--font-family--h--1);
    --font-family--h--2--footer: var(--font-family--h--1);
    --font-family--h--3--footer: var(--font-family--h--1);
    --font-family--h--4--footer: var(--font-family--h--1);
    --font-family--main-navigation: var(--font-family--default);
    --font-family--dropdown: var(--font-family--default);
    --font-family--megamenu--heading: var(--font-family--h--1);
    --font-family--gallery--caption: var(--font-family--default);
    --font-family--collapsible: var(--font-family--default);
    --font-family--tab: var(--font-family--default);
    --font-family--button: var(--font-family--default);
    --font-family--h--sub-heading--0: var(--font-family--h--1);
    --font-family--h--lead-text--0: var(--font-family--default);
}

/* ---------------------------- CUSTOMIZABLE IMPROVEMENTS ---------------------------- */
@media only screen and (max-width: 1280px) {

    /* position btn 2 for mobile */
    .imt-btn-2 {
        margin-top: calc(var(--wp--custom--imt--spacer) * 1) !important;
    }

    /* remove megamenu padding on mobile */
    nav.imt-main-nav>div ul>li .submenu {
        padding: 0 !important;
    }

    /* IMPORTANT TODO: review usage and fixes for child starter */
    nav.imt-main-nav>div ul:not(.submenu)>li>a.imt-current-menu-item {
        color: var(--wp--custom--imt--global--main-navigation--link--top-level--active--mobile--color) !important;
    }

    /* swap gradient sooner for wider text */
    .imt-section:has(.imt-hero-default) .imt-section__background {
        background: var(--wp--custom--imt--global--section--hero--style--default--background--mobile--color) !important;
    }

    /* wrap the process cards because of font wrapping */
    .imt-section .imt-card-group.imt-process-cards.imt-cards-per-row-4>.acf-innerblocks-container .imt-card {
        width: calc((100% - var(--wp--custom--imt--card-group--style--2--gutter--column--default) * 1) / 2) !important;
    }
}

@media only screen and (min-width: 1281px) {

    /* increase the left right padding for full width sections, but not the hero */
    .imt-section:has(.imt-content.imt-content-width-full):not(:has(.imt-hero-default), .imt-section-padding-right-0, .imt-section-padding-left-0) {
        padding-left: calc(var(--wp--custom--imt--spacer) * 6);
        padding-right: calc(var(--wp--custom--imt--spacer) * 6);
    }

    /* position btn 2 styles for desktop */
    .imt-btn-2 {
        margin-left: calc(var(--wp--custom--imt--spacer) * 1) !important;
    }

    /* position and split columns */
    #main-navigation-ul>li.menu-item.imt-link-level-1.imt-pointer-events-none.megamenu.has-children>ul>div>li:nth-child(1)>ul {
        display: flex !important;
        flex-wrap: wrap;
    }

    #main-navigation-ul>li.menu-item.imt-link-level-1.imt-pointer-events-none.megamenu.has-children>ul>div>li:nth-child(1)>ul>li {
        flex: 50%;
    }

    #main-navigation-ul>li.menu-item.imt-link-level-1.imt-pointer-events-none.megamenu.has-children>ul>div>li:nth-child(1) {
        flex-grow: 2;
        flex-basis: 50%;
    }

    #main-navigation-ul>li.menu-item.imt-link-level-1.imt-pointer-events-none.megamenu.has-children>ul>div>li:nth-child(2) {
        flex-grow: 1;
        flex-basis: 25%;
    }

    /* position and display icons, add .imt-mm-icon and your assigned unique icon to each main navigation link in the site backend */
    .imt-mm-icon a {
        position: relative;
        padding: 16px 0 24px 16px !important;
    }

    /* RESIDENTIAL - Design-Build */
    .imt-mm-icon-r-db a::before {
        background: url('/wp-content/uploads/2026/01/Res-DesignBuild.png');
    }

    /* RESIDENTIAL - Landscape Construction */
    .imt-mm-icon-r-con a::before {
        background: url('/wp-content/uploads/2026/01/Res-LandscapeConstruction.png');
    }

    /* RESIDENTIAL - Landscape Installation */
    .imt-mm-icon-r-ins a::before {
        background: url('/wp-content/uploads/2026/01/Res-LandscapeInstallation.png');
    }

    /* RESIDENTIAL - Outdoor Living Spaces */
    .imt-mm-icon-r-liv a::before {
        background: url('/wp-content/uploads/2026/01/Res-OutdoorLiving.png');
    }

    /* RESIDENTIAL - Pools */
    .imt-mm-icon-r-pls a::before {
        background: url('/wp-content/uploads/2026/01/Res-Pools.png');
    }

    /* RESIDENTIAL - Outdoor Houses & Cabanas */
    .imt-mm-icon-r-hou a::before {
        background: url('/wp-content/uploads/2026/01/Res-OutdoorHouses.png');
    }

    /* RESIDENTIAL - Urban Living */
    .imt-mm-icon-r-urb a::before {
        background: url('/wp-content/uploads/2026/01/Res-UrbanLiving.png');
    }

    /* COMMERCIAL - Design-Build */
    .imt-mm-icon-c-db a::before {
        background: url('/wp-content/uploads/2026/01/Com-DesignBuild.png');
    }

    /* COMMERCIAL - Landscape Construction */
    .imt-mm-icon-c-con a::before {
        background: url('/wp-content/uploads/2026/01/Com-LandscapeConstruction.png');
    }

    .imt-mm-icon a::before {
        content: '';
        position: absolute;
        top: 0px;
        left: -48px;
        background-position: center;
        background-repeat: no-repeat;
        background-size: 48px 48px;
        width: 56px;
        height: 56px;
    }

    /* on desktop, for non-footer buttons, add the icon on hover */
    /* will not affect form buttons */
    /* applies to main nav link-level-2 items */
    .imt-section:not(#imt-footer-wrapper) .imt-btn::after,
    .imt-link-level-2 .imt-menu-link::after {
        font-family: "Font Awesome 6 Pro";
        font-weight: 900;
        content: "\f178";
        /* long-arrow-alt-right */
        display: inline-block;
        width: 0;
        opacity: 0;
        margin-left: 0;
        transform: translateX(-10px);
        transition: var(--wp--custom--imt--hover-transition);
        flex-shrink: 0;
    }

    .imt-section:not(#imt-footer-wrapper) .imt-btn:hover::after,
    .imt-section:not(#imt-footer-wrapper) .imt-btn:focus::after,
    .imt-link-level-2 .imt-menu-link:hover::after {
        width: 18px;
        opacity: 1;
        margin-left: calc(var(--wp--custom--imt--spacer) * 0.75);
        transform: translateX(0);
    }

    /* increase the border width on hover */
    .imt-section:not(#imt-footer-wrapper) .imt-buttons .imt-btn:hover,
    .imt-section:not(#imt-footer-wrapper) .imt-buttons.imt-btn-size-sm .imt-btn:hover,
    .imt-section:not(#imt-footer-wrapper) .imt-buttons.imt-btn-size-lg .imt-btn:hover,
    .gform_wrapper.gravity-theme .button:is(input[type=submit]):hover {
        border-width: 0 0 0 4px !important;
    }

    /* adjust span color for menu on scroll + btns */
    #imt-header:not(.imt-header-sm) li:not(.imt-btn-1) .imt-current-menu-item span::after {
        background-color: var(--wp--custom--imt--color--palette--background--primary--100);
    }

    /* add transition for link on hover */
    #imt-header li,
    #imt-header li a {
        transition: var(--wp--custom--imt--hover-transition);
    }
}

@media only screen and (min-width: 800px) {

    /* styles for testimonials layout */
    .imt-testimonial .imt-slide .acf-innerblocks-container {
        display: grid !important;
        grid-template-columns: 1fr 3fr;
        column-gap: calc(var(--wp--custom--imt--spacer) * 2);
    }

    .imt-testimonial .imt-slide .acf-innerblocks-container .imt-heading {
        grid-column: 1;
        grid-row: 1 / span 2;
    }
}

/* styles for why choose card group, assume card group style 2 */
.imt-card-style-2 .imt-card .acf-innerblocks-container {
    display: grid !important;
    grid-template-columns: 1fr 3fr;
}

.imt-card-style-2 .imt-card .acf-innerblocks-container .imt-img-container {
    grid-row: 1 / span 2;
}

/* add text formatting trial */
.imt-paragraphs {
    text-wrap: pretty;
}

.imt-hero .imt-heading,
.imt-hero .imt-lead-text--0 {
    text-wrap: balance;
}

/* across all heroes and callouts, remove the bottom padding */
.imt-section:has(.imt-hero-default),
.imt-section:has(.imt-hero-default) .imt-content,
.imt-section:has(.imt-callout-default),
.imt-section:has(.imt-callout-default) .imt-content {
    padding-bottom: 0;
}

/* in the default callout, remove the top padding and remove the min-height setting */
.imt-section:has(.imt-callout-default) {
    min-height: 0;
}

.imt-section:has(.imt-callout-default),
.imt-section:has(.imt-callout-default) .imt-content {
    padding-top: 0;
}

/* fix hover color for callout and hero btns */
.imt-section:has(.imt-hero-default, .imt-callout-default, .imt-media-row) .imt-btn:hover::after {
    color: var(--wp--custom--imt--color--text--dark) !important;
}

/* adjust the primary and primary outline button border color, is hardcoded to color */
.imt-btn.imt-btn-primary {
    border-color: var(--wp--custom--imt--color--palette--background--primary--active);
}

.imt-btn.imt-btn-primary-outline {
    background: var(--wp--custom--imt--color--palette--background--accent--3--300);
}

.imt-btn.imt-btn-secondary {
    border-color: var(--wp--custom--imt--color--palette--background--secondary--active);
}

.imt-btn.imt-btn-accent-2 {
    border-color: var(--wp--custom--imt--color--palette--background--accent--2--active);
}

.imt-btn-2 a:hover span::after {
    background-color: var(--wp--custom--imt--color--palette--background--primary--active) !important;
}

.imt-btn-1:hover a.imt-current-menu-item span::after {
    background-color: var(--wp--custom--imt--color--palette--background--white) !important;
}

/* IMPORTANT TODO: fix application in child */
#imt-header .imt-btn-1 a {
    color: var(--wp--custom--imt--main-navigation--link-styles--1--color) !important;
}

.imt-collapsible {
    border-width: 0 0 0 2px !important;
    border-color: var(--wp--custom--imt--color--palette--background--accent--3--active) !important;
}

.imt-collapsible:has(button:hover) {
    border-color: var(--wp--custom--imt--color--palette--background--primary--active) !important;
}