/**
 * Child theme block styles.
 *
 * The parent theme loads this file automatically when it exists - see
 * knowall/inc/fse-mode.php, enqueue_block_editor_styles(). It is hooked to
 * enqueue_block_assets, so it lands in BOTH the frontend and the editor canvas.
 * That is why the release breadcrumb overrides live here rather than in the
 * block's own editorStyle: the block stylesheet is not reliably applied to
 * block previews inside the Site Editor, which left the preview rendering as a
 * plain numbered <ol>.
 *
 * The rules below mirror the parent theme's own KB breadcrumb overrides in
 * knowall/css/style-blocks.css, with the classes renamed:
 *   .wp-block-heroickb-category-breadcrumb -> .release-breadcrumbs
 *   .heroickb-breadcrumb                   -> .release-breadcrumb
 * The !important flags are the parent theme's; they are needed for the same
 * reason - to beat the block stylesheet's inherited values.
 */

/* ---------- release breadcrumb appearance ---------- */

.release-breadcrumbs .release-breadcrumb,
.wp-block-knowall-child-release-breadcrumbs .release-breadcrumb {
	display: block !important;
	list-style: none !important;
	margin: 0 0 5px !important;
	padding: 0 !important;
	letter-spacing: 0 !important;
	font-size: 14px !important;
	color: #5c5c5c !important;
}

.release-breadcrumbs .release-breadcrumb:last-child,
.wp-block-knowall-child-release-breadcrumbs .release-breadcrumb:last-child {
	margin-bottom: 0 !important;
}

.release-breadcrumbs .release-breadcrumb li,
.wp-block-knowall-child-release-breadcrumbs .release-breadcrumb li {
	display: inline-block !important;
	margin: 0 0 5px 0 !important;
	padding: 0 !important;
	vertical-align: middle !important;
	list-style: none !important;
}

/* a bare <ol> is numbered by the editor canvas - suppress any marker */
.release-breadcrumbs .release-breadcrumb li::marker,
.wp-block-knowall-child-release-breadcrumbs .release-breadcrumb li::marker {
	content: none;
}

.release-breadcrumbs .release-breadcrumb li::before,
.wp-block-knowall-child-release-breadcrumbs .release-breadcrumb li::before {
	content: none !important;
}

.release-breadcrumbs .release-breadcrumb li:last-child,
.wp-block-knowall-child-release-breadcrumbs .release-breadcrumb li:last-child {
	color: rgba(0, 0, 0, 0.5) !important;
}

.release-breadcrumbs .release-breadcrumb a,
.wp-block-knowall-child-release-breadcrumbs .release-breadcrumb a {
	color: #5c5c5c !important;
	text-decoration: none !important;
	margin-right: 0 !important;
	border: none !important;
	background: none !important;
	box-shadow: none !important;
}

.release-breadcrumbs .release-breadcrumb a:hover,
.wp-block-knowall-child-release-breadcrumbs .release-breadcrumb a:hover {
	text-decoration: none !important;
}

/* the arrow: a 12px chevron drawn as a mask, tinted with the primary colour */
.release-breadcrumbs .release-breadcrumb li:not(:last-child)::after,
.wp-block-knowall-child-release-breadcrumbs .release-breadcrumb li:not(:last-child)::after {
	content: "" !important;
	display: inline-block !important;
	width: 12px !important;
	height: 12px !important;
	margin: 0 2px !important;
	position: relative !important;
	top: 1px !important;
	background-color: var(--wp--preset--color--primary, #00b4b3) !important;
	-webkit-mask-image: url("data:image/svg+xml;charset=UTF-8, %3Csvg xmlns='http://www.w3.org/2000/svg' height='12' width='12' viewBox='0 0 16 16'%3E%3Cpath d='M6 13.4L4.6 12 8.6 8 4.6 4 6 2.6 11.4 8z'/%3E%3C/svg%3E") !important;
	mask-image: url("data:image/svg+xml;charset=UTF-8, %3Csvg xmlns='http://www.w3.org/2000/svg' height='12' width='12' viewBox='0 0 16 16'%3E%3Cpath d='M6 13.4L4.6 12 8.6 8 4.6 4 6 2.6 11.4 8z'/%3E%3C/svg%3E") !important;
	-webkit-mask-repeat: no-repeat !important;
	mask-repeat: no-repeat !important;
	-webkit-mask-position: center !important;
	mask-position: center !important;
	-webkit-mask-size: contain !important;
	mask-size: contain !important;
}

/**
* ---------------------------------------------------------------------------
* Release tags - core's Post Terms block set to the release_tag taxonomy.
*
* The Heroic KB plugin has no tags block; KB tags are core's wp:post-terms
* styled by the theme's .hkb-article-tags rules. Those rules are reproduced
* here for release_tag, so:
*
*   <!-- wp:post-terms {"term":"release_tag","prefix":"Tagged: "} /-->
*
* renders the same rounded chips as KB article tags.
*
* Values copied verbatim from .hkb-article-tags in knowall/css/style.css.
* Core emits a .taxonomy-release_tag class on the wrapper, which is what these
* rules hook onto - so the block keeps all of its own controls (prefix, suffix,
* separator, colours, typography).
* ---------------------------------------------------------------------------
*/

.taxonomy-release_tag {
	font-size: 14px;
	color: #999;
	margin: 0 0 20px;
}

.taxonomy-release_tag a {
	border-radius: 99px;
	transition: all .1s ease-in-out;
	display: inline-block;
	padding: 5px 10px;
	line-height: 1;
	margin: 0 5px 5px 0;
	background: #f4f5f5;
	color: #666;
	font-size: 13px;
	text-decoration: none;
}

.taxonomy-release_tag a:hover {
	background: hsl(180, 4.7619047619%, 90.8823529412%);
	text-decoration: none;
}

.taxonomy-release_tag a:first-of-type {
	margin-left: 5px;
}

/**
* Core puts a ", " separator between terms, which reads as stray punctuation
* between chips. The pills already have their own margins, so hide it - keeping
* it in the DOM rather than removing it server side means core's separator
* setting still works for anyone who wants a non-pill layout.
*/
.taxonomy-release_tag .wp-block-post-terms__separator {
	display: none;
}
