:root {
  --addgene-blue: rgb(0, 86, 179); /* #0056b3 */
  --addgene-blue-light-60: rgb(153, 199, 255); /* #99c7ff */
  --addgene-blue-light-80: rgb(209, 227, 255); /* #d1e3ff */
  --addgene-dark-blue: rgb(10, 16, 30); /* #0a101e */
  --addgene-navy: rgb(23, 37, 68); /* #172544 */
  --addgene-light-gray: rgb(245, 245, 245); /* #f5f5f5 */
  --addgene-dark-gray: rgb(88, 88, 88); /* #585858 */
  --addgene-midnight-gray: rgb(34, 34, 34); /* #222222 */
  --addgene-midnight-gray-light-80: rgb(211, 211, 211); /* #d3d3d3 */
  --border-color: rgb(204, 204, 204); /* #cccccc */
  --font-serif: Calistoga;
  --logo-text: var(--addgene-navy);
  --h1-h2-color: var(--addgene-navy);

  --bs-primary: var(--addgene-blue);
  --bs-primary-rgb: 0, 86, 179;
  --bs-link-color-rgb: 0, 86, 179;
  --bs-link-hover-color-rgb: 0, 49, 102;
  --bs-font-sans-serif: Roboto, "Helvetica Neue", Arial, sans-serif;
  --bs-font-monospace: monospace;
  --bs-body-color: var(--addgene-dark-gray);
  --bs-body-color-rgb: var(--bs-secondary-rgb);
  --bs-secondary: var(--addgene-dark-gray);
  --bs-secondary-rgb: 88, 88, 88;
  --bs-danger: var(--bs-danger-text-emphasis);
  --bs-danger-rgb: 88, 21, 28;
  --bs-focus-ring-width: 0.25rem;
  --bs-focus-ring-opacity: 1;
  --bs-focus-ring-color: var(--bs-primary);
  --bs-form-invalid-color: var(--bs-danger-text-emphasis);
  --bs-form-invalid-border-color: var(--bs-danger-text-emphasis);
  --addgene-form-invalid-icon: url("data:image/svg+xml,%3Csvg%20width%3D%2255%22%20height%3D%2255%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle%20cx%3D%2227.5%22%20cy%3D%2227.5%22%20r%3D%2225.5%22%20fill%3D%22%2358151c%22%20stroke%3D%22%2358151c%22%20stroke-width%3D%224%22%2F%3E%3Cpath%20d%3D%22M26.962%2011.017c-.068.014-.298.068-.509.122-1.907.479-3.453%202.316-3.453%204.09%200%20.225.108%201.241.245%202.253.132%201.011.552%204.187.929%207.066.983%207.5.973%207.412%201.056%207.725.206.806.69%201.451%201.326%201.764.328.161.42.186.822.2.743.035%201.203-.146%201.702-.664.484-.513.705-1.095.861-2.268l.543-4.109c.24-1.847.64-4.867.88-6.719.245-1.847.49-3.694.543-4.105.118-.889.123-1.49.02-1.89-.401-1.579-1.761-2.928-3.39-3.353-.367-.098-1.301-.161-1.575-.112zM27.12%2038.109c-1.688.215-2.906%201.813-2.7%203.547.097.812.42%201.471.997%202.004.558.523%201.16.782%201.912.83.915.054%201.644-.229%202.324-.913.655-.655.94-1.334.944-2.272.005-.567-.064-.895-.284-1.368-.587-1.276-1.854-2-3.194-1.828z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E");
  --bs-border-color: var(--border-color);
  --bs-navbar-brand-font-size: 1.5rem;
}

[data-bs-theme="dark"] {
  --bs-body-bg: var(--addgene-midnight-gray);
  --bs-body-color: var(--addgene-midnight-gray-light-80);
  --bs-body-color-rgb: 245, 245, 245;
  --bs-link-color-rgb: 209, 227, 255;
  --bs-link-hover-color-rgb: 153, 199, 255;
  --bs-secondary: var(--addgene-dark-gray);
  --bs-secondary-rgb: var(--bs-secondary-rgb);
  --addgene-form-invalid-icon: url("data:image/svg+xml,%3Csvg%20width%3D%2255%22%20height%3D%2255%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle%20cx%3D%2227.5%22%20cy%3D%2227.5%22%20r%3D%2225.5%22%20stroke%3D%22%23ea868f%22%20stroke-width%3D%224%22%20style%3D%22fill%3A%23ea868f%3Bpaint-order%3Afill%22%2F%3E%3Cpath%20d%3D%22M26.962%2011.017c-.068.014-.298.068-.509.122-1.907.479-3.453%202.316-3.453%204.09%200%20.225.108%201.241.245%202.253.132%201.011.552%204.187.929%207.066.983%207.5.973%207.412%201.056%207.725.206.806.69%201.451%201.326%201.764.328.161.42.186.822.2.743.035%201.203-.146%201.702-.664.484-.513.705-1.095.861-2.268l.543-4.109c.24-1.847.64-4.867.88-6.719.245-1.847.49-3.694.543-4.105.118-.889.123-1.49.02-1.89-.401-1.579-1.761-2.928-3.39-3.353-.367-.098-1.301-.161-1.575-.112zm.158%2027.092c-1.688.215-2.906%201.813-2.7%203.547.097.812.42%201.471.997%202.004a2.92%202.92%200%200%200%201.912.83c.915.054%201.644-.229%202.324-.913.655-.655.94-1.334.944-2.272.005-.567-.064-.895-.284-1.368-.587-1.276-1.854-2-3.194-1.828z%22%20fill%3D%22%23000%22%2F%3E%3C%2Fsvg%3E");
  --bs-border-color: var(--border-color);
}

.btn-primary {
  --bs-btn-bg: var(--addgene-blue);
  --bs-btn-border-color: var(--addgene-blue);
  --bs-btn-hover-bg: #00428a;
  --bs-btn-hover-border-color: #002c5c;
}

.navbar-toggler {
  color: var(--addgene-navy);
}

.navbar-toggler-icon {
  background-image: url('data:image/svg+xml,<svg width="30" height="25" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23a)" stroke="%23172544" stroke-width="3" stroke-linecap="round"><path d="M1.5 1.5h27M1.5 12.5h27M1.5 23.5h27"/></g><defs><clipPath id="a"><path fill="%23172544" d="M0 0h30v25H0z"/></clipPath></defs></svg>');
}

[data-bs-theme="dark"] {
  .navbar-toggler {
    color: var(--addgene-light-gray);
  }

  .navbar-toggler-icon {
    background-image: url('data:image/svg+xml,<svg width="30" height="25" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23a)" stroke="%23fff" stroke-width="3" stroke-linecap="round"><path d="M1.5 1.5h27M1.5 12.5h27M1.5 23.5h27"/></g><defs><clipPath id="a"><path fill="%23fff" d="M0 0h30v25H0z"/></clipPath></defs></svg>');
  }

  .btn-check:checked + .btn,
  :not(.btn-check) + .btn:active,
  .btn:first-child:active,
  .btn.active,
  .btn.show {
    color: var(--bs-secondary);
    background-color: #fff;
    border-color: #fff;
  }
}

.btn-outline-primary {
  --bs-btn-color: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
  --bs-btn-active-bg: var(--bs-primary);
  --bs-btn-active-border-color: var(--bs-primary);
  --bs-btn-disabled-color: var(--bs-primary);
  --bs-btn-disabled-border-color: var(--bs-primary);
}

[data-bs-theme="dark"] .btn-outline-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-bg: #00428a;
  --bs-btn-hover-border-color: #002c5c;
  --bs-btn-active-color: #fff;
  --bs-btn-hover-color: #fff;
}

.btn-outline-secondary {
  --bs-btn-color: var(--bs-secondary);
  --bs-btn-border-color: var(--bs-secondary);
  --bs-btn-hover-bg: var(--bs-secondary);
  --bs-btn-hover-border-color: var(--bs-secondary);
  --bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
  --bs-btn-active-bg: var(--bs-secondary);
  --bs-btn-active-border-color: var(--bs-secondary);
  --bs-btn-disabled-color: var(--bs-secondary);
  --bs-btn-disabled-border-color: var(--bs-secondary);
}

[data-bs-theme="dark"] .btn-outline-secondary {
  --bs-btn-color: #fff;
  --bs-btn-border-color: #fff;
  --bs-btn-hover-color: var(--bs-secondary);
  --bs-btn-hover-bg: #fff;
  --bs-btn-hover-border-color: #fff;
  --bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-secondary);
  --bs-btn-active-border-color: var(--bs-secondary);
}

[data-bs-theme="light"] .nav-link {
  --bs-nav-link-color: var(--bs-secondary);
}

[data-bs-theme="dark"] .nav-link {
  --bs-nav-link-color: #fff;
}

.dropdown-menu {
  --bs-dropdown-border-color: var(--bs-secondary);
}

.offcanvas,
.offcanvas-xxl,
.offcanvas-xl,
.offcanvas-lg,
.offcanvas-md,
.offcanvas-sm {
  --bs-offcanvas-bg: var(--addgene-light-gray);
}

[data-bs-theme="dark"] {
  .offcanvas,
  .offcanvas-xxl,
  .offcanvas-xl,
  .offcanvas-lg,
  .offcanvas-md,
  .offcanvas-sm {
    --bs-offcanvas-bg: var(--addgene-midnight-gray);
  }
}

.card-body {
  --bs-card-spacer-y: 1.875rem;
  --bs-card-spacer-x: 1.875rem;
}
