/*
 Theme Name:   Bootscore Child
 Description:  Bootscore Child Theme
 Author:       Bootscore
 Author URI:   https://bootscore.me
 Template:     bootscore
 Version:      6.0.0
 Requires at least: 5.0
 Tested up to: 6.6
 Requires PHP: 7.4
 License: MIT License
 License URI: https://github.com/bootscore/bootscore-child/blob/main/LICENSE
 Text Domain:  bootscore
*/

/* 
All style editing is done via /assets/scss/_bootscore_custom.scss
*/

:root {
  /* VARIABLE COLLECTION */
  --base-900: #012944;
  --base-500: #85909d;
  --base-700: #3e627a;
  --base-200: #e4edf3;
  --base-100: #f7fbfd;
  --base-000: #ffffff;
  --primary-saturated: #00aadd;
  --primary-dark: #004394;
  --secondary-saturated: #e6007e;
  --secondary-dark: #9d0154;
  --primary-light: #cce0ed;
  --secondary-light: #f8ebf2;
 
}

body {
    color: var(--Base-900, #012944);
    font-size: 24px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 33.6px */
letter-spacing: -0.24px;
}

h2.blog-post-title {
font-family: Verdana;
font-size: 28px;
font-style: normal;
font-weight: 700;
line-height: 130%; /* 36.4px */
letter-spacing: -0.28px;
}

p{
   color: var(--Base-900, #012944);  
}

.simple-text ul li {
  margin-bottom:1rem;
}

h1.hero {
  color: var(--Primary-Dark, #004394);



/* Desktop/H1 */
font-family: Verdana;
font-size: 48px;
font-style: normal;
font-weight: 700;
line-height: 140%; /* 67.2px */
letter-spacing: -0.48px;
}

/*navbar*/
#nav-main, .offcanvas {
    background: var(--Primary-Dark, #004394);
    
}

.offcanvas-body {
    padding:0;
}

.offcanvas .nav-link
{
    padding-left:40px;
} 

 .offcanvas .btn.hell
{
    margin-left:40px !important;
} 

.schliessen {
    display:none;
}
#nav-main a {
    border-radius: 32px 0px;
border: 2px solid transparent;
padding:12px 24px;


} 

#nav-main a:hover {
    border-radius: 32px 0px;
border: 2px solid #fff;

} 

a.navbar-brand:hover {
  border-color:transparent !important;

} 

#nav-main a {
color:#fff;
    
}


.menu-item img._before, .rtl .menu-item img._after {
   
    max-height: 35px;
    width: auto;
}


.card {
    border-radius: 44px;
border: 2px solid var(--Primary-Dark, #004394);
box-shadow: 0px 0px 47px 0px rgba(66, 96, 133, 0.02), 0px 0px 104px 0px rgba(45, 80, 122, 0.08);
}

.card-body {
    border-radius: 0 0 44px 44px; /* Rounded corners at the bottom */
    padding:24px;
    padding-bottom:76px;
}

.card-body:hover {
    border-radius: 0 0 40px 40px !important; /* Slightly smaller rounded corners at the bottom on hover */
}



.card-body h2, .card-body .card-text .text-body {
    color: var(--Base-900, #012944);
}

.card:hover .card-body .card-text .text-body, .card:hover .card-body h2 , .card-body:hover h2, .card:hover  .kurz, .card-body:hover p, .card-body:hover .card-text .text-body, .card-body:hover .kurz {
    color: var(--Base-000, #FFF) !important; 
}

.card:hover .card-body, .card-body:hover{
    border-radius: 0px 0px 44px 44px;
background: var(--Primary-Dark, #004394);

}

.card img.wp-post-image {
    border-radius: 44px 44px 0px 0px;

}

.card a.read-more {
    position: absolute;
right: 0px;
bottom: 0px;
border-radius: 32px 0px 41px 0px;
border: 2px solid var(--Primary-Dark, #004394);
background: var(--Primary-Dark, #004394);
display: flex;
padding: 18px;
align-items: center;
gap: 12px;
color:#fff;
text-decoration:none !important;
}

.card:hover  a.read-more{

border: #fff;
background: #fff;

color:var(--Primary-Dark, #004394);
}


.extern-card {
  color:#fff !important;
  background-color:#013D7D !important;
  padding:48px !important;
  
}

.extern-card p{
line-height:33px;
}

.extern-card a.btn{
background-color:#fff !important;
}


/*Buttons*/



.btn
{
    border-radius: 32px 0px;
   
padding: 16px 24px;
align-items: center;
gap: 12px;
font-size: 24px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 33.6px */
letter-spacing: -0.24px;
}

.btn.dunkel
{
    color: var(--Base-000, #FFF);
    border: 2px solid var(--Primary-Dark, #004394);
background: var(--Primary-Dark, #004394);
}

a.btn.dunkel:hover i, .card-body:hover a.btn.dunkel i
{
    color:  #004394 !important;

}


a.btn.dunkel.mailbutton:hover  i
{
    color:  #fff !important;
}

.btn.hell

{
    border: 1px solid var(--Base-000, #FFF);
background: var(--Base-000, #FFF);
color: var(--Primary-Dark, #004394) !important;
}

/*Suche*/

.input-group>.form-control, .input-group>.form-select, .input-group>select, .input-group>.form-floating {
   border-radius: 32px 0px;
border: 2px solid var(--Base-700, #3E627A);
background: var(--Base-000, #FFF);
display: flex;
padding: 16px 24px;
align-items: center;
gap: 12px;
flex: 1 0 0;
}


.input-group .btn {
    border-radius: 32px 0px;
border: 2px solid var(--Primary-Dark, #004394);
background: var(--Primary-Dark, #004394);
display: flex;
padding: 16px 24px;
align-items: center;
gap: 12px;
color:#fff;
}



/*Unsichtbar*/
.meta.small.mb-2.text-body-secondary {
    display:none;
}

/*Content-Block*/
.content-block {
    margin-bottom:20px !important;
}

/*Filter*/

.wpc-term-count {

    display: none !important;
   
}


.wpc-filter-layout-search-field {
    display:none;
}


.wpc-filters-main-wrap .wpc-filters-labels li.wpc-term-item label {
 
    border-radius: 12px 0 12px 0 !important;
     border: 1.5px solid #013D7D !important;
}

.wpc-filters-date-range-column label:hover, .wpc-filters-main-wrap li.wpc-term-item:not(.wpc-term-disabled) label:hover {
    background-color: #013D7D !important;
     border-radius: 12px 0 12px 0 !important;
     border: 1.5px solid #013D7D !important;
     
    
}

.wpc-filters-main-wrap .wpc-filters-labels li.wpc-term-item label a {
   color:#012944;
    margin-left: 25px;
}

.filteralert {
  margin-bottom:24px;
}



body .wpc-filters-main-wrap input.wpc-label-input:checked+label span.wpc-filter-label-wrapper {
    border-radius: 10px 0 10px 0 !important; /* Rounded top-left and bottom-left corners */
    background-color: #013D7D !important; /* Inner dot color */
}

body .wpc-filters-main-wrap input.wpc-label-input:checked+label span.wpc-filter-label-wrapper a {
  color:#fff !important;
}


.wpc-filters-main-wrap .wpc-filters-labels li.wpc-term-item:hover label a {
    color: #fff !important; /* White text color on hover */
     border-radius: 12px 0 12px 0 !important;
}

/* Hover styles for label and pseudo-elements within it */
.wpc-filters-main-wrap li.wpc-term-item:not(.wpc-term-disabled) label:hover

 {
    background-color: #013D7D !important; /* Background color on hover */
    border-radius: 12px 0 12px 0 !important; /* Consistent border-radius */
}

.wpc-filters-main-wrap .wpc-filters-labels li.wpc-term-item:hover label {
    border-radius: 12px 0 12px 0 !important;
}


.wpc-filters-main-wrap li.wpc-term-item:not(.wpc-term-disabled) label:hover span.wpc-filter-label-wrapper::before {
    border-color: #fff !important; /* Border color of the outer circle on hover */
}

.wpc-filters-main-wrap li.wpc-term-item:not(.wpc-term-disabled) label:hover span.wpc-filter-label-wrapper::after {
    background-color: #fff !important; /* Inner dot color on hover */
}


/* Make the parent element relative */
body .wpc-filters-main-wrap input.wpc-label-input+label span.wpc-filter-label-wrapper {
    position: relative; /* Ensures proper positioning for pseudo-elements */
    display: inline-block; /* Maintain inline layout */
}

/* Base style for the before pseudo-element */
body .wpc-filters-main-wrap input.wpc-label-input+label span.wpc-filter-label-wrapper::before {
    content: '';
    display: inline-block;
    width: 16px; /* Size of the outer circle */
    height: 16px;
    border: 2px solid #013D7D; /* Border color for inactive state */
    border-radius: 50%; /* Makes it circular */
    margin-right: 5px; /* Spacing between the dot and the text */
    transition: all 0.3s ease; /* Smooth transition for state change */
    vertical-align: middle; /* Align the dot vertically with the text */
    position: absolute; /* Absolute position relative to parent */
    top: 50%; /* Center vertically */
    left: 10px; /* Align to the left */
    transform: translateY(-50%); /* Ensure vertical centering */
}

/* Style for the checked state */
body .wpc-filters-main-wrap input.wpc-label-input:checked+label span.wpc-filter-label-wrapper::before {
    background-color: white; /* Inner background of the active circle */
    border: 2px solid #013D7D; /* Active border color */
}

/* Inner dot for the active state */
body .wpc-filters-main-wrap input.wpc-label-input:checked+label span.wpc-filter-label-wrapper::after {
    content: '';
    display: inline-block;
    width: 6px; /* Size of the inner dot */
    height: 6px;
    background-color: #013D7D; /* Inner dot color */
    border-radius: 50%; /* Makes it circular */
    position: absolute; /* Absolute position relative to parent */
    top: 50%; /* Center vertically */
    left: 18px; /* Center inside the outer circle */
    transform: translate(-50%, -50%); /* Ensure proper centering */
}

/* Adjust input checkbox size and alignment */
body .wpc-filters-main-wrap input.wpc-label-input {
    width: 20px; /* Size of the checkbox */
    height: 20px; /* Size of the checkbox */
    vertical-align: middle; /* Align the checkbox vertically with the text */
}



/* Footer Styles */
#footer {
    background-color: #9D0154 !important; /* Dark pink */
    padding:44px 32px !important;
    color:#fff !important;
    position: relative;
    z-index:2;
    
}

#footer p {

    color:#fff !important;
}

#footer h2 {
  color: #FFF;

font-family: Verdana;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 130%; /* 36.4px */
letter-spacing: -0.28px;
margin-bottom:30px;
}



#footer.bg-light {
    background-color: #9D0154 !important; /* Ensure bg-light doesn't override */
}


/* Footer List Styles */
#footer ul {
    list-style: none; /* Remove bullets from all footer lists */
    padding: 0; /* Remove padding */
    margin: 0; /* Remove margin */
}

#footer ul li {
    display: flex; /* Use flex for proper alignment */
    align-items: baseline; /* Vertically center items */
    margin-bottom: 5px; /* Add space between list items */
    color: white; /* Ensure all text in the footer is white */
}

#footer ul li a {
    color: white !important; /* Footer menu items should always be white */
    text-decoration: underline; /* Remove underlines from links */
    font-weight: 500; /* Optional: Make links slightly bold */
    position: relative; /* Required for adding arrow */
    padding-right: 20px; /* Add padding to create space for arrow */
    margin-bottom:30px;
}

#footer h3.widget-title {
   color:#fff !important;
   margin-bottom:30px;
   font-size:1.2em;
   font-weight:bold;
}

#footer ul li a:hover {
    text-decoration: underline; /* Optional: Add underline on hover */
}

/* Arrow After Footer Links */
#footer ul li a::after {
    content: " →"; /* Add arrow after menu item */
    color: white; /* Arrow color matches text color */
    position: relative; /* Correct typo for position */
   top: 20px;
    left: 15px;
    transform: translateY(-50%); /* Center vertically */
    font-size: 2rem; /* Adjust arrow size if needed */
    text-decoration: none; /* Remove underline from arrow */
    display: inline-block; /* Ensures text-decoration control */
}

/* New CSS for external links */
#footer ul li.externlink a::after {
    content: "\f35d"; /* Font Awesome external link icon */
    font-family: "Font Awesome 5 Free"; /* Use Font Awesome */
    font-weight: 900; /* Needed for solid icons */
    font-size:1em;
}


/* Arrow After Footer Links */
#footer ul li.organisation::after {
    content: " "; /* Add arrow after menu item */

}

/*Accordions*/
.accordion-item, .accordion-item:last-of-type, .accordion-item:first-of-type, .accordion-item:not(:first-of-type) 
   
 {
  border-radius: 44px;
border: 1.5px solid var(--Base-200, #E4EDF3);
border-top:1.5px solid var(--Base-200, #E4EDF3);
background: var(--Base-000, #FFF);

padding: 48px;

margin-bottom: 32px;
}


.accordion p{
  color: var(--Primary-Dark, #004394);

/* Desktop/Text/Regular */
font-family: Verdana;
font-size: 24px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 33.6px */
letter-spacing: -0.24px;
}

.accordion h2 {
  color: var(--Primary-Dark, #004394);
font-family: Verdana;
font-size: 28px;
font-style: normal;
font-weight: 700;
line-height: 130%; /* 36.4px */
letter-spacing: -0.28px;
}

.accordion.sticky .accordion-item {
border-radius: 44px;
border: 1.5px solid var(--Base-200, #E4EDF3);
background: var(--Primary-Dark, #004394);
color:#fff;}

.accordion.sticky .accordion-item p {

color:#fff;}


.accordion.sticky button{
color: #fff;
background:var(--Primary-Dark, #004394);}


.accordion.sticky .badge.bg-primary-subtle  {
background: : #fff;
color:var(--Primary-Dark, #004394) !important;}

.accordion-button::after {
   
    margin-left: 20px;
   background-image: url('data:image/svg+xml;charset=UTF-8,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"%3E%3Cpath fill="%23FFFFFF" d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 402.7V32c0-17.7-14.3-32-32-32s-32 14.3-32 32v370.7L49.4 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"%3E%3C/path%3E%3C/svg%3E');
   background-size:contain;
   margin-top:-10px;
}

.accordion-button:not(.collapsed)::after {
    background-image: url('data:image/svg+xml;charset=UTF-8,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"%3E%3Cpath fill="%23FFFFFF" d="M214.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 109.3V480c0 17.7 14.3 32 32 32s32-14.3 32-32V109.3l105.4 137.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z"%3E%3C/path%3E%3C/svg%3E');
     background-size:contain;
   margin-top:-10px;
    transform: rotate(0deg); /* No rotation needed */
}

.accordion.white .accordion-button::after { 
 background-image: url('data:image/svg+xml;charset=UTF-8,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"%3E%3Cpath fill="%23004394" d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 402.7V32c0-17.7-14.3-32-32-32s-32 14.3-32 32v370.7L49.4 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"%3E%3C/path%3E%3C/svg%3E');

 
}

.accordion.white .accordion-button:not(.collapsed)::after {
    background-image: url('data:image/svg+xml;charset=UTF-8,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"%3E%3Cpath fill="%23004394" d="M214.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 109.3V480c0 17.7 14.3 32 32 32s32-14.3 32-32V109.3l105.4 137.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z"%3E%3C/path%3E%3C/svg%3E');

}


/*bereiche card*/

.card.card-bereiche {
border-radius: 44px;
border: 1px solid var(--Base-200, #E4EDF3) !important;
background: var(--Base-000, #FFF);

}

.card.card-bereiche .card-body:hover  {
border-radius: 44px !important;

}

.card.card-bereiche .card-body:hover p, .card.card-bereiche .card-body:hover h2, .card.card-bereiche .card-body:hover i {
color:#fff;
}

.card.card-bereiche .card-body:hover .btn.dunkel {
  color:var(--Primary-Dark, #004394) !important;
background: var(--Base-000, #FFF);
}

/*badge*/
.filterbadge {
  padding-left:20px;
  padding-right:20px;
}


body.page-id-11 h1 {
  margin-top:64px;
}

ul.pagination .page-link {
background: var(--Primary-Dark, #004394);
color:#fff;
}

div.entry-footer > nav > ul > li.page-item.active > span > span
  {
text-decoration:underline !important;
font-weight:bold;
}


/*single bg*/
#bereiche {
    position: relative;
    z-index: 1;
    padding: 60px 0;
}

/* Linkes Hintergrundbild */
.bg-left {
    position: absolute;
    top: 0;
    left: -150px;
    width: 300px; /* Breite anpassen */
    height: 1024px; /* Höhe anpassen */
    background-image: url('img/bg_links.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left top;
    z-index: -1;
}

/* Rechtes Hintergrundbild (200px tiefer) */
.bg-right {
    position: absolute;
    top: 350px; /* 200px tiefer als das linke */
    right: -150px;
    width: 300px; /* Breite anpassen */
    height: 1024px; /* Höhe anpassen */
    background-image: url('img/bg_rechts.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right top;
    z-index: -1;
}

/*scroll to top button*/
.top-button.visible {
    opacity: 1;
    transition: visibility 0s linear 0s, opacity 0.3s;
    background-color: #004394;
    border: none !important;
}

.accordion-button:not(.collapsed) {
    background-color: transparent;
    box-shadow: none;
}


.icon_bereich {
    filter: brightness(50%) saturate(100%) invert(8%) sepia(100%) saturate(4000%) hue-rotate(201deg) brightness(50%) contrast(130%);
    transition: filter 0.3s ease-in-out;
}

.card-body:hover .icon_bereich {
    filter: brightness(0) invert(1);
}







/* TAB NAVIGATION - Styled Like Filters */

/* --- TABS STYLING (MATCHES FILTER STYLE) --- */

#cat-14-tab {
  display:none !important; 
}

.nav-tabs {
    border-bottom: none !important; /* Remove default Bootstrap underline */
    display: flex;
    flex-wrap: wrap;
    gap: 10px; /* Spacing between tabs */
}

/* Inactive tabs default to 50% opacity */
.nav-tabs .nav-link {
    position: relative; /* Ensures pseudo-elements position correctly */
    display: inline-block; /* Keep inline layout */
    padding-left: 35px !important; /* Adjust space for dot */
    opacity: 0.5; /* Default to 50% opacity for inactive tabs */
    border-radius: 12px 0 12px 0 !important;
    border: 1.5px solid #013D7D !important;
    color: #012944 !important;
    padding: 10px 20px;
    background: transparent !important;
    transition: opacity 0.3s ease-in-out, background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

/* Hover effect */
.nav-tabs .nav-link:hover {
    background-color: #013D7D !important;
    color: #fff !important;
    opacity: 1; /* Make it fully visible on hover */
}

/* Active tab - fully visible */
.nav-tabs .nav-link.active {
    background-color: #013D7D !important;
    color: #fff !important;
    opacity: 1; /* Active tab is fully visible */
    border-radius: 12px 0 12px 0 !important;
    border: 1.5px solid #013D7D !important;
}

/* Base style for the before pseudo-element (outer circle) */
.nav-tabs .nav-link::before {
    content: '';
    display: inline-block;
    width: 16px; /* Size of the outer circle */
    height: 16px;
    border: 2px solid #013D7D; /* Border color for inactive state */
    border-radius: 50%; /* Makes it circular */
    position: absolute; /* Position relative to parent */
    top: 50%; /* Center vertically */
    left: 10px; /* Align to the left */
    transform: translateY(-50%); /* Ensure vertical centering */
    transition: all 0.3s ease-in-out; /* Smooth transition */
}

/* Active tab - dot gets filled */
.nav-tabs .nav-link.active::before,
.nav-tabs .nav-link:hover::before{
    background-color: white; /* Inner background of the active circle */
    border: 2px solid #013D7D; /* Active border color */
}





/* Inner dot for the active state */
.nav-tabs .nav-link.active::after {
    content: '';
    display: inline-block;
    width: 6px; /* Size of the inner dot */
    height: 6px;
    background-color: #013D7D; /* Inner dot color */
    border-radius: 50%; /* Makes it circular */
    position: absolute; /* Absolute position relative to parent */
    top: 50%; /* Center vertically */
    left: 18px; /* Center inside the outer circle */
    transform: translate(-50%, -50%); /* Ensure perfect centering */
}



body.search-no-results .btn.dunkel:hover i::before {
  color:#fff;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .nav-tabs {
        flex-direction: row;
        justify-content: flex-start;
        overflow-x: auto;
        white-space: nowrap;
    }
}
