/* SaarLetsPlay-Design, abgeleitet aus dem SLP-Logo */
:root {
  --slp-bg: #140702;
  --slp-panel: #26100a;
  --slp-input: #1b0a04;
  --slp-accent: #dd4b0b;
  --slp-accent-hi: #f56a0f;
  --slp-gold: #fbdb54;
  --slp-text: #fbe9d6;
  --slp-muted: #d9b99c;
}
body, .ui, .columns-area, .drawer__inner, .navigation-panel {
  background: var(--slp-bg) !important;
}
.column, .status, .account-card, .modal-root__modal, .compose-form, .notification__filter-bar, .drawer__header {
  background: var(--slp-panel) !important;
}
.ui, .ui * { color: var(--slp-text); }
.ui .status__content, .ui .status__content p { color: var(--slp-text) !important; }
.ui .account__display-name, .ui .display-name, .ui .display-name strong { color: var(--slp-text) !important; }
.ui .display-name span, .ui .account__header__tabs__name small, .ui .status__relative-time, .ui time { color: var(--slp-muted) !important; }
input, textarea, select {
  background: var(--slp-input) !important;
  color: var(--slp-text) !important;
  border-color: #5a2a14 !important;
}
::placeholder { color: var(--slp-muted) !important; opacity: 0.8; }
a, .ui a { color: var(--slp-accent-hi) !important; }
.button, .button--block, .ui .button, .ui .button * {
  background-color: var(--slp-accent) !important;
  color: #fff !important;
}
.button:hover, .button:focus { background-color: var(--slp-accent-hi) !important; }
.column-header, .column-header__button, .tabs-bar__link.active { color: var(--slp-gold) !important; }
svg.logo--wordmark, svg.logo--icon {
  display: inline-block;
  width: 48px;
  height: 48px;
  background: url('/branding/slp-logo.png') center / contain no-repeat;
}
svg.logo--wordmark use, svg.logo--icon use { display: none; }

/* Helle Restbereiche auf dunkel setzen */
.column-header, .column-header__wrapper, .column-header__back, .drawer__header, .ui .column-link {
  background: var(--slp-panel) !important;
  color: var(--slp-gold) !important;
}
.column-header__back, .column-header__button { color: var(--slp-gold) !important; }
.compose-form, .compose-form__buttons-wrapper, .compose-form__buttons {
  background: var(--slp-panel) !important;
}
.privacy-dropdown__value, .privacy-dropdown__dropdown, .language-dropdown__dropdown, .dropdown-button,
.language-dropdown, .privacy-dropdown, .dropdown-menu {
  background: var(--slp-input) !important;
  color: var(--slp-text) !important;
  border-color: #5a2a14 !important;
}
.privacy-dropdown__value-icon, .privacy-dropdown__value *, .language-dropdown__dropdown * , .dropdown-button * {
  color: var(--slp-text) !important;
}

/* Ganze Seite, damit auch Anmeldung und Startseite lesbar sind */
html, body { background: var(--slp-bg) !important; }
body, body * { color: var(--slp-text); }
body .button, body .button *, body .button--block { color: #fff !important; }
body a, body a * { color: var(--slp-accent-hi); }
body .hint, body .input .hint, body small { color: var(--slp-muted) !important; }

/* Anmeldeformular: Beschreibung, Labels und Hinweise hell */
body label, body .input label, body .lead, body p, body .form-container p,
body .simple_form label, body .simple_form p, body h1, body h2, body h3,
body .form-container, body .simple_form, body .fields-group label {
  color: var(--slp-text) !important;
}
body .hint, body .input .hint, body .simple_form .hint { color: var(--slp-muted) !important; }
body .button, body .button * { color: #fff !important; }