/* ── SSLK merkevarefarger ─────────────────────────────────────
   dark blue:  #002E6D  (PANTONE 294 C)
   sharp blue: #0097CE  (PANTONE 801 C)
   light blue: #97CAEB  (PANTONE 291 C)
   green:      #80BC00  (PANTONE 376 C)

   UI-palett:
   side-bakgrunn:   #F4F7FA
   primærtekst:     #1C2B3A
   sekundærtekst:   #4A6275  (WCAG AA ~5.2:1 mot #F4F7FA)
   kantlinje:       #C8DDE9
   tabellheader:    #EBF4FB
   suksess:         #1A9E5A
   advarsel:        #F59E0B
───────────────────────────────────────────────────────────── */

/* ── Typografi ───────────────────────────────────────────────── */
body {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  background-color: #F4F7FA !important;
  color: #1C2B3A;
}

/* ── Border-radius ───────────────────────────────────────────── */
:root {
  --bs-border-radius:    8px;
  --bs-border-radius-sm: 6px;
  --bs-border-radius-lg: 10px;
}

/* ── Typografisk skala ───────────────────────────────────────── */
.table td, .table th {
  font-size: .875rem;
}
.text-secondary-info {
  font-size: .8125rem;
  color: #4A6275;
}
.label-caps {
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #4A6275;
}

/* ── Sekundærtekst (text-muted) – WCAG AA ───────────────────── */
.text-muted {
  color: #4A6275 !important;
}

/* ── Lenker ──────────────────────────────────────────────────── */
a:not(.btn):not(.navbar-brand):not(.nav-tab):not(.dropdown-item) {
  color: #0097CE;
}
a:not(.btn):not(.navbar-brand):not(.nav-tab):not(.dropdown-item):hover {
  color: #002E6D;
}

/* ── Knapper – generelle overganger ─────────────────────────── */
.btn {
  transition: background-color .15s ease, border-color .15s ease,
              box-shadow .15s ease, transform .1s ease;
  font-weight: 500;
}
.btn:active:not(:disabled) {
  transform: scale(.97);
}

/* Primærknapper → sharp blue */
.btn-primary {
  background-color: #0097CE;
  border-color: #0097CE;
  color: #fff;
}
.btn-primary:hover, .btn-primary:focus {
  background-color: #007dae;
  border-color: #007dae;
  color: #fff;
}
.btn-outline-primary {
  color: #0097CE;
  border-color: #0097CE;
}
.btn-outline-primary:hover {
  background-color: #0097CE;
  border-color: #0097CE;
  color: #fff;
}

/* btn-brand: blå PDF/eksport-knapper */
.btn-brand {
  background-color: #0097CE;
  border-color: #0097CE;
  color: #fff;
}
.btn-brand:hover, .btn-brand:focus {
  background-color: #007dae;
  border-color: #007dae;
  color: #fff;
}

/* Suksess-grønn */
.btn-success {
  background-color: #1A9E5A;
  border-color: #1A9E5A;
  color: #fff;
}
.btn-success:hover, .btn-success:focus {
  background-color: #158549;
  border-color: #158549;
  color: #fff;
}
.alert-success {
  background-color: #D6F0E4;
  border-color: #A8DABD;
  color: #0F5C33;
}
.badge.bg-success {
  background-color: #1A9E5A !important;
}

/* Advarsel-amber */
.alert-warning {
  background-color: #FEF3C7;
  border-color: #FCD34D;
  color: #78350F;
}
.badge.bg-warning {
  background-color: #F59E0B !important;
  color: #fff !important;
}

/* bg-info → nøytral status-badge */
.badge.bg-info {
  background-color: #5B7489 !important;
  color: #fff !important;
}

/* Bland-knapp → grønn */
.btn-brand-action {
  background-color: #80BC00;
  border-color: #80BC00;
  color: #fff;
  font-weight: 500;
}
.btn-brand-action:hover {
  background-color: #6a9e00;
  border-color: #6a9e00;
  color: #fff;
}

/* Farlige handlinger i navbar – de-emphasis */
.btn-nav-danger {
  background: transparent;
  border-color: rgba(255,100,100,.5);
  color: rgba(255,180,180,.9);
  font-size: .8rem;
}
.btn-nav-danger:hover {
  background: rgba(220,53,69,.2);
  border-color: #dc3545;
  color: #fff;
}

/* ── Tabeller ────────────────────────────────────────────────── */
.table {
  --bs-table-border-color: #C8DDE9;
}
.table-light > * > tr > th,
.table-light > * > tr > td,
thead.table-light th {
  background-color: #EBF4FB !important;
  color: #1C2B3A;
}
thead.table-dark {
  background-color: #002E6D !important;
}
thead.table-dark th {
  background-color: #002E6D !important;
  color: #fff !important;
}

/* ── Badges ──────────────────────────────────────────────────── */
.badge.bg-secondary {
  background-color: #97CAEB !important;
  color: #002E6D !important;
}

/* ── Kort ────────────────────────────────────────────────────── */
.card {
  border-color: #C8DDE9;
  box-shadow: 0 1px 4px rgba(0,46,109,.07);
  transition: box-shadow .2s ease;
}
.card-header {
  background-color: #EBF4FB;
  border-bottom: 1px solid #C8DDE9;
  color: #002E6D;
  font-size: .9rem;
}

/* ── btn-outline-secondary ───────────────────────────────────── */
.btn-outline-secondary {
  color: #002E6D;
  border-color: #97CAEB;
}
.btn-outline-secondary:hover {
  background-color: #97CAEB;
  border-color: #97CAEB;
  color: #002E6D;
}

/* ── Navbar ──────────────────────────────────────────────────── */
.navbar.brand-nav {
  background-color: #002E6D !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
  padding-top: .3rem;
  padding-bottom: .3rem;
}
.navbar.brand-nav .navbar-brand {
  color: rgba(255,255,255,.7);
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .82rem;
  font-weight: 500;
  letter-spacing: .01em;
  transition: color .15s;
}
.navbar.brand-nav .navbar-brand:hover { color: #fff; }
.navbar.brand-nav .navbar-brand img {
  height: 28px;
  width: auto;
  filter: brightness(0) invert(1);
}
.navbar.brand-nav .vr {
  border-color: rgba(255,255,255,.3);
}

/* ── Navigasjonsfaner (pille-stil) ───────────────────────────── */
.nav-tab {
  color: rgba(255,255,255,.65);
  padding: .3rem .65rem;
  font-size: .82rem;
  font-weight: 500;
  text-decoration: none;
  border: none;
  background: transparent;
  border-radius: 6px;
  transition: color .15s ease, background .15s ease;
  cursor: pointer;
  line-height: 1.4;
  display: inline-flex;
  align-items: center;
  gap: .3rem;
}
.nav-tab:hover {
  color: #fff;
  background: rgba(255,255,255,.1);
}
.nav-tab.active {
  color: #fff;
  font-weight: 600;
  background: rgba(255,255,255,.18);
}
/* Logg ut - spesifikt */
.nav-tab-logout {
  color: rgba(255,180,180,.8);
  font-size: .8rem;
}
.nav-tab-logout:hover {
  color: #fff;
  background: rgba(220,53,69,.25);
}

/* ── Logoplaceholder ─────────────────────────────────────────── */
.logo-placeholder {
  width: 28px;
  height: 28px;
  background: #0097CE;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 700;
  font-size: .8rem;
  flex-shrink: 0;
}

/* ── Øvelsestitler ───────────────────────────────────────────── */
.event-section h5 {
  color: #002E6D;
  border-bottom: 2px solid #97CAEB;
  padding-bottom: .25rem;
}

/* ── Veiviser-overlay ────────────────────────────────────────── */
#wizardOverlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.35);
  z-index: 999;
}
#wizardPanel {
  position: relative;
  z-index: 1000;
}

/* ── Dropdown-meny ───────────────────────────────────────────── */
.dropdown-item:hover,
.dropdown-item:focus {
  background-color: #EBF4FB;
  color: #002E6D;
}
.dropdown-item.active,
.dropdown-item:active {
  background-color: #EBF4FB;
  color: #002E6D;
}

/* ── Toast-varsler ───────────────────────────────────────────── */
.toast {
  min-width: 280px;
  box-shadow: 0 4px 16px rgba(0,0,0,.18);
  border-radius: 8px;
}
