/* =====================================================
   1. Globale Farben / Variablen
===================================================== */

:root{
    --cassiopeia-color-primary:#4641E0;
    --template-bg-light:#ffffff;
    --footer-bg:#4641E0 !important;
}


/* =====================================================
   2. Seitenhintergrund / Layout
===================================================== */

body.site{
    background-color:#4641E0 !important;
    background-attachment:fixed;
}

.site-grid,
.container-component{
    background:#ffffff;
    padding:2rem;
    border-radius:4px;
    margin-top:20px;
    margin-bottom:20px;
}

.site-grid{
    margin-top:0 !important;
    padding-top:5px !important;
    background:transparent;
}

body.site.view-featured .container-component{
    padding:20px;
    border-radius:8px;
}


/* =====================================================
   3. Header / Logo
===================================================== */

.header{
    width:100%;
    background:#ffffff !important;
    background-image:none !important;
    margin-bottom:0 !important;
    padding-bottom:0 !important;
}

.navbar-brand{
    background:#ffffff !important;
}


/* =====================================================
   4. Menüleiste (top-a)
===================================================== */

/* =====================================================
   Menü – sauberer Neustart
===================================================== */

/* Menüleiste */
.container-top-a{
    background:#4641E0;
    padding:0;
}

/* Top-Level horizontal */
.container-top-a ul.mod-menu{
    list-style:none;
    margin:0;
    padding:0;
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:wrap;
    gap:0px;
}

/* Top-Level Items */
.container-top-a ul.mod-menu > li{
    position:relative;
}

.container-top-a ul.mod-menu > li > a{
    display:block;
    padding:6px 10px;
    color:#fff;
    text-decoration:none;
    font-weight:600;
    padding:0px 0px;
}

/* Hoverfarbe */
.container-top-a ul.mod-menu > li > a:hover{
    background:#3530b5;
}

/* Dropdown verstecken */
.container-top-a ul.mod-menu li ul{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    background:#fff;
    min-width:200px;
    border:1px solid #ccc;
    padding:0;
    margin:0;
    list-style:none;
}

/* Dropdown anzeigen */
.container-top-a ul.mod-menu li:hover > ul{
    display:block;
}

/* Dropdown Links */
.container-top-a ul.mod-menu li ul li a{
    display:block;
    padding:6px 10px;
    color:#333;
}

/* Hover im Dropdown */
.container-top-a ul.mod-menu li ul li a:hover{
    background:#f0f0f0;
}

/* =====================================================
   5. Banner
===================================================== */

.container-banner{
/*
    background:#4641E0 !important;
*/
    background:transparent !important;
    margin:0 !important;
    padding:0 !important;
}

.container-banner .grid-child{
    display:flex !important;
    align-items:center;
    gap:8px;
}

.banner-flex-container{
    display:flex !important;
    justify-content:flex-end !important;
    align-items:center !important;
    gap:25px !important;
}

.banner-flex-container .search input{
    background:rgba(255,255,255,0.15) !important;
    border:1px solid rgba(255,255,255,0.4) !important;
    color:#ffffff !important;
    width:220px !important;
    height:26px !important;
    padding:2px 6px !important;
    font-size:0.8rem;
}

#banner-clock{
    color:#ffffff !important;
    font-size:0.8rem;
    font-weight:600;
}


/* =====================================================
   6. Login Modal
===================================================== */

#loginModal .modal-body{
    padding:2rem;
}

#loginModal .mod-login__userdata{
    display:flex;
    flex-direction:column;
    gap:15px;
}


/* =====================================================
   7. Footer
===================================================== */

footer.footer{
    background:#4641E0 !important;
    color:#ffffff !important;
    padding:15px 0 !important;
    margin:0 !important;
}

.container-footer{
    display:flex !important;
    justify-content:space-between !important;
    align-items:center !important;
    max-width:1320px !important;
    margin:0 auto !important;
}

.container-footer .mod-custom{
    flex:1;
    font-size:0.85rem;
}

.container-footer .mod-custom:nth-child(1){text-align:left;}
.container-footer .mod-custom:nth-child(2){text-align:center;}
.container-footer .mod-custom:nth-child(3){text-align:right;}

@media (max-width:767px){

.container-footer{
flex-direction:column !important;
gap:10px;
}

.container-footer .mod-custom{
text-align:center !important;
}

}


/* =====================================================
   8. Sidebar Module
===================================================== */

/* Hauptcontainer neutral */
.container-sidebar-right{
    background:transparent !important;
    padding:0 !important;
}

.container-sidebar-right .card{
    border:none !important;
    overflow:hidden;
    box-shadow:0 1px 4px rgba(0,0,0,0.15);
    background:#ffffff !important;
    border-radius:6px;
    margin-bottom:20px !important;
}

.container-sidebar-right .card-body{
    padding:10px 12px !important;
}

.sidebar-right .card{
    border:none !important;
    padding:0 !important;
    margin:0 !important;
}

.sidebar-right .card-header{
    margin:0 !important;
}

.container-sidebar-right .card-header{
    background:#000000 !important;
    color:#ffffff !important;
    padding:8px 12px !important;
    font-size:1rem;
    border:none !important;
    border-radius:0 !important;
}

.container-sidebar-right .jev-event{
    display:flex !important;
    gap:10px;
    align-items:flex-start;
    border-bottom:2px solid #4641E0;
    padding-bottom:6px;
    margin-bottom:8px;
    padding:8px 0;
/*
    border-bottom:1px solid #e5e5e5;
*/
}

/* letzter Eintrag ohne Linie */
.container-sidebar-right .jev-event:last-child{
    border-bottom:none;
}

/* Hover-Effekt (leicht, modern) */
.container-sidebar-right .jev-event:hover{
    background:#f9f9ff;
    border-radius:6px;
    padding-left:5px;
    transition:0.2s;
}

/* =====================================================
   9. JEvents – Event Darstellung
===================================================== */

.jev-event{
    padding:2px 0;
}

.jev-date{
    display:block;
    font-size:1rem;
    color:#666;
}

/* Titel */
.jev-title{
    display:block;
    font-size:0.95rem;
    font-weight:600;
    color:#222; /* #4641E0 **/
    margin-top:2px;
}

/* Location */
.jev-location{
    display:block;
    font-size:0.85rem;
    color:#888;
    font-style:italic;
    margin-top:1px;
}

/* =====================================================
   JEvents Kalenderblatt Layout
===================================================== */

/* Kalenderbox */

/* Datum links kompakt */
.jev-datebox{
    width:50px;
    min-width:50px;
    text-align:center;
    background:#f5f5f5;
    border:1px solid #ddd;
    border-radius:6px;
    padding:4px 0;
}

/* Tag */
.jev-day{
    display:block;
    font-size:1.2rem;
    font-weight:700;
    color:#4641E0;
    line-height:1;
}

/* Monat */
.jev-month{
    display:block;
    font-size:0.7rem;
    text-transform:uppercase;
    color:#666;
}

/* Jahr */
.jev-year{
    display:block;
    font-size:0.7rem;
    color:#999;
}

/* Inhalte rechts */
.jev-details{
    flex:1;
}

/* Inhalte UNTEREINANDER */
.jev-details span{
    display:block !important;
}

/* Zeit */
.jev-time{
    display:inline !important;
    font-size:0.8rem;
    color:#666;
    white-space:nowrap;
}

.jev-time span{
    display:inline !important;
    white-space:nowrap;
}

/* =====================================================
   10. Geburtstagsliste
===================================================== */

.jev-birthday{
display:flex;
gap:10px;
padding:4px 0;
align-items:center;
border-bottom:1px solid #e5e5e5;
}

.jev-bday-date{
font-weight:700;
color:#4641E0;
min-width:55px;
}

.jev-bday-name{
color:#333;
}

/* runde Geburtstage */

.jev-birthday.round{
background:#f5f5ff;
border-left:4px solid #4641E0;
padding-left:6px;
font-weight:600;
}

/* 80+ Jubilare */

.jev-birthday.elder{
background:#fff7e6;
border-left:4px solid #e0a000;
}

/* =====================================================
   JEvents Trennlinien
===================================================== */

.mod_events_latest_table td.mod_events_latest,
.mod_events_latest_table td.mod_events_latest_first{
    border-bottom:3px solid #4641E0 !important;
    padding-bottom:1px;
}

.mod_events_latest_table tr:last-child td{
    border-bottom:none !important;
}



/* =====================================================
   11. Categorie-Liste 
===================================================== */

.category-list .alert-info {
    display: none;
}

.category-children .alert-info {
    display: none;
}


/* ===== Joomla Kategorien wieder als normale Liste ===== */

.cat-children,
.com-content-category__children{
    display:block !important;
    grid-template-columns:none !important;
}

.com-content-category__children{
    border:none !important;
    background:none !important;
    box-shadow:none !important;
    margin:0 !important;
}

.com-content-category__children h3 a{
    display:inline;
    padding:0;
}