/* ===== Floovi — Custom Styles ===== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

/* ---- Brand palette ----------------------------------------------------------
   Single source of truth. The wordmark (floovi-logo.svg) is drawn in navy
   #1b3a6b; the navbar uses that exact navy and the interactive accent is a
   lighter member of the same hue. Use var(--floovi-blue) for chart series and
   inline SVG strokes instead of Bootstrap's default #0d6efd, so the whole app
   stays on one blue. */
:root {
  --floovi-navy:      #1b3a6b;  /* logo navy — navbar, headings on dark        */
  --floovi-blue:      #3a6fc4;  /* interactive accent — buttons, links, charts */
  --floovi-blue-dark: #2e58a0;  /* hover/active                                */

  --bs-primary: var(--floovi-blue);
  --bs-primary-rgb: 58, 111, 196;
  --bs-link-color: var(--floovi-blue);
  --bs-link-hover-color: var(--floovi-blue-dark);

  --bs-body-font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}
body {
  font-family: var(--bs-body-font-family);
  background-color: #f4f6f9;
}
h1, h2, h3, h4, h5, h6, .navbar-brand {
  font-weight: 600;
}
.btn-primary {
  --bs-btn-bg: var(--floovi-blue);
  --bs-btn-border-color: var(--floovi-blue);
  --bs-btn-hover-bg: var(--floovi-blue-dark);
  --bs-btn-hover-border-color: var(--floovi-blue-dark);
  --bs-btn-active-bg: #275091;
  --bs-btn-active-border-color: #275091;
}
.btn-outline-primary {
  --bs-btn-color: var(--floovi-blue);
  --bs-btn-border-color: var(--floovi-blue);
  --bs-btn-hover-bg: var(--floovi-blue);
  --bs-btn-hover-border-color: var(--floovi-blue);
}
.navbar-dark.bg-primary,
.bg-primary {
  background-color: var(--floovi-navy) !important;
}

/* Tighter navbar */
.navbar-brand {
  font-size: 1.1rem;
  letter-spacing: 0.02em;
}
.navbar-brand img {
  transition: opacity 0.15s ease;
}
.navbar-brand:hover img {
  opacity: 0.85;
}

/* Card polish */
.card {
  border: 1px solid rgba(0, 0, 0, 0.08);
}

.card-header {
  font-size: 0.9rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #555;
}

/* Progress bar label */
.progress-bar span {
  font-size: 0.7rem;
  line-height: 22px;
}

/* Breadcrumb tweak */
.breadcrumb {
  font-size: 0.875rem;
}

/* Status badges in tables */
.badge {
  font-weight: 500;
}

/* Log terminal */
#log-output::-webkit-scrollbar {
  width: 6px;
}
#log-output::-webkit-scrollbar-thumb {
  background: #555;
  border-radius: 3px;
}

/* Spinning icon utility */
.spin {
  display: inline-block;
  animation: spin 1.2s linear infinite;
}
@keyframes spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* Responsive table scroll on small screens */
@media (max-width: 767px) {
  .table-responsive-xs {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* Lining/tabular figures for numeric data so columns align cleanly.
   Pair with text-end on numeric <td>/<th>. */
.num,
td.num, th.num {
  font-variant-numeric: tabular-nums;
  font-feature-settings: 'tnum';
  text-align: right;
  white-space: nowrap;
}
