/* =========================================================
   CATALEYA MASSAGE – KLICK-REGEL
   Eine einzige Methode für alles, was man anklicken kann.

   Wird als LETZTE Datei geladen (inc/assets.php), damit sie sich überall durchsetzt.

   Die Regel
   ---------
   1. BUTTONS (Fläche in der Markenfarbe, weiße Schrift): Beim Darüberfahren, Tastaturfokus
      und Anklicken wechselt die Schrift von Weiß auf die Markenfarbe (Magenta) und die Fläche
      auf dunkles Grün (style.css: --cataleya-action). Der Rand bleibt in der Markenfarbe.
      Betroffen: Slider- und Willkommensband-Buttons (.btn-primary), Buttons im Seiteninhalt
      (.cataleya-button und Editor-Buttons in der Markenfarbe), „Termin sichern“ in der Kopfzeile,
      Suchen, Formular „Absenden“ (Forminator), Gästebuch „Eintrag speichern“.
   2. TEXT-LINKS und alles übrige: Die Farbe ändert sich NICHT. Das Zeichen für „anklickbar“ ist
      ein Unterstrich (2 px dick, 3 px Abstand zum Text):
        - auf weißem Grund bei dunklem Text (Kontakt, Untermenüs): rosa,
        - bei rosa Text und im Fußbereich: in der Farbe des Textes bzw. weiß.
   3. Symbole ohne Text (Menü-Schalter, „Nach oben“) bekommen einen Balken am unteren
      Rand statt des Unterstrichs.
   4. Tastatur: derselbe Hinweis plus ein Fokusrahmen in der Markenfarbe (base.css).
   5. Das Hauptmenü oben hat seinen eigenen Balken (header.css), deshalb dort kein Unterstrich.
   6. Der aktive Menüpunkt (die Seite, auf der man ist) ist rosa – das ist ein Zustand,
      keine Hover-Reaktion.
   7. WooCommerce-Buttons (Warenkorb, Kasse, Mein Konto) behalten ihr Aussehen und bekommen
      nur den Unterstrich.

   Zum Ändern der Methode genügt diese eine Datei; das Grün steht in style.css.
   ========================================================= */


/* ---------------------------------------------------------
   1a. BUTTONS: SCHRIFT WIRD MAGENTA, FLÄCHE DUNKELGRÜN
   „body“ und !important sind nötig, weil die Farben dieser Buttons aus mehreren Quellen kommen
   (Bootstrap, WordPress-Editorfarben, Kadence-Palette, Forminator, Slider) und teils selbst
   !important tragen.
   --------------------------------------------------------- */

body :is(
	.btn-primary,
	a.cataleya-button,
	.wp-block-button__link.has-vivid-red-background-color,
	.search-submit,
	.cataleya-desktop-booking a,
	.cataleya-compact-booking a,
	.forminator-button-submit,
	input.gwolle_gb_submit
):not(:disabled, .disabled, [aria-disabled="true"]):is(:hover, :focus-visible, :active) {
	border-color: var(--primary) !important;
	background-color: var(--cataleya-action) !important;
	color: var(--primary) !important;
	text-decoration-line: none;
}


/* ---------------------------------------------------------
   1. TEXT-LINKS UND ÜBRIGE BUTTONS: UNTERSTRICH
   (Die Buttons aus 1a bekommen stattdessen den Farbwechsel; ihre Regel ist stärker.)
   --------------------------------------------------------- */

a:is(:hover, :focus-visible, :active),
.btn:is(:hover, :focus-visible, :active),
.search-submit:is(:hover, :focus-visible, :active),
.cataleya-page-content a:is(:hover, :focus-visible, :active),
.cataleya-page-content a.cataleya-button:is(:hover, :focus-visible, :active),
#cataleya-compact-navigation a:is(:hover, :focus-visible, :active),
#cataleya-compact-navigation .cataleya-compact-menu-list > li > a:is(:hover, :focus-visible, :active),
.cataleya-desktop-menu-list .sub-menu a:is(:hover, :focus-visible, :active) {
	text-decoration-line: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

/* WooCommerce-Buttons (Warenkorb, Kasse, Mein Konto): gleiche Regel, ihr Aussehen bleibt.
   „body“ davor macht die Regel stärker als die von WooCommerce, egal in welcher Reihenfolge geladen wird. */
body .woocommerce a.button:is(:hover, :focus-visible, :active),
body .woocommerce button.button:is(:hover, :focus-visible, :active),
body .woocommerce input.button:is(:hover, :focus-visible, :active),
body .woocommerce #respond input#submit:is(:hover, :focus-visible, :active),
body .woocommerce-page a.button:is(:hover, :focus-visible, :active),
body .woocommerce-page button.button:is(:hover, :focus-visible, :active),
body .woocommerce-page input.button:is(:hover, :focus-visible, :active) {
	text-decoration-line: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}


/* ---------------------------------------------------------
   2. FARBE DES UNTERSTRICHS
   Standard = Farbe des Textes (rosa bei rosa Text).
   Ausnahmen: dunkler Text auf weißem Grund bekommt einen rosa Unterstrich,
   die Fußzeile einen weißen.
   --------------------------------------------------------- */

.cataleya-desktop-contact a:is(:hover, :focus-visible, :active),
.cataleya-desktop-menu-list .sub-menu a:is(:hover, :focus-visible, :active),
#cataleya-compact-navigation a:is(:hover, :focus-visible, :active),
#cataleya-compact-navigation .cataleya-compact-menu-list > li > a:is(:hover, :focus-visible, :active) {
	text-decoration-color: var(--primary);
}

.cataleya-footer a:is(:hover, :focus-visible, :active) {
	text-decoration-color: #fff;
}


/* ---------------------------------------------------------
   3. BOOTSTRAP-BAUSTEINE OHNE EIGENE HOVER-FARBE
   Bootstrap färbt beim Darüberfahren den Hintergrund grau. Hier bleibt er, wie er ist;
   angezeigt wird die Reaktion durch den Unterstrich aus Abschnitt 1.
   --------------------------------------------------------- */

.pagination > li:not(.active):not(.disabled) > a:is(:hover, :focus),
.pagination > li:not(.active):not(.disabled) > span:is(:hover, :focus),
.pager li:not(.disabled) > a:is(:hover, :focus),
a.list-group-item:not(.active):is(:hover, :focus) {
	background-color: #fff;
	border-color: #ddd;
}

.nav > li:not(.active):not(.disabled) > a:is(:hover, :focus) {
	background-color: transparent;
}

.nav-tabs > li:not(.active) > a:is(:hover, :focus) {
	border-color: transparent;
}

.btn-default:is(:hover, :focus, :active) {
	border-color: #ccc;
	background-color: #fff;
	color: #333;
}

.label-default[href]:is(:hover, :focus) {
	background-color: #777;
}


/* ---------------------------------------------------------
   4. AUSNAHMEN
   --------------------------------------------------------- */

/* Logos sind Bilder und „Nach oben“ ist ein Symbol: kein Unterstrich, dafür der Fokusrahmen (base.css) bei Tastaturbedienung. */
.cataleya-compact-logo a:is(:hover, :focus-visible, :active),
.cataleya-main-logo a:is(:hover, :focus-visible, :active),
.cataleya-partner-logo a:is(:hover, :focus-visible, :active),
.cataleya-footer-logo-link:is(:hover, :focus-visible, :active),
.cataleya-scroll-top:is(:hover, :focus-visible, :active) {
	text-decoration-line: none;
}

/* Hauptmenü oben (Desktop): eigener Balken in header.css, kein zusätzlicher Unterstrich. */
.cataleya-desktop-menu-list > li > a:is(:hover, :focus-visible, :active) {
	text-decoration-line: none;
}


/* ---------------------------------------------------------
   5. SYMBOLE OHNE TEXT: BALKEN AM UNTEREN RAND
   --------------------------------------------------------- */

.cataleya-compact-menu-toggle:is(:hover, :focus-visible, :active) {
	box-shadow: inset 0 -3px 0 var(--primary);
}

.cataleya-scroll-top:is(:hover, :focus-visible, :active) {
	box-shadow: inset 0 -3px 0 #fff;
}


/* ---------------------------------------------------------
   6. TIPPEN AUF DEM HANDY
   Kurzes Aufleuchten in der Markenfarbe statt des grauen/blauen Systemrahmens.
   --------------------------------------------------------- */

html {
	-webkit-tap-highlight-color: rgba(var(--primary-rgb), 0.15);
}
