/*
 * Front-end styles for [wizsp_officers].
 * Colors read the site's own Avada "--awb-colorN" custom properties first,
 * falling back to the AMD Green palette (color5 #094830) they currently
 * resolve to, so the block keeps matching the theme if that palette changes.
 */

.wizsp-do {
	--wizsp-do-white: var( --awb-color1, #ffffff );
	--wizsp-do-tint: var( --awb-color2, #f8f9fa );
	--wizsp-do-line: var( --awb-color3, #d0cfcd );
	--wizsp-do-accent: var( --awb-color4, #457f6a );
	--wizsp-do-brand: var( --awb-color5, #094830 );
	--wizsp-do-brand-hover: var( --awb-color6, #598373 );
	--wizsp-do-ink-soft: var( --awb-color7, #182c25 );
	--wizsp-do-ink: var( --awb-color8, #000000 );

	max-width: 100%;
}

.wizsp-do-empty {
	color: var( --wizsp-do-ink-soft );
}

.wizsp-do-current__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.5em 1.5em;
	margin: 0 0 1em;
}

.wizsp-do-current__heading {
	margin: 0;
	color: var( --wizsp-do-ink );
}

.wizsp-do-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	background: var( --wizsp-do-brand );
	color: var( --wizsp-do-white );
	padding: 0.35em 1em;
	border-radius: 999px;
	font-size: 0.8em;
	font-weight: 600;
	letter-spacing: 0.02em;
	white-space: nowrap;
}

.wizsp-do-badge em {
	font-style: normal;
	font-weight: 400;
	opacity: 0.85;
}

.wizsp-do-table-wrap {
	background: var( --wizsp-do-white );
	border: 1px solid var( --wizsp-do-line );
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 6px 20px -8px rgba( 0, 0, 0, 0.15 );
}

.wizsp-do-table {
	width: 100%;
	border-collapse: collapse;
}

.wizsp-do-table thead th {
	text-align: left;
	background: var( --wizsp-do-brand );
	color: var( --wizsp-do-white );
	font-size: 0.75em;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	padding: 0.9em 1.25em;
}

.wizsp-do-table tbody tr {
	border-top: 1px solid var( --wizsp-do-tint );
}

.wizsp-do-table tbody tr:first-child {
	border-top: none;
}

.wizsp-do-table tbody tr:hover {
	background: var( --wizsp-do-tint );
}

.wizsp-do-table td {
	padding: 0.85em 1.25em;
	vertical-align: top;
}

.wizsp-do-table__rank {
	width: 55%;
	color: var( --wizsp-do-ink-soft );
}

.wizsp-do-table__name {
	color: var( --wizsp-do-ink );
	font-weight: 600;
}

.wizsp-do-history {
	margin-top: 2.5em;
}

.wizsp-do-history__heading {
	margin: 0 0 0.75em;
	color: var( --wizsp-do-ink );
}

.wizsp-do-accordion {
	background: var( --wizsp-do-white );
	border: 1px solid var( --wizsp-do-line );
	border-radius: 16px;
	overflow: hidden;
}

.wizsp-do-accordion__item {
	border-top: 1px solid var( --wizsp-do-line );
}

.wizsp-do-accordion__item:first-child {
	border-top: none;
}

.wizsp-do-accordion__trigger {
	display: flex;
	align-items: center;
	gap: 1em;
	padding: 1em 1.25em;
	cursor: pointer;
	color: var( --wizsp-do-ink );
	list-style: none;
}

.wizsp-do-accordion__trigger::-webkit-details-marker {
	display: none;
}

.wizsp-do-accordion__trigger:hover,
.wizsp-do-accordion__trigger:focus-visible {
	background: var( --wizsp-do-tint );
}

.wizsp-do-accordion__term {
	font-weight: 600;
}

.wizsp-do-accordion__count {
	margin-left: auto;
	font-size: 0.85em;
	color: var( --wizsp-do-ink-soft );
	opacity: 0.8;
}

.wizsp-do-accordion__icon {
	flex: 0 0 auto;
	width: 0.55em;
	height: 0.55em;
	border-right: 2px solid var( --wizsp-do-brand );
	border-bottom: 2px solid var( --wizsp-do-brand );
	transform: rotate( 45deg );
	transition: transform 0.2s ease;
}

.wizsp-do-accordion__item[open] .wizsp-do-accordion__icon {
	transform: rotate( -135deg );
}

.wizsp-do-accordion__panel-inner {
	padding: 0 1.25em 1.25em;
}

.wizsp-do-accordion__panel-inner .wizsp-do-table-wrap {
	box-shadow: none;
}