/*
Theme Name: De Stuwzangers FSE
Theme URI: https://sieroit.nl
Author: Marijn Siero
Author URI: https://www.sieroit.nl
Description: FSE thema voor De Stuwzangers
Version: 1.0
Requires at least: 6.0
Tested up to: 6.4
Requires PHP: 7.4
License: Marijn Siero - SieroIT
License URI: https://www.sieroit.nl
Text Domain: destuwzangers-fse
*/

/* Additional custom styles can be added here */

:root {
  --sz-red: #9c2730;
  --sz-light-blue: #e7e8fb;
  --sz-dark-blue: #48508e;
}

html {
  font-family: "Roboto Slab", serif;
}

body {
  margin: 5px;
}

/* Printing */
@media print {
  .header-right {
    display: none !important;
  }

  body,
  body * {
    color: #000 !important; /* tekst zwart maken */
    background: none !important; /* verwijdert achtergrondkleuren */
  }
}

/* Sponsor */

div.sponsor {
  background-color: white;
  border: 1px solid var(--sz-red);
  width: 300px !important;
  height: 300px !important;
  display: flex;
  justify-content: center; /* horizontal */
  align-items: center; /* vertical */
  padding: 10px;
  margin: 10px;
}

/* Header */

header {
  height: 100px;
  background-color: var(--sz-light-blue);

  display: flex;
  justify-content: space-between; /* Push left and right groups apart */
  align-items: center; /* Vertical alignment */
  gap: 0px; /* Space between left and right groups */

  color: var(--sz-red);

  max-width: var(--wp--style--global--content-size);
  margin-left: auto !important;
  margin-right: auto !important;
}

.header-left,
.header-right {
  display: flex;
  gap: 0px; /* Space between columns inside each group */
  align-items: center; /* vertical centering */
  padding: 10px;
}

.site-logo {
  width: 80px;
  height: auto;
  display: block;
  margin-right: 10px;
}

.site-member-nav {
  color: var(--sz-red);
}

.site-main-nav {
  color: var(--sz-red);
}

.site-title {
  margin: 0px;
  font-size: 1.7em;
  font-weight: bold;
  white-space: nowrap;
}

a.logout-link,
a.login-link {
  color: white;
  margin-left: 10px;
}

.wp-block-navigation {
  gap: 15px;
}

.wp-block-navigation:not(.has-background)
  .wp-block-navigation__submenu-container {
  background-color: var(--sz-dark-blue);
  color: white;
}

.wp-block-navigation a:hover,
a.logout-link,
a.login-link {
  text-decoration: underline;
}

.wp-block-navigation__responsive-container.is-menu-open {
  padding: 50px;
}

/* Events */

.event-private {
  color: yellow;
}

.event-date {
  background-color: var(--sz-dark-blue);
  color: white;
}

.event-list .event-private {
  color: var(--sz-red);
}

.event-notes {
  color: var(--sz-red);
}