/* ==========================================================
	Expert Evidence Shortcodes — Modern CSS
	Uses CoreFramework CSS variables where available.
	Protos Digital
   ========================================================== */

/* ----------------------------------------------------------
   Column Layout (Float-based — matches legacy content structure)
   Single [one_half] blocks without _last pairing are supported.
   ---------------------------------------------------------- */

.expert-evidence-col {
	float: left;
	margin-right: var(--space-m, 1.5rem);
	margin-bottom: var(--space-m, 1.5rem);
}

.expert-evidence-one-half     { width: calc(50% - var(--space-m, 1.5rem) / 2); }
.expert-evidence-one-third    { width: calc(33.333% - var(--space-m, 1.5rem)); }
.expert-evidence-two-third    { width: calc(66.666% - var(--space-m, 1.5rem) / 2); }
.expert-evidence-one-fourth   { width: calc(25% - var(--space-m, 1.5rem)); }
.expert-evidence-three-fourth { width: calc(75% - var(--space-m, 1.5rem) / 4); }
.expert-evidence-one-fifth    { width: calc(20% - var(--space-m, 1.5rem)); }
.expert-evidence-two-fifth    { width: calc(40% - var(--space-m, 1.5rem)); }
.expert-evidence-three-fifth  { width: calc(60% - var(--space-m, 1.5rem) / 2); }
.expert-evidence-four-fifth   { width: calc(80% - var(--space-m, 1.5rem) / 4); }
.expert-evidence-one-sixth    { width: calc(16.666% - var(--space-m, 1.5rem)); }
.expert-evidence-five-sixth   { width: calc(83.333% - var(--space-m, 1.5rem) / 6); }

@media (max-width: 640px) {
	.expert-evidence-col {
		float: none !important;
		width: 100% !important;
		margin-right: 0 !important;
	}
}

/* ----------------------------------------------------------
   Clear / HR
   ---------------------------------------------------------- */

.expert-evidence-clear {
	clear: both;
	display: block;
	height: 0;
}

.expert-evidence-hr {
	border: none;
	border-top: 1px solid var(--border-primary, #e8e8e8);
	margin: var(--space-m, 1.5rem) 0;
}

.expert-evidence-hr--2 {
	border-top-style: dashed;
}

.expert-evidence-hr--3 {
	border-top-width: 2px;
}

/* ----------------------------------------------------------
   Dropcap
   ---------------------------------------------------------- */

.expert-evidence-dropcap {
	display: block;
	float: left;
	font-size: var(--text-3xl, 3em);
	line-height: 1;
	margin: 0 var(--space-xs, 0.5em) 0 0;
	font-weight: 700;
	color: var(--accent, #ec7100);
}

/* ----------------------------------------------------------
   Alert Boxes
   ---------------------------------------------------------- */

.expert-evidence-alert {
	display: block;
	padding: var(--space-s, 0.75em) var(--space-m, 1.25em);
	margin-bottom: var(--space-m, 1.5rem);
	border-radius: var(--radius-m, 3px);
	border: 1px solid transparent;
}

.expert-evidence-alert p {
	margin: 0;
}

.expert-evidence-alert--warning {
	background-color: var(--accent-10, #fbf6e4);
	border-color: var(--accent-40, #eed77d);
	color: var(--accent-d-2, #c7a900);
}

.expert-evidence-alert--error {
	background-color: var(--error-10, #fee9e9);
	border-color: var(--error-40, #e8a0a0);
	color: var(--error, #d45959);
}

.expert-evidence-alert--success {
	background-color: var(--success-10, #e9f2d3);
	border-color: var(--success-40, #c0d86d);
	color: var(--success, #77a113);
}

.expert-evidence-alert--info {
	background-color: var(--neutral-10, #dce9f3);
	border-color: var(--neutral-40, #a0c2dc);
	color: var(--neutral-d-1, #387cb0);
}

.expert-evidence-alert--notice {
	background-color: var(--bg-surface, #ffffff);
	border-color: var(--border-primary, #cccccc);
	color: var(--neutral, #999999);
}

/* ----------------------------------------------------------
   Button
   ---------------------------------------------------------- */

.expert-evidence-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	padding: var(--btn-space, var(--space-xs) var(--space-s));
	font-size: var(--text-m, 0.9rem);
	font-weight: 600;
	border-radius: var(--radius-full, 4px);
	text-decoration: none;
	transition: all 0.2s ease-in-out;
	background-color: var(--core, #ec7100);
	color: var(--text-light, #ffffff);
	border: 1px solid transparent;
	box-shadow: var(--shadow-s, none);
}

.expert-evidence-button:hover {
	background-color: var(--neutral, #666666);
	color: var(--text-light, #ffffff);
	transform: translateY(-1px);
}

.expert-evidence-button--light {
	background-color: var(--bg-surface, #ffffff);
	color: var(--text-body, #666666);
	border-color: var(--border-primary, #cccccc);
}

.expert-evidence-button--light:hover {
	background-color: var(--dark-5, #f5f5f5);
	color: var(--text-title, #333333);
}

.expert-evidence-button--dark {
	background-color: var(--core, #676767);
	color: var(--text-light, #ffffff);
}

.expert-evidence-button--dark:hover {
	background-color: var(--core-d-1, #484848);
}

.expert-evidence-button--large {
	font-size: var(--text-l, 1rem);
	padding: var(--space-s) var(--space-m);
}

.expert-evidence-button--small {
	font-size: var(--text-s, 0.75rem);
	padding: var(--space-2xs) var(--space-xs);
}

.expert-evidence-button--left {
	float: left;
	margin-right: var(--space-s, 0.75em);
}

.expert-evidence-button--right {
	float: right;
	margin-left: var(--space-s, 0.75em);
}

/* ----------------------------------------------------------
   List
   ---------------------------------------------------------- */

.expert-evidence-list {
	list-style: none;
	margin: 0 0 var(--space-m, 1.5rem) 0;
	padding: 0;
}

.expert-evidence-list li {
	padding: var(--space-2xs, 0.4em) 0 var(--space-2xs, 0.4em) var(--space-m, 1.75em);
	border-bottom: 1px dotted var(--border-primary, #e4e4e4);
	position: relative;
}

.expert-evidence-list li:last-child {
	border-bottom: none;
}

.expert-evidence-list li::before {
	position: absolute;
	left: var(--space-2xs, 0.25em);
	top: var(--space-2xs, 0.4em);
	font-style: normal;
	font-weight: 700;
}

.expert-evidence-list--arrow li::before { content: "›"; color: var(--core, #333); }
.expert-evidence-list--check  li::before { content: "✓"; color: var(--success, #77a113); }
.expert-evidence-list--minus  li::before { content: "–"; color: var(--neutral, #666); }
.expert-evidence-list--plus   li::before { content: "+"; color: var(--neutral-d-1, #387cb0); }
.expert-evidence-list--x      li::before { content: "✕"; color: var(--error, #d45959); }

/* ----------------------------------------------------------
   Toggle
   ---------------------------------------------------------- */

.expert-evidence-toggle {
	border: 1px solid var(--border-primary, #e8e8e8);
	border-radius: var(--radius-m, 3px);
	margin-bottom: var(--space-s, 1.25rem);
}

.expert-evidence-toggle__title {
	display: block;
	width: 100%;
	text-align: left;
	padding: var(--space-s, 0.9em) var(--space-m, 1em) var(--space-s, 0.9em) var(--space-2xl, 2.75em);
	font-size: var(--text-m, 0.95em);
	font-weight: 700;
	color: var(--neutral, #777777);
	background: none;
	border: none;
	cursor: pointer;
	position: relative;
	transition: color 0.15s ease, background-color 0.15s ease;
}

.expert-evidence-toggle__title::before {
	content: "+";
	position: absolute;
	left: var(--space-s, 1em);
	font-size: 1.1em;
	font-weight: 400;
}

.expert-evidence-toggle__title[aria-expanded="true"] {
	color: var(--accent, #ec7100);
}

.expert-evidence-toggle__title[aria-expanded="true"]::before {
	content: "–";
}

.expert-evidence-toggle__title:hover {
	color: var(--accent, #ec7100);
	background-color: var(--dark-5, #f8f8f8);
}

.expert-evidence-toggle__body {
	padding: var(--space-m, 1em);
	border-top: 1px dotted var(--border-primary, #d5d5d5);
}

/* ----------------------------------------------------------
   Accordion
   ---------------------------------------------------------- */

.expert-evidence-accordion {
	border-bottom: 1px solid var(--border-primary, #e8e8e8);
	margin-bottom: var(--space-m, 1.5rem);
}

.expert-evidence-accordion__title {
	display: block;
	width: 100%;
	text-align: left;
	padding: var(--space-s, 1em) var(--space-m, 1em) var(--space-s, 1em) var(--space-2xl, 2.75em);
	font-size: var(--text-m, 0.95em);
	font-weight: 700;
	color: var(--neutral, #777777);
	background: none;
	border: none;
	border-top: 1px solid var(--border-primary, #e8e8e8);
	cursor: pointer;
	position: relative;
	transition: color 0.15s ease, background-color 0.15s ease;
}

.expert-evidence-accordion__title::before {
	content: "+";
	position: absolute;
	left: var(--space-s, 1em);
	font-weight: 400;
	font-size: 1.1em;
}

.expert-evidence-accordion__title[aria-expanded="true"] {
	color: var(--accent, #ec7100);
}

.expert-evidence-accordion__title[aria-expanded="true"]::before {
	content: "–";
}

.expert-evidence-accordion__title:hover {
	color: var(--accent, #ec7100);
	background-color: var(--dark-5, #f8f8f8);
}

.expert-evidence-accordion__body {
	padding: var(--space-s, 0.5em) var(--space-m, 1em) var(--space-m, 1em) var(--space-2xl, 2.75em);
}

/* ----------------------------------------------------------
   Tabs
   ---------------------------------------------------------- */

.expert-evidence-tabs {
	margin-bottom: var(--space-m, 1.5rem);
}

.expert-evidence-tabs__nav {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3xs, 0.25rem);
	border-bottom: 1px solid var(--border-primary, #d5d5d5);
}

.expert-evidence-tabs__nav [role="tab"] {
	display: block;
	padding: var(--space-xs, 0.6em) var(--space-m, 1.25em);
	font-size: var(--text-m, 0.9rem);
	font-weight: 600;
	color: var(--neutral, #a6a6a6);
	background: var(--bg-surface, #f8f8f8);
	border: 1px solid var(--border-primary, #d5d5d5);
	border-bottom: none;
	border-radius: var(--radius-s, 4px) var(--radius-s, 4px) 0 0;
	cursor: pointer;
	transition: color 0.15s ease, background-color 0.15s ease;
	margin-bottom: -1px;
}

.expert-evidence-tabs__nav [role="tab"]:hover {
	color: var(--accent, #ec7100);
}

.expert-evidence-tabs__nav [role="tab"][aria-selected="true"] {
	color: var(--accent, #ec7100);
	background: var(--bg-body, #ffffff);
	border-top: 2px solid var(--accent, #ec7100);
}

.expert-evidence-tabs [role="tabpanel"] {
	padding: var(--space-m, 1.25em);
	border: 1px solid var(--border-primary, #d5d5d5);
	border-top: none;
	background: var(--bg-body, #fff);
	border-radius: 0 0 var(--radius-m, 4px) var(--radius-m, 4px);
}

/* ----------------------------------------------------------
   Video
   ---------------------------------------------------------- */

.expert-evidence-video {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	margin-bottom: var(--space-m, 1.5rem);
	border-radius: var(--radius-m, 4px);
	box-shadow: var(--shadow-m, none);
}

.expert-evidence-video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
}
