/*
Theme Name: Uncode Child · Dr. Çoban-Başaran
Description: Child-Theme für dr-coban-basaran.at. Ergänzt Uncode nur dort per CSS, wo es keine Bordmittel gibt (Aura, Atemkreis, Blob, Glas-Navigation).
Author: Undsgn™
Author URI: http://www.undsgn.com
Template: uncode
Version: 1.0.0
Text Domain: uncode
*/

/* ==========================================================================
   Ergänzungen zu Uncode – nur, was die Theme Options und Elemente nicht abdecken.
   Klassen-Präfix: cb-
   ========================================================================== */

/* Atemkreis: Signet in einem Glas-Kreis, der im 10-s-Rhythmus atmet */
.cb-atem .t-entry-visual, .cb-atem .tmb, .cb-atem .t-inside { overflow: visible; }
.cb-atem .uncode-single-media-wrapper {
	position: relative; overflow: visible; border-radius: 50%;
	background: rgba(255, 255, 255, .55);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .9), 0 30px 60px -30px rgba(22, 57, 74, .35);
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	animation: cb-atmen 10s ease-in-out infinite;
}
.cb-atem .uncode-single-media-wrapper::after {
	content: ""; position: absolute; inset: -18%; border-radius: 50%;
	box-shadow: inset 0 0 0 1px rgba(28, 106, 130, .16);
	animation: cb-atmen 10s .25s ease-in-out infinite;
}
@keyframes cb-atmen { 0%, 100% { transform: scale(.9); } 45%, 55% { transform: scale(1.06); } }

/* Info-Chips wie im Entwurf: heller Icon-Kreis, kleines Label, kräftiger Wert */
.cb-info-chip .fa-stack { background: #eaf5f7 !important; border-color: #eaf5f7 !important; }
.cb-info-chip .icon-box-icon i { color: #1c6a82 !important; }
.cb-info-chip p { margin: 0; }
.cb-info-chip .cb-info-label { font-size: 12.5px; font-weight: 500; color: #4e6a77; line-height: 1.4; }
.cb-info-chip .cb-info-wert { font-size: 15.5px; font-weight: 600; color: #16394a; line-height: 1.45; }

/* Organische, langsam morphende Form für das Porträt */
.cb-blob .uncode-single-media-wrapper.img-circle {
	border-radius: 46% 54% 58% 42% / 48% 42% 58% 52%;
	animation: cb-morph 16s ease-in-out infinite;
}
@keyframes cb-morph { 50% { border-radius: 58% 42% 44% 56% / 54% 58% 42% 46%; } }

/* Detailfoto überlappt das Porträt */
.cb-detailbild { margin-top: -22% !important; position: relative; z-index: 2; }
/* Ring (6 px Schatten) und Bild mit gleichem Radius, damit die Ecken konzentrisch laufen: innen 20 px, außen 26 px */
.cb-detailbild .tmb, .cb-detailbild .t-inside, .cb-detailbild .t-entry-visual, .cb-detailbild .uncode-single-media-wrapper, .cb-detailbild img { border-radius: 20px !important; }
.cb-detailbild .tmb { box-shadow: 0 0 0 6px #fbfcfc, 0 24px 50px -24px rgba(22, 57, 74, .45); overflow: hidden; }

/* Signet im Credo weiß */
.cb-signet-weiss img { filter: brightness(0) invert(1); }

/* Karten heben sich bei Hover leicht an.
   Uncode setzt Radius und Hintergrund auf .uncell (nicht auf .uncol) – der Schatten muss daher auch dort liegen. */
.cb-karte > .uncol { transition: transform .6s cubic-bezier(.22, .9, .24, 1); }
.cb-karte .uncell { transition: box-shadow .6s; }
.cb-karte:hover > .uncol { transform: translateY(-6px); }
.cb-karte:hover .uncell { box-shadow: 0 30px 60px -36px rgba(22, 57, 74, .45); }
.cb-chip:hover > .uncol { transform: none; }
.cb-chip:hover .uncell { box-shadow: none; }

/* Ablauf: nummerierte Schritte an einer Zeitleiste */
.cb-timeline .uncont { counter-reset: cb-schritt; }
.cb-schritt-row { position: relative; padding-left: 56px; }
.cb-schritt-row::before {
	counter-increment: cb-schritt; content: counter(cb-schritt);
	position: absolute; left: 0; top: 2px; width: 34px; height: 34px; border-radius: 50%;
	display: grid; place-items: center; background: #1c6a82; color: #fff;
	font: 600 13px/1 "Plus Jakarta Sans", sans-serif;
}
.cb-schritt-row:not(:last-child)::after {
	content: ""; position: absolute; left: 16px; top: 44px; bottom: -18px; width: 2px; border-radius: 2px;
	background: linear-gradient(#1c6a82, rgba(28, 106, 130, .15));
}
.cb-mitbringen { margin-top: 18px; padding: 22px 24px; border-radius: 22px; background: linear-gradient(135deg, #eff7f8, #f8f1ef); }
.cb-mitbringen ul { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.cb-mitbringen li { background: #fff; padding: 7px 14px; border-radius: 999px; font-size: 14px; }

/* Öffnungszeiten als ruhige Zeilen (Uncode setzt Tabellen-Rahmen, die hier entfallen) */
.cb-zeiten, .cb-zeiten tbody, .cb-zeiten tr, .cb-zeiten td { border: 0 !important; }
.cb-zeiten { width: 100%; border-collapse: separate; border-spacing: 0 8px; margin: -8px 0 8px; font-variant-numeric: tabular-nums; }
.cb-zeiten td { background: #f3f7f8; padding: 14px 18px !important; color: #16394a; }
.cb-zeiten td:first-child { border-radius: 16px 0 0 16px; }
.cb-zeiten td:last-child { border-radius: 0 16px 16px 0; text-align: right; }
.cb-zeiten tr.cb-heute td { background: #16394a; color: #fff; }

/* Akkordeon: feine Kontur wie im Entwurf, Plus-Zeichen in Petrol */
.cb-akkordeon .panel { box-shadow: inset 0 0 0 1px rgba(22, 57, 74, .12); }
.cb-akkordeon .panel.active-group, .cb-akkordeon .panel:has(.in) { box-shadow: inset 0 0 0 1px rgba(28, 106, 130, .3); }
.cb-akkordeon .panel-title > a::after, .cb-akkordeon .panel-title > a .plus-sign { color: #1c6a82; }

@media (prefers-reduced-motion: reduce) {
	.cb-atem .uncode-single-media-wrapper, .cb-atem .uncode-single-media-wrapper::after, .cb-blob .uncode-single-media-wrapper { animation: none; }
}

/* Akzentwort in Überschriften: kursiv (Petrona Italic) in Petrol */
.heading-text em, h1 em, h2 em, h3 em { color: #1c6a82; }
.style-dark .heading-text em, .cb-credo .heading-text em { color: #fff; }

/* Liste „Bitte mitbringen“ ohne Theme-Aufzählungszeichen */
.cb-mitbringen ul li { list-style: none; }
.cb-mitbringen ul li::before { content: none !important; }

/* Schwebende Pillen-Navigation (Uncode bietet nur eine durchgehende Leiste).
   Die volle Leiste wird transparent, die innere .row-menu wird zur Glas-Pille. */
#masthead .menu-container {
	background: transparent !important; box-shadow: none !important;
	-webkit-backdrop-filter: none !important; backdrop-filter: none !important;
	padding-top: 16px;
}
#masthead .menu-container::after, #masthead .menu-container::before { display: none !important; }
#masthead .row-menu-inner { padding-left: 0; padding-right: 0; } /* Abstand übernimmt die Pille */
#masthead .row-menu.limit-width {
	max-width: 1120px; width: calc(100% - 32px); margin: 0 auto; padding: 0 10px 0 22px;
	background: rgba(255, 255, 255, .64);
	-webkit-backdrop-filter: blur(18px) saturate(1.4); backdrop-filter: blur(18px) saturate(1.4);
	border-radius: 999px;
	box-shadow: 0 10px 40px -20px rgba(22, 57, 74, .35), inset 0 0 0 1px rgba(255, 255, 255, .7);
}
@media (min-width: 960px) {
	#masthead .navbar-main > ul > li > a { border-radius: 999px; transition: background-color .3s; }
	#masthead .navbar-main > ul > li > a:hover { background: rgba(255, 255, 255, .9); }
}
@media (max-width: 959px) {
	#masthead .row-menu.limit-width { border-radius: 28px; padding: 0 8px 0 18px; }
	#masthead .main-menu-container, #masthead .menu-primary-inner, #masthead .menu-cta-inner { background: transparent !important; }
}
/* „Termin buchen“ in der Pille gefüllt wie im Entwurf (Uncode zeigt Menü-Buttons als Kontur) */
#masthead .menu-cta-inner .menu-btn-container.btn { background: #16394a; border-color: #16394a; color: #fff; padding-left: 22px; padding-right: 22px; }
#masthead .menu-cta-inner a:hover .menu-btn-container.btn { background: #1c6a82; border-color: #1c6a82; color: #fff; }
@media (max-width: 959px) { .cb-hero > .row { padding-top: 110px !important; } } /* Platz unter der schwebenden Navigation */
/* Geöffnetes Mobilmenü: Das Menü ragt unter der Pille heraus – die ganze Fläche bekommt einen hellen Glas-Hintergrund,
   die Pille bleibt oben stehen (nötig, weil „Menu mobile transparency“ für den Header aktiv ist) */
@media (max-width: 959px) {
	body.open-overlay-menu #masthead .menu-container,
	body.opening-overlay-menu #masthead .menu-container {
		background: rgba(251, 252, 252, .96) !important;
		-webkit-backdrop-filter: blur(18px) saturate(1.3) !important; backdrop-filter: blur(18px) saturate(1.3) !important;
		transition: background-color .3s;
	}
	body.open-overlay-menu #masthead .row-menu.limit-width { background: #fff; }
}
.cb-karte-statisch:hover > .uncol { transform: none; }
.cb-karte-statisch:hover .uncell { box-shadow: none; }

/* ===== Feinschliff nach Entwurf (Artefakt „Aura“) ===== */

/* Pillen-Label: Glas mit feiner Petrol-Kontur */
.cb-pille .badge-style { background: rgba(255, 255, 255, .62) !important; box-shadow: inset 0 0 0 1px rgba(28, 106, 130, .14); }
.cb-pille-dunkel .badge-style { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22); }

/* Live-Status in den Öffnungszeiten */
.cb-live { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #3f9f82; margin-right: 8px; vertical-align: 2px; animation: cb-live 2s infinite; }
.cb-live.aus { background: #9aaeb6; animation: none; }
@keyframes cb-live { 50% { opacity: .35; } }

/* Akkordeon: Karten mit 22 px Radius, Innenabstand 20/24, aktive Karte mit Petrol-Kontur und Schatten.
   Uncode zieht den Titel-Link mit negativen Margins über das ganze Panel (klickbar) – Margin und Padding daher gemeinsam setzen. */
.cb-akkordeon .panel { border-radius: 22px !important; transition: box-shadow .4s; }
.cb-akkordeon .panel.single-block-padding { padding: 20px 24px !important; }
.cb-akkordeon .panel-title > a.single-block-padding { margin: -20px -24px !important; padding: 20px 24px !important; }
.cb-akkordeon .panel-body { padding: 12px 0 0 !important; color: #4e6a77; font-size: 15.5px; }
.cb-akkordeon .panel-body p { margin: 0; }
.cb-akkordeon .panel.active-group { box-shadow: inset 0 0 0 1px rgba(28, 106, 130, .3), 0 20px 40px -30px rgba(22, 57, 74, .4) !important; }

/* Schwerpunkt-Karten: Ring-Punkt, neutrale Kontur, farbiger Schimmer beim Hover */
.cb-sp .uncell { position: relative; overflow: hidden; isolation: isolate; border-color: rgba(22, 57, 74, .12) !important; }
.cb-sp .uncell::before {
	content: ""; position: absolute; width: 260px; height: 260px; border-radius: 50%; right: -110px; top: -120px;
	background: var(--cb-sp, #bfe2e8); filter: blur(40px); opacity: 0; transition: opacity .6s; z-index: -1;
}
.cb-sp:hover .uncell::before { opacity: .9; }
.cb-sp-aqua { --cb-sp: #bfe2e8; } .cb-sp-flieder { --cb-sp: #dce2f1; } .cb-sp-rose { --cb-sp: #f3dad3; }
.cb-sp .cb-punkt .fa-stack { width: 42px; height: 42px; display: inline-flex !important; align-items: center; justify-content: center; }
.cb-sp .cb-punkt .fa-stack i { font-size: 0; position: static !important; width: auto; height: auto; line-height: 0; display: inline-flex; }
.cb-sp .cb-punkt .fa-stack i::before { content: ""; display: inline-block; width: 20px; height: 20px; border-radius: 50%; background: rgba(255, 255, 255, .7); }
.cb-sp .cb-punkt { margin-bottom: 26px; }

/* Kosten: Vorteile als helle Zeilen */
.cb-aura-karte .uncode-list ul, .cb-aura-karte ul { list-style: none; margin: 28px 0 0; padding: 0; display: grid; gap: 10px; }
.cb-aura-karte li { display: flex; align-items: center; gap: 14px; padding: 14px 18px !important; border-radius: 18px; background: rgba(255, 255, 255, .7); font-weight: 500; font-size: 15.5px; color: #16394a; }
.cb-aura-karte li i { color: #1c6a82 !important; position: static !important; margin: 0 !important; }

/* Rückerstattung: nummerierte Schritte mit Trennlinien */
.cb-karte .uncont { counter-reset: cb-rueck; }
.cb-rueck-schritt { padding-block: 20px; border-bottom: 1px solid rgba(22, 57, 74, .12); margin-top: 0 !important; }
.cb-rueck-schritt:last-of-type { border-bottom: 0; padding-bottom: 0; }
.cb-rueck-schritt .fa-stack { width: 44px; height: 44px; line-height: 44px; background: #eaf5f7 !important; border-color: #eaf5f7 !important; counter-increment: cb-rueck; }
.cb-rueck-schritt .fa-stack i { display: none; }
.cb-rueck-schritt .fa-stack::before { content: counter(cb-rueck); font: 600 14px/44px "Plus Jakarta Sans", sans-serif; color: #1c6a82; }
/* Plus/×-Zeichen sitzt absolut im Titel-Link (der wegen negativer Margins bis zum Panelrand reicht) */
.cb-akkordeon .panel-title > a > span:after { right: 24px !important; color: #1c6a82; }
.cb-akkordeon .panel-body { padding-top: 4px !important; }
/* Link in Textfarbe: Uncodes Akzent-Linkregel ist sehr spezifisch – Farbe daher auf ein inneres span legen */
.cb-textfarbe { color: #16394a; }
/* Einheitliche, neutrale Kartenkontur wie im Entwurf (Breite kommt aus der WPBakery-Design-Option) */
.cb-karte .uncell.border-color-cb-flieder-color { border-color: rgba(22, 57, 74, .12) !important; }
/* Anfahrtskarte in abgerundeter Karte */
.cb-map .uncell { overflow: hidden; }
.cb-map iframe, .cb-map .vc_gmaps_embed, .cb-map .wpb_map_wraper { display: block; width: 100%; border: 0; margin: 0 !important; }
.cb-map .uncont > *, .cb-map .wpb_content_element { margin-bottom: 0 !important; }