/*
 * Liturgische Farben für liturgischersingkreisjena.de
 *
 * Das Bootstrap Package kompiliert die Farben aus settings.yaml fest ins CSS
 * (primary #577760, dark/darker #2d7c31, tertiary #006600). Hier werden sie
 * überschrieben, sobald <html data-liturgie="…"> gesetzt ist. Das Attribut setzt
 * das Inline-Skript aus Classes/UserFunc/LiturgieKopf.php. Ohne Attribut bleibt
 * die Seite im bisherigen Grün.
 *
 * Je Farbe vier Töne (als Hex und als RGB-Tripel für Bootstraps rgba()-Regeln):
 *   dunkel   Kopfzeile, Aufklappmenüs, Fußzeile (= Farbe von kirchenjahr-evangelisch.de)
 *   primaer  Links, Primär-Buttons, Hervorhebungen (auf Creme mind. 4,5:1)
 *   hover    Links/Buttons beim Überfahren
 *   tertiaer btn-tertiary, frame-background-tertiary
 */

html[data-liturgie="gruen"] {
    --lsj-dunkel: #2d7c31; --lsj-dunkel-rgb: 45, 124, 49;
    --lsj-primaer: #577760; --lsj-primaer-rgb: 87, 119, 96;
    --lsj-hover: #465f4d; --lsj-hover-rgb: 70, 95, 77;
    --lsj-tertiaer: #006600; --lsj-tertiaer-rgb: 0, 102, 0;
}
html[data-liturgie="violett"] {
    --lsj-dunkel: #5c3995; --lsj-dunkel-rgb: 92, 57, 149;
    --lsj-primaer: #6c5687; --lsj-primaer-rgb: 108, 86, 135;
    --lsj-hover: #56456c; --lsj-hover-rgb: 86, 69, 108;
    --lsj-tertiaer: #452a72; --lsj-tertiaer-rgb: 69, 42, 114;
}
html[data-liturgie="rosa"] {
    --lsj-dunkel: #b150b3; --lsj-dunkel-rgb: 177, 80, 179;
    --lsj-primaer: #8e4f8f; --lsj-primaer-rgb: 142, 79, 143;
    --lsj-hover: #723f72; --lsj-hover-rgb: 114, 63, 114;
    --lsj-tertiaer: #8c3a8e; --lsj-tertiaer-rgb: 140, 58, 142;
}
html[data-liturgie="rot"] {
    --lsj-dunkel: #b61b1b; --lsj-dunkel-rgb: 182, 27, 27;
    --lsj-primaer: #a51c1c; --lsj-primaer-rgb: 165, 28, 28;
    --lsj-hover: #841616; --lsj-hover-rgb: 132, 22, 22;
    --lsj-tertiaer: #8e1414; --lsj-tertiaer-rgb: 142, 20, 20;
}
html[data-liturgie="schwarz"] {
    --lsj-dunkel: #333333; --lsj-dunkel-rgb: 51, 51, 51;
    --lsj-primaer: #5a5a5a; --lsj-primaer-rgb: 90, 90, 90;
    --lsj-hover: #474747; --lsj-hover-rgb: 71, 71, 71;
    --lsj-tertiaer: #1f1f1f; --lsj-tertiaer-rgb: 31, 31, 31;
}
/* Weiß: helle Kopf-/Fußzeile mit dunkler Schrift, Akzente in Gold (siehe unten) */
html[data-liturgie="weiss"] {
    --lsj-dunkel: #e6e2d6; --lsj-dunkel-rgb: 230, 226, 214;
    --lsj-primaer: #8a6d1d; --lsj-primaer-rgb: 138, 109, 29;
    --lsj-hover: #6e5617; --lsj-hover-rgb: 110, 86, 23;
    --lsj-tertiaer: #7d6318; --lsj-tertiaer-rgb: 125, 99, 24;
}

/* ---- Grundvariablen (schlagen :root, weil spezifischer) ---- */
html[data-liturgie] {
    --bs-primary: var(--lsj-primaer); --bs-primary-rgb: var(--lsj-primaer-rgb);
    --bs-link-color: var(--lsj-primaer); --bs-link-color-rgb: var(--lsj-primaer-rgb);
    --bs-link-hover-color: var(--lsj-hover); --bs-link-hover-color-rgb: var(--lsj-hover-rgb);
    --bs-dark: var(--lsj-dunkel); --bs-dark-rgb: var(--lsj-dunkel-rgb);
    --bs-darker: var(--lsj-dunkel); --bs-darker-rgb: var(--lsj-dunkel-rgb);
    --bs-tertiary: var(--lsj-tertiaer); --bs-tertiary-rgb: var(--lsj-tertiaer-rgb);
    --frame-link-color: var(--lsj-primaer);
    --frame-link-hover-color: var(--lsj-hover);
    --cookieconsent-link-color: var(--lsj-primaer);
    --cookieconsent-button-bg: var(--lsj-primaer);
}

/* ---- Kopf- und Fußzeile ---- */
html[data-liturgie] .navbar-mainnavigation { --mainnavigation-hightlight: var(--lsj-primaer); }
html[data-liturgie] .footer-section-content,
html[data-liturgie] .footer-section-meta {
    background: var(--lsj-dunkel);
    --frame-background: var(--lsj-dunkel);
}

/* ---- Buttons ---- */
html[data-liturgie] .btn-primary,
html[data-liturgie] .frame-type-felogin_login input[type="submit"],
html[data-liturgie] .cc-btn {
    --bs-btn-bg: var(--lsj-primaer); --bs-btn-border-color: var(--lsj-primaer);
    --bs-btn-hover-bg: var(--lsj-hover); --bs-btn-hover-border-color: var(--lsj-hover);
    --bs-btn-active-bg: var(--lsj-hover); --bs-btn-active-border-color: var(--lsj-hover);
    --bs-btn-disabled-bg: var(--lsj-primaer); --bs-btn-disabled-border-color: var(--lsj-primaer);
}
html[data-liturgie] .btn-outline-primary {
    --bs-btn-color: var(--lsj-primaer); --bs-btn-border-color: var(--lsj-primaer);
    --bs-btn-hover-bg: var(--lsj-primaer); --bs-btn-hover-border-color: var(--lsj-primaer);
    --bs-btn-active-bg: var(--lsj-primaer); --bs-btn-active-border-color: var(--lsj-primaer);
    --bs-btn-disabled-color: var(--lsj-primaer); --bs-btn-disabled-border-color: var(--lsj-primaer);
}
html[data-liturgie] .btn-dark,
html[data-liturgie] .btn-darker {
    --bs-btn-bg: var(--lsj-dunkel); --bs-btn-border-color: var(--lsj-dunkel);
    --bs-btn-hover-bg: color-mix(in srgb, var(--lsj-dunkel) 85%, #000);
    --bs-btn-hover-border-color: color-mix(in srgb, var(--lsj-dunkel) 85%, #000);
    --bs-btn-active-bg: color-mix(in srgb, var(--lsj-dunkel) 80%, #000);
    --bs-btn-active-border-color: color-mix(in srgb, var(--lsj-dunkel) 80%, #000);
    --bs-btn-disabled-bg: var(--lsj-dunkel); --bs-btn-disabled-border-color: var(--lsj-dunkel);
}
html[data-liturgie] .btn-outline-dark,
html[data-liturgie] .btn-outline-darker {
    --bs-btn-color: var(--lsj-dunkel); --bs-btn-border-color: var(--lsj-dunkel);
    --bs-btn-hover-bg: var(--lsj-dunkel); --bs-btn-hover-border-color: var(--lsj-dunkel);
    --bs-btn-active-bg: var(--lsj-dunkel); --bs-btn-active-border-color: var(--lsj-dunkel);
}
html[data-liturgie] .btn-tertiary {
    --bs-btn-bg: var(--lsj-tertiaer); --bs-btn-border-color: var(--lsj-tertiaer);
    --bs-btn-hover-bg: color-mix(in srgb, var(--lsj-tertiaer) 85%, #000);
    --bs-btn-hover-border-color: color-mix(in srgb, var(--lsj-tertiaer) 85%, #000);
    --bs-btn-active-bg: color-mix(in srgb, var(--lsj-tertiaer) 80%, #000);
    --bs-btn-active-border-color: color-mix(in srgb, var(--lsj-tertiaer) 80%, #000);
    --bs-btn-disabled-bg: var(--lsj-tertiaer); --bs-btn-disabled-border-color: var(--lsj-tertiaer);
}
html[data-liturgie] .btn-outline-tertiary {
    --bs-btn-color: var(--lsj-tertiaer); --bs-btn-border-color: var(--lsj-tertiaer);
    --bs-btn-hover-bg: var(--lsj-tertiaer); --bs-btn-hover-border-color: var(--lsj-tertiaer);
    --bs-btn-active-bg: var(--lsj-tertiaer); --bs-btn-active-border-color: var(--lsj-tertiaer);
}

/* ---- Navigationselemente, Listen, Formulare ---- */
html[data-liturgie] .dropdown-menu,
html[data-liturgie] .dropdown-menu-dark { --bs-dropdown-link-active-bg: var(--lsj-primaer); }
html[data-liturgie] .nav-pills { --bs-nav-pills-link-active-bg: var(--lsj-primaer); }
html[data-liturgie] .pagination {
    --bs-pagination-active-bg: var(--lsj-primaer);
    --bs-pagination-active-border-color: var(--lsj-primaer);
}
html[data-liturgie] .list-group {
    --bs-list-group-active-bg: var(--lsj-primaer);
    --bs-list-group-active-border-color: var(--lsj-primaer);
}
html[data-liturgie] .progress,
html[data-liturgie] .progress-stacked { --bs-progress-bar-bg: var(--lsj-primaer); }
html[data-liturgie] .form-check-input:checked,
html[data-liturgie] .form-check-input[type="checkbox"]:indeterminate {
    background-color: var(--lsj-primaer);
    border-color: var(--lsj-primaer);
}
html[data-liturgie] .form-range::-webkit-slider-thumb { background-color: var(--lsj-primaer); }
html[data-liturgie] .form-range::-moz-range-thumb { background-color: var(--lsj-primaer); }
html[data-liturgie] .table-dark { --bs-table-bg: var(--lsj-dunkel); }
html[data-liturgie] .timeline { --timeline-item-headline-color: var(--lsj-primaer); }
html[data-liturgie] .scroll-top { --scrolltop-hover-bg: var(--lsj-primaer); }
html[data-liturgie] .page-skip-link:focus {
    background: var(--lsj-primaer);
    border-color: var(--lsj-dunkel);
}

/* ---- Rahmen (Hintergrund-Optionen der Inhaltselemente) ---- */
html[data-liturgie] .frame-background-primary { --frame-background: var(--lsj-primaer); }
html[data-liturgie] .frame-background-tertiary { --frame-background: var(--lsj-tertiaer); }
html[data-liturgie] .frame-background-dark {
    --frame-background: var(--lsj-dunkel);
    --frame-link-color: var(--lsj-primaer);
    --frame-link-hover-color: var(--lsj-hover);
}
html[data-liturgie] .frame-background-light {
    --frame-link-color: var(--lsj-primaer);
    --frame-link-hover-color: var(--lsj-hover);
}

/* ---- Karten, Karussell, Panels ---- */
html[data-liturgie] .card a:not(.btn) { color: var(--lsj-primaer); }
html[data-liturgie] .card a:not(.btn):hover { color: var(--lsj-hover); }
html[data-liturgie] .card-panel-primary { --cardpanel-header-background: var(--lsj-primaer); }
html[data-liturgie] .card-panel-dark,
html[data-liturgie] .card-panel-darker { --cardpanel-header-background: var(--lsj-dunkel); }
html[data-liturgie] .card-panel-tertiary { --cardpanel-header-background: var(--lsj-tertiaer); }
html[data-liturgie] .carousel-item-layout-primary { --carousel-item-background: var(--lsj-primaer); }
html[data-liturgie] .carousel-item-layout-tertiary { --carousel-item-background: var(--lsj-tertiaer); }
html[data-liturgie] .carousel-item-layout-dark {
    --carousel-item-background: var(--lsj-dunkel);
    --carousel-item-link-color: var(--lsj-primaer);
    --carousel-item-link-hover-color: var(--lsj-hover);
}
html[data-liturgie] .carousel-item-layout-light {
    --carousel-item-link-color: var(--lsj-primaer);
    --carousel-item-link-hover-color: var(--lsj-hover);
}
html[data-liturgie] .carousel .carousel-indicators-navigation > button.active::before { border-top-color: var(--lsj-primaer); }

/* ---- Tag und Farbe in der Fußzeile (setzt LiturgieKopf.php) ----
   Normalfall: eigene Spalte .footer-liturgie im unteren Band zwischen Navigation und
   Kontakt, das Raster wird dafür dreispaltig. Ohne Kontaktblock: mittlere Spalte des
   oberen Bands. */
@media (min-width: 768px) {
    .footer-menu-section.lsj-hat-liturgie { grid-template-columns: 1fr 1fr 1fr; }
}
.footer-liturgie { text-align: center; }
.footer-liturgie .footer-liturgie-headline {
    font-size: inherit;
    font-weight: bold;
    line-height: inherit;
    margin: 0 0 0.5rem;
    color: var(--frame-color, #fff);
}
.footer-liturgie .lsj-liturgie-tag { padding: 0; }

html[data-liturgie="gruen"] { --lsj-punkt: #2d7c31; }
html[data-liturgie="violett"] { --lsj-punkt: #5c3995; }
html[data-liturgie="rosa"] { --lsj-punkt: #b150b3; }
html[data-liturgie="rot"] { --lsj-punkt: #b61b1b; }
html[data-liturgie="schwarz"] { --lsj-punkt: #222222; }
html[data-liturgie="weiss"] { --lsj-punkt: #ffffff; }
/* Die Fußzeilenspalten liegen außerhalb eines .frame; --frame-color (weiß bzw. bei Weiß
   dunkel) setzt .footer-section-content trotzdem und wird vererbt */
.lsj-liturgie-tag {
    margin: 0;
    padding: 1.25rem 0;
    text-align: center;
    line-height: 1.5;
    color: var(--frame-color, #fff);
}
.lsj-liturgie-tag a,
.lsj-liturgie-tag a:hover,
.lsj-liturgie-tag a:focus {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 0.2em;
}
.lsj-liturgie-punkt {
    display: inline-block;
    width: 0.85em;
    height: 0.85em;
    margin-right: 0.45em;
    border: 2px solid currentColor;
    border-radius: 50%;
    background: var(--lsj-punkt);
    vertical-align: -0.05em;
}
.lsj-liturgie-name { font-weight: 700; }
.lsj-liturgie-tag small { opacity: 0.85; }

/* ---- Weiß: auf hellem Grund dunkle Schrift statt der weißen der »inverse«-Navigation ---- */
html[data-liturgie="weiss"] .navbar-inverse {
    --bs-navbar-color: rgba(0, 0, 0, 0.7);
    --bs-navbar-hover-color: rgba(0, 0, 0, 0.9);
    --bs-navbar-disabled-color: rgba(0, 0, 0, 0.3);
    --bs-navbar-active-color: #000;
    --bs-navbar-brand-color: #000;
    --bs-navbar-brand-hover-color: #000;
    --bs-navbar-toggler-border-color: rgba(0, 0, 0, 0.15);
    border-bottom: 3px solid var(--lsj-tertiaer);
}
html[data-liturgie="weiss"] .navbar-inverse .dropdown-menu {
    --bs-dropdown-color: #2b2b2b;
    --bs-dropdown-link-color: #2b2b2b;
    --bs-dropdown-link-hover-color: #000;
    --bs-dropdown-link-hover-bg: rgba(0, 0, 0, 0.06);
    --bs-dropdown-link-active-color: #fff;
    --bs-nav-link-color: #2b2b2b;
    --bs-nav-link-hover-color: #000;
}
html[data-liturgie="weiss"] .footer-section-content,
html[data-liturgie="weiss"] .footer-section-meta {
    color: #2b2b2b;
    --frame-color: #2b2b2b;
    --frame-link-color: var(--lsj-hover);
    --frame-link-hover-color: #000;
}
html[data-liturgie="weiss"] .footer-section-content { border-top: 3px solid var(--lsj-tertiaer); }
html[data-liturgie="weiss"] .frame-background-dark { --frame-color: #2b2b2b; }
html[data-liturgie="weiss"] .card-panel-dark,
html[data-liturgie="weiss"] .card-panel-darker { --cardpanel-header-color: #2b2b2b; }
html[data-liturgie="weiss"] .carousel-item-layout-dark { --carousel-item-color: #2b2b2b; }
html[data-liturgie="weiss"] .table-dark { --bs-table-color: #2b2b2b; }
html[data-liturgie="weiss"] .btn-dark,
html[data-liturgie="weiss"] .btn-darker {
    --bs-btn-color: #2b2b2b; --bs-btn-hover-color: #000;
    --bs-btn-active-color: #000; --bs-btn-disabled-color: #2b2b2b;
}
html[data-liturgie="weiss"] .btn-outline-dark,
html[data-liturgie="weiss"] .btn-outline-darker {
    --bs-btn-color: #5c5a52; --bs-btn-border-color: #5c5a52;
    --bs-btn-hover-color: #2b2b2b; --bs-btn-active-color: #2b2b2b;
}