/* ==========================================================================
   RyanOlivier.com Details Accordion Styling
   ========================================================================== */
/* 1. Top-Level Main Accordions (Black Headings, Box Outline) */
html body .wp-block-details {
	border: 1px solid #B81329 !important;
	border-radius: 8px;
	margin-bottom: 1rem !important;
	background-color: #ffffff !important;
	overflow: hidden;
	transition: border-color .2s ease;
}

html body .wp-block-details[open] {
	border-color: #B81329 !important;
}

/* Style main category summary bar (Black Heading) */
html body .wp-block-details > summary {
	color: #000000 !important;
	font-weight: 600 !important;
	padding: 1rem 1.25rem !important;
	cursor: pointer;
	background-color: #ffffff !important;
	list-style: none;
	position: relative;
}

html body .wp-block-details > summary:hover,
html body .wp-block-details > summary:focus {
	color: #333333 !important;
}

/* Hide default browser marker */
html body .wp-block-details summary::marker,
html body .wp-block-details summary::-webkit-details-marker {
	display: none;
	color: #B81329 !important;
}

/* Custom indicator icon (+ / -) for top level */
html body .wp-block-details > summary::after {
	content: "+";
	position: absolute;
	right: 1.25rem;
	font-weight: 400;
	color: #B81329 !important;
}

html body .wp-block-details[open] > summary::after {
	content: "−";
}

/* 2. Top-Level Content Container */
html body .wp-block-details > .wp-block-details__content {
	padding: 1rem 1.25rem 1.25rem !important;
	background-color: #ffffff !important;
}

/* 3. Nested Individual Piece Details (Black when closed, Red when opened/hovered) */
html body .wp-block-details .wp-block-details {
	border: none !important;
	border-left: 2px solid #e2e8f0 !important;
	border-radius: 0;
	margin-bottom: .75rem !important;
	background-color: #ffffff !important;
}

/* When closed: Default Black text */
html body .wp-block-details .wp-block-details > summary {
	font-weight: 500 !important;
	color: #000000 !important;
	padding: .4rem .75rem !important;
	background-color: #ffffff !important;
	transition: color .2s ease;
}

/* When hovered, focused, OR expanded [open]: Switch to Red */
html body .wp-block-details .wp-block-details > summary:hover,
html body .wp-block-details .wp-block-details > summary:focus,
html body .wp-block-details .wp-block-details[open] > summary {
	color: #B81329 !important;
}

/* Left border line turns red when expanded */
html body .wp-block-details .wp-block-details[open] {
	border-left-color: #B81329 !important;
}

/* Chevron indicator for inner items (black when closed, red when open) */
html body .wp-block-details .wp-block-details > summary::after {
	content: "›";
	right: .5rem;
	color: #000000 !important;
	transition: transform .2s ease, color .2s ease;
}

html body .wp-block-details .wp-block-details > summary:hover::after,
html body .wp-block-details .wp-block-details[open] > summary::after {
	color: #B81329 !important;
}

html body .wp-block-details .wp-block-details[open] > summary::after {
	transform: rotate(90deg);
}

/* 4. Inner Content (Lists, Typography, Links) */
html body .wp-block-details .wp-block-details__content {
	padding: .25rem .75rem .5rem !important;
	background-color: #ffffff !important;
}

html body .wp-block-details ul.wp-block-list {
	margin: .5rem 0 .5rem 1rem !important;
	padding-left: .5rem !important;
	list-style-type: disc;
}

html body .wp-block-details ul.wp-block-list li {
	color: #475569 !important;
	margin-bottom: .4rem !important;
}

html body .wp-block-details ul.wp-block-list li:last-child {
	margin-bottom: 0 !important;
}

html body .wp-block-details a {
	color: #B81329 !important;
	text-decoration-color: #B81329 !important;
}

html body .wp-block-details a:hover {
	color: #8c0d1e !important;
}

/* Outline/Focus Rules */
html body .wp-block-details summary:focus,
html body .wp-block-details summary:focus-visible {
	outline: 2px solid #B81329 !important;
	box-shadow: none !important;
}