/*
Theme Name: Mitch Canter - 2025
Theme URI: https://mitchcanter.me
Description: Mitch's Custom Child Theme of Ollie.
Author: Mitch Canter
Author URI: https://mitchcanter.me
Template: ollie
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: blog, portfolio, entertainment, grid-layout, one-column, two-columns, three-columns, four-columns, block-patterns, block-styles, custom-logo, custom-menu, editor-style, featured-images, full-site-editing, full-width-template, rtl-language-support, style-variations, template-editing, theme-options, translation-ready, wide-blocks
Text Domain: ollie-child
*/


/* Mitch's Additions
---------------------------------------------------------------------------- */

*{
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Helper Classes */
.is-fixed-desktop{
	position: fixed !important;
	z-index: 1000;
}

.--is-pink{
    color:var(--wp--preset--color--accent-1);
}

.is-button-style li {
    width: 50%;
    text-align: center !important;
    border-radius: 10px !important;
}

.--is-rainbow{
	background: linear-gradient(135deg, #70cbd0, #70cbd0, #f5ed5f, #F4A352, #f27db2, #A37DDC);
    background-clip: text !important;
	-webkit-background-clip: text; /* For WebKit browsers */
    color: transparent;
	-webkit-text-fill-color: transparent; /* For older WebKit browsers */
}

header *{
	text-decoration: none !important;
}

h2 span.--is-rainbow{
    padding-top: 10px;
}

.is-width-100-override {
    width: 100%;
}

.--content-height {
    min-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px));
    padding-bottom: 90px !important;
    background-repeat: repeat, repeat;
    background-size: 40% !important;
}

/* Card Shadow */

.dark-card-shadow {
    box-shadow: 0px 0px 0px rgba(112, 203, 208, 0);
    transition: .3s all ease-in-out;
    border: 1px solid rgba(112, 203, 208, 0.2);
}

@keyframes shadowpulse {
    0% {
        box-shadow: 0px 0px 6px rgba(112, 203, 208, 0.6);
    }
    33% {
        box-shadow: 0px 0px 6px rgba(242, 125, 178, 0.6);
    }
    66% {
        box-shadow: 0px 0px 6px rgba(244, 233, 82, 0.6);
    }
    100% {
        box-shadow: 0px 0px 6px rgba(112, 203, 208, 0.6);
    }    
}

.dark-card-shadow:hover {
    animation: shadowpulse 1s ease-in-out infinite;
    border: 1px solid rgba(112, 203, 208, 0);
}

.header-offset{
	margin-left: 320px !important;
}

.wp-site-blocks .wp-container-core-columns-is-layout-9c22b1e3{
	margin-block-start: 0;
}

.wp-block-navigation__responsive-container-close svg,
.wp-block-navigation__responsive-container-open svg {
    margin-top: 1rem;
    height: 2.4rem;
    width: 2.4rem;
}

.wp-block-navigation__responsive-container-open svg{
	margin-top: 0rem;
}

.wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation-item__content {
    display: block;
    font-size: 3.75rem !important;
  }

.wp-block-navigation__container .current-menu-item > .wp-block-navigation-item__content, 
.wp-block-navigation__container .wp-block-navigation-item:hover > .wp-block-navigation-item__content {
	transition: .3s ease;
	text-decoration: none;
	background: rgba(0,0,0,0);
	-webkit-tap-highlight-color: transparent;
	color: var(--wp--preset--color--accent-3);
}	

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container, 
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__submenu-container {
	gap: revert !important;
}

@media SCREEN and (max-width: 993px){

.wp-block-navigation__container .wp-block-navigation-item .wp-block-navigation-item__content {
    font-size: 1.25rem !important;
}
.wp-block-navigation__responsive-container-content ul{
padding: 3rem 0 !important;
}

.--hide-on-mobile{
  display: none;
}

	.mobile-col-order-2 {
		order: 2;
	}

	.is-fixed-desktop{
		position: static !important;
	}	

	/*
	 * Core stacks columns at 781px, so on tablets the header would stay
	 * marooned in its 290px column with the page squeezed alongside it. The
	 * column widths are inline styles and core's nowrap carries !important,
	 * hence the flags. Only the shell columns block that holds the header is
	 * targeted; columns inside page content keep their own behaviour.
	 */
	.wp-block-columns:has(> .wp-block-column.is-fixed-desktop){
		flex-wrap: wrap !important;
	}

	.wp-block-columns:has(> .wp-block-column.is-fixed-desktop) > .wp-block-column{
		flex-basis: 100% !important;
		flex-grow: 0;
	}

	.header-offset{
		margin-left: 0px !important;
	}

	.tablet-hide{
		display: none;
	}

	.wp-block-navigation__responsive-close{
		position: absolute;
		top: -2rem;
		right: .4rem;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		padding-top: 0 !important;
		margin-top: 1.2rem;
	}

        .--stack-on-mobile{
            display: flex;
            flex-direction: column;
        }

		header{
			margin: 0 0 !important;
			width: 100% !important;
			max-width: unset !important;			
		}

}

@media SCREEN and (max-width: 599px){



}




/* Taxonomy Tag Colors
---------------------------------------------------------------------------- */

div.taxonomy-guide-type a{
    font-size: 0.6rem;
    padding: .25rem .5rem;
    color: var(--wp--preset--color--primary);
	transition: .1s all ease;
	display: inline-block;
}

@media SCREEN and (max-width: 599px){
	div.taxonomy-guide-type a {
		position: relative;
		top: -3px;
	}
}

div.taxonomy-guide-type a[data-term*="ghoul"], 
div.taxonomy-guide-type a[data-term*="smoothskin"] {
    background: var(--wp--preset--color--accent-1);
}

div.taxonomy-guide-type a[data-term*="rifle"], 
div.taxonomy-guide-type a[data-term*="pistol"],
div.taxonomy-guide-type a[data-term*="bow"],
div.taxonomy-guide-type a[data-term*="heavy-weapon"],
div.taxonomy-guide-type a[data-term*="commando"]{
    background: var(--wp--preset--color--accent-2);
}

div.taxonomy-guide-type a[data-term*="specific-weapon"], 
div.taxonomy-guide-type a[data-term*="themed-build"],
div.taxonomy-guide-type a[data-term*="content-specific"]{
    background: var(--wp--preset--color--accent-3);
}

div.taxonomy-guide-type a:hover{
	color: var(--wp--preset--color--secondary) !important;
	background: var(--wp--preset--color--primary) !important;
}

/* Block Overrides
---------------------------------------------------------------------------- */

.wp-block-preformatted,
.wp-block-code code {
    overflow-wrap: unset;
    overflow-x: hidden;
    white-space: pre-wrap;
}

/* Compact Mobile Header
---------------------------------------------------------------------------- */

/*
 * Every template pulls in the same header part, whose full stack is 95vh tall.
 * At 781px the columns stack and the header sits on top of the page instead of
 * beside it, so only the front page still has room for the introduction;
 * elsewhere the header collapses to the name on its own. The header's heights,
 * paddings and gaps come from block supports as inline styles, hence the
 * !important flags.
 */

@media SCREEN and (max-width: 993px) {

	body:not(.home) .site-header,
	body:not(.home) .site-header > header {
		min-height: 0 !important;
	}

	body:not(.home) .site-header {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}

	/*
	 * Cinematografica leaves far more room above its capitals than below them,
	 * so even padding reads as bottom-heavy. The uneven values put the extra
	 * space underneath, which lands the name in the middle of the bar.
	 */
	body:not(.home) .site-header > header {
		padding-top: 0.25rem !important;
		padding-bottom: 1.25rem !important;
	}

	/*
	 * The avatar, role headings and social icons introduce Mitch; the name alone
	 * identifies him, and the dock already carries the links people tap.
	 */
	body:not(.home) .site-header figure.wp-block-image,
	body:not(.home) .site-header > header > .wp-block-heading,
	body:not(.home) .site-header .wp-block-social-links {
		display: none;
	}

	body:not(.home) .site-header > header > .wp-block-group {
		margin-top: 0 !important;
	}

	/*
	 * The name keeps the editor's 1.2 line height on desktop, which is taller
	 * than this bar needs; a line height of 1 sizes the bar to the letters
	 * themselves so nothing spills past the header.
	 */
	body:not(.home) .site-header > header > .wp-block-group > .wp-block-heading {
		margin: 0 !important;
		padding: 0 !important;
		font-size: 2.75rem !important;
		line-height: 1 !important;
		text-align: center;
	}

}