:root {
  --cc-primary: #00C7D9;
  --cc-primary-hover: #00C4D0;
  --cc-primary-active: #00C2CC;
  --cc-primary-deep: #00BFC8;
  --cc-primary-dark: #007A83;
  --cc-dark: #37393A;
  --cc-text: #37393A;
  --cc-text-muted: #5A5D5F;
  --cc-background: #F2F2F2;
  --cc-white: #FFFFFF;
  --cc-muted: var(--cc-text-muted);
  --cc-border: #C6CDCE;
  --cc-sidebar: #37393A;
  --cc-progress-track: #005B63;
  --cc-danger: #B42318;
  --cc-primary-soft: #E5F9FA;
  --primary: var(--cc-primary-dark);
  --primary-2: var(--cc-dark);
  --secondary: var(--cc-primary);
  --accent: var(--cc-primary);
  --success: var(--cc-primary-dark);
  --background: var(--cc-background);
  --surface: var(--cc-white);
  --ink: var(--cc-dark);
  --muted: var(--cc-muted);
  --line: var(--cc-border);
  --bs-primary: var(--cc-primary);
  --bs-primary-rgb: 0, 199, 217;
  --bs-success: var(--cc-primary-dark);
  --bs-success-rgb: 0, 122, 131;
  --bs-link-color: var(--cc-primary-dark);
  --bs-link-hover-color: #006B73;
  --bs-body-color: var(--cc-text);
  --bs-body-bg: var(--cc-background);
  --bs-font-sans-serif: "Maven Pro", sans-serif;
  --bs-secondary-color: var(--cc-text-muted);
}

body {
  font-family: "Maven Pro", sans-serif;
  background-color: var(--cc-background);
}

a { color: var(--cc-primary-dark); text-decoration: underline; text-underline-offset: .15em; }
a:hover { color: #006B73; }

.btn-primary {
  --bs-btn-color: var(--cc-dark);
  --bs-btn-bg: var(--cc-primary);
  --bs-btn-border-color: var(--cc-primary);
  --bs-btn-hover-color: var(--cc-dark);
  --bs-btn-hover-bg: var(--cc-primary-hover);
  --bs-btn-hover-border-color: var(--cc-primary-hover);
  --bs-btn-active-color: var(--cc-dark);
  --bs-btn-active-bg: var(--cc-primary-active);
  --bs-btn-active-border-color: var(--cc-primary-active);
  --bs-btn-disabled-color: var(--cc-dark);
  --bs-btn-disabled-bg: var(--cc-primary);
  --bs-btn-disabled-border-color: var(--cc-primary);
}

.btn-success {
  --bs-btn-color: var(--cc-dark);
  --bs-btn-bg: var(--cc-primary);
  --bs-btn-border-color: var(--cc-primary);
  --bs-btn-hover-color: var(--cc-dark);
  --bs-btn-hover-bg: var(--cc-primary-hover);
  --bs-btn-hover-border-color: var(--cc-primary-hover);
}

.btn-outline-primary {
  --bs-btn-color: var(--cc-primary-dark);
  --bs-btn-border-color: var(--cc-primary);
  --bs-btn-hover-color: var(--cc-dark);
  --bs-btn-hover-bg: var(--cc-primary);
  --bs-btn-hover-border-color: var(--cc-primary);
  --bs-btn-active-color: var(--cc-dark);
  --bs-btn-active-bg: var(--cc-primary-active);
  --bs-btn-active-border-color: var(--cc-primary-active);
}

.text-success, .link-success { color: var(--cc-primary-dark) !important; }
.text-muted { color: var(--cc-text-muted) !important; }
.bg-success, .border-success { --bs-success-rgb: 0, 199, 217; }
.bg-success { background-color: var(--cc-primary) !important; color: var(--cc-dark) !important; }
.btn-success { color: var(--cc-dark) !important; background-color: var(--cc-primary) !important; border-color: var(--cc-dark) !important; }
.progress-bar { background-color: var(--cc-primary); }

:focus-visible, .form-control:focus, .form-select:focus {
  --bs-focus-ring-color: rgba(0, 199, 217, .28);
}

:focus-visible {
  outline: 3px solid #007A83;
  outline-offset: 3px;
}

.form-control:focus, .form-select:focus {
  border-color: var(--cc-primary-dark);
  box-shadow: 0 0 0 .2rem rgba(0, 122, 131, .2);
}
