/**
 * COmanage Registry Default Style Sheet
 *
 * Portions licensed to the University Corporation for Advanced Internet
 * Development, Inc. ("UCAID") under one or more contributor license agreements.
 * See the NOTICE file distributed with this work for additional information
 * regarding copyright ownership.
 *
 * UCAID licenses this file to you under the Apache License, Version 2.0
 * (the "License"); you may not use this file except in compliance with the
 * License. You may obtain a copy of the License at:
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 *
 * @link          https://www.internet2.edu/comanage COmanage Project
 * @package       registry
 * @since         COmanage Registry v1.0.0
 * @license       Apache License, Version 2.0 (http://www.apache.org/licenses/LICENSE-2.0)
 */

/* HTML, BODY, HEADINGS, ANCHORS, FONTS */
@import url("fonts/opensans/stylesheet.css");
@import url("fonts/material-symbols/stylesheet.css");

html * {
  font-family: var(--cmg-font-regular);
}
body {
  color: var(--cmg-color-body-txt);
  background-color: var(--cmg-color-body-bg);
  -webkit-overflow-scrolling: touch; /* for dialog boxes */
  font-size: 14px; /* base font size */
}
h1,h2,h3,h4,h5 {
  color: var(--cmg-color-headings);
}
h1 {
  font-size: 2em;
  margin: 0;
}
h1.loginMsg {
  font-size: 1.8em;
  margin: 1em 0;
  text-align: center;
}
body.in-iframe h1 {
  font-size: 2em;
}
h2 {
  font-size: 2em;
  line-height: 2em;
  margin: 0;
}
h3 {
  font-size: 1.4em;
  line-height: 1.4em;
  margin: 1em 0 0.5em;
}
h4 {
  font-size: 1.1em;
  line-height: 1.1em;
  margin: 1em 0 0.5em;
}
a {
  color: var(--cmg-color-link);
  text-decoration: none;
}
#main a:active,
#main a:hover {
  color: var(--cmg-color-link-hover);
  text-decoration: underline;
}
#main a.ui-widget:active,
#main a.ui-widget:hover {
  text-decoration: none;
}
/* ACCESSIBLE SKIP LINK */
#skip-to-content-box {
  position: absolute;
  left: 50%;
  margin-left: -100px;
  text-align: center;
  width: 200px;
  z-index: 40;
}
#skip-to-content {
  position: relative;
  background-color: var(--cmg-color-btn-bg-001);
  color: var(--cmg-color-txt-inverse);
  padding: 0 1em 0.25em ;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  border-color: var(--cmg-color-btn-bg-001);
  top: -40px;
  text-decoration: underline;
}
#skip-to-content:focus {
  top: 0;
  transition: top 0.1s ease-in 0s, background 0.5s linear 0s;
  background-color: var(--cmg-color-link-hover);
}
/* HEADER */
#banner {
  display: flex;
  justify-content: space-between;
  align-items: end;
  padding: 1em;
  margin: 0;
  background-color: var(--cmg-color-banner);
  color: var(--cmg-color-txt-inverse);
}
#logo-title-wrapper {
  white-space: nowrap;
}
#siteTitle {
  font-size: 2em;
  min-height: 23px;
  padding: 0 40px 0 0;
  margin: 0;
}
#banner a {
  color: var(--cmg-color-txt-inverse);
  text-decoration: none;
}
#user-defined-links-top ul {
  display: flex;
  column-gap: 1em;
  margin: 0;
  padding: 0 15px 0 0;
}
#user-defined-links-top li {
  list-style: none;
}
/* LOGO */
#logo {
  float: left;
  margin-right: 0.75em;
}
#logo img {
  height: 28px;
}
/* TOP BAR */
#top-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0;
  border-bottom: 1px solid var(--cmg-color-bg-006);
  min-height: 47px;
}
body.logged-out #top-bar,
body.cos.select #top-bar {
  justify-content: end;
}
#top-bar .material-symbols {
  vertical-align: bottom;
}
#top-bar .top-menu-button {
  padding: 0.5em 1em;
  background-color: transparent;
  border: none;
}
#top-bar .icon-adjust {
  margin-right: -8px;
}
#top-controls {
  display: flex; 
  flex: 1;
}
/* Mobile menu icon */
#co-hamburger {
  margin: 0;
  padding: 0.5em 1em;
  cursor: pointer;
  -webkit-font-smoothing: antialiased;
}

/* GLOBAL SEARCH */
#global-search {
  width: 100%;
  background-color: var(--cmg-color-bg-003);
  border-radius: 0;
  border: none;
  border-top: 1px solid var(--cmg-color-bg-006);
  border-bottom: 1px solid var(--cmg-color-bg-006);
}
#global-search form {
  display: flex;
  justify-content: space-between;
  padding: 1em;
}
#global-search #q { /* search input */
  padding-left: 0.5em;
  width: 100%;
  border-radius: 0;
  border: 1px solid var(--cmg-color-bg-006);
  color: var(--cmg-color-body-txt);
}
#global-search-button {
  background-color: var(--cmg-color-btn-bg-001);
  color: white;
  border-radius: 0 3px 3px 0;
}
#global-search-clear {
  display: none; /* will only appear if input holds a value */
  background-color: var(--cmg-color-btn-bg-001);
  border-radius: 0;
  color: var(--cmg-color-txt-inverse);
  border-right: 1px dotted var(--cmg-color-highlight-005);
}
#q.has-value + #global-search-clear {
  display: inline-block;
}
#top-bar #global-search-toggle {
  display: flex;
  align-items: center;
  padding: 0.5em 0;
}
/* TOP MENU */
#top-menu {
  z-index: 100;
}
#top-menu ul {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 1em;
  line-height: unset;
}
#top-menu .top-menu-link-text {
  display: none;
}
#top-menu li a.dropdown-toggle {
  color: var(--cmg-color-txt-inverse);
}
#top-menu li a.dropdown-toggle:hover {
  text-decoration: none;
}
#top-menu .dropdown-item {
  padding: 0.5em 1em;
  background-color: var(--cmg-color-body-bg);
  color: var(--cmg-color-body-txt);
}
#top-menu .dropdown-item:focus,
#top-menu .dropdown-item:hover {
  background-color: var(--cmg-color-bg-003);
}
#top-menu .dropdown-item .material-symbols,
#top-menu .dropdown-item .material-symbols-outlined {
  margin-right: 0.25em;
  vertical-align: middle;
}
#top-menu .menu-grouping legend .material-symbols,
#top-menu .menu-grouping legend .material-symbols-outlined {
  font-size: 1.1rem;
  margin-right: 0.5rem;
}
.material-symbols.danger,
.material-symbols-outlined.danger {
  color: var(--cmg-color-btn-bg-004);
}
.material-symbols.success,
.material-symbols-outlined.success {
  color: var(--cmg-color-highlight-007);
}
.material-symbols.warning,
.material-symbols-outlined.warning {
  color: var(--cmg-color-highlight-018);
}
.menu-grouping {
  padding: 1em;
  font-size: 0.9em;
}
.menu-grouping legend {
  display: flex;
  align-items: center;
  font-size: 1rem;
  padding: 0;
  margin-bottom: 0.2em;
}
.menu-grouping-group {
  display: flex;
  gap: 0.75em;
  padding-left: 2em;
}
.menu-grouping-group .form-check {
  display: flex;
  gap: 0.25em;
  align-items: center;
}
.menu-grouping-group .form-check .form-check-input {
  float: none;
}
#user-panel {
  color: var(--cmg-color-body-txt);
  background-color: var(--cmg-color-bg-002);
  border: 1px solid var(--cmg-color-bg-005);
  padding: 0;
  margin: 9px 0 0;
  min-width: 100vw;
  box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
  font-size: 1em;
}
#user-panel a:hover {
  text-decoration: underline;
}
#user-panel-user {
  display: flex;
  justify-content: space-between;
}
#user-panel-cn {
  margin-top: -8px;
  padding: 1em 0 0 0;
  font-size: 1.2em;
  line-height: 1em;
}
#user-panel-id {
  margin: 0.25em 0;
  max-width: 60vw;
  word-wrap:break-word;
}
#user-panel-user-info {
  padding: 1em;
}
#user-panel-user-icon {
  display: none;
}
#user-panel-user-labels {
  color: var(--cmg-color-body-txt);
}
#user-panel-user-info a:hover {
  text-decoration: none;
}
#user-panel-user-info a:hover #user-panel-canvas-link {
  text-decoration: underline;
}
#user-panel-user-icon .material-symbols {
  font-size: 4.2em;
  color: var(--cmg-color-body-txt);
}
#user-panel .co-info-topbox {
  background-color: var(--cmg-color-bg-004);
  margin-top: 2em;
}
#user-panel .co-info-topbox strong {
  font-weight: normal;
}
#user-panel #co-profile-link:hover {
  background-color: var(--cmg-color-bg-005);
}
#user-panel #co-profile-link .material-symbols {
  vertical-align: middle;
  margin-right: 0.25em;
  font-size: 16px;
  color: var(--cmg-color-headings);
}
#user-panel h2 {
  font-size: 1.1em;
  font-weight: normal;
  margin: 1em 0 0 1em;
}
#user-panel #panel-orgid-container {
  margin-top: 2em;
  border-top: 1px solid var(--cmg-color-bg-006);
  padding-top: 1em;
}
#user-panel #panel-orgid-container h2 {
  margin-top: -0.25em;
}
#user-panel .org-ids {
  font-style: italic;
}
#user-panel #user-panel-flows {
  column-count: 2;
}
#user-panel #user-panel-flows,
#user-panel #user-panel-invite,
#user-panel #panel-orgid {
  margin-top: 0;
}
#user-panel #user-panel-switch-co {
  clear: both;
  text-align: center;
  border-top: 1px solid var(--cmg-color-bg-006);
  margin-top: 2.5em;
  padding: 0;
}
#user-panel #co-switch-link {
  text-transform: unset;
  font-size: 1.1em;
  display: block;
  padding: 1em;
}
#user-panel-user-settings {
  float: right;
  margin: 0 1rem 1rem 0;
}
#user-panel-user-settings .dropdown-divider {
  margin: 0 0 0.25rem;
}
/* LOGIN & LOGOUT */
#login-button {
  display: inline-block;
  padding: 0.25em 1em;
  text-decoration: none;
  font-size: 1rem;
}
#welcome-login {
  text-align: center;
  margin: 1em auto;
}
#logout-in-panel-link {
  padding: 1em;
  margin: 0;
  width: 100%;
  white-space: nowrap;
}
#login .material-symbols,
#logout-in-panel .material-symbols {
  font-size: 1.2rem;
  vertical-align: top;
  margin-top: 0.25rem;
}
/* Shib IDP */
#idp-select-container {
  clear: both;
  padding: 1em 0;
}
/* ALERT MESSAGES */
#flash-messages {
  margin: 0.5em 0 0;
}
.co-alert {
  margin: 0 auto 1em;
  border-radius: 0;
}
.co-alert.alert-success {
  background-color: var(--cmg-color-highlight-006);
  border-color: var(--cmg-color-highlight-008);
}
.co-alert.alert-warning {
  background-color: var(--cmg-color-highlight-009);
  color: var(--cmg-color-highlight-010);
  border-color: var(--cmg-color-highlight-011);
}
.co-alert.alert-danger {
  background-color: var(--cmg-color-highlight-012);
  color: var(--cmg-color-highlight-015);
  border-color: var(--cmg-color-highlight-016);
}
.co-alert.alert-information {
  background-color: var(--cmg-color-highlight-004);
  color: var(--cmg-color-highlight-003);
  border-color:  var(--cmg-color-highlight-017);
}
.co-alert .alert-icon {
  margin-right: 0.1rem;
}
.co-alert .alert-title-text {
  margin-right: 0.25em;
}
.co-alert a {
  text-decoration: underline;
}
/* Alerts in the add-edit form: */
ul.form-list li.alert-banner {
  display: block;
  padding: 0;
}
ul.form-list li.alert-banner .co-alert {
  margin: 0;
  border: none;
}
#lastLogin p {
  margin-bottom: 0;
}
/* MAIN NAVIGATION and CONTENT */
#main-wrapper {
  position: relative;
}
/* NAVIGATION / SIDE DRAWER */
#navigation-drawer {
  display: none;
  position: absolute;
  z-index: 20;
  border-right: 1px solid var(--cmg-color-bg-006);
  border-bottom: 1px solid var(--cmg-color-bg-006);
  background-color: var(--cmg-color-body-bg);
}
#navigation-drawer.visible {
  display: block;
}
#navigation {
  z-index: 100;
  padding-top: 0;
}
#main-menu {
  margin: 0;
  padding: 0;
}
#main-menu ul {
  padding: 0.5em 0 1em 0;
}
#main-menu li {
  list-style: none;
}
#main-menu > li {
  border-bottom: 1px solid var(--cmg-color-bg-006);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#main-menu > li a {
  display: block;
  cursor: pointer;
  margin: 0;
  padding: 1rem;
  text-decoration: none;
  color: var(--cmg-color-body-txt);
  position: relative;
  overflow:hidden;
  width: 100%;
}
#main-menu > li a:hover,
#main-menu > li a:focus {
  background-color: var(--cmg-color-bg-005);
}
#main-menu a.selected {
  background-color: var(--cmg-color-bg-007);
}
#main-menu .material-symbols,
#main-menu .material-symbols-outlined {
  margin-right: 6px;
  vertical-align: bottom;
}
#main-menu .material-symbols.dropdown-chevron {
  opacity: 0.3;
}
#co-menu-collapse {
  display: none;
}
#all-button-container {
  text-align: center;
  padding-bottom: 3em;
}
#all-button {
  padding: 0.25rem 1rem;
  display: inline-block;
  margin: 3em 0 0;
}
/* Menu Panels */
.menu-panel {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 200;
  padding: 1rem;
  width: 100vw;
  border-right: 1px solid var(--cmg-color-bg-006);
  border-bottom: 1px solid var(--cmg-color-bg-006);
  text-align: left;
  background-color: var(--cmg-color-body-bg);
  -webkit-box-shadow: 5px 5px 8px 0 var(--cmg-color-bg-003);
  box-shadow: 5px 5px 8px 0 var(--cmg-color-bg-003);
}
.menu-panel h3 {
  margin: 0;
}
#main-menu .menu-panel a {
  color: var(--cmg-color-link);
}
#main-menu .menu-panel li a:hover,
#main-menu .menu-panel li a:focus {
  background-color: transparent !important;
}
#main-menu .menu-panel li a:hover .menu-panel-link-text,
#main-menu .menu-panel li a:focus .menu-panel-link-text {
  text-decoration: underline;
}
.menu-panel.visible {
  display: block;
}
.menu-panel-close.btn {
  position: absolute;
  right: 0;
  top: 0;
  color: var(--cmg-color-txt-soft);
  padding: 1rem;
  line-height: 1.2rem;
}
#main-menu .menu-panel-primary-link-text h3 {
  color: var(--cmg-color-link);
  padding: 0;
  font-weight: 500;
}
#main-menu .menu-panel-links > li {
  border: 1px solid var(--cmg-color-body-bg);
}
#main-menu .menu-panel-links > li:hover {
  border: 1px solid var(--cmg-color-bg-006);
}
#main-menu a.menu-panel-primary-link {
  display: flex;
  align-items: center;
}
#main-menu .menu-panel-links a.menu-panel-primary-link:hover {
  background-color: transparent;
}
#main-menu .menu-panel-links a.menu-panel-primary-link:hover h3 {
  text-decoration: underline;
}
#main-menu .menu-panel-primary-link-text {
  flex: 1;
}
#main-menu ul.menu-panel-links ul li a {
  padding: 0.5em 1em;
  margin: 0;
  display: flex;
  gap: 0.5em;
  align-items: center;
  line-height: 1.4em;
}
#main-menu .menu-panel-links .material-symbols,
#main-menu .menu-panel-links .material-symbols-outlined,
#navigation-drawer.closed #main-menu .menu-panel-links .material-symbols,
#navigation-drawer.closed #main-menu .menu-panel-links .material-symbols-outlined {
  font-size: 2.5rem;
  margin-right: 0.75rem;
  display: inline;
  color: var(--cmg-color-headings);
}
#main-menu .menu-panel-links li {
  margin-bottom: 1em;
}
#main-menu .menu-panel-links-inner .material-symbols,
#main-menu .menu-panel-links-inner .material-symbols-outlined,
#navigation-drawer.closed #main-menu .menu-panel-links-inner .material-symbols,
#navigation-drawer.closed #main-menu .menu-panel-links-inner .material-symbols-outlined {
  font-size: 1.2em;
}
#main-menu .menu-panel-links .menu-panel-links-inner li {
  margin-bottom: 0;
}
.menu-panel-links-desc {
  margin-top: 0.5em;
  font-size: 0.9em;
}
.menu-panel-link-desc {
  color: var(--cmg-color-body-txt);
}
#main-menu ul.menu-panel-links li:has(.menu-panel-submenu) a.menu-panel-primary-link {
  padding: 0.5em 1em 0 1em;
}
#main-menu ul.menu-panel-submenu {
  padding: 0;
  margin: 0 0 0 4.65em;
}
#main-menu ul.menu-panel-links ul.menu-panel-submenu li a {
  gap: 0.25em;
  padding: 0.5em;
  width: fit-content;
}
#main-menu .menu-panel-submenu .material-symbols,
#main-menu .menu-panel-submenu .material-symbols-outlined {
  margin: 0;
  font-size: 1em;
}
.menu-panel-sidepanel {
  padding: 0 1em 2em 1.25em;
}
#main-menu .menu-panel-sidepanel h3 {
  margin-bottom: 0.5em;
}
#main-menu #menu-panel-config li,
#main-menu #menu-panel-config li:hover,
#main-menu .menu-panel-sidepanel li,
#main-menu .menu-panel-sidepanel li:hover {
  border: none;
}
#main-menu .menu-panel-sidepanel a {
  display: flex !important;
  align-items: center;
  padding: 0 !important;
}
#main-menu .menu-panel-common-items {
  margin-top: 1rem;
}
#main-menu .menu-panel-common-items li {
  list-style: disc;
}
/* CONTENT */
#breadcrumbs {
  font-size: 0.9em;
  margin-top: -1em;
}
.page-title-container {
  display: flex;
  justify-content: space-between;
  margin: 1em 0 0;
  align-items: baseline;
  flex-wrap: wrap;
}
#select-co.page-title-container {
  margin: 0;
}
.page-title {
  padding-bottom: 0.25em;
}
.page-title h2 {
  line-height: 1.2em;
}
.page-title h2.flow-step-description {
  font-size: 1.4em;
  margin: 0.5em 0 0.25em;
}
.page-title .deleted,
.page-title .archived {
  background-color: var(--cmg-color-highlight-013);
  color: var(--cmg-color-txt-inverse);
  font-size: 0.7em;
  font-weight: 600;
  letter-spacing: 0.8px;
  margin-left: 0.25em;
  padding: 0 4px;
  text-transform: uppercase;
}
.page-title .archived {
  background-color: var(--cmg-color-txt-soft);
}
#introduction {
  margin-top: 1em;
}
/* SUBNAVIGATION & TABS */
.supertitle {
  padding: 1em 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1em;
}
.supertitle .person-status-badge {
  margin: 0;
}
#subnavigation nav {
  padding: 0.5em 0;
}
#cm-person-subnav-tabs {
  margin-bottom: 1.5em;
}
#cm-person-subnav-links {
  margin-top: -2em;
}
.cm-subnav-tabs .nav-tabs {
  border-bottom-color: var(--cmg-color-bg-006);
}
.cm-subnav-tabs .nav-link {
  text-transform: uppercase;
  padding: 1em 1.5em;
  color: var(--cmg-color-link) !important;
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
}
.cm-subnav-links .nav-link {
  color: var(--cmg-color-link) !important;
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
}
.cm-subnav-tabs .nav-link.active,
.cm-subnav-links .nav-link.active {
  color: var(--cmg-color-body-txt) !important;
  background-color: var(--cmg-color-body-bg);
  border-color: var(--cmg-color-bg-006) var(--cmg-color-bg-006) var(--cmg-color-body-bg) var(--cmg-color-bg-006);
}
.cm-subnav-tabs .nav-link .bg-outline-primary {
  color: var(var(--cmg-color-link));
  border-color: var(var(--cmg-color-link));
}
.cm-subnav-tabs .nav-link.active .bg-outline-primary {
  color: var(--cmg-color-body-txt);
  border-color: var(--cmg-color-body-txt);
}
.tab-count {
  display: inline-block;
  margin: -4px 0 -4px 0.5em;
  padding: 1px 4px;
  font-size: 0.9em;
  border: 1px solid var(--cmg-color-link);
  border-radius: 16px;
  min-width: 24px;
  text-align: center;
}
.tab-count-item {
  display: inline-block;
}
.nav-link.active .tab-count {
  border-color: var(--cmg-color-body-txt);
}
.cm-subnav-links ul.list-inline {
  margin: 0.5em 0 0 0;
  font-size: 0.9em;
}
.cm-subnav-links .list-inline-item {
  margin: 0;
}
.cm-subnav-links .list-inline-item a.nav-link {
  padding: 0 1.5em 0.5em 0;
}
#external-id-role {
  border-top: 1px solid var(--cmg-color-bg-006);
}
#external-id-role h3 {
  padding: 0.5rem 1rem;
  background-color: var(--cmg-color-bg-003);
}
#external-id-role-nav {
  margin-left: 1rem;
}
/* INNER CONTENT - for non-table-based layouts */
#content {
  padding: 2rem;
}
.inner-content {
  clear: both;
  margin-top: 1em;
}
/* SEARCH RESULTS */
#search-results-meta {
  padding: 0;
}
#search-results-meta li {
  list-style: none;
  display: inline;
}
#search-results ul.search-results-group {
  padding: 0;
  list-style: none;
  margin: 1.5em 0 0;
}
#search-results li.search-result {
  padding: 0;
  margin-bottom: 1.5em;
  border: 1px dashed var(--cmg-color-bg-008);
  break-inside: avoid;
}
#search-results li.search-result a {
  display: block;
  padding: 1em;
  color: var(--cmg-color-headings);
  height: 100%;
}
#search-results li.search-result a:hover,
#search-results li.search-result a:focus-visible {
  text-decoration: none;
  background-color: var(--cmg-color-bg-004);
}
#search-results .search-result-name {
  color: var(--cmg-color-link);
}
#search-results .search-result-match-info {
  font-size: 0.8em;
}
#search-results .search-result-tab {
  display: flex;
  align-items: center;
  gap: 0.5em;
}
#search-results .accordion-body {
  padding: 1em;
}
/* TOP FILTERS */
.top-filters {
  margin-top: 0.5em;
  padding: 0;
  border: 1px solid var(--cmg-color-bg-005);
}
#content .top-filters legend button.cm-toggle {
  position: absolute;
  right: 0.5em;
  border: none;
  background-color: transparent;
}
#content .top-filters legend .material-symbols {
  color: var(--cmg-color-headings);
}
#content .top-filters legend .material-symbols.top-filters-search-icon {
  font-size: 1.4rem;
  padding: 0 0.2rem 0 0.1rem;
}
#content .top-filters legend button.cm-toggle .material-symbols {
  font-size: 34px;
  line-height: 17px;
}
.top-filters fieldset {
  clear: both;
  position: relative;
  padding: 0.4rem 0.5rem 0;
  margin: 0;
  background-color: var(--cmg-color-bg-001);
}
.top-filters.open fieldset {
  padding-bottom: 0.5em;
}
.top-filters legend {
  width: 100%;
  background-color: var(--cmg-color-bg-001);
  line-height: 1.8em;
  cursor: pointer;
  font-size: 1em;
  box-sizing: content-box;
}
#top-filters-fields {
  display: none;
  padding: 0.25em 0.5em;
}
#top-filters-fields .filter-standard {
  margin-bottom: 0.25em;
}
#top-filters-fields .filter-inactive {
  display: none;
}
#top-filters-submit {
  display: flex;
  flex-direction: row-reverse;
  justify-content: right;
  margin-bottom: 0.75em;
}
.top-filters input[type=text],
.top-filters select,
.side-search input[type=text],
.side-search select {
  width: 100%;
  box-sizing: border-box;
  height: 28px;
  padding: 2px 4px;
  border: 1px solid var(--cmg-color-bg-006);
  background-color: var(--cmg-color-body-bg);
  color: var(--cmg-color-body-txt);
}
.top-filters label {
  margin-bottom: 0;
}
.top-search-end-date,
.top-search-start-date {
  display: flex;
  margin-bottom: 0.5em;
  align-items: center;
}
::-webkit-input-placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
:-moz-placeholder {
  opacity: 0.2;
}
.top-filters input[type=text]:focus,
.side-search input[type=text]:focus {
  background-color: var(--cmg-color-highlight-002);
}
.top-filters .submit-button,
.top-filters .clear-button,
.top-filters .options-button {
  font-size: 0.9em;
  width: 80px;
  height: 28px;
  margin: 1em 0.5em;
  padding: 0;
}
.top-filters .options-button {
  width: 90px;
}
#top-filters-options {
  font-size: 0.9em;
  padding: 0 1em 0.5em 1em;
}
#top-filters-options-container .dropdown-menu {
  padding: 0;
}
#top-filters-options-container h3 {
  font-size: 0.9em;
  background-color: var(--cmg-color-bg-005);
  text-align: center;
  padding: 0.4em 0;
}
.top-filters .top-filters-checkboxes {
  margin-top: 0.5em;
}
.top-filters-fields-dates {
  padding: 1.25em 1em 0.5em;
  border: 1px solid var(--cmg-color-bg-006);
  border-radius: 4px;
  margin-bottom: 1em;
}
.top-search-date-label {
  padding: 1em 0 0.25em;
}
.top-filters .filter-clear-all-button {
  font-size: 0.9em;
  width: auto;
  height: auto;
  line-height: unset;
  padding: 0 1em;
}
.top-filters .filter-clear-all-button:hover {
  background-color: unset;
}
.top-filters.top-filters-hide-fields label,
.side-search label {
  display: none;
}
#top-filters-active-filters {
  margin-left: 0.25em;
  padding: 0.5em 0;
}
.top-filters-active-filter.btn.btn-sm {
  padding: 0.2em 0.4em;
  white-space: nowrap;
  box-shadow: none;
  text-transform: none;
  font-size: 0.8em;
  border: 1px solid var(--cmg-color-bg-007);
}
.top-filters-active-filter.btn.btn-sm:hover {
  background-color: var(--cmg-color-bg-006);
  color: var(--cmg-color-btn-bg-002) !important;
}
.top-filters-active-filter.btn.btn-sm:focus {
  border: 1px dotted var(--cmg-color-btn-bg-002);
  box-shadow: 0 0 0 .25rem rgba(13,110,253,.25);
}
.top-filters-active-filter-value::before {
  content: ":";
}
.top-filters-active-filter-title.no-value::after {
  content: none;
}
.top-filters-active-filters-remove button {
  margin-left: 2em;
  font-size: 0.9em;
  background-color: var(--cmg-color-bg-003);
}
.top-filters-active-filters-remove button:hover {
  background-color: var(--cmg-color-bg-005);
}
.filter-datepicker-lbl {
  white-space: nowrap;
  margin-right: 0.5em;
}
/* PLATFORM NOTICE (for COmanage CO) */
#platform-notice {
  padding: 0.5em;
  text-align: center;
  border-bottom: 1px solid var(--cmg-color-bg-006);
  background-color: var(--cmg-color-highlight-004);
}
#platform-notice a:hover {
  text-decoration: underline;
}
/* CO CONFIGURATION DASHBOARD */
.config-menu {
  list-style: none;
  padding: 0 0 1em;
  border-bottom: 1px solid var(--cmg-color-bg-006);
}
.config-menu a {
  display: inline-block;
  padding: 0.5em 0.5em 0.5em 2em;
  text-indent: -0.9em;
}
.config-menu a .material-symbols,
.config-menu a .material-symbols-outlined {
  color: var(--cmg-color-body-txt);
  margin-right: 0.5em;
}
#configuration-menu {
  border-bottom: none;
}
h2.config-subtitle {
  font-size: 1.6em;
}
.config-platform-notice {
  margin: 1em 0 -3em;
}
#main-menu .menu-panel .config-platform-notice {
  margin: 0 0 1em;
}
#main-menu .menu-panel .config-platform-notice a {
  display: inline;
  padding: 0;
}
#main-menu .menu-panel .config-platform-notice a:hover {
  background-color: unset;
  text-decoration: underline;
}
#main-menu .menu-panel .config-platform-notice .material-symbols-outlined {
  font-size: 24px;
}
/* INDEX ACTION COMMAND MENUS */
th.with-field-actions {
  padding-left: 3em;
}
table.list-mode td.with-field-actions {
  padding: 0;
}
table.list-mode .field-actions-container {
  display: flex;
  align-items: center;
}
.field-actions .action-menu-toggle {
  display: inline-block;
  padding: 1em;
}
.field-actions-menu.actions-expanded {
  margin-right: 0;
}
.field-actions .dropdown-menu {
  padding: 0;
  margin: -1em 0 !important; /* offset gear icon padding */
  font-size: 1em;
  border-radius: 0;
}
.field-actions a.dropdown-item {
  padding: 0.5em 1em;
}
#main .field-actions a.dropdown-item:hover {
  color: var(--cmg-color-btn-bg-002);
  text-decoration: none;
}
.dropdown-item.active,
.dropdown-item:active {
  background-color: var(--cmg-color-bg-004);
}
a.dropdown-item.deletebutton {
  color: var(--cmg-color-highlight-001);
}
.dropdown-item.bottom-border {
  border-bottom: 1px solid var(--cmg-color-bg-005);
}
/* INDEX ACTION BULK EDIT */
.field-actions.top-links #bulk-edit-switch-container {
  padding: 0.5em 1em 1.5em;
}
#bulk-actions {
  display: none;
}
body.bulk-mode #bulk-actions {
  display: block;
  width: 100%;
  padding: 1em;
  margin: 0 0 1em;
  background-color: var(--cmg-color-bg-003);
  border: 1px solid var(--cmg-color-bg-005);
}
body.bulk-mode #bulk-actions legend {
  width: auto;
  font-size: 1.2em;
}
#bulk-action-select {
  margin-bottom: 0.75em;
  font-size: 0.9rem;
}
#bulk-actions button {
  float: right;
}
table.bulk-edit-mode a.row-link,
table.bulk-edit-mode .read-only-link-container,
table.bulk-edit-mode .row-link-heading,
table.bulk-edit-mode .field-actions {
  display: none;
}
table.bulk-edit-mode .with-field-actions {
  padding-left: 1em;
}
table.list-mode a.row-link,
table.list-mode .field-actions {
  display: block;
}
table.list-mode .bulk-action-checkbox-container {
  display: none;
}
table.index-table .form-check {
  margin: 0 0 0 -0.5em;
  min-height: unset;
}
table.index-table .with-field-actions .form-check {
  margin: 0;
}
.bulk-action-checkbox-container {
  display: flex;
  align-items: center;
}
.bulk-action-checkbox-container .form-check-input {
  margin-right: 1em;
  flex-shrink: 0;
}
#bulk-actions-modal .modal-body {
  padding: 1rem;
  overflow-y: auto;
}
#bulk-actions-modal .modal-body h3.data-table-modal-header {
  margin-bottom: -1.75em;
}
#bulk-actions .progress {
  width: 100%;
  height: 3rem;
  margin-bottom: 1rem;
  background-color: var(--cmg-color-bg-006);
  border: 1px solid var(--cmg-color-btn-bg-001);
  border-radius: 0;
}
#bulk-actions .progress-bar {
  background-color: var(--cmg-color-btn-bg-001);
}
/* PAGINATION */
#pagination {
  margin: 0;
  min-height: 1.5em;
  padding: 0.5em 1em;
  background-color: var(--cmg-color-btn-bg-001);
  color: var(--cmg-color-txt-inverse);
  text-align: center;
}
html.dark-mode #pagination {
  background-color: var(--cmg-color-bg-003);
}
#pagination ul,
#pagination li { /* override defaults */
  display: inline-block;
  list-style: none;
  margin: 0;
  padding: 0;
}
#pagination a {
  color: var(--cmg-color-txt-inverse);
}
#pagination a:hover {
  color: var(--cmg-color-bg-002);
  text-decoration: underline;
}
#pagination .paginationNumbers a {
  display: inline-block;
  padding: 0 4px;
}
#pagination .paginationCounter {
  display: block;
}
#pagination ul.paginationFirstPrev li {
  margin-right: 0.5em;
  font-size: 0.9em;
}
#pagination ul.paginationNextLast li {
  margin-left: 0.5em;
  font-size: 0.9em;
}
#pagination .pagination-form {
  display: inline-block;
}
#pagination #goto-page {
  margin: 0 2em;
}
#pagination .pagination-form label {
  margin-bottom: 0;
}
#pagination .pagination-form input[type=text] {
  height: 1.4em;
  width: 2em;
  margin: 0;
  padding: 2px;
  font-size: 0.9em;
  background-color: var(--cmg-color-bg-004);
  border: 1px solid var(--cmg-color-bg-004);
  border-radius: 0.25rem;
  text-align: center;
}
#pagination .pagination-form select {
  margin: 0 0.25rem 0 0.5rem;
  padding: 0 2rem 0 0.25rem;
  font-size: 0.9em;
  display: inline-block;
  line-height: unset;
  width: unset;
  height: unset;
  border: 1px solid var(--cmg-color-bg-001);
  background-color: var(--cmg-color-bg-001);
  color: var(--cmg-color-body-txt);
}
#pagination .pagination-form option {
  padding: 0;
}
#pagination .pagination-form input[type="submit"] {
  width: auto;
  margin: -3px 0 0 2px;
  padding: 0 4px;
  min-width: 0;
  min-height: 0;
  line-height: initial;
  font-size: 0.9em;
}
#pagination li.active {
  font-weight: bold;
  font-size: 120%;
  position: relative;
  top: 1px;
}
#pagination .btn-primary {
  background-color: var(--cmg-color-btn-bg-001);
  border-color: var(--cmg-color-btn-bg-001);
}
#pagination .btn-primary:hover,
#pagination .btn-primary:focus,
#pagination .btn-primary:active {
  background-color: var(--cmg-color-body-txt) !important;
  border-color: var(--cmg-color-btn-bg-002);
}
#pagination div.submit,
#pagination div.select {
  display: inline-block;
}
::-webkit-input-placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
:-moz-placeholder {
  opacity: 0.2;
}
.form-control::placeholder {
  color: var(--cmg-color-txt-soft);
}
/* PERSON CANVAS / CARDS */
#person-actions {
  display: flex;
}
#person-actions .action-menu-toggle {
  white-space: nowrap;
}
#mvea-add-menu-container {
  float: right;
  margin: 1em 0 0;
}
#mvea-canvas {
  clear: both;
}
#mvea-canvas-title-container {
  display: flex;
  gap: 0.5em;
  align-items: center;
  margin: 3em 0 -0.5em;
}
#mvea-canvas-attributes,
#mvea-canvas-attributes-js {
  margin-top: 0;
  margin-bottom: 2em;
}
#mvea-canvas-attributes-js .badge {
  margin-right: 0.5em;
}
#mvea-canvas-attributes-js .canvas-url-link {
  margin-left: 1em;
}
#mvea-canvas-roles {
  margin-bottom: 2em;
}
h2.card-title {
  font-size: 1.2rem;
  margin-bottom: 0.5rem;
  line-height: 2rem;
}
h2.card-title a {
  display: block;
  color: var(--cmg-color-headings);
}
#main h2.card-title a:hover {
  text-decoration: none;
}
.field-data-container .id-col {
  text-align: right;
  padding-right: 1em;
  color: var(--cmg-color-txt-soft);
  font-size: 0.8em;
}
.field-data.with-actions {
  display: flex;
  justify-content: space-between;
}
/* JavaScript Component Action Dropdowns (e.g. on MVEAs) */
.cm-component-actions ul.dropdown-menu {
  margin: -0.5em 0 !important;
  padding: 0;
  font-size: 0.9em;
  min-width: unset;
}
.cm-component-actions li.action-list-item {
  margin: 0;
  padding: 0;
}
.cm-component-actions .action-menu-toggle {
  padding: 0.5em;
}
.cm-component-actions a.dropdown-item {
  display: flex;
  gap: 0.25em;
  padding: 0.25rem 0.5rem;
}
#main .cm-component-actions a.dropdown-item:hover {
  color: var(--cmg-color-btn-bg-002);
  text-decoration: none;
}
.with-hover-button {
  display: flex;
  justify-content: space-between;
  gap: 0.5em;
  align-items: center;
}
.with-row-actions {
  display: flex;
  justify-content: space-between;
  gap: 0.5em;
  align-items: end;
}
.field-data.with-row-actions {
  padding-right: 0.25em;
}
.cm-copy-value-button .material-icons-outlined {
  font-size: 1em !important;
}
button.cm-row-button,
a.cm-row-button {
  display: flex;
  align-items: center;
  gap: 0.1em;
  padding: 0 0.5em 0.2em;
  text-transform: unset;
  box-shadow: none;
  background-color: var(--cmg-color-body-bg);
  border: 1px solid var(--cmg-color-bg-006);
  color: var(--cmg-color-link);
  white-space: nowrap;
}
button.cm-row-button:hover,
button.cm-row-button:active,
button.cm-row-button:focus,
a.cm-row-button:hover,
a.cm-row-button:active,
a.cm-row-button:focus {
  background-color: var(--cmg-color-btn-bg-001);
  border: 1px solid var(--cmg-color-btn-bg-001);
  color: var(--cmg-color-txt-inverse) !important;
}
/* DATA LISTS */
ul.data-list {
  padding-left: 0;
}
ul.data-list li {
  margin: 0 0 2px;
  padding: 2px 0 3px 0;
  background-color: var(--cmg-color-bg-003);
}
ul.data-list li:nth-child(2n) {
  background-color: var(--cmg-color-bg-009);
}
ul.data-table li {
  background-color: unset;
}
.field-data {
  padding: 0.25em 0.75em;
}
/* FORMS */
label {
  cursor: pointer;
}
ul.fields li {
  overflow-x: auto; /* required for data tables on mobile */
}
.card ul.fields li {
  overflow: unset; /* but don't overflow in a card row */
  list-style: none;
}
/*** ul.form-list is the main structure for representing forms
as well as data where field name is in the left column and
field data is in the right column; see also ul.data-list
above. ***/
ul.form-list {
  clear: both;
  margin-top: 0.5rem;
  padding: 0;
  border-top: 1px solid var(--cmg-color-bg-005);
}
.cm-time-picker-vals ul li,
ul.form-list li {
  background-color: var(--cmg-color-body-bg);
  border-left: 1px solid var(--cmg-color-bg-005);
  border-bottom: 1px solid var(--cmg-color-bg-005);
  border-right: 1px solid var(--cmg-color-bg-005);
  margin: 0;
  padding: 0;
  list-style: none;
}
ul.fields li.form-list-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  overflow-x: unset;
  margin-top: 2rem;
  color: var(--cmg-color-txt-inverse);
  background-color: var(--cmg-color-btn-bg-001);
  padding: 1rem;
}
ul.fields li.form-list-header h2 {
  font-size: 1.4em;
  padding: 0;
  color: var(--cmg-color-txt-inverse);
}
ul.fields li.form-list-header .btn {
  color: var(--cmg-color-txt-inverse);
  padding: 0;
}
ul.form-list li:focus-within {
  background-color: var(--cmg-color-bg-001);
}
ul.form-list li.form-list-header:focus-within {
  background-color: var(--cmg-color-btn-bg-001);
}
ul.form-list li.fields-submit:focus-within {
  background-color: var(--cmg-color-body-bg);
}
ul.form-list li.subfield {
  border-top: none;
}
ul.form-list li .field {
  margin: 0;
  padding: 0.75em;
}
ul.form-list li .field:hover,
ul.form-list li fieldset:hover {
  background-color: var(--cmg-color-bg-001);
}
ul.form-list li .field.field-with-toggle:hover {
  background-color: unset;
}
ul.form-list li.fields-subsection {
  border-left: none;
  border-right: none;
}
ul.form-list li.fields-submit {
  background-color: unset;
  border: none;
}
ul.form-list li.fields-submit .field:hover {
  background-color: var(--cmg-color-body-bg);
}
ul.form-list .field-name {
  display: block;
}
ul.form-list .field-info {
  position: relative;
}
ul.form-list .field-with-toggle {
  cursor: pointer;
}
ul.form-list .field-with-toggle .field-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
ul.form-list button.cm-toggle {
  border: none;
  background-color: transparent;
}
#content ul.form-list button.cm-toggle .material-symbols,
#content ul.form-list button.cm-toggle .material-symbols-outlined {
  color: var(--cmg-color-headings);
  font-size: 34px;
  line-height: 17px;
}
ul.form-list .field-desc {
  font-size: 0.9em;
  font-style: italic;
  padding-bottom: 1em;
  color: var(--cmg-color-txt-soft);
}
ul.form-list .field-desc.field-autocomplete-desc {
  display: flex;
  align-items: center;
  gap: 0.25em;
}
ul.form-list .fields-header {
  background-color: var(--cmg-color-body-bg);
}
ul.form-list .subfield-title {
  font-weight: bold;
}
ul.form-list .subfield-cols {
  display: inline-flex;
}
ul.form-list .subfield-cols.d-block {
  margin-top: 0.5rem;
}
ul.form-list .subfield-cols.d-block:first-child {
  margin-top: 0;
}
ul.form-list .field-col .subfield-title {
  display: block;
  margin-bottom: 0;
}
ul.form-list input[type="text"],
ul.form-list input[type="number"],
ul.form-list input[type="password"] {
  width: 100%;
  font-size: 1em;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  border: 1px solid var(--cmg-color-bg-007);
  padding: 4px 6px;
  color: var(--cmg-color-body-txt);
  background-color: var(--cmg-color-body-bg);
}
ul.form-list input[type="number"] {
  width: 6em;
}
ul.form-list input[type="text"]:focus,
ul.form-list input[type="number"]:focus,
ul.form-list input[type="password"]:focus {
  background-color: var(--cmg-color-highlight-002);
}
ul.form-list input[type="text"][readonly="readonly"],
ul.form-list input[type="number"][readonly="readonly"] {
  border: none;
  background-color: transparent;
  appearance: textfield;
  padding: 0;
}
ul.form-list select[readonly="readonly"] {
  appearance: none;
  --bs-form-select-bg-img: none;
  background-color: transparent !important;
  padding: 0;
  border: none;
  font-size: 1em;
}
ul.form-list select {
  width: auto; /* select boxes should fit to their content, typically */
  font-size: 0.9em;
  color: var(--cmg-color-body-txt);
  background-color: var(--cmg-color-body-bg);
  border-color: var(--cmg-color-bg-007);
}
ul.form-list .not-set {
  padding: 0;
}
.form-select:disabled {
  background-color: var(--cmg-color-bg-009);
}
ul.form-list li.fields-submit .required {
  font-style: italic;
}
ul.form-list li.fields-submit .field-info {
  display: flex;
  gap: 1em;
}
ul.form-list .btn.inline-form-button {
  padding: 0.25rem 0.75rem;
  margin-left: 1rem;
}
ul.field-children {
  margin: 0.5em;
  padding: 0;
}
ul.field-children li {
  margin: 0;
  border-left: 1px solid var(--cmg-color-bg-007);
  border-right: 1px solid var(--cmg-color-bg-007);
  border-bottom: 1px solid var(--cmg-color-bg-007);
}
ul.field-children li:nth-child(1) {
  border-top: 1px solid var(--cmg-color-bg-007);
}
ul.field-children li:nth-child(odd) {
  background-color: var(--cmg-color-bg-002);
}
ul.field-children li:nth-child(even) {
  background-color: var(--cmg-color-bg-006);
}
ul.form-list li.field-stack .field-name,
ul.form-list li.field-stack .field-info {
  display: block;
  width: 97%;
}
ul.form-list textarea {
  font-size: 0.9em;
  width: 100%;
  height: 4em;
  border: 1px solid var(--cmg-color-bg-007);
  padding: 0.5em;
  color: var(--cmg-color-body-txt);
  background-color: var(--cmg-color-body-bg);
}
ul.form-list textarea.big-textarea {
  height: 24em;
}
ul.form-list li.field-stack textarea {
  margin: 0;
  width: 100%;
  resize: vertical;
}
ul.form-list .field-suppliment {
  font-size: 0.9em;
}
ul.form-list li.info-title {
  border: none;
}
.checkbox label input[type="checkbox"] {
  position: relative;
  top: -0.12em;
  margin-right: 0.5em;
  width: 1.24em;
  height: 1.24em;
}
html.dark-mode .form-check-input:checked {
  background-color: var(--cmg-color-btn-bg-001);
  border-color: var(--cmg-color-bg-006);
}
.checkbox .subfield {
  margin-left: 1.5em;
}
.checkbox .subfield input {
  float: none;
}
.checkbox .subfield label {
  display: inline;
  margin: 0;
}
#content .material-symbols,
#content .material-symbols-outlined {
  font-size: 17px;
  margin-top: 1px;
  vertical-align: top;
}
.form-control {
  font-size: 1em; /* bootstrap override */
}
.field .radio {
  display: flex;
  gap: 1em;
}
.field .radio input {
  margin-right: 0.25em;
}
.field .radio.required {
  color: var(--cmg-color-body-txt);
}
/* DATE and TIME PICKERS */
.cm-datetime-picker {
  display: flex;
  align-items: center;
  margin-left: 2.8em;
}
.datepicker-container {
  display: flex;
}
.duet-date__toggle {
  width: 30px;
  height: 30px;
  background-color: transparent;
  border-radius: 0;
  margin: -15px 0 0;
  box-shadow: none;
}
.duet-date__toggle:focus {
  border: 1px dotted var(--cmg-color-btn-bg-002);
  box-shadow: 0 0 0 .25rem rgba(13,110,253,.25); /* override Duet to be same as Bootstrap */
}
table.duet-date__table tr th:first-child,
table.duet-date__table tr td:first-child,
table.duet-date__table th,
table.duet-date__table td {
  padding: unset !important;
}
table.duet-date__table th.duet-date__table-header {
  padding: 8px;
  text-align: center;
}
.cm-time-picker button {
  width: 30px;
  margin: 0;
  padding: 0;
}
#content .cm-time-picker .material-symbols,
#content .cm-time-picker .material-symbols-outlined {
  font-size: 1.5em;
  font-weight: 300;
  margin: 0;
}
.duet-date__input {
  display: none;
}
ul.fields li.fields-datepicker {
  overflow: unset;
}
ul.fields li.fields-datepicker .field-info {
  width: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
ul.fields li.fields-datepicker .datepicker-message {
  flex-basis: 100%;
}
ul.form-list input.datepicker {
  width: auto;
}
.field-info .input-group {
  flex-wrap: unset;
}
.field-info .input-group .input.text {
  width: inherit;
}
.field-info .input-group .input-group-text {
  border-radius: unset;
  font-size: inherit;
  line-height: inherit;
  padding: .25rem .75rem;
  background-color: var(--cmg-color-bg-002);
  color: var(--cmg-color-body-txt);
  border-color: var(--cmg-color-bg-007);
}
.cm-time-picker {
  position: relative;
}
.cm-time-picker-panel {
  position: absolute;
  z-index: 100;
  right: 0;
  width: auto;
  background-color: var(--cmg-color-body-bg);
  border: 1px solid var(--cmg-color-bg-006);
  text-align: center;
  border-radius: 4px;
  align-items: center;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.1);
}
.cm-time-picker-title {
  padding: 0.25em;
  border-bottom: 1px solid var(--cmg-color-bg-005);
  font-size: 1.1em;
}
.cm-time-picker-vals ul {
  display: grid;
  /* Mobile view is long. The grid templates are reversed for desktop. */
  grid-template-columns: repeat(6,40px);
  grid-template-rows: repeat(4,40px);
  padding: 0;
  align-content: center;
}
.cm-time-picker-minutes .cm-time-picker-vals ul {
  grid-template-columns: repeat(4,40px);
  grid-template-rows: repeat(1,40px);
}
.top-filters .cm-time-picker-vals li,
ul.form-list .cm-time-picker-vals li {
  display: block;
  padding: 4px 0 0 0;
}
.cm-time-picker-vals ul li:nth-child(even) {
  background-color: var(--cmg-color-body-bg);
}
.cm-time-picker-vals button {
  background-color: transparent;
  border: none;
  width: 30px;
  height: 30px;
  font-size: 0.9rem;
  margin: 0;
}
.cm-time-picker-vals button:focus {
  background-color: var(--cmg-color-btn-bg-001);
  color: var(--cmg-color-txt-inverse);
  border-radius: 14px;
}
.cm-time-picker-colon {
  padding: 0 1em;
}
.cm-tz {
  font-size: 0.9em;
  margin-left: 0.5em;
  color: var(--cmg-color-txt-soft);
}
/* Autocomplete */
.cm-autocomplete-panel {
  overflow-y: auto;
  max-height: 50vh !important;
  max-width: 800px;
  border: 1px solid var(--cmg-color-bg-008);
  background-color: var(--cmg-color-body-bg);
  line-height: 1.75em;
}
.cm-autocomplete-panel ul {
  padding: 0;
  margin: 0;
}
.cm-autocomplete-panel .cm-ac-item {
  padding: 1em;
}
.cm-autocomplete-panel li {
  list-style: none;
  border-collapse: collapse;
  border-bottom: 1px solid var(--cmg-color-bg-006);
}
.cm-autocomplete-panel li[data-p-focus="true"] {
  background-color: var(--cmg-color-highlight-002);
  box-shadow: inset 0 0 0.1em var(--cmg-color-bg-001);
  cursor: pointer;
}
.cm-autocomplete-panel li[data-p-focus="true"] > .cm-ac-item-is-member {
  background-color: var(--cmg-color-body-bg);
  box-shadow: inset 0 0 0.1em var(--cmg-color-highlight-007);
  cursor: default;
}
.cm-autocomplete-panel .cm-ac-subitems {
  font-size: 0.9em;
  margin-left: 1em;
}
.cm-autocomplete-panel .disabled {
  pointer-events:none;
  opacity:0.65;
  box-shadow: inset 0 0 0.2em var(--cmg-color-highlight-007);
}
input.cm-autocomplete {
  color: var(--cmg-color-body-txt);
  background-color: var(--cmg-color-body-bg);
  border: 1px solid var(--cmg-color-bg-008);
}
.cm-ac-item-primary {
  display: flex;
  justify-content: space-between;
}
.cm-ac-name {
  display: flex;
  align-items: center;
  gap: 1em;
}
.cm-ac-name-value {
  font-weight: bold;
}
.cm-ac-item-id {
  font-size: 0.9em;
}
.cm-ac-subitem {
  display: grid;
  grid-template-columns: 1fr 8fr;
  gap: 0.5em;
}
.cm-ac-pager a {
  display: block;
  padding: 1em;
  text-align: center;
}
.cm-ac-pager a:focus,
.cm-ac-pager a:hover {
  text-decoration: underline;
  background-color: var(--cmg-color-bg-002);
}
.cm-ac-input-group > div {
  flex-grow: 1;
}
.cm-ac-link-to-person {
  gap: 0.25em;
  color: var(--cmg-color-link);
}
#main .cm-ac-link-to-person:hover {
  text-decoration: none;
}
.item-with-type {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5em;
}
.item-with-type:last-child {
  border-bottom: none;
}
.item-with-type .value {
  word-break: break-all;
}
.item-with-type .type {
  font-size: 0.9em;
  font-style: italic;
}
.query-highlight {
  background-color: var(--cmg-color-highlight-018);
  color: black;
}
li[data-pc-section="emptymessage"] {
  padding: 0.1em 0.5em;
}
/* PEOPLE PICKER */
#cm-people-picker {
  display: flex;
  flex-direction: column;
  padding: 1em;
  gap: 4px;
}
.group-member-name {
  margin-right: 0.5em;
  font-size: 1.4em;
}
/* Vue transitions */
.v-enter-active,
.v-leave-active {
  transition: opacity 0.2s;
}
.v-enter-from,
.v-leave-to {
  opacity: 0;
}
[v-cloak] {
  display: none;
}
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  border: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap; /* Prevent text wrapping */
}
/* ENTITY METADATA under each Edit/View Form/List */
#entity-metadata {
  text-align: right;
  margin: 0 0 0.5rem;
  color: var(--cmg-color-txt-soft);
}
/* ENROLLMENT FLOWS */
.upper-buttons {
  display: flex;
  gap: 0.5em;
  font-size: 0.9em;
}
.upper-buttons a {
  padding: 0.5em 1em;
}
/* ENROLLMENT FLOWS: ATTRIBUTE COLLECTOR */
body.dispatch main,
body.start main {
  max-width: 800px;
  margin: 0 auto;
}
body.dispatch form,
body.start form {
  margin-top: 1em;
}
body.dispatch .submit,
body.start .submit {
  width: 100%;
  text-align: right;
}
#dispatch-list-container > ul {
  border-top: none;
}
#dispatch-list-container ul {
  padding-left: 0;
}
#dispatch-list-container li {
  border: none;
}
#dispatch-list-container li.petition-key-value {
  padding: 0.5rem 0;
}
#dispatch-list-container li.env-source-key-value-newgroup {
  border-top: 1px solid var(--cmg-color-bg-005);
}
#dispatch-list-container .field,
#dispatch-list-container fieldset {
  display: block;
  padding: 0.75em 1em 1.5em;
}
#dispatch-list-container .fieldset-info {
  display: flex;
  flex-direction: column;
  gap: 0.5em;
  padding: 1em;
  border: 1px solid var(--cmg-color-bg-006);
}
#dispatch-list-container .fieldset-info > div {
  flex-grow: 1;
}
#dispatch-list-container li.fields-submit .field {
  display: grid;
}
#dispatch-list-container .field-name,
#dispatch-list-container .field-desc {
  padding: 0;
}
#dispatch-list-container .field-title,
#dispatch-list-container legend {
  font-size: 1.05rem;
  margin-bottom: 0;
}
#dispatch-list-container .field-info {
  padding-top: 0.5em;
}
#dispatch-list-container input[type='text'],
#dispatch-list-container textarea {
  padding: 0.5rem;
}
#dispatch-list-container li.dispatch-welcome {
  margin: 1em 1em 2em;
  font-size: 1.1em;
}
#dispatch-list-container ul.fields li.fields-accepted .field {
  background-color: var(--cmg-color-bg-001);
  border: 1px solid var(--cmg-color-bg-006);
  padding: 1em 1.5em 1.5em;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}
#dispatch-list-container ul.fields li.fields-accepted .field-info label {
  display: flex;
  align-items: center;
  gap: 0.25em;
  padding: 0.5em 1.5em 0.5em 1.25em;
  background-color: var(--cmg-color-bg-005);
  border: 1px solid var(--cmg-color-bg-006);
  border-radius: 3px;
  box-shadow: 0 1px 1px 0 rgba(0,0,0,.14),0 3px 1px -3px rgba(0,0,0,.2),0 1px 3px 0 rgba(0,0,0,.12);
}
#dispatch-list-container ul.fields li.fields-accepted .field-info label[for='accepted-1'].is-selected {
  background-color: var(--cmg-color-highlight-006);
  border: 1px solid var(--cmg-color-highlight-008);
  color: var(--cmg-color-highlight-007);
}
#dispatch-list-container ul.fields li.fields-accepted .field-info label .form-check-input {
  margin-top: 0;
}
#dispatch-list-container ul.fields li.fields-accepted .field .radio {
  gap: 0.5em;
}
/* DIALOG BOX */
#dialog .modal-header {
  background-color: var(--cmg-color-bg-004);
  border-bottom: none;
  justify-content: space-between;
}
#dialog .modal-footer {
  border-top: none;
}
.modal-header .btn-close {
  background-color: var(--cmg-color-txt-inverse);
  border: 1px solid var(--cmg-color-bg-007);
  margin: 0;
}
.btn.btn-primary.cm-deleted-close-button {
  display: flex;
  align-items: center;
  gap: 0.25em;
  margin: auto;
}
/* MVEA & STANDARD MODAL */
.cm-modal .modal-header {
  padding: 0.5rem 1rem;
  background-color: var(--cmg-color-bg-004);
  border-bottom: none;
  justify-content: space-between;
}
.cm-modal .modal-content {
  height: 80vh;
}
.cm-modal .modal-body {
  padding-top: 0;
}
.cm-modal iframe {
  width: 100%;
  height: 100%;
}
#comanage-iframe-wrapper #subnavigation .supertitle-container,
#comanage-iframe-wrapper #subnavigation #cm-person-subnav-tabs,
#comanage-iframe-wrapper #subnavigation #cm-person-subnav-links {
  display: none;
}
#comanage-iframe-wrapper #content {
  padding: 1rem 2em 0;
}
#comanage-iframe-wrapper .page-title-container {
  margin: 1em 0;
}
/* EIS SEARCH */
#eis-search-form {
  margin-bottom: 1em;
}
#eis-search-form .eis-single-search {
  display: flex;
  gap: 1em;
  align-items: center;
}
.eis-single-search .input {
  flex-grow: 1;
}
/* EIS Source Records */
.eis-item {
  width: 30%;
}
.eis-type {
  width: 20%;
  font-style: italic;
}
.eis-meta.eis-item {
  width: 50%;
}
/* PETITIONS */
#petition-resume td {
  vertical-align: middle;
}
.btn.ef-continue-step,
.btn.ef-rerun-step {
  padding-right: 1em;
  white-space: nowrap;
}
ul#view_Petitions.form-list {
  border-top: none;
}
ul#view_Petitions.form-list li {
  overflow-x: unset;
}
ul#view_Petitions.form-list li.history-table {
  overflow-x: auto;
}
ul#view_Petitions ul li:focus-within {
  background: unset;
}
ul.form-list li.petition-status-title {
  margin-top: 0.5rem;
  margin-bottom: -1rem;
  border: none;
}
ul.form-list li.petition-status-title {
  /* default colors for most status titles */
  background-color: var(--cmg-color-highlight-009);
  color: var(--cmg-color-highlight-010);
  border: 1px solid var(--cmg-color-highlight-011);
}
ul.form-list li.petition-status-title h2 {
  color: var(--cmg-color-highlight-010);
}
ul.form-list li.petition-status-title-finalized {
  background-color: var(--cmg-color-highlight-006);
  color: var(--cmg-color-highlight-007);
  border: 1px solid var(--cmg-color-highlight-008);
}
ul.form-list li.petition-status-title-finalized h2 {
  color: var(--cmg-color-highlight-007);
}
ul.form-list li.petition-enrollee-items,
ul.form-list li.petition-enrollee-items .field:hover {
  background-color: var(--cmg-color-highlight-004);
  color: var(--cmg-color-highlight-005);
}
ul.form-list li.petition-enrollee-items .field-info {
  display: flex;
  flex-direction: column; /* changes to 'row' on desktop */
}
ul.form-list li.petition-enrollee-items .petition-inline-value,
ul.form-list li.petition-enrollee-items .petition-inline-value a {
  font-family: var(--cmg-font-semibold);
}
.env-source-key {
  font-size: 0.9em;
}
.env-source-value {
  word-break: break-all;
}
ul#view_Petitions.form-list li.env-source-key-value-newgroup {
  border-top: 1px solid var(--cmg-color-bg-005);
}
.petition-step-modified {
  margin-right: 1em;
}
.petition-attrs {
  padding: 0;
  box-shadow: inset 0 0 0.5rem 0 rgba(0,0,0,0.1);
}
.petition-attrs h3 {
  padding: 1rem 1rem 0;
  margin: 0;
  font-size: 1.2em;
  font-weight: 600;
  border-top: 1px solid var(--cmg-color-bg-006);
}
.petition-attrs h4 {
  font-size: 0.9em;
  margin: 0 0 0.25em;
}
.petition-attrs > ul {
  padding: 0 0 1rem;
  border-top: none;
}
.petition-attrs > ul > li {
  padding: 0.5rem 1rem;
  border: none;
  background-color: unset;
}
.petition-attrs > ul.env-source-attrs {
  margin-top: 1rem;
}
ul.petition-attrs-subset {
  padding: 0;
  border: 1px solid var(--cmg-color-bg-005);
  border-top: none;
}
ul.petition-attrs-subset li {
  display: grid;
  grid-template-columns: 1fr 2fr;
  border: none;
  border-top: 1px solid var(--cmg-color-bg-005);
  gap: 1em;
  padding: 0.1em 0.5em;
}
.petition-attrs-subset-label {
  color: var(--cmg-color-txt-soft);
}
/* MOSTLY STATIC PAGES */
body.pages.logged-out #top-bar,
body.pages.logged-out #breadcrumbs {
  display: none;
}
body.pages.logged-out .page-title-container {
  margin: 0;
}
.page-body {
  margin-top: 1em;
}
/* GENERAL */
.hidden,
.invisible,
.co-dialog {
  display: none;
}
p {
  margin: 0 0 1em;
}
address {
  margin-bottom: 0;
}
.fieldTitle {
  font-weight: bold;
}
.descr {
  font-style: italic; /* used for long descriptions of fields, typically near the field-title */
}
.data-desc {
  margin-left: 0.5em; /* used for short, often parenthesized descriptions of data */
  font-size: 0.9em;
}
.required {
  color: var(--cmg-color-highlight-001);
}
.center {
  text-align: center;
}
.vtop {
  vertical-align: top !important;
}
.force-wrap {
  overflow-wrap: anywhere;
}
.text-muted-cmg {
  color: var(--cmg-color-txt-soft) !important;
}
.cm-id-display {
  margin-left: 1em;
  font-size: 0.9em;
}
.smaller {
  font-size: smaller;
}
.invalid-feedback {
  font-size: 1em;
}
input[type='text'].invalid {
  border: 1px solid var(--cmg-color-highlight-001) !important;
}
.warn-level-a,
.warn-level-a td {
  background-color: var(--cmg-color-highlight-012);
}
.warn-level-b,
.warn-level-b td {
  background-color: var(--cmg-color-highlight-009);
}
/* Sortable table headings and icons */
a.asc,
a.desc {
  white-space: nowrap;
}
a.asc::after,
a.desc::after {
  display: inline-block;
  content: "";
  height: 0;
  width: 0;
  margin-left: 0.25em;
  border: 4px solid transparent;
}
a.asc::after {
  border-bottom-color: var(--cmg-color-link);
  margin-bottom: 3px;
}
a.desc::after {
  border-top-color: var(--cmg-color-link);
  margin-bottom: -3px;
}
/* CO GRID LAYOUT; currently used only on CO Selection */
.co-grid {
  clear: both;
  max-width: 100%;
  border-bottom: 1px solid var(--cmg-color-bg-005);
}
.co-grid .col {
  margin: 0;
  padding: 1em;
}
.co-grid .co-grid-header {
  font-weight: bold;
}
.co-grid .co-row {
  border-top: 1px solid var(--cmg-color-bg-005);
}
code,
.fixed-width * {
  font-family: "Courier New","Courier",monospace !important;
  color: var(--cmg-color-body-txt);
  font-size: 1em;
}
code.source-record {
  overflow-wrap: anywhere;
}
.with-copy-icon {
  display: flex;
  justify-content: space-between;
  gap: 0.5em;
  align-items: center;
}
button.cm-copy-value-button {
  display: flex;
  align-items: center;
  gap: 0.1em;
  padding: 0 0.5em 0.2em;
  text-transform: unset;
  box-shadow: none;
  background-color: var(--cmg-color-body-bg);
  border: 1px solid var(--cmg-color-bg-006);
  color: var(--cmg-color-link);
  white-space: nowrap;
}
button.cm-copy-value-button:hover,
button.cm-copy-value-button:active,
button.cm-copy-value-button:focus {
  background-color: var(--cmg-color-btn-bg-001);
  border: 1px solid var(--cmg-color-btn-bg-001);
  color: var(--cmg-color-txt-inverse) !important;
}
.cm-copy-value-button .material-symbols-outlined {
  font-size: 1em !important;
}
/* INDEX VIEWS and TABLES */
table {
  width: 100%;
  border-collapse: collapse;
  border-left: 1px solid var(--cmg-color-bg-005);
  border-right: 1px solid var(--cmg-color-bg-005);
}
.table-container {
  overflow: auto;
  clear: both;
}
th, td {
  padding: 1em 1em 1em 1.5em;
  text-align: left;
}
th {
  color: var(--cmg-color-body-txt);
  background-color: var(--cmg-color-bg-003);
}
thead td.actions {
  color: var(--cmg-color-body-txt);
  background-color: var(--cmg-color-bg-003);
}
td {
  border-bottom: 1px solid var(--cmg-color-bg-005);
}
td ul {
  margin: 0;
  padding: 0 0 0 1em;
}
table.list-mode th.actions:first-child,
table.list-mode td.actions:first-child {
  text-align: center;
}
table.bulk-edit-mode th.actions,
table.bulk-edit-mode td.actions {
  width: 1.25em;
}
th:last-child,
td:last-child {
  border-right: none;
}
tr.noborder td {
  border: none;
}
td.indented {
  border-left: 3em solid var(--cmg-color-body-bg);
}
tr.linked-row:hover td {
  background-color: var(--cmg-color-bg-001);
  cursor: pointer;
}
table.index-table.with-actions th:nth-child(2),
table.index-table.with-actions td:nth-child(2) {
  padding-left: 0;
}
.linked-row {
  cursor: pointer !important;
}
.linked-row:hover,
.linked-row:hover td {
  background-color: var(--cmg-color-bg-001) !important;
}
table.list-mode .read-only-link-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.linked-row .read-only-icon {
  color: var(--cmg-color-txt-soft);
  padding: 0 0.5em;
}
table.table-striped tbody tr:nth-child(2n) td {
  /* bootstrap override */
  background-color: var(--cmg-color-bg-001);
}
td .alert {
  margin-bottom: 0;
}
.history-table th {
  font-weight: normal;
}
/* LOADING ANIMATION & SKELETONS */
@keyframes loading {
  0%   { opacity: 0.3; }
  30%  { opacity: 1.0; }
  100% { opacity: 0.3; }
}
#co-loading {
  display: none; /* revealed by JavaScript */
  position: fixed;
  z-index: 1100;
  top: 50%;
  left: 50%;
  width: 120px;
  margin: -25px 0 0 -60px;
  padding: 2em 0;
  line-height: 0;
  text-align: center;
  background-color: var(--cmg-color-body-bg);
  border: 1px solid var(--cmg-color-bg-006);
  border-radius: 60px;
}
#co-loading-redirect {
  padding: 1em 1em 0;
  text-align: center;
}
.co-loading-mini-input-container {
  position: relative;
}
.co-loading-mini-input-container .co-loading-mini {
  display: none;
  position: relative;
  right: 38px;
  bottom: 2px;
  margin-right: -26px;
}
.co-loading-mini-container.over-input {
  display: none;
  position: absolute;
  right: 0.5em;
  bottom: 0.7em;
  z-index: 100;
}
#co-loading span,
#co-loading-redirect span,
.co-loading-mini span {
  animation: 1.2s linear infinite both loading;
  background-color: var(--cmg-color-spinner);
  display: inline-block;
}
#co-loading span {
  height: 20px;
  width: 20px;
  border-radius: 10px;
  margin: 0 2.5px;
}
#co-loading-redirect span {
  height: 16px;
  width: 16px;
  border-radius: 8px;
  margin: 0 2px;
}
.co-loading-mini span {
  height: 6px;
  width: 6px;
  border-radius: 3px;
  margin: 0 1px;
}
#co-loading span:nth-child(2),
#co-loading-redirect span:nth-child(2),
.co-loading-mini span:nth-child(2) {
  animation-delay: 0.2s;
}
#co-loading span:nth-child(3),
#co-loading-redirect span:nth-child(3),
.co-loading-mini span:nth-child(3) {
  animation-delay: 0.4s;
}
.skeleton-list li {
  height: 2.2rem;
}
/* BUTTONS */
button, .btn, .btn:hover {
  color: var(--cmg-color-body-txt);
}
.btn {
  text-transform: uppercase;
  font-weight: 500;
  border-radius: 3px;
  font-size: 1.2em;
  padding: 0.5em 1.5em;
}
.btn:focus {
  border: 1px dotted var(--cmg-color-btn-bg-002);
}
.btn.btn-sm {
  font-size: 0.9em;
}
.btn-primary,
.btn-primary:focus,
.btn-primary:active {
  background-color: var(--cmg-color-btn-bg-001);
  color: var(--cmg-color-txt-inverse);
  border-color: var(--cmg-color-btn-bg-001);
}
.btn-secondary,
.btn-secondary:focus,
.btn-secondary:active {
  background-color: var(--cmg-color-btn-bg-004);
  color: var(--cmg-color-txt-inverse);
}
.btn-tertiary,
.btn-tertiary:focus,
.btn-tertiary:active {
  background-color: var(--cmg-color-btn-bg-005);
  color: var(--cmg-color-txt-inverse);
}
.btn-default,
.btn-default:focus,
.btn-default:active {
  background-color: var(--cmg-color-bg-005);
}
.btn-primary,
.btn-secondary,
.btn-tertiary,
.btn-default,
.btn-cancel,
.btn-primary:active,
.btn-secondary:active,
.btn-tertiary:active,
.btn-default:active,
.btn-cancel:active {
  box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
}
.btn-primary:hover,
.btn-secondary:hover,
.btn-tertiary:hover,
.btn-default:hover {
  background-color: var(--cmg-color-btn-bg-002);
  color: var(--cmg-color-txt-inverse) !important;
  border-color: var(--cmg-color-btn-bg-002);
  text-decoration: none !important;
}
.btn-cancel:hover {
  background-color: var(--cmg-color-bg-009);
  text-decoration: none !important;
}
.btn-primary.disabled,
.btn-primary:disabled {
  color: var(--cmg-color-txt-inverse);
  background-color: var(--cmg-color-btn-bg-001);
  border-color: var(--cmg-color-btn-bg-001);
  opacity: 0.4;
}
.btn-default,
.btn-default:active {
  background-color: var(--cmg-color-bg-005);
  box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
}
html.dark-mode .btn-default,
html.dark-mode .btn-default:active {
  background-color: var(--cmg-color-bg-005);
}
.btn-default:hover {
  background-color: var(--cmg-color-btn-bg-001);
  color: var(--cmg-color-txt-inverse) !important;
  text-decoration: none !important;
}
.btn-secondary {
  background-color: var(--cmg-color-btn-bg-004);
  color: var(--cmg-color-txt-inverse);
  border-color: var(--cmg-color-btn-bg-004);
}
.btn-link {
  font-size: 1em;
  text-decoration: underline;
  color: var(--cmg-color-btn-bg-001);
  border: none;
}
#edit_ApiUsers .provisionbutton {
  margin-left: 1em;
}
/*Bootstrap badge*/
.badge {
  font-size: 0.8em; /* as small as we can go and maintain WCAG */
  font-weight: normal;
  height: min-content;
  margin-top: auto;
  margin-bottom: auto;
  line-height: 1.2em;
}
.bg-light {
  color: var(--cmg-color-highlight-005);
}
.bg-danger {
  color: var(--cmg-color-txt-inverse);
  background-color: var(--cmg-color-highlight-014) !important;
}
.bg-warning {
  background-color: var(--cmg-color-highlight-009) !important;
  color: var(--cmg-color-highlight-010);
}
.bg-primary {
  background-color: var(--cmg-color-btn-bg-001);
}
.badge.bg-primary {
  background-color: var(--cmg-color-btn-bg-001) !important;
}
.bg-secondary {
  background-color: var(--cmg-color-btn-bg-003);
}
/* Bootstrap bg-outline */
.bg-outline-primary {
  color: var(--cmg-color-link);
  border: 1px solid var(--cmg-color-btn-bg-001);
}
.bg-outline-info {
  color: var(--cmg-color-highlight-004);
  border: 1px solid var(--cmg-color-highlight-004);
}
.bg-outline-danger {
  color: var(--cmg-color-highlight-014);
  border: 1px solid var(--cmg-color-highlight-014);
}
.bg-outline-success {
  color: var(--cmg-color-highlight-007);
  border: 1px solid var(--cmg-color-highlight-007);
}
.bg-outline-warning {
  color: var(--cmg-color-highlight-009);
  border: 1px solid var(--cmg-color-highlight-009);
}
.bg-outline-light {
  color: var(--cmg-color-highlight-005);
  border: 1px solid var(--cmg-color-highlight-005);
}
.bg-outline-secondary {
  color: var(--cmg-color-btn-bg-003);
  border: 1px solid var(--cmg-color-btn-bg-003);
}
/* Other Bootstrapisms */
.accordion-item {
  color: var(--cmg-color-body-txt);
  background-color: var(--cmg-color-body-bg);
  border-color: var(--cmg-color-bg-006);
}
.accordion-button {
  color: var(--cmg-color-link);
  background-color: var(--cmg-color-body-bg);
}
.accordion-button:not(.collapsed) {
  color: var(--cmg-color-link);
  background-color: var(--cmg-color-bg-001);
  box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--cmg-color-bg-006);
}
html.dark-mode .accordion-button::after { /* override Bootstrap SVG in dark mode */
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='rgb(99, 146, 197)' viewBox='0 0 16 16'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.dropdown-menu, .dropdown-item {
  color: var(--cmg-color-body-txt);
  background-color: var(--cmg-color-body-bg);
}
.alert-success {
  color: var(--cmg-color-highlight-007);
}
.card,
.modal-content {
  color: var(--cmg-color-body-txt);
  background-color: var(--cmg-color-body-bg);
  border-color: var(--cmg-color-bg-006);
}
.collapsing {
  transition-property: height, visibility;
  transition-duration: 0.2s;
  transition-timing-function: ease-out;
}
/* DENSITY SETTINGS (from User Settings Menu; Medium is default) */
/* Density "small" */
html.density-small th,
html.density-small td {
  padding: 0.5em 0.5em 0.5em 1em;
}
html.density-small th.with-field-actions {
  padding-left: 2.5em;
}
html.density-small td.with-field-actions {
  padding: 0;
}
html.density-small .field-actions .action-menu-toggle {
  padding: 0.75em;
}
html.density-small table.bulk-edit-mode th.with-field-actions {
  padding-left: 0.5em;
}
html.density-small .bulk-action-checkbox-container .form-check-input {
  margin-right: 0;
}
html.density-small .co-grid .col {
  padding: 0.75em;
}
html.density-small ul.form-list li .field {
  padding: 0.5em;
}
html.density-small a.menu-panel-toggle {
  font-size: 0.9em;
}
/* Density "large" */
html.density-large th,
html.density-large td {
  padding: 1.25em 1.25em 1.25em 1.75em;
}
html.density-large th.with-field-actions {
  padding-left: 2.75em;
}
html.density-large table.bulk-edit-mode th.with-field-actions {
  padding-left: 1.25em;
}
html.density-large td.with-field-actions {
  padding-left: 0.5em;
}
html.density-large .co-grid .col {
  padding: 1.5em;
}
html.density-large ul.form-list li .field {
  padding: 1.5em;
}
html.density-large .field-data {
  padding: 0.75em 1em;
}
/* CHANGELOG */
#changelog-container .accordion-button {
  padding: 0.5rem 1rem;
}
#changelog-container .accordion-item {
  border-radius: 0;
  border: 1px solid var(--cmg-color-bg-005)
}
#changelog .accordion-body, 
#changelog .accordion-body ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
#changelog .accordion-body {
  overflow-x: scroll;
}
#changelog .accordion-body li {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  padding: 0.5rem 1rem;
  border-top: 1px solid var(--cmg-color-bg-003);
  align-items: center;
}
#changelog .accordion-body li:first-child {
  border-top: none;
}
.changelog-active-link-container {
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  align-items: center;
}
/* FOOTER */
footer {
  text-align: center;
  padding: 2em 2em 1em;
}