/******************************************************************************
 * Theme "md" der Messdiener Brand für Admidio 5
 *
 * Baut auf dem Standard-Theme "simple" auf und bildet das Aussehen des
 * früheren Admidio-3-Themes (Bootstrap 3) mit Bootstrap 5 nach.
 *****************************************************************************/

@import url("../../simple/css/admidio.css");

:root {
    --md-primary: #1D2E57;
    --md-primary-dark: #101a31;
    --md-primary-light: #4a6ec3;
    --md-primary-lightest: #97abdc;
    --md-highlight: #009900;
    --md-text: #333333;
    --md-headline: #555555;
    --md-link: #222222;

    --bs-primary: #1D2E57;
    --bs-primary-rgb: 29, 46, 87;
    --bs-secondary: #4a6ec3;
    --bs-secondary-rgb: 74, 110, 195;
    --bs-body-color: #333333;
    --bs-body-font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    --bs-body-font-size: 14px;
    --bs-body-line-height: 1.42857;
    --bs-link-color: #222222;
    --bs-link-color-rgb: 34, 34, 34;
    --bs-link-hover-color: #009900;
    --bs-link-hover-color-rgb: 0, 153, 0;
    --bs-focus-ring-color: rgba(29, 46, 87, 0.25);
}

/**************************************************/
/* Grundlayout                                    */
/**************************************************/
html {
    min-height: 100%;
}

body {
    padding: 0 0 15px 0;
    margin: 0;
    min-height: 100%;
    text-align: left;
    font-family: var(--bs-body-font-family);
    font-size: 14px;
    line-height: 1.42857;
    color: var(--md-text);
    background-color: var(--md-primary-light);
    background: linear-gradient(to bottom, #ffffff 15%, var(--md-primary-light) 95%) fixed;
}

div.content-width {
    max-width: 1200px;
}

/**************************************************/
/* Kopfbereich mit animiertem Himmel              */
/**************************************************/
@keyframes animatedHeaderBackground {
    from { background-position: 0 0; }
    to { background-position: 100% 0; }
}

#page-header {
    background-image: url("../images_theme/water.jpg");
    background-position: right top;
    background-repeat: repeat-x;
    background-color: var(--md-primary-lightest);
    padding: 0;
    margin: 0;
    height: 90px;
    animation: animatedHeaderBackground 240s linear infinite;
}

#page-header > div,
#page-header > div > .row,
#page-header .head-left {
    height: 100%;
}

#page-header > div > .row {
    padding: 5px 0;
}

#page-header .head-left {
    text-align: left;
}

#page-header .head-left > img {
    height: 100%;
    max-width: none;
}

#page-header h1 {
    color: #ffffff;
    font-size: 23.8px;
    line-height: 1.1;
    margin: 0;
    padding: 0;
    border: none;
}

@media (min-width: 768px) {
    #page-header { height: 120px; }
    #page-header > div > .row { padding: 10px 0; }
}

@media (min-width: 992px) {
    #page-header { height: 150px; }
    #page-header > div > .row { padding: 15px 0; }
}

/**************************************************/
/* Hauptmenü                                      */
/**************************************************/
#main-nav {
    background-color: var(--md-primary);
    border: 1px solid var(--md-primary-dark);
    border-left: 0;
    border-right: 0;
    margin-bottom: 20px;
    padding: 0;
    min-height: 50px;
    --bs-navbar-color: #ffffff;
    --bs-navbar-hover-color: var(--md-highlight);
    --bs-navbar-active-color: var(--md-highlight);
}

#main-nav > .container-fluid {
    padding-left: 15px;
    padding-right: 15px;
}

#main-nav .navbar-toggler {
    margin: 8px 0 8px auto;
    border-color: #333333;
}

#main-nav .nav-link {
    color: #ffffff;
    padding: 15px;
    line-height: 20px;
    text-decoration: none;
}

#main-nav .nav-link:hover,
#main-nav .nav-link:focus {
    color: var(--md-highlight);
    text-decoration: underline;
    background-color: transparent;
}

#main-nav .nav-link.show,
#main-nav .nav-link.show:hover {
    color: var(--md-highlight);
    background-color: var(--md-primary-dark);
}

#mainNavbarLeft {
    font-size: 1.3em;
}

#mainNavbarRight {
    font-size: 14px;
}

/* Kein Pfeil hinter den Dropdown-Einträgen wie im alten Layout */
#main-nav .dropdown-toggle::after {
    display: none;
}

#main-nav .dropdown-menu {
    font-size: 14px;
    margin-top: 0;
    padding: 5px 0;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 0 0 4px 4px;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
}

#main-nav .dropdown-item {
    color: var(--md-text);
    padding: 3px 20px;
    line-height: 20px;
    text-decoration: none;
}

#main-nav .dropdown-item:hover,
#main-nav .dropdown-item:focus {
    color: var(--md-highlight);
    text-decoration: underline;
    background-color: #f5f5f5;
}

@media (min-width: 768px) {
    #mainNavbarLeft > li:first-of-type > .nav-link {
        padding-left: 0;
    }
    #mainNavbarRight > li:last-of-type > .nav-link {
        padding-right: 0;
    }
}

@media (max-width: 767px) {
    #main-nav .dropdown-menu {
        background-color: transparent;
        border: 0;
        box-shadow: none;
    }
    #main-nav .dropdown-item {
        color: #ffffff;
        padding: 5px 15px 5px 25px;
    }
    #main-nav .dropdown-item:hover,
    #main-nav .dropdown-item:focus {
        background-color: transparent;
    }
}

/**************************************************/
/* Inhalt und rechte Spalte                       */
/**************************************************/
#page {
    padding-left: 15px;
    padding-right: 15px;
}

.admidio-container {
    text-align: left;
    border: 0;
    background-color: transparent;
    padding: 0;
    margin-bottom: 25px;
}

#left-block .admidio-content {
    max-width: none;
    padding: 0;
    order: initial;
    -webkit-hyphens: manual;
    hyphens: manual;
}

.admidio-content-header {
    display: block;
}

.admidio-breadcrumb {
    margin-bottom: 10px;
}

.admidio-breadcrumb .breadcrumb {
    margin-bottom: 0;
}

/**************************************************/
/* Überschriften                                  */
/**************************************************/
h1, h2, h3, h4, h5 {
    color: var(--md-headline);
    font-weight: normal;
    line-height: 1.1;
    margin: 20px 0 15px 0;
    border-bottom: none;
    letter-spacing: normal;
}

h1, .admidio-module-headline {
    font-size: 140%;
}

h2 { font-size: 130%; }
h3 { font-size: 110%; }
h4 { font-size: 100%; }
h5 { font-size: 14px; }

@media (min-width: 992px) {
    h1, .admidio-module-headline { font-size: 170%; }
}

p {
    margin: 0 0 10px;
}

/**************************************************/
/* Links                                          */
/**************************************************/
a:link,
a:visited {
    color: var(--md-link);
    text-decoration: underline;
}

a:hover,
a:active {
    color: var(--md-highlight);
    text-decoration: underline;
}

a.btn:link,
a.btn:visited,
a.nav-link:link,
a.nav-link:visited {
    text-decoration: none;
}

hr {
    border: 0;
    border-top: 1px solid var(--md-primary-light);
    opacity: 1;
    width: 100%;
    margin-bottom: 15px;
}

img {
    max-width: 100%;
}

.img_in_text {
    float: right;
    margin: 0 0 15px 15px;
}

/**************************************************/
/* Buttons und Funktionsmenü der Module           */
/**************************************************/
.btn-primary {
    --bs-btn-bg: var(--md-primary);
    --bs-btn-border-color: var(--md-primary);
    --bs-btn-hover-bg: var(--md-primary-dark);
    --bs-btn-hover-border-color: var(--md-primary-dark);
    --bs-btn-active-bg: var(--md-primary-dark);
    --bs-btn-active-border-color: var(--md-primary-dark);
    --bs-btn-disabled-bg: var(--md-primary);
    --bs-btn-disabled-border-color: var(--md-primary);
}

.btn-primary:link,
.btn-primary:visited,
.btn-primary:hover {
    color: #ffffff;
}

.admidio-menu-function-node {
    margin-bottom: 15px;
}

/**************************************************/
/* Karten (Ankündigungen, Termine ...)            */
/**************************************************/
.card {
    --bs-card-bg: rgba(255, 255, 255, 0.85);
}

/**************************************************/
/* Akkordeon auf den eigenen Inhaltsseiten        */
/**************************************************/
.laaccodion .accordion-item {
    border: 1px solid #777777;
    border-radius: 10px;
    margin-bottom: 5px;
    overflow: hidden;
    background-color: rgba(255, 255, 255, 0.85);
}

.laaccodion .accordion-header {
    margin: 0;
}

.laaccodion .accordion-button {
    display: block;
    width: 100%;
    padding: 10px 15px;
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 0.1em;
    color: #222222;
    text-align: left;
    background: linear-gradient(to bottom, var(--md-primary-lightest) 0%, var(--md-primary-light) 95%);
    border: 0;
    border-radius: 9px 9px 0 0;
    box-shadow: none;
}

.laaccodion .accordion-button.collapsed {
    border-radius: 9px;
}

.laaccodion .accordion-button:not(.collapsed) {
    color: #ffffff;
    background: linear-gradient(to bottom, var(--md-primary-light) 0%, var(--md-primary-dark) 95%);
}

.laaccodion .accordion-button::after {
    display: none;
}

.laaccodion .accordion-body {
    padding: 15px;
}

.laaccodion .accordion-body::after {
    content: "";
    display: block;
    clear: both;
}

.laaccodion img {
    float: left;
    margin-right: 15px;
}

/**************************************************/
/* Rechte Spalte mit Plugins                      */
/**************************************************/
#right-block .admidio-plugin-content {
    margin-top: 40px;
}

#right-block .admidio-plugin-content:first-child {
    margin-top: 0;
}

#right-block .admidio-plugin-content > h3 {
    color: var(--md-primary);
    font-size: 135%;
    margin: 0 0 5px 0;
}

/* Ankündigungen */
#right-block .list-group {
    --bs-list-group-bg: transparent;
    --bs-list-group-border-color: var(--md-primary-light);
    --bs-list-group-item-padding-x: 0;
    --bs-list-group-item-padding-y: 5px;
    border-radius: 0;
}

#right-block .list-group-item h5 {
    font-size: 14px;
    margin: 5px 0 10px 0;
    line-height: 1.42857;
}

#right-block .list-group-item em {
    display: block;
    margin-bottom: 5px;
}

#right-block .list-group-item:last-child {
    border-bottom: 0;
}

/* Kalender */
#right-block .popover { min-width: 200px; }
#right-block #plgCalendarTable { width: 100%; font-size: 95%; color: var(--md-text); }
#right-block #plgCalendarTable td { text-align: center; font-size: 95%; line-height: 14pt; width: 14%; padding: 0; }
#right-block #plgCalendarTable td a:link,
#right-block #plgCalendarTable td a:visited,
#right-block #plgCalendarTable td a:active,
#right-block #plgCalendarTable td a:hover { display: block; line-height: 14pt; background: none; color: var(--md-link); font-weight: bold; text-decoration: none; }
#right-block #plgCalendarTable th a:link,
#right-block #plgCalendarTable th a:visited,
#right-block #plgCalendarTable th a:active { display: block; line-height: 14pt; background: transparent; color: var(--md-primary); text-decoration: none; }
#right-block #plgCalendarTable th a:hover { background: var(--md-primary); color: var(--md-link); text-decoration: none; }
#right-block #plgCalendarTable th.plgCalendarHeader { color: var(--md-primary); background: transparent; font-size: 10pt; line-height: 20pt; }
#right-block #plgCalendarTable td.plgCalendarWeekday { color: var(--md-headline); }
#right-block #plgCalendarTable td.plgCalendarWeekdaySaturday,
#right-block #plgCalendarTable td.plgCalendarWeekdaySunday { color: var(--md-primary); }
#right-block #plgCalendarTable td.plgCalendarToday { border: 2px var(--md-primary) solid; border-radius: 0; background-color: transparent; color: var(--md-text); }
#right-block #plgCalendarTable td.plgCalendarSaturday,
#right-block #plgCalendarTable td.plgCalendarBirthSaturday,
#right-block #plgCalendarTable td.plgCalendarDateSaturday,
#right-block #plgCalendarTable td.plgCalendarMergeSaturday { color: var(--md-link); }
#right-block #plgCalendarTable td.plgCalendarSunday,
#right-block #plgCalendarTable td.plgCalendarBirthSunday,
#right-block #plgCalendarTable td.plgCalendarDateSunday,
#right-block #plgCalendarTable td.plgCalendarMergeSunday { color: #04060b; }
#right-block #plgCalendarTable td.plgCalendarDateSunday { border: 1px #999999 solid; }
#right-block #plgCalendarReset { font-size: 8pt; line-height: 12pt; text-align: center; }

/**************************************************/
/* Fußzeile                                       */
/**************************************************/
#pageFooter {
    border-top: 1px solid var(--md-primary);
    padding-top: 5px;
    text-align: left;
}

#pageFooter a:link,
#pageFooter a:visited {
    color: var(--md-link);
}

@media print {
    body { background: #ffffff; }
    #page-header, #main-nav, #pageFooter { display: none; }
}