/**
 * Allegory Accordion — Global Styles v2.0.3
 *
 * SINGLE SOURCE OF TRUTH for all accordion styling site-wide.
 * Controls both Core Details blocks and Event Template Fine Print.
 *
 * Targets:
 *   - .wp-block-details         (Core Details block on pages/posts)
 *   - .allegory-fineprint__item (Event Template fine print)
 *
 * Loaded at priority 999 to override Kadence's global.min.css
 * Also loaded in block editor for preview.
 *
 * COLOR LOGIC:
 *   Default:  BG #edf5f5 · Title #1a1a1a · Arrow #249ea0 (Teal Light)
 *   Hover:    BG #ffffff · Title #005555 · Arrow #fd5901 (Orange)
 *   Open:     Same as default, arrow rotated 90°
 *   Open+Hov: Same as hover, arrow rotated 90°
 *
 * Design: Studio Allegory Corporate Design Guideline v1.0
 */


/* ══════════════════════════════════════════════════
   1. BASE — Container
   ══════════════════════════════════════════════════ */

.wp-block-details,
.allegory-fineprint__item {
	border: 1px solid #cccccc;
	border-radius: 6px;
	margin-bottom: 8px;
	overflow: hidden;
}

.wp-block-details:last-child,
.allegory-fineprint__item:last-child {
	margin-bottom: 0;
}


/* ══════════════════════════════════════════════════
   2. SUMMARY — The clickable header row
   Overrides Kadence's: summary { display: list-item }
   ══════════════════════════════════════════════════ */

.wp-block-details summary,
.allegory-fineprint__summary {
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	padding: 14px 20px;
	font-size: inherit;
	font-weight: 700;
	color: #1a1a1a;
	cursor: pointer;
	list-style: none;
	background: #edf5f5;
	transition: background-color 0.15s ease, color 0.15s ease;
}

/* Hide native browser disclosure triangle */
.wp-block-details summary::-webkit-details-marker,
.allegory-fineprint__summary::-webkit-details-marker {
	display: none;
}

.wp-block-details summary::marker,
.allegory-fineprint__summary::marker {
	display: none;
	content: '';
}

/* Hover: white bg, teal text */
.wp-block-details summary:hover,
.allegory-fineprint__summary:hover {
	background: #ffffff;
	color: #005555;
}

/* Focus state — subtle accessible outline (WCAG 2.4.7) */
.wp-block-details summary:focus-visible,
.allegory-fineprint__summary:focus-visible {
	outline: 2px solid #249ea0;
	outline-offset: 2px;
	border-radius: 6px;
}


/* ══════════════════════════════════════════════════
   3. CUSTOM SVG ARROW
   Inline SVG via CSS url() — the Allegory arrow
   Default: Teal Light (#249ea0)
   Hover: Orange Main (#fd5901)
   ══════════════════════════════════════════════════ */

/* --- 3a. Core Details block: ::after pseudo-element --- */

.wp-block-details summary::after {
	content: '';
	flex-shrink: 0;
	display: block;
	width: 20px;
	height: 16px;
	margin-left: 12px;
	/* Allegory arrow SVG — Teal Light #249ea0 */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28.92 21.92'%3E%3Cline x1='25.92' y1='10.93' x2='3.14' y2='10.93' stroke='%23249ea0' stroke-width='4' stroke-linecap='round'/%3E%3Cpolyline points='18.05 3.03 25.92 10.9 18.07 18.76' fill='none' stroke='%23249ea0' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	transition: transform 0.25s ease, background-image 0.15s ease;
}

/* Arrow hover: Orange */
.wp-block-details summary:hover::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28.92 21.92'%3E%3Cline x1='25.92' y1='10.93' x2='3.14' y2='10.93' stroke='%23fd5901' stroke-width='4' stroke-linecap='round'/%3E%3Cpolyline points='18.05 3.03 25.92 10.9 18.07 18.76' fill='none' stroke='%23fd5901' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Arrow open: rotated 90° clockwise */
.wp-block-details[open] > summary::after {
	transform: rotate(90deg);
}

/* --- 3b. Event Template: .allegory-fineprint__icon span --- */
/*     Uses the same SVG arrow approach via background-image    */

.allegory-fineprint__icon {
	flex-shrink: 0;
	width: 20px;
	height: 16px;
	margin-left: 12px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28.92 21.92'%3E%3Cline x1='25.92' y1='10.93' x2='3.14' y2='10.93' stroke='%23249ea0' stroke-width='4' stroke-linecap='round'/%3E%3Cpolyline points='18.05 3.03 25.92 10.9 18.07 18.76' fill='none' stroke='%23249ea0' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	transition: transform 0.25s ease, background-image 0.15s ease;
}

/* Remove the old +/- pseudo-elements completely */
.allegory-fineprint__icon::before,
.allegory-fineprint__icon::after {
	content: none !important;
	display: none !important;
}

/* Arrow hover: Orange */
.allegory-fineprint__summary:hover .allegory-fineprint__icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28.92 21.92'%3E%3Cline x1='25.92' y1='10.93' x2='3.14' y2='10.93' stroke='%23fd5901' stroke-width='4' stroke-linecap='round'/%3E%3Cpolyline points='18.05 3.03 25.92 10.9 18.07 18.76' fill='none' stroke='%23fd5901' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Arrow open: rotated 90° clockwise */
.allegory-fineprint__item[open] .allegory-fineprint__icon {
	transform: rotate(90deg);
}


/* ══════════════════════════════════════════════════
   4. OPEN STATE — header styling when expanded
   ══════════════════════════════════════════════════ */

.wp-block-details[open] > summary,
.allegory-fineprint__item[open] .allegory-fineprint__summary {
	border-bottom: 1px solid #cccccc;
	/* Open state keeps default colors (edf5f5 bg, 1a1a1a text) */
	/* Hover on open item still triggers white bg + teal text */
}


/* ══════════════════════════════════════════════════
   5. BODY — The expandable content area
   ══════════════════════════════════════════════════ */

/* --- 5a. Core Details block --- */

.wp-block-details > *:not(summary) {
	padding-left: 20px;
	padding-right: 20px;
	background: #ffffff;
}

.wp-block-details > summary + * {
	padding-top: 16px;
}

.wp-block-details > *:last-child:not(summary) {
	padding-bottom: 16px;
}

/* --- 5b. Event Template --- */

.allegory-fineprint__body {
	padding: 16px 20px;
	background: #ffffff;
}

/* --- 5c. Shared content styles --- */

.wp-block-details p,
.allegory-fineprint__body p {
	margin: 0 0 10px 0;
	color: #333333;
	font-size: inherit;
	line-height: 1.6;
}

.wp-block-details p:last-child,
.allegory-fineprint__body p:last-child {
	margin-bottom: 0;
}

/* Links in accordion body: Orange */
.wp-block-details a,
.allegory-fineprint__body a {
	color: #fd5901;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.wp-block-details a:hover,
.allegory-fineprint__body a:hover {
	color: #f78104;
}

.wp-block-details ul,
.wp-block-details ol,
.allegory-fineprint__body ul,
.allegory-fineprint__body ol {
	padding-left: 20px;
	margin: 0 0 10px 0;
	color: #333333;
}

.wp-block-details li,
.allegory-fineprint__body li {
	margin-bottom: 4px;
}


/* ══════════════════════════════════════════════════
   6. RESPONSIVE — Mobile adjustments
   ══════════════════════════════════════════════════ */

@media (max-width: 768px) {
	.wp-block-details summary,
	.allegory-fineprint__summary {
		padding: 12px 16px;
	}

	.wp-block-details > *:not(summary) {
		padding-left: 16px;
		padding-right: 16px;
	}

	.allegory-fineprint__body {
		padding: 12px 16px;
	}

	.wp-block-details summary::after,
	.allegory-fineprint__icon {
		width: 18px;
		height: 14px;
	}
}


/* ══════════════════════════════════════════════════
   7. PRINT — Force all accordions open
   ══════════════════════════════════════════════════ */

@media print {
	.wp-block-details,
	.allegory-fineprint__item {
		border: 1px solid #ccc;
	}

	.wp-block-details[open] > summary,
	.allegory-fineprint__item[open] .allegory-fineprint__summary {
		border-bottom: 1px solid #ccc;
	}

	.wp-block-details > *:not(summary),
	.allegory-fineprint__body {
		display: block !important;
	}

	.wp-block-details summary::after,
	.allegory-fineprint__icon {
		display: none;
	}
}