/* =====================================================================
   TH Int. Markets – Länder-Akkordeon
   CSS-Klassen in Elementor (Erweitert → CSS-Klassen):
     .th-loc (Container pro Land), .th-loc__country, .th-loc__firma,
     .th-loc__addr, .th-loc__web, .th-loc__icon
   Breakpoint 1025px muss mit DESKTOP in th-standorte.js übereinstimmen.
   ===================================================================== */
/* ---------- Grundgerüst (Mobile zuerst) ---------- */
.th-loc {
	display: grid !important;
	grid-template-columns: 1fr 2.5rem;
	grid-template-areas:
		"country icon"
		"firma   firma"
		"addr    addr"
		"web     web";
	gap: 0;
	align-items: end !important;
	padding: 10px 0 0;
	border-top: 1px solid #9a9a9a;
}

.th-loc:last-child {
	padding: 10px 0;
}
/* Falls der Container auf "Boxed" steht: Inner-Wrapper neutralisieren */
.th-loc > .e-con-inner { display: contents; }
.th-loc > .elementor-element,
.th-loc > .e-con-inner > .elementor-element {
	margin: 0 !important;
	width: auto !important;
	max-width: none !important;
}

.th-loc .th-loc__country { grid-area: country; cursor: pointer;}
.th-loc .th-loc__firma   { grid-area: firma; }
.th-loc .th-loc__addr    { grid-area: addr; }
.th-loc .th-loc__web     { grid-area: web; }
.th-loc .th-loc__icon    { grid-area: icon; align-self: start; cursor: pointer; }

.th-loc p { margin: 0; }
.th-loc .th-loc__country :focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }

/* Pfeil drehen */
.th-loc .th-loc__icon :is(i, svg) { transition: transform .2s ease; }
.th-loc.is-open .th-loc__icon :is(i, svg) { transform: rotate(180deg); }

/* Mobile: zugeklappt nur Land + Pfeil */
.th-loc:not(.is-open) :is(.th-loc__firma, .th-loc__addr, .th-loc__web) { display: none; }

/* aufgeklappt */
.th-loc.is-open {
	gap: 5px 0;
}

.th-loc.is-open .th-loc__country {
	padding: 10px 0 15px;
}

/* Manueller Umbruch (Shift+Enter): Mobile = Leerzeichen */
.th-loc .th-loc__addr .th-br { display: inline; }

/* ---------- Desktop ---------- */
@media (min-width: 1024px) {
	.th-loc {
		grid-template-columns: 27.5% 40.5% 1fr 2.5rem;
		grid-template-areas:
			"country firma web  icon"
			".       addr  .    .";
	}
	/* Firma + Website immer sichtbar, nur die Adresse klappt auf */
	.th-loc:not(.is-open) :is(.th-loc__firma, .th-loc__web) { display: block; }
	.th-loc.is-open :is(.th-loc__firma, .th-loc__web) { margin-top: 0 !important; }
	.th-loc .th-loc__firma { cursor: pointer; }

	/* Adresse in der Firmen-Spalte, etwas Abstand zwischen Spalte und Website */
	.th-loc .th-loc__firma,
	.th-loc .th-loc__addr { padding-right: 2rem; }
	.th-loc .th-loc__addr { line-height: 1.7; }
	
	.th-loc.is-open .th-loc__country {
		padding-bottom: 0;
	}

	/* Manueller Umbruch (Shift+Enter): Desktop = neue Zeile */
	.th-loc .th-loc__addr .th-br { display: block; height: 0; }
}