/**
 * ToLQ FSE Block Theme - Custom Styles
 * Active flap styling for multisite navigation bar
 */

/* Active flap styling per site color variant apart from gold */
.site-color-wine .flap-wine,
.site-color-gold .flap-gold,
.site-color-forest .flap-forest,
.site-color-sky .flap-sky,
.site-color-night .flap-night,
.site-color-royal .flap-royal {
	/*width: 24% !important;*/
	margin-bottom: 1px;
	z-index: 999 !important;
	position: relative !important;
    transform: scale(1.2, 1.1);
    margin-left: 12px;
    margin-right: 12px;
    padding-left: 15px;
    padding-right: 15px;
}

/* Active flap font sizing 
.site-color-wine .flap-wine p,
.site-color-gold .flap-gold p,
.site-color-forest .flap-forest p,
.site-color-sky .flap-sky p,
.site-color-night .flap-night p,
.site-color-royal .flap-royal p {
	font-size: 20px !important;
    color: var(--wp--preset--color--tolq-golden);
} */

/* Active flap link styling - golden border and shadow */
.site-color-wine .flap-wine,
.site-color-gold .flap-gold,
.site-color-forest .flap-forest,
.site-color-sky .flap-sky,
.site-color-night .flap-night,
.site-color-royal .flap-royal {
	border-top: 2px solid var(--wp--preset--color--tolq-golden) !important;
	border-right: 2px solid var(--wp--preset--color--tolq-golden) !important;
	border-left: 2px solid var(--wp--preset--color--tolq-golden) !important;
	border-bottom: none !important;
	box-shadow: 0 -3px 8px -2px rgba(0, 0, 0, 0.3) !important;
}

/* Active flap link color settings */
.site-color-wine .flap-wine a, 
.site-color-gold .flap-gold a, 
.site-color-forest .flap-forest a, 
.site-color-sky .flap-sky a, 
.site-color-night .flap-night a, 
.site-color-royal .flap-royal a { 
    font-size: 20px !important;
    color: var(--wp--preset--color--tolq-golden) !important; 
}
 
.site-color-wine .flap-wine a:hover, 
.site-color-gold .flap-gold a:hover, 
.site-color-forest .flap-forest a:hover, 
.site-color-sky .flap-sky a:hover, 
.site-color-night .flap-night a:hover, 
.site-color-royal .flap-royal a:hover { 
    color: var(--wp--preset--color--tolq-tint-background) !important; 
}

/* Making submenu links full width and height of submenu items */
.ablocks-block--menu-child-sub .ablocks-block--menu-item .ablocks-menu-item__link
{ display: inline-block;
  width: 250px;
  height: 100%;
}