/*
Theme Name: Rosen & Company
Description: Block theme for Rosen & Company Barristers, built on Twenty Twenty-Five.
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.6
Requires PHP: 7.2
Text Domain: rosen
*/

/* Keep the header visible while scrolling, as the old site did. */
.rosen-header {
	position: sticky;
	top: 0;
	z-index: 50;
}
.admin-bar .rosen-header {
	top: var(--wp-admin--admin-bar--height, 0);
}

/* Section anchors land below the sticky header. */
[id="ABOUT"], [id="AREAS"], [id="TEAM"], [id="MEDIA"], [id="CONTACT"] {
	scroll-margin-top: 100px;
}
html {
	scroll-behavior: smooth;
}

/* Practice-area accordion: white cards with a coloured edge, like the old design. */
.rosen-areas details.wp-block-details {
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	border-left: 5px solid var(--rosen-edge, var(--wp--preset--color--accent));
	padding: 0.9rem 1.2rem;
	margin-block-start: 0.75rem;
}
.rosen-areas details.wp-block-details summary {
	font-family: var(--wp--preset--font-family--fira-sans);
	font-weight: 500;
	letter-spacing: 0.04em;
	cursor: pointer;
}
.rosen-areas details.wp-block-details[open] summary {
	color: var(--wp--preset--color--navy);
	margin-block-end: 0.75rem;
}

/* Latest posts on the home page sit on the blue background. */
.rosen-media .wp-block-latest-posts a {
	color: var(--wp--preset--color--base);
	font-weight: 500;
}
.rosen-media .wp-block-latest-posts li {
	border-bottom: 1px solid rgba(255, 255, 255, 0.35);
	padding-block: 0.75rem;
}
.rosen-media .wp-block-latest-posts__post-date {
	color: rgba(255, 255, 255, 0.8);
}

/* Edge colours carried over from the old accordion. */
.rosen-areas .rosen-edge-1 { --rosen-edge: #fffe0d; }
.rosen-areas .rosen-edge-2 { --rosen-edge: #e8be0c; }
.rosen-areas .rosen-edge-3 { --rosen-edge: #ffa000; }
.rosen-areas .rosen-edge-4 { --rosen-edge: #e8600c; }
.rosen-areas .rosen-edge-5 { --rosen-edge: #ff1f00; }
.rosen-areas .rosen-edge-6 { --rosen-edge: #ff0069; }

/* Header search: a plain icon rather than a filled button. */
.rosen-header .wp-block-search__button {
	background: transparent;
	color: #555555;
	padding: 0.4rem;
	border: 0;
}
.rosen-header .wp-block-search__button:hover {
	color: var(--wp--preset--color--blue);
}

/* Media sidebar tag cloud: small grey tags. */
.wp-block-tag-cloud a {
	display: inline-block;
	background: var(--wp--preset--color--light);
	color: var(--wp--preset--color--contrast);
	padding: 0.25rem 0.6rem;
	margin: 0 0.3rem 0.4rem 0;
}
.wp-block-tag-cloud a:hover {
	background: var(--wp--preset--color--navy);
	color: var(--wp--preset--color--base);
	text-decoration: none;
}
.wp-block-categories-dropdown select {
	width: 100%;
	padding: 0.5rem;
	font: inherit;
	font-size: var(--wp--preset--font-size--small);
}