/* [georgia_chapters] — Omega purple and old gold. */

/* Give the page that shows the chapters (or regions) more room than Divi's usual 1080px
   content area, still centered. Only containers holding the list are
   affected, so the rest of the site keeps its layout. */
#main-content .container:has(.oppga-ch) {
	width: 94%;
	max-width: 1400px;
}

.oppga-ch {
	--ch-purple: #4b2c71;
	--ch-purple-soft: #f4f0f9;
	--ch-gold: #cfb53b;
	--ch-border: #e3dfe8;
	--ch-text: #4b2c71; /* Purple, not black. */
	--ch-muted: #6e5a8a;
	color: var(--ch-text);
	font-size: 16px;
	line-height: 1.45;
}

.oppga-ch__stats {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 24px;
	margin: 0 0 16px;
	color: var(--ch-muted);
}
.oppga-ch__stats strong {
	color: var(--ch-purple);
	font-size: 1.35em;
	font-variant-numeric: tabular-nums;
}

.oppga-ch__controls:not([hidden]) {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 12px 16px;
	margin-bottom: 12px;
}
.oppga-ch__label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: var(--ch-muted);
	margin-bottom: 4px;
}
.oppga-ch__search {
	flex: 1 1 280px;
}
.oppga-ch__filter {
	flex: 0 1 240px;
}
.oppga-ch input[type="search"],
.oppga-ch select {
	width: 100%;
	box-sizing: border-box;
	min-height: 44px;
	padding: 8px 12px;
	border: 1px solid #b9b2c3;
	border-radius: 6px;
	background: #fff;
	color: var(--ch-text);
	font: inherit;
}
.oppga-ch input[type="search"]:focus,
.oppga-ch select:focus {
	outline: 2px solid var(--ch-purple);
	outline-offset: 1px;
	border-color: var(--ch-purple);
}
.oppga-ch__count {
	flex-basis: 100%;
	margin: 0;
	padding: 0 !important; /* Divi pads every <p>. */
	font-size: 14px;
	color: var(--ch-muted);
}

.oppga-ch__scroll {
	max-height: 70vh;
	overflow: auto;
	border: 1px solid var(--ch-border);
	border-top: 3px solid var(--ch-gold);
	border-radius: 6px;
	background: #fff;
}
.oppga-ch__table {
	width: 100%;
	margin: 0 !important;
	border: 0 !important;
	border-collapse: collapse;
}
.oppga-ch__table th,
.oppga-ch__table td {
	padding: 10px 14px !important;
	border: 0 !important;
	border-bottom: 1px solid var(--ch-border) !important;
	text-align: left;
	vertical-align: middle;
}
.oppga-ch__table thead th {
	position: sticky;
	top: 0;
	z-index: 1;
	background: var(--ch-purple);
	color: #fff;
	font-weight: 600;
	white-space: nowrap;
	padding: 0 !important;
}
.oppga-ch__table tbody tr:nth-child(even) {
	background: #faf9fc;
}
.oppga-ch__table tbody tr:hover {
	background: var(--ch-purple-soft);
}
.oppga-ch__num {
	font-variant-numeric: tabular-nums;
	color: var(--ch-muted);
	width: 7em;
}
.oppga-ch__table thead th:not(:has(button)) {
	padding: 12px 14px !important;
}

.oppga-ch__sort {
	display: flex;
	align-items: center;
	gap: 6px;
	width: 100%;
	padding: 12px 14px;
	border: 0;
	background: none;
	color: inherit;
	font: inherit;
	text-align: left;
	cursor: pointer;
}
.oppga-ch__sort:hover {
	background: rgba(255, 255, 255, 0.1);
}
.oppga-ch__sort:focus-visible {
	outline: 2px solid var(--ch-gold);
	outline-offset: -2px;
}
.oppga-ch__arrow::after {
	content: "\2195";
	opacity: 0.45;
	font-size: 0.85em;
}
[aria-sort="ascending"] .oppga-ch__arrow::after {
	content: "\25B2";
	opacity: 1;
	color: var(--ch-gold);
}
[aria-sort="descending"] .oppga-ch__arrow::after {
	content: "\25BC";
	opacity: 1;
	color: var(--ch-gold);
}

.oppga-ch__omega {
	display: inline-block;
	margin-left: 6px;
	padding: 1px 8px;
	border-radius: 999px;
	background: #ece7f3;
	color: var(--ch-purple);
	font-size: 12px;
	font-weight: 600;
	white-space: nowrap;
}

.oppga-ch__empty:not([hidden]) {
	margin: 16px 0 0;
	padding: 16px !important;
	text-align: center;
	color: var(--ch-muted);
	background: #faf9fc;
	border-radius: 6px;
}

/* Phones: each chapter becomes a card. */
@media (max-width: 640px) {
	.oppga-ch__scroll {
		max-height: none;
		overflow: visible;
		border: 0;
		background: none;
	}
	/* The headers stay as a strip of sort buttons above the cards. */
	.oppga-ch__table thead,
	.oppga-ch__table thead tr {
		display: flex;
		flex-wrap: wrap;
		margin-bottom: 10px;
		border-radius: 6px;
		overflow: hidden;
	}
	.oppga-ch__table thead th {
		position: static;
		flex: 1 1 50%;
		box-sizing: border-box;
		border-bottom: 0 !important;
	}
	.oppga-ch__table,
	.oppga-ch__table tbody,
	.oppga-ch__table tr,
	.oppga-ch__table td {
		display: block;
		width: auto;
	}
	.oppga-ch__table tbody tr {
		margin-bottom: 10px;
		border: 1px solid var(--ch-border);
		border-left: 4px solid var(--ch-gold);
		border-radius: 6px;
		background: #fff !important;
	}
	.oppga-ch__table td {
		display: flex;
		gap: 12px;
		padding: 6px 12px !important;
		border-bottom: 0 !important;
	}
	.oppga-ch__table td::before {
		content: attr(data-label);
		flex: 0 0 6.5em;
		font-size: 13px;
		font-weight: 600;
		color: var(--ch-muted);
	}
}

/* Chapters only. */
.oppga-ch__name {
	font-weight: 700;
	color: var(--ch-purple);
}
.oppga-ch__table td {
	vertical-align: top;
}
.oppga-ch__note {
	display: block;
	font-size: 12px;
	color: var(--ch-muted);
}
.oppga-ch__status {
	display: inline-block;
	padding: 1px 8px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	white-space: nowrap;
}
/* Status labels keep their own colors so they read at a glance; everything
   else on the page is purple. */
.oppga-ch__status--active {
	background: #e6f4ea;
	color: #1e6b34;
}
.oppga-ch__status--inactive {
	background: #eeeeee;
	color: #555555;
}
.oppga-ch__status--suspended {
	background: #fdecea;
	color: #a1281c;
}
.oppga-ch__filter {
	flex: 0 1 180px;
}

/* [georgia_regions] */
.oppga-ch__jump {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-bottom: 24px;
}
.oppga-ch__jump a {
	padding: 4px 12px;
	border: 1px solid var(--ch-border);
	border-radius: 999px;
	background: #fff;
	color: var(--ch-purple);
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}
.oppga-ch__jump a:hover,
.oppga-ch__jump a:focus-visible {
	background: var(--ch-purple-soft);
	border-color: var(--ch-purple);
}
.oppga-ch__region {
	margin: 0 0 20px;
	padding: 18px 20px;
	border: 1px solid var(--ch-border);
	border-top: 3px solid var(--ch-gold);
	border-radius: 8px;
	background: #fff;
	scroll-margin-top: 120px; /* Clear Divi's fixed header when jumping. */
}
.oppga-ch__region-title {
	margin: 0 0 10px !important;
	padding: 0 !important;
	color: var(--ch-purple);
	font-size: 22px !important;
	font-weight: 700;
	line-height: 1.3 !important;
}
.oppga-ch__region-code {
	display: inline-block;
	margin-right: 8px;
	padding: 1px 10px;
	border-radius: 999px;
	background: var(--ch-purple);
	color: #fff;
	font-size: 14px;
	vertical-align: 3px;
}
.oppga-ch__region-area {
	display: block;
	font-size: 15px;
	font-weight: 600;
	color: var(--ch-muted);
}
.oppga-ch__reps {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 32px;
	margin: 0 0 14px;
}
.oppga-ch__reps dt {
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--ch-muted);
}
.oppga-ch__reps dd {
	margin: 0;
	font-weight: 700;
	color: var(--ch-purple);
}
.oppga-ch__region-cols {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 8px 32px;
}
.oppga-ch__region-cols h3 {
	margin: 0 0 6px !important;
	padding: 0 !important;
	font-size: 15px !important;
	color: var(--ch-purple);
}
.oppga-ch__region-cols ul {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}
.oppga-ch__region-cols li {
	padding: 4px 0;
	border-bottom: 1px solid var(--ch-border);
	color: var(--ch-text);
}
.oppga-ch__region-cols li span {
	color: var(--ch-muted);
}
.oppga-ch__region-cols li span::before {
	content: " · ";
}
