/* =====================================================
 * ABCA Website 2026.  Front / Back end styles
 * enqueued in functions.php
 * ===========================================================
 */
 
/* prevent line wrapping on submenu - need to make
 * sure submenu text is not too long  
 * ------------------------------------------- */
.wp-block-navigation-submenu{
	white-space: nowrap;
}

/* hide left border and remove padding on sidebars when
 * the columns group is stacked (screen width < 782)  
--------------------------------------------- */
.right-column-sidebar { padding-left: 24px; border-left: 2px solid grey;}
@media (max-width:781px){
.right-column-sidebar { border-style: none; padding-left: 0;}
}

/* material icons (the font loaded in theme.json)
--------------------------------------------- */
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1.2;
}

/* Set light modal block width to auto.  The class is set
 in block editor settings > advanced > additional css classes
--------------------------------------------*/
.modal-width-auto{
	width: auto;
}

/* latest posts - news list on home page
--------------------------------------------- */
.wp-block-latest-posts.latest-posts-news-list{
	padding-left: 8px;
	line-height:1.4;
	& time{ font-size: 14px; padding: 0 0 8px 12px}
	& time::before{ content: "Posted: ";}
}

/* latest posts - news archive page
--------------------------------------------- */
.wp-block-group.news-archive-page-group{
	& time{ font-size: 14px; }
	& time::before{ content: "Posted:\00a0\00a0";}
}

/* fix img size on latest posts for hof people and dogs
-----------------------------------------------*/
.wp-block-latest-posts__featured-image img {
    height: 200px; /* set fixed img height */
    object-fit: cover; /* Ensures image covers area without stretching */
    width: 100%; /* Ensures width fills the container */
}

/* List quick access menu
--------------------------------------------- */
.wp-block-list.list-quick-access{
	padding: 0;
	& li{
		line-height: 1.4;
		list-style-type: none;	
		padding-left: 32px;
		text-indent: -32px;
	}
	& li::before {
		content: ">\00a0\00a0";
		/*margin-left: -16px;  same as padding-left set on li */
	}	
}

/* hof 'other recipients' button
--------------------------------------------- */
.wp-block-button.button-hof{
	z-index:99;
	top: 20px;
	right: 20px;
	position: absolute !important;
}
@media (max-width:781px){
	.wp-block-button.button-hof{
		display: none;
	}
}

/* light modal used in hof post templates
--------------------------------------------- */
.wp-block-cloudcatch-light-modal-block.modal-hof{
	width: auto;
	height: 400px;
	transform: translate(40%, 16px);
}
@media (max-width:781px){
	.wp-block-cloudcatch-light-modal-block.modal-hof{
		transform: translate(0%, 16px);
	}
}

/* center floated images on small screens
--------------------------------------------- */
@media (max-width:781px){
	.wp-block-image.image-781{
		float: none;
		margin-left: auto !important;
		margin-right: auto !important;
	}
}

/* responsive width - 100% on small screens*/
div.width-80-100 {
	margin-left: auto;
	margin-right: auto;
	width: 80%;
}
@media (max-width: 781px) {
	div.width-80-100 {
		width: 100%;
	}
}
/* hide mobile menu button */
.menu-toggle{
	display: none;
	color: white;
}

/* switch to mobile menu below 600*/
@media (max-width: 599px) {
	.menu-toggle{
		display: inline-block;
	} 
	.menu-toggle:hover{
		color: gold !important;
		cursor: pointer;
	}
	.site-navigation nav{
		display: none;
	}
	.site-tagline{display: none;}
}