/*
 * PSippr look on top of the Materialize template (21 Oct 2026, owner: every site except mjdev.psippr.cz uses the bought
 * template; accent = the green of the app icon, dark theme by default with a black background).
 *
 * Load order on a page: vendor core.css, then this file, then psippr-theme.js. The values below are the CSS fallback
 * (page without JavaScript); psippr-theme.js derives the remaining primary shades from PSIPPR_THEME.primary.
 */

/* Accent and font: one place for every site. */
:root,
[data-bs-theme=light],
[data-bs-theme=dark] {
  /* accent green of the PSippr icon (sites used --accent: #00e676 before the template) */
  --bs-primary: #00e676;
  --bs-primary-rgb: 0, 230, 118;
  /* dark text on the bright green keeps the contrast of buttons readable */
  --bs-primary-contrast: #000;
  /* system fonts only: no font is loaded from another server */
  --bs-font-sans-serif: -apple-system, blinkmacsystemfont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans",
    "Droid Sans", "Helvetica Neue", sans-serif;
  /* old name kept for the site styles written before the template */
  --accent: var(--bs-primary);
}

/* Dark theme: black background, near-black cards (owner: "background default black in dark theme"). */
[data-bs-theme=dark] {
  --bs-body-bg: #000;
  --bs-body-bg-rgb: 0, 0, 0;
  --bs-paper-bg: #121212;
  --bs-paper-bg-rgb: 18, 18, 18;
  --bs-tertiary-bg: #1a1a1a;
  --bs-tertiary-bg-rgb: 26, 26, 26;
  --bs-secondary-bg: #262626;
  --bs-secondary-bg-rgb: 38, 38, 38;
  --bs-secondary-bg-subtle: #1f1f1f;
  --bs-border-color: #2a2a2a;
  /* neutral greys instead of the template's blue-tinted text (made for its navy background) */
  --bs-body-color: #d0d0d0;
  --bs-body-color-rgb: 208, 208, 208;
  --bs-heading-color: #f2f2f2;
  --bs-secondary-color: #9e9e9e;
  --bs-secondary-color-rgb: 158, 158, 158;
}

/* Logo: white bunny on a black rounded square (logo.svg of this folder). */
.psippr-logo {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  border-radius: 22%;
  background: #000 url("logo.svg") center / cover no-repeat;
}

.psippr-logo-lg {
  width: 4rem;
  height: 4rem;
}

/* Modal backdrop: black like the page, not the template's navy. */
[data-bs-theme=dark] .modal-backdrop {
  --bs-backdrop-bg: #000;
}

/* Button labels as written: the template capitalizes every word, which breaks Czech/Slovak texts
   ("Zaregistrovat Se"). */
.btn {
  text-transform: none;
}

/* Shell pages (psippr-shell.js) stay hidden until the menu is built or the visitor is sent to the sign-in page. */
body[data-psippr-shell]:not(.psippr-ready) {
  visibility: hidden;
}

/* Menu of the shell (dark theme): neutral greys like the rest instead of the template's navy; black text on the green
   active item for contrast. */
[data-bs-theme=dark] {
  --bs-menu-bg: #0d0d0d;
  --bs-menu-bg-rgb: 13, 13, 13;
  --bs-menu-color: #d0d0d0;
  --bs-menu-color-rgb: 208, 208, 208;
  --bs-menu-hover-bg: #1c1c1c;
  --bs-menu-hover-color: #f2f2f2;
  --bs-menu-active-color: #000;
  --bs-menu-active-toggle-bg: #1c1c1c;
  --bs-menu-sub-active-bg: #1c1c1c;
  --bs-menu-sub-active-color: #f2f2f2;
  --bs-menu-item-icon-color: #d0d0d0;
  --bs-menu-box-shadow: none;
}

/* Shell pages: the template layout owns the body; page styles written before the shell (body as a flex column) must not
   squeeze it. */
body[data-psippr-shell].psippr-ready {
  display: block;
  min-height: 0;
}

/* Front navbar of the public pages (psippr-front.js): stays on top while the page scrolls. */
.psippr-front-nav {
  position: sticky;
  top: 0;
  z-index: 1000;
}

/* Front pages: black page background like every other site (the template front pages use the card colour). */
body[data-psippr-front] {
  background-color: var(--bs-body-bg);
}
