/*
 * yunite.me custom style overrides (formerly the raw CSS in the build-time _branding.scss).
 * Served from the brand's assets folder and injected at runtime (branding.assets.css →
 * plugins/branding-head.js), so it applies on a live switch without a rebuild. Brand colours use
 * the runtime CSS custom properties (var(--color-primary/-secondary)); the Overpass font is loaded
 * via branding.theme.fontFaces.
 */

.main-navigation a {
  color: #fff;
  text-transform: uppercase;
  font-size: 16px;
  font-weight: 500;
}
.main-navigation a:hover {
  color: hsla(0, 0%, 100%, 0.8);
}
.main-navigation .router-link-exact-active {
  color: var(--color-secondary) !important;
}
.main-navigation .locale-menu {
  color: #fff;
}
.main-navigation .os-button {
  color: #fff !important;
}

/* The video-call header reuses $color-header-background (= --color-primary for yunite), so its
   minimize/close buttons (variant="primary" appearance="outline") would render the icon in the same
   colour as their own background — invisible. Give this ONE header --color-primary-contrast instead
   (unlike the main nav, which stays branded) — the token defined to contrast against --color-primary,
   so the buttons' default primary icon colour has contrast again. */
.video-call__header {
  background: var(--color-primary-contrast) !important;
}

#nav-search-box .hc-hashtag a {
  color: var(--color-primary);
}

/* Info toasts. The framework's "blue" toast is $color-toast-blue = $color-secondary, i.e. yunite's
   lime — unreadable as an info colour. The old build-time SCSS pinned it back to the vanilla blue
   ($color-toast-blue: rgb(0, 142, 230)); this restores that. `!important` because the framework rule
   (assets/styles/imports/_toast.scss) carries it too — same specificity, this sheet loads later. */
.iziToast.iziToast-color-blue {
  background: rgb(0, 142, 230) !important;
  border-color: rgb(0, 142, 230) !important;
}

#footer {
  background-color: var(--color-secondary);
}
#footer a {
  color: var(--color-primary);
}

.avatar-menu .profile-avatar {
  color: var(--color-primary);
}
.profile-avatar .initials {
  color: var(--color-primary);
}

.branding-menu .ds-text {
  font-family: 'Overpass', Helvetica, Arial, Lucida, sans-serif;
  font-weight: 500;
  text-transform: uppercase;
  font-size: 16px;
}

/* avoid uppercase for user slug */
span.slug {
  text-transform: none;
}

.ds-footer {
  font-family: 'Overpass', Helvetica, Arial, Lucida, sans-serif;
  text-transform: uppercase;
  font-size: 16px;
  font-weight: 300;
}

/* chips on group teaser */
a.group-teaser footer .ds-chip-primary {
  background-color: var(--color-primary);
}
/* chips on group profile */
.group-profile .ds-chip-primary {
  background-color: var(--color-primary);
}

/* number count color */
div.ds-number > p.ds-number-count {
  color: var(--color-primary);
}

/* active tab border bottom color */
div.tab-navigation li.Tabs__tab {
  border-bottom-color: var(--color-primary);
}

/* submit button color group form */
form.group-form button.ds-button-primary {
  background-color: var(--color-primary);
}

/* color of active filter tags in post teaser */
span.category-tag.filterActive {
  background-color: var(--color-primary);
}