/* Navigate Mail Suite — brand overrides
 * Palette derived from navigate.uk.com logo (teal #2096A6, dark grey #4A4A4A)
 */

:root {
  --nav-primary: #2096A6;
  --nav-primary-hover: #187886;
  --nav-primary-dark: #0F6072;
  --nav-ink: #4A4A4A;
  --nav-accent: #2096A6;
}

/* Top navbar */
nav.navbar.navbar-default {
  background: linear-gradient(180deg, #ffffff 0%, #f7fbfc 100%);
  border-bottom: 1px solid #e3eef0;
}

/* ------------------------------------------------------------------
 * Navbar brand — single Navigate logo + "Navigate Mail Suite" wordmark
 * Overrides Mautic's default .mautic-brand sizing rules.
 * Navbar is bumped to 64px to accommodate the larger logo.
 * ------------------------------------------------------------------ */
#app-header.navbar { min-height: 64px !important; height: 64px !important; }
#app-header.navbar .navbar-nocollapse .navbar-header { height: 64px !important; }
#app-header.navbar ~ #app-content > .content-body { padding-top: 64px !important; }

.navigate-brand-link {
  display: inline-flex !important;
  align-items: center !important;
  height: 64px !important;
  padding: 0 20px !important;
  text-decoration: none !important;
  line-height: 1 !important;
  gap: 14px !important;
}
.navigate-brand-link:hover,
.navigate-brand-link:focus { text-decoration: none !important; }

.navigate-brand-logo {
  display: block !important;
  height: 48px !important;
  width: auto !important;
  max-width: none !important;
  max-height: 48px !important;
  border-radius: 0 !important;
  -webkit-mask: none !important;
          mask: none !important;
  background: transparent !important;
  object-fit: contain !important;
}

.navigate-brand-text {
  display: inline-block !important;
  font-family: 'Source Sans 3', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  letter-spacing: 0.2px !important;
  color: var(--nav-ink) !important;
  white-space: nowrap !important;
}

/* Hide text on very small screens — show only logo */
@media (max-width: 768px) {
  .navigate-brand-text { display: none !important; }
  .navigate-brand-logo { height: 36px !important; max-height: 36px !important; }
  #app-header.navbar { min-height: 56px !important; height: 56px !important; }
  #app-header.navbar .navbar-nocollapse .navbar-header { height: 56px !important; }
  .navigate-brand-link { height: 56px !important; }
}

/* Primary buttons */
.btn-primary,
.btn-primary:focus {
  background-color: var(--nav-primary) !important;
  border-color: var(--nav-primary) !important;
}
.btn-primary:hover,
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  background-color: var(--nav-primary-hover) !important;
  border-color: var(--nav-primary-hover) !important;
}

/* Links */
a { color: var(--nav-primary); }
a:hover, a:focus { color: var(--nav-primary-hover); }

/* Login panel accent */
.panel { border-top: 3px solid var(--nav-primary); }
.navigate-login-logo { padding: 6px 0 14px; }

/* Side nav / sidebar selected item */
.nav > li.active > a,
.nav-pills > li.active > a {
  background-color: var(--nav-primary) !important;
}

/* Progress / badges using primary */
.progress-bar-primary,
.label-primary,
.badge.primary { background-color: var(--nav-primary); }

/* Toggle switches */
.toggle.btn-primary,
.toggle-on.btn-primary { background-color: var(--nav-primary); }

/* Loading bar */
.loading-bar { background: var(--nav-primary); }

/* Form focus rings */
.form-control:focus {
  border-color: var(--nav-primary);
  box-shadow: 0 0 0 0.15rem rgba(32, 150, 166, 0.15);
}

/* Inputs / dropdowns active states */
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
  background-color: var(--nav-primary);
}