:root {
  /* Colors */
  --m-color-offwhite: #f9f9f9;
  --m-color-gray-1: #eeeeee;
  --m-color-gray-2: #dedede;
  --m-color-gray-3: #ccc;
  --m-color-gray-4: #979797;
  --m-color-gray-5: #838383;
  --m-color-gray-6: #6e6e6e;
  --m-color-dark: #404040;
  --m-color-darker: #333;
  --m-color-darkest: #282828;
  --m-color-blue-dark: #494eaa;
  --m-color-blue-med: #6990ee;
  --m-color-blue-light: #d8ebfe;
  --m-color-red-dark: #a2204f;
  --m-color-red-med: #eb6176;
  --m-color-red-light: #fce2de;
  --m-color-green-dark: #146146;
  --m-color-green-med: #26a573;
  --m-color-green-light: #ccf3ca;
  --m-color-orange-dark: #963712;
  --m-color-orange-med: #e36f4f;
  --m-color-orange-light: #f6e5bb;

  --m-color-disabled-fg: var(--m-color-gray-4);
  --m-color-disabled-bg: var(--m-color-gray-1);

  --m-color-primary-action: #157bb6;
  --m-color-secondary-action: var(--m-color-blue-med);
  --m-color-tertiary-action: tan;

  --m-color-primary-bg: white;
  --m-color-secondary-bg: #F5F3F7;
  --m-color-tertiary-bg: #fafafa;
  --m-color-border: var(--m-color-gray-2);

  /* Borders */
  --m-border-radius-sm: 2px;
  --m-border-radius-md: 4px;
  --m-border-radius-full: 50%;


  /* Other */
  --m-max-content-width: 1792px; /* The 16" MacBook Pro */
  --m-input-min-height: 34px;

  /* Spacing (loosely based on Divine Proportions) */
  --m-space-xs: 6px;
  --m-space-sm: 12px;
  --m-space-md: 18px;
  --m-space-lg: 30px;
  --m-space-xl: 48px;

  /* Breakpoints */
  --m-breakpoint-sm: 576px; /* and below is "phone" */
  --m-breakpoint-md: 768px; /* and below is "tablet" */
  --m-breakpoint-lg: 992px;

  /* Font */
  --m-font-size-min: 13px; /* a11y recommendation */
  --m-font-size-default: 16px;
  --m-font-size-lg: 20px;
  --m-font-size-xl: 48px;
}

.brd-all.brd-dark {
    border-color: var(--m-color-dark);
}

.title {
    color: var(--m-color-primary-action);
}

m-container m-container,
m-container ~ m-container
{
    margin-top: -9px;
    margin-bottom: -9px;
}

m-box > .title {
    margin-top: 0;
}

.link-button:active, .link-button:focus, .link-button:hover {
    outline: 1px dashed gray;
}

input[disabled] + label {
    color: var(--m-color-gray-4);
}

body { background-color: #f8f8fe; }
header#layout-header, footer#layout-footer { background-color: #f8f8fe; }
footer#layout-footer { min-height: 1em; }
section#layout-content {
    background-color: #f8f8fe;
    padding-left: 1em;
    padding-right: 1em;
}

@media only screen and (max-width: 600px) {
    nav.breadcrumbs { display: none !important; }
}

div.form-field:has(label + .help) {
    margin-bottom: 0em !important;
}

.notification_icon_dot {
    border-radius: 100%;
    width: 18px;
    color: whitesmoke;
    text-align: center;
    height: 18px;
    vertical-align: bottom;
    padding: 5px;
}
