:root{
--ci-bg: rgb(51, 100, 175);
/*  --ci-bg: #D6F0FF;          /* baby blue */
  --ci-surface: #FFFFFF;     /* cards/tables */
  --ci-text: #0B1F2A;        /* dark */
  --ci-border: rgba(11,31,42,.15);

  --ci-primary: #00A050;     /* green */
  --ci-primary-hover: #008A45;

  --ci-danger: #E01020;      /* red */
  --ci-danger-hover: #C90E1C;

  --ci-warning: #F0F030;     /* yellow accent */
  --ci-warning-hover: #D6D62B;
  --bs-heading-color: #fff;
}

/* App background + default text */
body{ background: var(--ci-bg); color: var(--ci-text); }

/* Surfaces */
.card, .modal-content, .dropdown-menu, .table{
  background: var(--ci-surface);
}
.table, .card, .modal-content{
  border-color: var(--ci-border);
}

/* Bootstrap button theme */
.btn-primary{
  --bs-btn-bg: var(--ci-primary);
  --bs-btn-border-color: var(--ci-primary);
  --bs-btn-hover-bg: var(--ci-primary-hover);
  --bs-btn-hover-border-color: var(--ci-primary-hover);
}
.btn-outline-primary{
  --bs-btn-color: var(--ci-primary);
  --bs-btn-border-color: var(--ci-primary);
  --bs-btn-hover-bg: var(--ci-primary);
  --bs-btn-hover-border-color: var(--ci-primary);
}

.btn-danger{
  --bs-btn-bg: var(--ci-danger);
  --bs-btn-border-color: var(--ci-danger);
  --bs-btn-hover-bg: var(--ci-danger-hover);
  --bs-btn-hover-border-color: var(--ci-danger-hover);
}
.btn-warning{
  --bs-btn-bg: var(--ci-warning);
  --bs-btn-border-color: var(--ci-warning);
  --bs-btn-hover-bg: var(--ci-warning-hover);
  --bs-btn-hover-border-color: var(--ci-warning-hover);
  --bs-btn-color: var(--ci-text); /* readable on yellow */
}
.navbar{
  background: rgb(51, 100, 175) !important;
}
.navbar .navbar-brand, .navbar a{ color:#fff; }

h1, h2, h3, .page-title, .module-title{
  color: #fff !important;
}


/* Links + accents */
a{ color: var(--ci-primary); }
a:hover{ color: var(--ci-primary-hover); }

.sb-scroll-viewport{
  position: relative;
  overflow: hidden;
  height: 55vh; /* tune */
}

.sb-scroll-content{
  will-change: transform;
  transform: translateY(0);
}

.rank-1 td { background-color: #81c784 !important; }
.rank-2 td { background-color: #a5d6a7 !important; }
.rank-3 td { background-color: #c8e6c9 !important; }