/*
Theme Name: VIVA
Description: Child-Theme fuer viva.systems auf Hello Elementor. Das Aussehen steckt im Elementor-Kit; hier liegen nur Schriften, die Grundstile der Altseite (Twenty Seventeen) und Angleichungen an Elementor 3.21.
Template: hello-elementor
Version: 0.1.0
Requires PHP: 8.2
Text Domain: viva
*/

/*
 * Angleichung an Elementor 3.21 (Altseite).
 *
 * Jede Regel hier gleicht eine Stelle aus, an der Elementor 4 anders rendert
 * als 3.21 und die Altseite deshalb anders aussah. Gemessen, nicht vermutet
 * (tools/regel.mjs zeigt die Quelle jedes Werts).
 */

/* Ueberschriften: Elementor 3.21 bettete das Stilblatt des Ueberschriften-
   Widgets (mit margin:0) nur auf manchen Seiten ein - gemessen auf 204 von
   209 Seiten, es fehlte NUR auf den fuenf Startseiten. Dort galt Twenty
   Seventeen (h1-h6: 0 0 .75em, p: 0 0 1.5em). Elementor 4 setzt ueberall
   margin:0; die Startseiten bekommen den alten Rand ueber die body-Klasse
   (functions.php). */
.viva-ueberschrift-rand h1.elementor-heading-title,
.viva-ueberschrift-rand h2.elementor-heading-title,
.viva-ueberschrift-rand h3.elementor-heading-title,
.viva-ueberschrift-rand h4.elementor-heading-title,
.viva-ueberschrift-rand h5.elementor-heading-title,
.viva-ueberschrift-rand h6.elementor-heading-title {
	margin: 0 0 0.75em;
}

.viva-ueberschrift-rand p.elementor-heading-title {
	margin: 0 0 1.5em;
}

/* Seitentitel (h1.entry-title) waren ueberall ausgeblendet: die tote
   ElementsKit-Kopfvorlage 95, auf jeder Seite eingebunden, brachte ihr
   Stilblatt mit `:root { --page-title-display: none }` mit (gemessen auf
   /de/unternehmen/; Archiv- und Suchtitel sind h1.page-title und blieben).
   html:root, weil Elementor selbst :root { ...: block } setzt. */
html:root {
	--page-title-display: none;
}
/* Dieselbe Variable blendet in 4.x auch das Titel-Widget aus (Klasse
   elementor-page-title). Die umgewandelten Titel von The Plus waren davon auf
   der Altseite nicht betroffen - gemessen: Beitragstitel fehlten. */
.viva-titel-ohne-rand.elementor-page-title {
	--page-title-display: block;
}
/* Ebenso Titel in Loop-Eintraegen (Trefferliste der Suche, Vorlage 100976):
   dort ist der Titel der des Treffers, nicht der Seite - ausgeblendet blieben
   nur leere Zeilen (2026-10-02). */
.e-loop-item .elementor-page-title {
	--page-title-display: block;
}

/* Bootstrap-Klassen aus der Joomla-Zeit im Beitragsinhalt (/consulting-
   development/: Bilder rechts neben dem Text). Die Altseite bekam die Regeln
   zufaellig aus wpdmpp.css von Premium Packages, das auf jeder Seite hing. */
.pull-left {
	float: left;
}
.pull-right {
	float: right;
}

/* Beitragstitel aus The Plus: dort sass der Rand auf dem Titel selbst (jetzt
   auf dem Widget) - die Angleichung oben darf nicht zusaetzlich greifen. */
.viva-titel-ohne-rand .elementor-heading-title,
.viva-titel-ohne-rand .elementor-headline {
	margin: 0;
}

/* Lange Adressen im Beitragstext brechen um. Im Original zog eine einzige
   (capterra.com, 701 px) den ganzen Text ueber Spalte und Bildschirm hinaus
   (Canva-/Affinity-Vergleich, VIVA Points) - Altfehler, nicht nachgebaut. */
.elementor-widget-theme-post-content a {
	overflow-wrap: anywhere;
}

/* Aufklapper: das Widget faerbt die Titelzeile (zu, Hover, offen) - der
   Titel darin ist ein h3 und bekam sonst die h3-Farbe des Kits (schwarz statt
   #313131, offen nicht weiss). */
.elementor-widget-n-accordion .e-n-accordion-item-title-text {
	color: inherit;
}
/* "hover-style-2" von The Plus: beim Ueberfahren eine 3-px-Linie unten in
   der Akzentfarbe (0.3 s), ohne dass der Balken waechst; geoeffnet faerbt
   das Widget den ganzen Balken (gemessen auf /designer/faq/). */
.viva-aufklapper-linie .e-n-accordion-item-title {
	transition: box-shadow 0.3s linear;
}
.viva-aufklapper-linie .e-n-accordion-item-title:hover {
	box-shadow: inset 0 -3px 0 var(--e-global-color-68ab1e4, #aa1313);
}

/* Beitragsliste (vorher Ultimate Post Kit "Fanel List"): Titel senkrecht
   mittig neben dem Bild. Bildformat, Polster, Schatten und Titelschrift
   setzt das Widget je Instanz. */
.viva-beitragsliste .elementor-post {
	align-items: center;
}

/* Inhaltsverzeichnis (vorher Qi): 3 px zwischen den Eintraegen, kein Kasten,
   Aufzaehlungspunkte, Text 33 px eingerueckt, Schrift 300 (gemessen auf
   /de/systemanforderungen-vivadesigner-und-database-publishing/). */
.viva-inhalt .elementor-toc__list-item {
	margin-left: 33px;
	list-style: disc outside;
}
.viva-inhalt .elementor-toc__list-item-text {
	font-weight: 300;
}
.viva-inhalt .elementor-toc__list-item {
	margin-bottom: 3px;
}
.viva-inhalt .elementor-toc__header {
	padding: 0;
	border: 0;
}

/* Umschalter (vorher Unlimited Elements "Content Switcher"): die Reiter
   bilden EIN graues Band mit runden Aussenecken, der aktive ist eine rote Pille. */
.viva-umschalter .e-n-tabs-heading {
	flex-grow: 0;
	margin-inline: auto;
	border-radius: 5px;
	background: #dedede;
}

/* Newsletter-Formulare (AcyMailing): 11.x setzt je Formular "display: block;
   margin-bottom: 1rem" auf Eingabefelder und Auswahllisten (fest im Plugin,
   back/Partial/forms/fields.php), 9.7.2 der Altseite nicht - gemessen +16 bis
   +28 px je Formular. Die Breite kommt aus der Formulareinstellung
   fields_width (Importer: 100 wie alt). */
.acym__subscription__form__fields .onefield select {
	display: inline-block !important;
}
.acym__subscription__form__fields .onefield input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]),
.acym__subscription__form__fields .onefield select,
.acym__subscription__form__fields .onefield textarea {
	margin-bottom: 0 !important;
}

/* Sprachauswahl im Fuss (WPML "legacy dropdown click"): WPML 5 gibt der
   aufgeklappten Liste neu einen weissen Grund (#wpml-ls-submenu-click-default),
   die Eintraege sind weiss - unlesbar. Auf der Altseite (WPML 4) war die Liste
   durchsichtig, der unterste Eintrag stand dort ueber dem hellen Seitengrund und
   war kaum zu lesen. Deshalb der Grund des Knopfes (#282828, gemessen). */
#wpml-ls-submenu-click-default.wpml-ls-sub-menu {
	background-color: #282828;
}

/* Font Awesome: Float Menu Pro 7 laedt Font Awesome 7 auf jeder Seite, und das
   gibt jedem Icon eine feste Breite von 1.25em (var(--fa-width)). Auf der
   Altseite (Font Awesome 5/6) hatten Icons ihre natuerliche Breite - gemessen
   z. B. die Reiter-Icons auf /designer/: 22,5/20 px statt 25. Wie FA7s eigene
   Klasse .fa-width-auto, nur fuer alle; .fa-fw bleibt fest (setzt die Variable
   am Element selbst). */
:root {
	--fa-width: auto;
}