@import url("../../core/css/theme.css");

:root {
  --brand-navy: #003a66;
  --brand-blue: #0072bc;
  --brand-sky: #3aa6dd;
  --brand-orange: #f47b20;
  --brand-charcoal: #1d2733;
  --brand-light: #f4f8fb;
  --brand-muted: #66788a;
}

.app-navbar {
  background: #fff;
  border-bottom: 1px solid rgba(0, 114, 188, 0.16);
  box-shadow: 0 8px 22px rgba(0, 58, 102, 0.08);
}

.app-navbar .navbar-brand {
  color: var(--brand-navy);
  text-transform: none;
  letter-spacing: 0;
}

.app-navbar .brand-logo {
  height: 34px;
  max-width: 220px;
  object-fit: contain;
}

.app-navbar .brand-mark {
  color: var(--brand-blue);
  letter-spacing: 0.16em;
}

.app-navbar .brand-accent {
  color: var(--brand-navy);
  letter-spacing: 0.02em;
}

.app-navbar .nav-link {
  color: var(--brand-muted);
}

.app-navbar .nav-link:hover,
.app-navbar .nav-link:focus,
.app-navbar .nav-link.active {
  color: var(--brand-blue);
}

.app-navbar .nav-link.disabled,
.app-navbar .text-white-50 {
  color: rgba(29, 39, 51, 0.58) !important;
}

.nav-divider {
  background: rgba(0, 114, 188, 0.24);
}

.navbar-toggler,
.navbar-toggler:focus {
  border-color: rgba(0, 58, 102, 0.25);
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0,58,102,0.75)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.btn-gradient {
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-navy));
  box-shadow: 0 12px 26px rgba(0, 114, 188, 0.22);
}

.btn-gradient:hover,
.btn-gradient:focus {
  background: linear-gradient(135deg, var(--brand-navy), #002a4d);
  box-shadow: 0 10px 24px rgba(0, 58, 102, 0.28);
}

.page-header {
  box-shadow: 0 18px 36px rgba(0, 114, 188, 0.08);
}

.equipment-pane-placeholder__logo {
  width: min(240px, 60%);
  max-width: 280px;
}