/* ============================================================================
   GCC High Migration Tracker: the small amount of CSS CoreUI does not cover.
   Loaded last, after the CoreUI bundle. Everything else is stock Bootstrap 5
   / CoreUI classes in the views.
   ========================================================================= */

/* CoreUI 5.5.0 ships a dark theme that leaves every *-bg-subtle token at its
   light tint, so alerts, subtle badges and anything built on them stay pale
   yellow and pale blue on a dark page. Bootstrap 5.3 darkens these; CoreUI
   does not. Recomputed here with Bootstrap's own formula from CoreUI's base
   colours: shade 80% for the fill, shade 60% for the border, tint 40% for the
   text. Remove if a future CoreUI release defines them. */
[data-coreui-theme=dark] {
  --cui-primary-bg-subtle:       #12112b;
  --cui-primary-border-subtle:   #232256;
  --cui-primary-text-emphasis:   #9b9ae6;
  --cui-secondary-bg-subtle:     #15181b;
  --cui-secondary-border-subtle: #2b3035;
  --cui-secondary-text-emphasis: #a6adb6;
  --cui-success-bg-subtle:       #05200c;
  --cui-success-border-subtle:   #0b3f19;
  --cui-success-text-emphasis:   #76c58b;
  --cui-info-bg-subtle:          #0a1f33;
  --cui-info-border-subtle:      #143d66;
  --cui-info-text-emphasis:      #85c2ff;
  --cui-warning-bg-subtle:       #322304;
  --cui-warning-border-subtle:   #644708;
  --cui-warning-text-emphasis:   #fbd073;
  --cui-danger-bg-subtle:        #2e1111;
  --cui-danger-border-subtle:    #5c2121;
  --cui-danger-text-emphasis:    #ef9898;
}

/* The template ships class="nav-divider" in its sidebar markup but v5.5.0 has
   no rule for it, so the separator above a nav-title does not render. */
.sidebar-nav .nav-divider {
  height: 1px;
  margin: 10px 16px;
  background: rgba(255, 255, 255, .14);
}

.footer {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 12px;
}

/* Counts and money-like figures line up column-wise instead of jittering. */
.tabular { font-variant-numeric: tabular-nums; }

/* A mock-up of the text message as it lands on a phone. Deliberately dark in
   both themes: that is what the recipient sees, not part of our chrome. */
.preview {
  background: #0f172a;
  color: #e2e8f0;
  border-radius: 12px;
  padding: 14px 16px;
  white-space: pre-wrap;
  font-size: 13px;
  line-height: 1.45;
  min-height: 90px;
}

/* Both toggled from assets/app.js: the SMS segment counter turning red over
   two segments, and a masked initial password before it is revealed. */
.counter.over { color: var(--cui-warning-text-emphasis); font-weight: 600; }
.secret { letter-spacing: 2px; }

/* The logo is dark blue on transparent: 5.9:1 on white, 1.15:1 on a dark
   background. Both versions ship, and the theme decides which one is painted.
   The sidebar does not use these; it is dark under either theme and hardcodes
   the reversed file. */
.brand-on-dark { display: none; }
[data-coreui-theme=dark] .brand-on-light { display: none; }
[data-coreui-theme=dark] .brand-on-dark  { display: inline-block; }