/* ==========================================================================
   A-Z CITY INDEX (.mygc-az-buttons / .mygc-az-btn)
   Genutzt auf: front-page.html, /german-cities (Übersicht) und den 26
   Buchstabenseiten /german-cities-a … -z. Einzige Datei, die für alle drei
   Zielseiten conditional geladen wird — s. mygc_enqueue_cities_az() in
   functions.php: is_front_page() ODER Slug german-cities(-a…z).

   Fund (Juli 2026): Die Kachel-Optik (s. unten) lag zunächst irrtümlich in
   front-page.css. Dort greift aber ausschließlich mygc_enqueue_front_page()
   → nur bei is_front_page(), ohne Ausnahme für die german-cities-Seiten (der
   gegenteilige Kommentar in front-page.html/front-page.css beschrieb einen
   Plan, der in functions.php nie umgesetzt wurde). Ruleset daher hierher
   verschoben — diese Datei ist die einzige mit der korrekten Enqueue-
   Bedingung für alle drei Zielseiten.

   Fund (Juli 2026): Frühere Version dieser Datei enthielt zusätzlich Regeln
   für .wp-block-buttons/.wp-block-button__link — Relikt aus einer
   Zwischenstufe von front-page.html, als dessen A-Z-Bereich noch aus 26
   echten wp:button-Blöcken bestand (vor Umstieg auf die <ul>-Kacheln unten).
   Das alte Theme selbst stellt die A-Z-Links in einer <table> dar und hat
   mit diesen Klassen nichts zu tun. Seit dem geplanten Direktumstieg der 27
   <table>-Seiten auf das <ul>-Markup (ohne wp:buttons-Zwischenschritt) ohne
   jeden Anwendungsfall — entfernt.
   ========================================================================== */

.mygc-az-buttons {
	display: grid;
	grid-template-columns: repeat(13, minmax(0, 1fr));
	gap: var(--wp--preset--spacing--2);
	list-style: none;
	margin-block-start: var(--wp--preset--spacing--5);
	margin-block-end: 0;
	margin-inline: 0;
	padding: 0;
}
.mygc-az-buttons li { margin: 0; }

.mygc-az-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0.5rem 0;
	font-size: 0.8125rem;
	font-weight: 600;
	text-decoration: none;
	border-radius: 4px;
	border: 1px solid var(--wp--preset--color--politics-gray);
	color: var(--wp--preset--color--politics-gray);
	background: var(--wp--preset--color--white);
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
/* Fund (Juli 2026): a:visited (style.css, Spezifität 0,1,1) schlägt eine
   einzelne Klasse wie .mygc-az-btn (0,1,0) — ohne diese Regel erscheinen
   bereits besuchte Buchstaben-Links blau statt politics-gray. Gleiches
   Muster wie .mygc-state-pill/.mygc-map-label (front-page.css); dort schon
   gefixt, hier bislang gefehlt. */
.mygc-az-btn:visited {
	color: var(--wp--preset--color--politics-gray);
}
.mygc-az-btn:hover,
.mygc-az-btn:focus-visible {
	background: var(--wp--preset--color--country-teal);
	border-color: var(--wp--preset--color--country-teal);
	color: var(--wp--preset--color--white);
}

@media (max-width: 640px) {
	.mygc-az-buttons { grid-template-columns: repeat(auto-fill, minmax(44px, 1fr)); }
}

/* Fund (Juli 2026): Modifier für die 27 eigenständigen A-Z-Seiten
   (/german-cities + die 26 Buchstabenseiten), wo direkt nach der Liste
   Fließtext folgt statt Spacer + Button wie auf front-page.html. Bewusst
   NICHT über margin-block-end an .mygc-az-buttons selbst gelöst, da das
   auch die Startseite treffen würde (dort bereits eigener 12px-Spacer vor
   dem "View all cities"-Button — Doppel-Lücke). Nur bei Bedarf zusätzlich
   auf das <ul> setzen: class="mygc-az-buttons mygc-az-buttons--with-gap". */
.mygc-az-buttons--with-gap {
	margin-block-end: var(--wp--preset--spacing--7);
}