/*
Theme Name: MyChild
Theme URI: 
Author: Jon Olsson
Author URI: https://jonolsson.se
Description: A FSE theme for MyChild.
Requires at least: 5.8
Tested up to: 5.9
Requires PHP: 5.7
Version: 0.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: frost
Text Domain: MyChild
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, rtl-language-support, theme-options, threaded-comments, translation-ready, wide-blocks
*/

/* Main Layout
--------------------------------------------- */

/* Remove default BlockGap */
.entry-content > .wp-block-cover, .entry-content > .wp-block-group {
    margin-top: 0px !important;
}

.entry-content > .wp-block-cover {
    min-height: 600px !important;
    /*padding-top: 70px !important; */
    padding-top: 50px !important;
}

@media only screen and (max-width: 800px) {
    .entry-content > .wp-block-cover {
        min-height: 600px !important;
        padding-top: 200px !important;
    }
}

/* Height classes
--------------------------------------------- */

.mychild-height-200 {
    min-height: 200px !important;
}

.mychild-height-250 {
    min-height: 250px !important;
}

.mychild-height-300 {
    min-height: 300px !important;
}

.mychild-height-350 {
    min-height: 350px !important;
}

.mychild-height-400 {
    min-height: 400px !important;
}

.mychild-height-500 {
    min-height: 500px !important;
}

.mychild-height-600 {
    min-height: 500px !important;
}


/* CTA Design
--------------------------------------------- */

.mychild-text-shadow {
    text-shadow: 2px 2px 5px #000000;
}

.mychild-box-shadow {
    box-shadow: 2px 2px 5px #e1e1e1;
}

.mychild-box-shadow-dark {
    box-shadow: 2px 2px 5px #2F3C40;
}

.wp-block-image.mychild-filter-black, .wp-block-image.mychild-filter-black-light {
    background-color: #2F3C40;
    border-radius: 5px;
}

.wp-block-image.mychild-filter-black img {
    opacity: 0.7;
}

.wp-block-image.mychild-filter-black-light img {
    opacity: 0.9;
}

/* Puffar
--------------------------------------------- */

.wp-block-columns.mychild-puffar .wp-block-column a:hover {
    opacity: 0.8;
}


/* Navigation Menu
--------------------------------------------- */

@media only screen and (min-width: 100px) {
    /* Use this instead to remove scrolling opacity on navigation menu

    .wp-site-blocks .site-header {
        position: sticky;
        top: 0px;
        left: 0px;
        right: 0px;
        background: white;
        z-index: 99;
    }
    */

    /* Header group row: middle or bottom : set in header template*/

    .home .site-header {
        /* background-color: var(--wp--preset--color--base); 
        opacity: 0.6; */
        background-color: #D4D6DEaa;
    }

    .site-header {
        /* background-color:var(--wp--preset--color--neutral); */
        background-color: #D4D6DEaa;
        opacity: 1;
        left: 0;
        position: fixed;
        width: 100%;
        z-index: 999;
    }

    .site-header .wp-block-navigation a, .site-header .wp-block-search {
        padding: 7px 8px 7px 8px !important;
    }

   .site-header.scroll {
        background-color: var(--wp--preset--color--neutral); 
        opacity: 1;
    }

    .site-header.scroll .wp-block-site-logo img {
        max-width: 60%;
    }

    .site-header.scroll,
    .site-header.scroll .wp-block-site-logo img {
        -webkit-transition: all 0.5s ease-in-out;
        -moz-transition: all 0.5s ease-in-out;
        -ms-transition: all 0.5s ease-in-out;
        -o-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
    }

    /* Shrink padding when scrolling */
    .site-header.scroll .wp-block-navigation a, .site-header.scroll .wp-block-search {
        padding: 10px 8px 10px 8px;
    }

    .site-header.scroll .wp-block-navigation__submenu-icon {
        padding-bottom: 10px !important; 
    }
}


@media only screen and (min-width: 100px) {
    .wp-block-search__input {
        padding: 0px 12px !important;
    }

    /* Version 1 - bg 
    .wp-block-navigation .wp-block-navigation-item:not(.has-child) a:hover,
    .wp-block-navigation .current-menu-item a {
        border-radius: 5px 5px 0px 0px;
        color: var(--wp--preset--color--primary) !important;
        background: var(--wp--preset--color--contrast) !important;
    }

    .wp-block-navigation .wp-block-navigation-item a:hover {
        border-radius: 5px 5px 0px 0px;
        color: var(--wp--preset--color--primary) !important;
        background: var(--wp--preset--color--neutral) !important;
    }

    .wp-block-navigation a {
        padding: 10px 8px 10px 8px;
        border-bottom: 2px solid transparent;
    }

    .wp-block-search {
        padding: 10px 8px 10px 8px !important; 
    }
    
    .wp-block-navigation__submenu-icon {
        padding-bottom: 10px !important; 
    }
    */

    /* Version 2 - underline */


    .wp-block-navigation {
        font-size: 22px;
    }
    .wp-block-navigation .wp-block-navigation-item:not(.has-child) a:hover,
    .wp-block-navigation .current-menu-item a {
        color: var(--wp--preset--color--contrast) !important;
        /* color: #D4D6DE !important; */
        /*font-weight: bold !important;*/
        /* background: var(--wp--preset--color--neutral) !important; */
        /* background: #D4D6DE33 !important; */
        border-color: var(--wp--preset--color--contrast);
        border-bottom: 2px solid;
    }
    .wp-block-navigation .wp-block-navigation-item a:hover {
        color: var(--wp--preset--color--contrast) !important;
        /* background: var(--wp--preset--color--neutral) !important; */
        border-color: var(--wp--preset--color--contrast);
        border-bottom: 2px solid transparent;
    }

    .wp-block-navigation a {
        color: var(--wp--preset--color--contrast) !important;
        padding: 20px 5px 20px 5px !important;
        border-bottom: 2px solid transparent;
    }

    .site-header .wp-block-button a {
        color: var(--wp--preset--color--contrast) !important;
        padding: 3px 5px 3px 5px !important;
        border-color: var(--wp--preset--color--contrast) !important;
        border-width: 1px !important;
        border-radius: 10px !important;
        white-space: nowrap;
    }

    .wp-block-search {
        padding: 20px 5px 20px 5px !important; 
    }
    
    .wp-block-navigation__submenu-icon {
        padding-bottom: 15px !important; 
    }
    

    /* Design current page for submenu items */
    .wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container {
        background-color: var(--wp--preset--color--contrast) !important;
        color: var(--wp--preset--color--base) !important;
        padding: 0px !important;
    }

    .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item a:hover,
    .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item a {
        color: var(--wp--preset--color--contrast) !important;
        background: var(--wp--preset--color--neutral) !important;
        font-size: 18px; /* storlek undermeny */
        padding: 5px 10px !important;
        border: 0px;
    }

    .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item a:hover {
        background: var(--wp--preset--color--neutral) !important;
        opacity: 0.9;
        border: 0px;
    }

    .wp-block-navigation .wp-block-navigation__submenu-container a:hover,
    .wp-block-navigation .wp-block-navigation__submenu-container .current-menu-item a {
        font-weight: bold !important;
        color: var(--wp--preset--color--contrast) !important;
    }
    
}

/* Mobile Navigation
--------------------------------------------- */
@media only screen and (max-width: 800px) {
    .home .site-header:has(.is-menu-open) {
        /* background-color: var(--wp--preset--color--base); 
        opacity: 1; */
        background-color: #D4D6DEaa;
    }

    .wp-block-site-logo img {
        height: auto;
        padding: 10px !important;
    }

    .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open {
        background-color:  #D4D6DEaa  !important;
        color: var(--wp--preset--color--contrast);
        padding: 40px 20px !important;
        font-size: var(--wp--preset--font-size--medium);
        font-weight: 600;
    }
    
    .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
        background-color: var(--wp--preset--color--neutral) !important;
        padding: 20px !important;
        border-radius: 10px;
    }

    .wp-block-navigation__responsive-container-open {
        color: var(--wp--preset--color--contrast) !important;
        background-color: var(--wp--preset--color--base);
    }

    .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container ul {
        gap: 5px !important;
    }

    .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container a {
        color: var(--wp--preset--color--contrast) !important;
       /* background-color: var(--wp--preset--color--neutral) !important;*/
        font-size: var(--wp--preset--font-size--medium);
        padding: 0px !important;
    }

    .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container .current-menu-item a {
        color: var(--wp--preset--color--contrast) !important;
       /* background-color: var(--wp--preset--color--neutral) !important;*/
    }

    /* Design current page for submenu items */
    .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container .wp-block-navigation__submenu-container {
        background-color: var(--wp--preset--color--neutral) !important;
        padding: 5px 10px !important;
    }

    .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container .wp-block-navigation__submenu-container a {
        color: var(--wp--preset--color--contrast) !important;
       /* background-color: var(--wp--preset--color--neutral) !important;*/
        font-size: var(--wp--preset--font-size--small);
        padding: 0px !important;
    }

    .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container .wp-block-navigation__submenu-container .current-menu-item a {
        color: var(--wp--preset--color--contrast) !important;
       /* background-color: var(--wp--preset--color--neutral) !important; */
    }
    
    .wp-block-navigation__responsive-container-close {
        top: 10px;
        right: 10px;
    }

    .site-header.scroll .wp-block-search {
        display: none; 
    }
}

/* Query Loop
--------------------------------------------- */

.wp-block-query .wp-block-group {
    overflow: hidden;
}

/* ALigning different kind of query boxes in height */
.mychild-height {
    height: 400px;
}

.mychild-featureImg-height {
    min-height: 400px;
}

@media only screen and (max-width: 800px) {
    .mychild-featureImg-height {
       min-height: 200px;
    }
}

/* Links
--------------------------------------------- */
/*
a {
    text-decoration: none;
}

.mychild-link-white a, .conexus-link-white a:visited {
    color:#fff !important;
}

.mychild-link-white a:hover {
    color:#c1c1c1 !important;
}
*/

/* Extras
--------------------------------------------- */

@media (max-width: 800px) {
    .mychild-reverse-mobile {
        flex-direction: column-reverse;
    }
}

.wp-block-group.mychild-CTA {
    overflow: hidden;
}

.mychild-image-width {
    width: 150px;
}

/* Zeroing the media-text block */
.wp-block-media-text .wp-block-media-text__content {
    padding: 0;
}

.wp-block-group li:nth-child(2n+1) .mychild-profil {
    background-color: #fff !important;
    border-style: solid !important;
    border-width: 1px !important;
    border-color: #ddd !important;
    border-radius: 10px !important;
}
/* Sticky "begär offert" att fastna under headern vid scroll */
.stickyoffert {
    top: calc(119px + var(--wp-admin--admin-bar--position-offset, 0px));
    position: sticky;
    z-index: 50000;
}
@media (max-width: 800px) {
    .stickyoffert {
        top: calc(75px + var(--wp-admin--admin-bar--position-offset, 0px));
        position: sticky;
        z-index: 50000;
    }
}
/*
#Kontakt {
    padding-top: 140px;
    margin-top: -140px;
    
  }
*/
#ytskikt, #fasadrenovering, #plat-tak, #entreprenad, #ramavtal, #offert, #kontakt {
    padding-top: 145px;
    margin-top: -145px;
    
  }
#alla  {
    padding-top: 195px;
    margin-top: -195px;
    
  }

/* Styling på sidan för lösenordsinmatning, lösenordsskyddad sida */

.protected-post-form {
    padding-top: 200px !important;
    padding-bottom: 10px !important;

}
.protected-post-form-p {
    padding-bottom: 50px;
}

.post-password-form {
    padding-top: 230px !important;
    padding-bottom: 10px !important;

}

/* Make categories links inactive */
.mychild-disable-link a{
    pointer-events: none;
    cursor: default;
}