/*
Theme Name: Yoko NAHMA Main
Theme URI: 
Author: Yoko Co
Author URI: 
Description: A custom theme for NAHMA by Yoko Co.
Requires at least: 6.8
Tested up to: 6.8
Requires PHP: 5.7
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: yoko-nahma-main
Tags: 

/*************************************************************/

/*************************************************************/
/*************** Gutenberg and FSE quirk fixes ***************/
/*************************************************************/


/* Fixes default gaps between blocks when stacking groups or rows at the highest level */
:where(.wp-site-blocks) > * {margin-block-start: 0; margin-block-end: 0;}



/*************************************************************/
/************ Utility classes for responsive fixes ***********/
/*************************************************************/

/* Handles responsive left-right padding by default by target top level groups. Can be undone by using .esc-pad class on a top level group */
@media screen and (max-width: 1240px) {
	.wp-site-blocks > .wp-block-group:not(.esc-pad), 
	.wp-site-blocks > .wp-block-template-part > .wp-block-group:not(.esc-pad), 
	.wp-block-template-part > .wp-block-template-part > .wp-block-group:not(.esc-pad), 
	.wp-block-template-part > .wp-block-template-part > .wp-block-template-part > .wp-block-group:not(.esc-pad), .wp-site-blocks > .entry-content > .wp-block-group:not(.esc-pad) {
		padding-left: 20px; 
		padding-right: 20px;
	}
}
 
/* utility classes for responsive layouts on medium devices */
@media screen and (max-width: 1024px) {
    body .is-layout-flex.md-reverse {flex-direction: row-reverse; justify-content: flex-end;} 
    body .is-layout-flex.md-stack {flex-direction: column;}  
    body .is-layout-flex.md-stack.md-reverse {flex-direction: column-reverse; justify-content: flex-end;} 
    body .is-layout-flex.md-stack  > :is(*, div) {display: block; width: 100%; margin-left: 0; margin-right: 0;} 
    body .wp-block-columns.is-layout-flex.md-reverse {flex-direction: column-reverse; justify-content: flex-end;}
}

/* utility classes for responsive layouts on small devices */
@media screen and (max-width: 781px) {
    body .is-layout-flex.mobile-reverse, body .is-layout-flex.sm-reverse {flex-direction: row-reverse; justify-content: flex-end;} 
    body .is-layout-flex.mobile-stack, body .is-layout-flex.sm-stack {flex-direction: column;} 
    body .is-layout-flex.mobile-stack.mobile-reverse, body .is-layout-flex.sm-stack.sm-reverse {flex-direction: column-reverse; justify-content: flex-end;} 
    body .is-layout-flex.mobile-stack  > :is(*, div), body .is-layout-flex.sm-stack  > :is(*, div) {display: block; width: 100%; margin-left: 0; margin-right: 0;} 
    body .wp-block-columns.is-layout-flex.mobile-reverse, body .wp-block-columns.is-layout-flex.sm-reverse {flex-direction: column-reverse; justify-content: flex-end;}
}


/****************************************************/
/************* Button default effects ***************/
/****************************************************/

/* Button hover states that adapt and work on most buttons */
.wp-element-button {
    transition: transform 0.4s; 
    position: relative;
}
.wp-element-button:hover {
    transform: translate(0,2px);
}

/****************************************************/
/********* Menu and Mega Menu Functionality *********/
/****************************************************/


/* Fixes grandchild menu behavior */
.wp-block-navigation .wp-block-navigation__container .has-child .wp-block-navigation__submenu-container {
    overflow: visible;
}
.wp-block-navigation-submenu .has-toggle::after, .wp-block-navigation-submenu .has-child .wp-block-navigation-submenu__toggle::after {
    right: 10px;
    top: calc(50% - 14px);
}
.wp-block-navigation-submenu__toggle[aria-expanded=true] {
    text-decoration: underline;
}


/* Custom Alert Banner */
.custom-alert-banner p {
    margin-block-start: 0;
    margin-block-end: 0;
}

/****************************************************/
/**************** Misc adjustments ******************/
/****************************************************/
 
/* Fixes default gaps when using prefixes on MFBPro */
.wp-block-mfb-meta-field-block.is-display-inline-block .prefix {
    margin-inline-end: var(--mfb--gap, 0);
}