/*
Theme Name: UoY
Theme URI: https://blogs.york.ac.uk
Author: University of York
Author URI: https://www.york.ac.uk
Template: twentytwentyfive
Version: 2025
Text Domain: uoy
*/

/* -------------------------------------------------- */

html
{
	-webkit-font-smoothing: antialiased;
}

/* -------------------------------------------------- */

:root
{
	/* Make the global content size quite a bit bigger */
	--wp--style--global--content-size: 890px;
}

/* -------------------------------------------------- */
/* Remove automatic margin between top-level blocks */

.wp-site-blocks > *
{
	margin-block: 0;
}

/* -------------------------------------------------- */
/* Constrained width via a class rather than a container */

.is-content-width
{
	max-width: var( --wp--style--global--content-size );
}

/* -------------------------------------------------- */
/* Selected text */

::selection
{
	color: var( --wp--preset--color--uoy-white );
	background: var( --wp--preset--color--uoy-pink );
}

/* -------------------------------------------------- */
/* Tweak links to be more UoY */
/* (apply same treatment to mobile nav open/close too) */

a,
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close
{
	transition: all 200ms ease-out;
}

a:hover,
.wp-block-navigation__responsive-container-open:hover,
.wp-block-navigation__responsive-container-close:hover
{
	transition-duration: 50ms;
}

a:where( :not( .wp-element-button ) ),
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close
{
	text-decoration: underline !important;
	text-underline-offset: 4px !important;
}

a:hover:where( :not( .wp-element-button ) ),
.wp-block-navigation__responsive-container-open:hover,
.wp-block-navigation__responsive-container-close:hover
{
	text-decoration: underline !important;
	text-decoration-thickness: 3px !important;
	text-underline-offset: 4px !important;
}

/* Not all links though */
.wp-block-post-terms a,
.wp-block-post-terms a:hover,
.wp-block-site-title a,
.wp-block-site-title a:hover
{
	text-decoration: none !important;
}

/* -------------------------------------------------- */
/* Tweak CTAs and buttons to be more UoY */

.wp-element-button
{
	font-weight: bold;
}

.wp-block-button.is-style-outline .wp-block-button__link
{
	background: transparent none;
	border-color: currentColor;
	border-width: 3px;
	border-style: solid;
	color: currentColor;
	padding-top: calc( 1rem - 3px );
	padding-right: calc( 2.25rem - 3px );
	padding-bottom: calc( 1rem - 3px );
	padding-left: calc( 2.25rem - 3px );
}

.wp-block-button.is-style-outline .wp-block-button__link:not( .has-background ):hover
{
	background-color: color-mix( in srgb , var( --wp--preset--color--contrast ) 5% , transparent );
}

/* -------------------------------------------------- */
/* Focus styles */

*:focus-visible
{
	outline-width: 2px;
	outline-offset: 2px;
	outline-style: solid;
	outline-color: var( --focus-ring-colour );
}

/* Raise WP search form bits when focused */
.wp-block-search__input:focus-visible,
.wp-block-search__button:focus-visible,
/* Raise JetPack subscribe form bits when focused */
#subscribe-email input:focus-visible,
#subscribe-submit button:focus-visible
{
	position: relative;
	z-index: 1;
}

/* -------------------------------------------------- */
/* Add UoY-style box shadows */

:root
{
	--uoy-box-shadow-colour: rgba( 0,0,0 , 0.15 );
	--uoy-box-shadow: 0.25rem 0.25rem 0 var( --uoy-box-shadow-colour );
	--uoy-box-shadow-raised: 0.3rem 0.3rem 4px var( --uoy-box-shadow-colour );
}

.has-box-shadow img
{
	background: var( --uoy-box-shadow-colour );
	box-shadow: var( --uoy-box-shadow );
	transition: all 200ms ease-out;
}

.has-box-shadow a:hover img,
a:hover .has-box-shadow img
{
	box-shadow: var( --uoy-box-shadow-raised );
	transition-duration: 50ms;
}

/* -------------------------------------------------- */

@media( max-width: 782px )
{
	.is-layout-flex.is-reversed-on-mobile
	{
		flex-direction: column-reverse;
	}
}

/* -------------------------------------------------- */
/* Pagination improvements */

.page-numbers
{
	margin: 0 5px;
}

.page-numbers.current
{
	display: inline-block;
	width: 2em;
	line-height: 2em;
	text-align: center;

	border-radius: 50%;

	background: var( --wp--preset--color--contrast );
	color: var( --wp--preset--color--base );
}

/* -------------------------------------------------- */
/* Search form */

/* Prevent blowout */

.wp-block-search
{
	min-width: 0;
}

/* Join up input and button */

.wp-block-search__button-outside .wp-block-search__input
{
	margin-right: 0;
	border-radius: 6px 0 0 6px !important;
}

.wp-block-search__button-outside .wp-block-search__button
{
	margin-left: 0;
	border-radius: 0 6px 6px 0 !important;
}

/* Rotate the magnifying glass icon */

.wp-block-search__button.has-icon > .search-icon
{
	rotate: -90deg;
}

/* -------------------------------------------------- */
/* Prevent the logo from taking a hover colour */

.wp-block-uoy-logo a:hover
{
	color: inherit;
}

/* -------------------------------------------------- */
/* Prevent flexbox blowout in cards */

.is-layout-flex > :is( * , div )
{
	min-height: 0;
}

/* -------------------------------------------------- */
/* Fake headings for taxonomies on single post template */

.wp-block-post-terms__prefix
{
	display: block;
}

/* -------------------------------------------------- */
/* Force vertical gap in navigation */

.wp-block-navigation
{
	row-gap: var( --wp--preset--spacing--20 );
}

/* -------------------------------------------------- */
/* Sub menu styling */
/* Cf: https://github.com/WordPress/gutenberg/issues/76306 */

.wp-block-navigation:not( .has-background ) .wp-block-navigation__submenu-container
{
	border: 0;
	border-radius: 6px;
	background: color-mix( in hsl , var( --wp--preset--color--uoy-warm-grey-tint ) , white 60% );
	box-shadow: var( --uoy-box-shadow );

	--subnav-gap: 0.3em;
	top: calc( 100% + var( --subnav-gap ) );
}

.wp-block-navigation:not( .has-background ) .wp-block-navigation__submenu-container::before
{
	content: '';

	position: absolute;
	bottom: 100%;
	top: calc( var( --subnav-gap ) * -1 );
	left: 0;
	right: 0;
}

.wp-block-navigation:not( .has-background ) .wp-block-navigation__submenu-container .wp-block-navigation-item
{
	background: none;
}

/* -------------------------------------------------- */
/* Jetpack subscribe form */

.wp-block-jetpack-subscriptions :where( input[ type = email ] )
{
	border-color: var( --wp--preset--color--accent-6 );
}

.wp-block-jetpack-subscriptions :where( .wp-element-button , .wp-block-button__link )
{
	font-weight: bold;

	color: var( --wp--preset--color--uoy-white );
	background-color: var( --wp--preset--color--uoy-dark-blue );
}

.wp-block-jetpack-subscriptions :where( .wp-element-button , .wp-block-button__link ):hover
{
	color: var( --wp--preset--color--uoy-white );
	background-color: var( --wp--preset--color--uoy-dark-blue-shade );
}

@media screen and ( min-width: 480px )
{
	.wp-block-jetpack-subscriptions
	{
		flex-basis: 450px;
	}
}

@media screen and ( max-width: 480px )
{
	.wp-block-jetpack-subscriptions
	{
		width: 100%;
	}

	.wp-block-jetpack-subscriptions__form-elements
	{
		flex-flow: column nowrap;
		gap: var( --wp--preset--spacing--20 );
		align-items: stretch !important;
		justify-content: space-between;
	}

	#subscribe-blog .wp-block-jetpack-subscriptions__form-elements #subscribe-email input,
	#subscribe-blog .wp-block-jetpack-subscriptions__form-elements #subscribe-submit button
	{
		border-radius: 6px !important;
		width: 100%;
	}
}

/* -------------------------------------------------- */
/* Swooshy header bits */

header.wp-block-template-part > .wp-block-group.is-style-blue,
header.wp-block-template-part > .wp-block-group.is-style-dark-blue
{
	position: relative;
}

header.wp-block-template-part > .wp-block-group.is-style-blue::after,
header.wp-block-template-part > .wp-block-group.is-style-dark-blue::after
{
	content: '';
	display: block;
	pointer-events: none;

	width: clamp( 1.25em , 4vw , 2em );
	height: clamp( 1.25em , 4vw , 2em );

	position: absolute;
	z-index: 1;
}

header.wp-block-template-part > .wp-block-group.is-style-dark-blue::after
{
	top: 100%;
	left: 0;

	background: radial-gradient( circle at bottom right , transparent 69.5% , var( --wp--preset--color--uoy-dark-blue ) 70.5% );
}

header.wp-block-template-part > .wp-block-group.is-style-blue::after
{
	bottom: 100%;
	right: 0;

	background: radial-gradient( circle at top left , transparent 69.5% , var( --wp--preset--color--uoy-dark-blue-tint ) 70.5% );
}

/* -------------------------------------------------- */
/* Alternate page layout with sticky sidebar */

.uoy_stickylayout
{
	max-width: var(--wp--style--global--wide-size);
	margin: 0 auto;

	padding-right: var(--wp--style--root--padding-right);
	padding-left: var(--wp--style--root--padding-left);

	display: flex;
	flex-flow: column nowrap;
	gap: var( --wp--preset--spacing--60 );

	position: relative;
}

.uoy_stickylayout_main
{
	max-width: var( --wp--style--global--content-size );
}

.uoy_stickylayout_main > * + *
{
	margin-block-start: var( --wp--preset--spacing--40 );
}

.uoy_stickylayout_sidebar
{
	max-width: var( --wp--style--global--content-size );

	position: sticky;
	top: var( --wp--preset--spacing--40 );

	display: flex;
	flex-flow: column nowrap;
	gap: var( --wp--preset--spacing--40 );
}

@media screen and ( min-width: 1400px )
{
	.uoy_stickylayout
	{
		display: flex;
		flex-flow: row nowrap;
		gap: var( --wp--preset--spacing--60 );

		align-items: start;
	}

	.uoy_stickylayout_main
	{
		flex: 0 0 var( --wp--style--global--content-size );
	}

	.uoy_stickylayout_sidebar
	{
		flex: 1 1 auto;
	}
}

/* -------------------------------------------------- */