/*!
 * Bootscore custom styles
 */

// Add your own code here!
// Because this file is compiled after Bootstrap, you're also able to use Bootstrap mixins for better code.
// Some examples can be found here: https://bootscore.me/documentation/bootstrap-css-sass

/* NAVIGATION */
#nav-main {
    height: 70px;
    .container {
        width: 1320px;
    }
    .nav-link {
        text-transform: uppercase;
        font-size: 13px;
    }
}

/* Is required to show the svg logo */
.navbar-brand {
    width: 150px;
}


/* CUSTOM BLOCK MOBILE SUPPORT */
@include media-breakpoint-up(md) {
    body:not(.wp-admin) .wp-block-create-block-featured-image-block {
		.call-to-action {
            width: 350px;
			margin-right: 100px;
		}
	}

}



/* DEFAULT BLOCK OVERRIDES */
:root :where(p.has-background) {
    padding:.5em;
}

.wp-block-cover, .wp-block-cover-image {
    min-height: auto;
}
/* COVER control the spacing on the left and right */ 
.wp-block-cover.is-light {
    .has-text-align-left {
        margin-left: 0 !important;
    }
    .has-text-align-right {
        margin-right: 0 !important;
    }
}

@include media-breakpoint-up(md) {
    :root :where(p.has-background) {
        padding:1.25em 2.375em;
    }
}


/* HOMEPAGE SPECIFIC STYLING PER BLOCK */
/* Crane block */
.homepage-crane {
    .wp-block-cover__image-background {
        background-position: right 35% top 20% !important;
    }
}

.home {
    #content {
        padding-top: 0 !important;
    }
    .entry-header {
        display: none;
    }
}

.footer-crane {
    .wp-block-cover__image-background {
        background-position: 760% 20% !important;
        background-attachment: initial;
        background-repeat: no-repeat;
        background-size: auto;
    }
}

/* Footer */

#footer {
    .bootscore-footer-columns {
        // background-color: black;
        color: white;
        a {
            color: white;
        }
    }
}

/* Custom Style for core/cover block */
.is-style-fixed-height-272 {
    height: 272px;
}
.is-style-fixed-height-300 {
    height: 300px;
}
.is-style-fixed-height-400 {
    height: 400px;
}

// /* FIXME: merge buttons to be bootstrap by amending the classes here in core/button. Then update theme.json */
// .wp-block-button__link {
//     transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
//     &:hover {
//         color: #fff;
//         background-color: #c20512;
//         border-color: #b70511;    
//     }
// }

.is-style-bootstrap-primary > a,
.is-style-bootstrap-primary > div {
    @extend .btn;
    @extend .btn-primary;
    @extend .btn-lg;
}

.is-style-bootstrap-dark > a,
.is-style-bootstrap-dark > div {
    @extend .btn;
    @extend .btn-dark;
    @extend .btn-lg;
}

/* Page */
.featured-full-width-img {
    height: 400px;
}

#secondary {
    height: 100%;
}

#sidebar {
    position: sticky;
    a:not(.active) {
        color: black;
    }
    li {
        padding: 0.25rem 0;
    }
}