/* Engage branding for Gitea. Keep this intentionally restrained: do not override Gitea's theme palette globally. */
:root {
  --engage-green: #6fbb45;
  --engage-green-soft: #eaf6e5;
  --engage-forest: #263823;
  --engage-ink: #171b19;
  --engage-border: rgba(111, 187, 69, 0.34);
}

#navbar {
  background: var(--engage-ink) !important;
  border-bottom: 2px solid var(--engage-green);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.12);
}

#navbar-logo {
  width: 164px;
  min-width: 164px;
  padding-left: 16px;
  padding-right: 16px;
  background: url('/assets/img/engage-logo.png') center / 138px auto no-repeat;
}

#navbar-logo img {
  width: 138px !important;
  height: auto !important;
  max-height: 30px;
  object-fit: contain;
  opacity: 0;
}

#navbar a.item,
#navbar button.item,
#navbar .item {
  color: rgba(255, 255, 255, 0.84) !important;
}

#navbar a.item:hover,
#navbar button.item:hover,
#navbar .item:hover,
#navbar .active.item {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
}

#navbar .ui.dropdown .menu .item {
  color: var(--color-text) !important;
}

.ui.primary.button,
.ui.green.button {
  background: var(--engage-forest) !important;
  border-color: var(--engage-forest) !important;
  color: #ffffff !important;
}

.ui.primary.button:hover,
.ui.green.button:hover {
  background: #1f2f1d !important;
  border-color: #1f2f1d !important;
}

.ui.primary.button:focus,
.ui.green.button:focus,
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--engage-green) !important;
  outline-offset: 2px;
}

/* Login page only. Leave dashboards/repositories on the native Gitea theme colours. */
.user.signin,
.user.signup,
.user.forgot.password {
  background:
    radial-gradient(circle at 18% 8%, rgba(111, 187, 69, 0.12), transparent 30rem),
    linear-gradient(135deg, rgba(38, 56, 35, 0.045), rgba(111, 187, 69, 0.035));
}

.user.signin .ui.container,
.user.signup .ui.container,
.user.forgot.password .ui.container {
  max-width: 520px;
}

.user.signin .ui.header::before,
.user.signup .ui.header::before,
.user.forgot.password .ui.header::before {
  content: "";
  display: block;
  width: 248px;
  height: 54px;
  margin: 0 auto 18px;
  border-radius: 7px;
  background: var(--engage-ink) url('/assets/img/engage-logo.png') center / 210px auto no-repeat;
  box-shadow: inset 0 -2px 0 var(--engage-green);
}

.user.signin .ui.segment,
.user.signup .ui.segment,
.user.forgot.password .ui.segment {
  border-top: 2px solid var(--engage-green);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.10);
}

@media (max-width: 767px) {
  #navbar-logo {
    width: 142px;
    min-width: 142px;
    background-size: 118px auto;
  }
  #navbar-logo img {
    width: 118px !important;
  }
}
