:root,
[data-bs-theme="light"] {
  --body-gradient-inner: #ffffff;
  --body-gradient-outer: #ffffffb8 80%;
  --text-invert-color: #ffffff;
  --bg-bage: rgb(108 117 125);
  --blockquote-bg: #f8f9fa;
  --blockquote-border: #6ea8fe;
  --privacy-modal-bg: #f0f7ff;
}

[data-bs-theme="dark"] {
  --body-gradient-inner: #292929;
  /* #3f3f3f; */
  --body-gradient-outer: #212529f2 80%;
  --text-invert-color: #000000;
  --bg-bage: #3f4449;
  --blockquote-bg: #2d3339;
  --blockquote-border: #5c8bd2;
  --privacy-modal-bg: #212529;
}

.headline-cover-main {
  background-image: radial-gradient(rgb(51 73 115 / 95%), rgb(35 39 43 / 84%)), url(/static/img/main.jpg) !important;
  background-repeat: no-repeat;
  background-size: cover;
}

.logo-icon {
  width: 2.5em;
  aspect-ratio: auto;
  height: auto;
  object-fit: contain;
}


.bi {
  vertical-align: -.125em;
  fill: currentColor;
}

.bi2 {
  vertical-align: -.24em;
  fill: currentColor;
}

.menu-icon {
  color: #6ea8fe;
}

.cover-container {
  background: radial-gradient(circle at center, var(--body-gradient-inner), var(--body-gradient-outer));
  background-attachment: fixed;
}

.logo-dark {
  width: 150px;
  height: 50px;
  background-image: url(/static/img/ics.svg);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: center;
}

.project-logo {
  object-fit: contain;
  max-height: 100px;
  width: auto;
}

.bg-bage {
  background-color: var(--bg-bage);
}

blockquote {
  border-left: 4px solid var(--blockquote-border);
  margin-top: 2em;
  margin-bottom: 2em;
  background-color: var(--blockquote-bg);
  padding: 1em 1em 0.2em 1em;
}

.privacy-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 9998;
}

.privacy-modal {
  position: fixed;
  bottom: 20px;
  right: 20px;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  z-index: 9999;
  width: 400px;
  max-width: 90%;
  text-align: center;
  background-color: var(--privacy-modal-bg);
}

.privacy-modal-content {
  display: flex;
  flex-direction: column;
}