@import "patPortal_depr.css";

/* font */
@font-face {
    font-family:'Helvetica';
    font-style: normal;
    font-weight: 400;
    src: local('Helvetica'),
    url(fonts/helvetica/helvetica.ttf) format('truetype'),
    url(fonts/helvetica/helvetica.woff) format('woff'), /* Modern Browsers */
    url(fonts/helvetica/helvetica.woff2) format('woff2'); /* Super Modern Browsers */
}

:root {

   /* --logo: url('../../../images/custom-schoen_klinik_gruppe_rgb.svg');*/
    --header-bg: #ffffff;

    /* font definition */
    --font-text: 'Helvetica';
    --font-headline: 'Helvetica';
    /* color name definition */
    --primary: #f6d333; /*#609999;*/
    --primary-hover: #fca311;
    --primary-active: #d4751c;  /*--#fca311--*/
    --primary-active-border:  var(--primary-active);
    --primary-checked: var(--primary-active);
    --primary-checked-hover: #fca311;
    --primary-disabled: #b6b6b6; /*--hell grau--*/
    --primary-text: #2e3136; /*--dark text--*/
    --primary2: #23518d;    /*--?--*/        /* multi level elements such accordion */

    --secondary: #84868a;
    --secondary-hover: var(--primary-hover);
    --secondary-active: var(--primary-active);
    --secondary-disabled: #b6b6b6;
    --secondary-text: #fefefe;; /*--hell text--*/

    --third: rgb(182, 182, 182); /*--?--*/
    --third-hover: #ef7d00; /*--?--*/
    --third-active: rgb(182, 182, 182); /*--?--*/
    --third-disabled: rgb(182, 182, 182); /*--?--*/
    --third-text: #fefefe;
    --success: #7AB51D; /*--?--*/
    --success-light: #b6d385; /*--?--*/
    --success-dark: #456711; /*--?--*/

    --bg-header-footer: #ededed;
    --color-willkommen-text: #18b950;
    --color-icon-kacheln: #f57606;

    --warning:#d94802; /*--?--*/

    --btn-warning-bg: #fefefe;

    --btn-primary-text: var(--primary-text);
    --btn-primary-active-text: var(--primary-text);
    --btn-primary-checked-text: var(--primary-text);
    --btn-primary-hover-text: var(--btn-primary-text);
    --btn-primary-disabled-text: var(--btn-primary-text);

    --btn-secondary-text: #fefefe;
    --btn-secondary-hover-text: var(--btn-secondary-text);
    --btn-secondary-active-text: #fff;
    --btn-secondary-disabled-text: #fff;

    --btn-third-text: var(--primary2);
    --btn-third-hover-text: #ffffff; /*--?--*/

    --info: #888; /*--?--*/
    --info-text: #fefefe; /*--?--*/

    --accordion: #ffffff;
    --accordion-hover-bg: var(--secondary);
    --accordion-active:var(--primary);
    --accordion-disabled: #DFE9A9;  /*--?--*/

    --filter-bg: #EAEFF0 /*--?--*/
}

/*layout*/
body {
    font-family: var(--font-text), Arial, sans-serif!important;
}

.navbar {
    /*background-color: var(--bg-header-footer);*/
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

nav.navbar .navbar-brand #navbarImg {
    display: none;
}

nav.navbar ul.navbar-nav li.nav-item a.nav-link i{
    display: none;
}

nav.navbar ul.navbar-nav {
    margin-right: 0 !important;
}

nav.navbar #navbarSupportedContent {
    justify-content: end;
    text-transform: uppercase;
    letter-spacing: 1px;
}
/*
nav.navbar a.navbar-brand.showFirstTile.ppTitleText {
    display: none;
}*/

/*!*--ohne Anmeldung werden Terminbuchung oder Aunahmeanfrage ausgeblendet--*!
#wrapper nav.navbar #navbarSupportedContent a.nav-link[data-tileid="Home"],
#wrapper nav.navbar #navbarSupportedContent a.nav-link[data-tileid="TerminAnfrage"],
#wrapper nav.navbar #navbarSupportedContent a.nav-link[data-tileid="TerminAnfrage_2"] {
    display: none;
}*/

.breadNav {
    padding-top: 1rem!important;
}

#tileContentContainer {
    padding-top: 0px!important;
}


/*--NB20241017 - Farbe für Icon in Kachel--*/
.service-1:last-child i {
    color: var(--color-icon-kacheln);
}

/*--NB20241002 - Zeitauswahltasten auf der Terminbuchungseite --*/
.taTerminChoiceOneDayDatesSelectionContainer > .col > button.btn-primary.active,
.taTerminChoiceOneDayDatesSelectionContainer > .col > button.btn-primary:active{
    color: var(--btn-primary-checked-text);
    background-color: var(--primary-active);
    border-color: var(--primary-active);
}

/*--NB20241002 - Farbe für ative Menüpunkt --*/
#navbarSupportedContent a.nav-link.activated {
    background-color: var(--secondary);
    color: var(--secondary-text)!important;
}


/***********************************************************/
/** region Timeline Accordion */
/*--NB20241002 - Accordion  Meine Akte --*/
.timelineAccordionContainer > div.accordion > div.accordion-item > h2.accordion-header > button.accordion-button {
    background-color: var(--primary)!important;
    color: var(--primary-text);
}

.timelineAccordionContainer > div.accordion > div.accordion-item > h2.accordion-header > button.accordion-button.collapsed {
    border: solid 2px var(--primary)!important;
    background-color: var(--accordion)!important;
    color: var(--primary-text)!important;
}

.timelineAccordionContainer > div.accordion > div.accordion-item > h2.accordion-header > button.accordion-button.collapsed:hover {
    background-color: var(--primary)!important;
    color: var(--primary-text)!important;
}

/*--NB20241002 - Accordion innerhalb Accordion --*/
.timelineAccordionContainer div.accordion-item div.accordion-collapse button.accordion-button {
    background-color: var(--secondary);
    color: var(--secondary-text);
}

.timelineAccordionContainer div.accordion-item div.accordion-collapse button.accordion-button.collapsed {
    border: solid 2px var(--secondary);
    background-color: var(--accordion);
    color: var(--primary-text);
}

.timelineAccordionContainer div.accordion-item div.accordion-collapse button.accordion-button.collapsed:hover {
    background-color: var(--secondary);
    color: var(--secondary-text);
}

.timelineAccordionContainer > div.accordion > div.accordion-item {
    margin-bottom: 0.25rem;
}

/*--machen Accordion Arrows weiß--*/
.timelineAccordionContainer div.accordion-item div.accordion-collapse button.accordion-button:after,
.timelineAccordionContainer div.accordion-item div.accordion-collapse button.accordion-button.collapsed:hover:after,
.timelineAccordionContainer > div.accordion > div.accordion-item > h2.accordion-header > button.accordion-button.collapsed:after {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>") !important;
}

/*--machen Accordion Arrows dark--*/
.timelineAccordionContainer > div.accordion > div.accordion-item > h2.accordion-header > button.accordion-button:after,
.timelineAccordionContainer > div.accordion > div.accordion-item > h2.accordion-header > button.accordion-button.collapsed:hover:after,
.timelineAccordionContainer > div.accordion > div.accordion-item > h2.accordion-header > button.accordion-button.collapsed::after,
.timelineAccordionContainer div.accordion-item div.accordion-collapse button.accordion-button.collapsed:after {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%232e3136'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>") !important;
}

button.accordion-button:focus {
    box-shadow: none;
}

span.badge {
    vertical-align: text-top!important;
}

span.badge.bg-secondary {
    background-color: var(--primary-active)!important;
}
/** endregion */
/***********************************************************/

.btn-check:checked + .btn {
    background-color: var(--primary-checked);
    border-color: var(--primary-active-border);
}

/*--breadcrambs--*/
.breadNav li.breadcrumb-item a {
    color: var(--primary-text);
}

.tile.Home a:hover,
.breadNav li.breadcrumb-item a:hover {
    text-decoration-color: var(--primary-hover);
    text-decoration-style: double;
}

.breadNav li.breadcrumb-item {
    color: var(--primary-text);
}

/*--Cards in Einstellungen--*/
div.tile.Einstellungen div.content div.card div.card-header {
    background-color: var(--secondary);
    color: var(--primary-text);
}

div.tile.Einstellungen div.content div.card div.accordion button.accordion-button {
    color: var(--primary-text);
}

.logo-shadow {
    box-shadow: rgba(250, 250, 250, 0.9) 3px 3px 10px 5px !important;
}

/***********************************************************/
/** region  Footer */

footer#footerBar {
    background-color: var(--bg-header-footer);
}

footer#footerBar a.footerBarBtn {
    color: var(--primary-text);
}

footer#footerBar a.footerBarBtn:hover {
    background-color: var(--primary-hover);
}

/*--Logo in Footer--*/
footer#footerBar::before {
    content: '';
    background-image: url('../images/custom-skh-EU-Logo-blau-horizontal.png');
    display: block;
    width: 240px;
    height: 60px;
    background-size: contain; /* Make sure the image fits within the specified width */
    background-repeat: no-repeat; /* Prevent repeating the image */
    background-position: center;
}
/** endregion */
/***********************************************************/

/*-- NB20250408 - ausgeblendet "Frage stellen" Div --*/
.tile.FAQ div:has(> button[data-bs-target="#collapseNewQuestArea"]) {
    display: none;
}

/***********************************************************/
/** region  Wegfindung */
.tile.Navigation .wayPointSelectContainer ol.breadcrumb {
    align-items: end;
}

.tile.Navigation .wayPointSelectContainer a {
    color: unset!important;
    text-decoration: none;
}

.tile.Navigation .wayPointSelectContainer:has(select#wpStart) a > i {
    color: #008800;
    font-size: 2rem;
}

.tile.Navigation .wayPointSelectContainer:has(select#wpDest) a > i {
    color: #ff0000;
    font-size: 2rem;
}
/** endregion */
/***********************************************************/


.tile.MyData .accordion-button:not(.collapsed),
.tile.FAQ .accordion-button:not(.collapsed),
.tile.Notizen .accordion-button:not(.collapsed) {
    background-color: var(--accordion-active);
    border-color: var(--accordion-active);
    color: var(--primary-text);
}

/***********************************************************/
/** region  Behandlungsinformation */
.tile.StaticHtml_1 div.accordion > div.accordion-item > h2.accordion-header > button.accordion-button {
    background-color: var(--primary)!important;
    color: var(--primary-text);
}

.tile.StaticHtml_1 div.accordion > div.accordion-item > h2.accordion-header > button.accordion-button.collapsed {
    border: solid 2px var(--primary)!important;
    background-color: var(--accordion)!important;
    color: var(--primary-text)!important;
}

.tile.StaticHtml_1 div.accordion > div.accordion-item > h2.accordion-header > button.accordion-button.collapsed:hover {
    background-color: var(--primary)!important;
    color: var(--primary-text)!important;
}

.tile.StaticHtml_1 #nav-tab button:hover {
    box-shadow: var(--bs-box-shadow) !important;
}

.tile.StaticHtml_1 #nav-tab button.active {
    box-shadow: var(--bs-box-shadow) !important;
    z-index: 2;
    outline: 1px solid var(--primary);
}
/** endregion */
/***********************************************************/