/*! dark-theme.css – Dark mode overrides (load after main.css) */

/* Dark theme CSS variables */
body.dark-theme {
  --text-color: #fafafa;
  --bg-color: #222;
}

@media (prefers-color-scheme: dark) {
  /* defaults to dark theme when system prefers dark */
  body {
    --text-color: #fafafa;
    --bg-color: #222;
  }
  body.dark-theme {
    --text-color: #fafafa;
    --bg-color: #222;
  }
}

/* Mode switcher button in dark theme */
.dark-theme #header .brand .mode-switcher .btn-toggle { border: 2px solid #fff; }
.dark-theme #header .brand .mode-switcher .btn-toggle svg { color: #fff; }
.dark-theme #header .brand .mode-switcher .btn-toggle:hover { border: 2px solid #ccc; }
.dark-theme #header .brand .mode-switcher .btn-toggle:hover svg { color: #ccc; }

/* ==========================================================================
   Dark theme modifications
   ========================================================================== */

.dark-theme .bg_intro, .dark-theme .bg_upscroll, .dark-theme .bg_food, .dark-theme .bg_events,
.dark-theme .bg_catering, .dark-theme .bg_news, .dark-theme .bg_about { background:#121212; border-left:1px solid #333; border-right:1px solid #333; }

.dark-theme #header .brand { background:#121212; }

.dark-theme .teaser-box.bg-default, .dark-theme .ce-imgtext { background:#222; border:1px solid #333; transition:all .35s; }
.dark-theme .ce-imgtext.postcard { border:1px solid #fafafa; }
.dark-theme .ce-imgtext:hover { border:1px solid #fafafa; }

.dark-theme #header .navbar { background:#222; background-image:none; border-top:1px solid #333; border-bottom:1px solid #333; }
.dark-theme #header .navbar .wrapper .inner, .dark-theme #header .navbar .nav_lang { background:none; }
.dark-theme #header .navbar .nav_lang li a, .dark-theme #header .navbar .nav_meta li a { color:#fafafa; }
.dark-theme #header .navbar .nav_lang li a:hover,  .dark-theme #header .navbar .nav_meta li a:hover { color:#ccc; }

.dark-theme #sectionmenu { margin-top:2px; }
.dark-theme #sectionmenu li a {
  color:#fafafa;
  background:#121212;
  border:1px solid #ccc;
}
.dark-theme #sectionmenu li.active a, .dark-theme #sectionmenu li a:hover { color:#121212; background:#fafafa; }

.dark-theme .op-title .wrapper .inner h1 { background:#121212; }
.dark-theme main h1, .dark-theme main h2, .dark-theme main h3, .dark-theme main h4, .dark-theme .ce-team .ce-team__text h3 { color:#fafafa; }

.dark-theme .fancy_video a, .dark-theme .fancy_video a:hover { color:#fafafa; border-bottom:none !important; }

.dark-theme main a:not(.eapps-instagram-feed-posts-item-link) { color:#fafafa; border-bottom:2px solid #fafafa; padding:2px 1px 0 1px; }
.dark-theme main a:not(.eapps-instagram-feed-posts-item-link):not(.no_border):not(.no-border):hover { color:#121212; border-bottom:2px solid #fafafa; background:#fafafa }

.dark-theme .ce-imgtext.postcard h2 { background:#121212; color:#fafafa; }
.dark-theme .ce-imgtext.postcard .img:hover h2 { background:#fafafa; color:#121212; }

.dark-theme footer .logos.social a, .dark-theme footer .logos.social a:hover,
.dark-theme footer a.blindspot, .dark-theme footer a.blindspot:hover, footer a.b-bern,
.dark-theme footer a.b-bern:hover, a.no-border, footer .toyota a, footer .toyota a:hover, .dark-theme .pagelist a, .shariff-button a:hover { border-bottom:none !important; background:none !important; }

.dark-theme .ce-imgtext.two_col.card h3 { border-bottom:1px solid #333; background:#121212; }
.dark-theme .ce-imgtext.two_col.card:hover h3 { background:#222; }

.dark-theme #upscroll a, .dark-theme #upscroll a:before, .dark-theme #upscroll a:after { color:#fafafa; }
.dark-theme #upscroll a:hover { color:#ccc; }

.dark-theme footer .logos.social svg { fill:#fafafa; }
.dark-theme footer .logos.social svg:hover { fill:#ccc; }

.dark-theme .c-accordion-item { border:1px solid #999; }
.dark-theme .c-accordion-item .c-accordion-title { background:#222; }
.dark-theme .c-accordion-item.act .c-accordion-title { border-bottom:2px dotted #fafafa; background:#121212; }

.dark-theme .c-accordion-item .c-accordion-title h3 { color:#fafafa; }
.dark-theme .c-accordion-item.act .c-accordion-title h3 { color:#121212; }

.dark-theme .c-accordion-item .c-accordion-title:hover { background:#121212; }
.dark-theme .c-accordion-item.act .c-accordion-title h3 { color:#fafafa; }
.dark-theme .c-accordion-item .c-accordion-title:hover h3 { color:#fafafa; }
.dark-theme .c-accordion-item.act .c-accordion-title svg { fill:#fafafa; }
.dark-theme .c-accordion-item .c-accordion-title:hover svg { fill:#fafafa; }
.dark-theme .c-accordion-item.act .c-accordion-content { background:#222; }

.dark-theme .ce-slider .flickity-prev-next-button .flickity-button-icon,
.dark-theme .ce-team .flickity-prev-next-button .flickity-button-icon { fill:#fafafa; }
.dark-theme .ce-slider .flickity-button:hover .flickity-button-icon path,
.dark-theme .ce-team .flickity-button:hover .flickity-button-icon path { fill:#ccc; }
.dark-theme .flickity-page-dots .dot { background:#ccc; }

.dark-theme.subpage-body main header h1 { border-bottom:2px dotted #fafafa; }

.dark-theme .burger svg, .dark-theme .close svg { fill:#fafafa; }

.dark-theme .shariff .theme-white .shariff-button.facebook {
  background-image: url('../Images/Layout/shariff_icons/dark-theme/facebook_icon.svg');
}
.dark-theme .shariff .theme-white .shariff-button.linkedin {
  background-image: url('../Images/Layout/shariff_icons/dark-theme/linkedin_icon.svg');
}
.dark-theme .shariff .theme-white .shariff-button.mail {
  background-image: url('../Images/Layout/shariff_icons/dark-theme/mail_icon.svg');
}
.dark-theme .shariff .theme-white .shariff-button.twitter {
  background-image: url('../Images/Layout/shariff_icons/dark-theme/twitter_icon.svg');
}
.dark-theme .shariff .theme-white .shariff-button.whatsapp {
  background-image: url('../Images/Layout/shariff_icons/dark-theme/whatsapp_icon.svg');
}
.dark-theme .shariff .theme-white .shariff-button:hover,
.dark-theme .shariff .theme-white .shariff-button:focus { filter: brightness(80%); }

.dark-theme #eapps-instagram-feed-1 .eapps-instagram-feed-posts-grid-load-more { background:#333; border:1px solid #fafafa; }
.dark-theme #eapps-instagram-feed-1 .eapps-instagram-feed-posts-grid-load-more:hover { background:#fafafa; color:#121212; }

.dark-theme svg.ecofort { filter: brightness(0) invert(1); }

/* Dark theme – larger screens (72em) */
@media only screen and (min-width: 72em) {
  .dark-theme #sectionmenu li a { margin-top:-1px; border-top:1px solid #fafafa; border-left:1px solid #333; border-bottom:1px solid #fafafa; }
}