/*
Theme Name: Sisyphus Counseling
Description: Twenty Twenty-Five, with the practice's brand: the five brand colors, Fraunces headings, Cabin body text, a centered logo above the menu, and colored full-width sections. Colors, fonts and sizes are in theme.json; this file only has what theme.json can't express.
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.7
Requires PHP: 8.3
License: Proprietary
Text Domain: sisyphus
*/

/* Logo above the menu (patterns/logo.php): 200px wide, a little smaller on phones */
.zab-logo {
	display: block;
	line-height: 0;
}
.zab-logo img {
	display: block;
	width: 200px;
	height: auto;
}
@media (max-width: 600px) {
	.zab-logo img {
		width: 150px;
	}
}

/* "Book a consultation" in the menu: a Slate Blue pill with Alabaster text, Deep Ink
   on hover. The selectors are deliberately specific: the Navigation block's own CSS sets
   link color with a doubled class, and theme.json adds a hover underline to menu links. */
.wp-block-navigation .wp-block-navigation-item.menu-cta > a.wp-block-navigation-item__content {
	display: inline-flex;
	align-items: center;
	padding: 0.55em 1.4em;
	margin-inline-start: 0.5em;
	border-radius: 999px;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.01em;
	white-space: nowrap;
	text-decoration: none;
	transition: background-color 0.15s ease, color 0.15s ease;
}
.wp-block-navigation .wp-block-navigation-item.menu-cta > a.wp-block-navigation-item__content:hover,
.wp-block-navigation .wp-block-navigation-item.menu-cta > a.wp-block-navigation-item__content:focus-visible {
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
	text-decoration: none;
}
.wp-block-navigation .wp-block-navigation-item.menu-cta > a.wp-block-navigation-item__content:focus-visible {
	outline: 2px solid var(--wp--preset--color--contrast);
	outline-offset: 3px;
}
/* In the phone menu (full-screen list), keep it a button at the end of the list */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.menu-cta > a.wp-block-navigation-item__content {
	margin-inline-start: 0;
	margin-block-start: 0.75em;
	padding: 0.7em 1.6em;
}

/* Rounded corners for photos placed in content (the "Soft rounded" image style) */
.wp-block-image.is-style-rounded-soft img {
	border-radius: 18px;
}

/* Selected text: Deep Ink on Golden Saffron */
::selection {
	background: var(--wp--preset--color--saffron);
	color: var(--wp--preset--color--contrast);
}