/* module-key = 'com.atlassian.gadgets.dashboard:dashboard', location = 'css/gadget-dialog.css' */

#gadget-dialog .aui-dialog2-content {
    padding: 0; /* remove inherited padding */
    border-radius: 0 0 5px 5px;
 }
#gadget-dialog .aui-page-panel-nav {
    padding: 20px 10px;
    width: 220px;
 }
#gadget-dialog #list-panel {
    margin-right: 20px;
 }
#gadget-dialog .aui-page-panel-nav .directory-search {
    margin-left: 10px;
}

#gadget-dialog .aui-page-panel-nav .directory-search .text {
    width:180px;
}
#gadget-dialog .aui-page-panel-nav .directory-search + .aui-navgroup-vertical {
    margin-top: 20px;
}
/* truncate items to a single line if too long */
/*#gadget-dialog .category-nav-item {*/
    /*overflow: hidden;*/
/*}*/
/*#gadget-dialog .category-nav-item a {*/
    /*text-overflow: ellipsis;*/
    /*white-space: nowrap;*/
/*}*/
/**/
#gadget-dialog .category-nav-item .aui-badge {
    float: right;
}

#gadget-dialog .item-group { /* directory item group */
    border-bottom: 1px solid var(--ds-border, #cccccc);
    padding: 10px 0;
}
#gadget-dialog .item-group.last {
    border:none;
}
#gadget-dialog .item-thumbnail {
    width: 120px; /* width of the image */
}
#gadget-dialog .item-thumbnail img {
    border: 1px solid var(--ds-border, #ccc);
    border-radius: 3px;
}
#gadget-dialog .item-description,
#gadget-dialog .item-actions {
    margin-left: 20px;
}
#gadget-dialog .item-actions {
    text-align: right;
    /* For some reason closing and re-opening the dialog causes the actions
    column to calculate its width differently, so hard-coding the width there */
    width:150px;
}

#gadget-dialog .item-description h4:first-child {
    margin-top: 0;
}
#gadget-dialog .item-author {
    color: var(--ds-text-subtlest, #707070);
    font-size: 12px;
    margin-top: 0;
}
#gadget-dialog .message-panel {
    padding-top:40px;
}
#gadget-dialog .loading-text {
    text-align: center;
    padding-top:10px;
}

#gadget-dialog .toggle-xml {
    display:block;
}

#gadget-dialog .loading-spinner {
    margin-left:auto;
    margin-right:auto;
}

#gadget-dialog #directory-page {
    height: 400px;
}

#gadget-dialog #message-panel div:first-of-type {
    margin-top: 20px;
    margin-right: 10px;
}

#gadget-dialog #message-panel div {
    margin-right: 10px;
}

/* module-key = 'com.atlassian.gadgets.dashboard:dashboard', location = 'css/dashboard.css' */
/* Dashboards Specific */
.dashboard {
    overflow: hidden;
}

.dashboard ul.disabled span {
    color: var(--ds-text-disabled, #999999);
    font-size: 1em;
    font-weight: bold;
    padding: 0.6em 0.8em 0.6em 0.8em;
}

.dashboard ul.disabled a {
    padding: 0;
}

.layout {
    clear: both;
    padding: 0 20px 20px 20px;
    position: relative;
}

.layout:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/* IE */
.dashboard.initializing .layout * {
    visibility: hidden;
}

.layout .column {
    display: block;
    float: left;
    list-style-type: none;
    margin: 0 0 -1.5em 2%;
    min-height: 200px;
    padding: 0;
    position: relative;
    width: 47.5%;
}

.layout .column .gadget {
    display: block;
    width: auto;
}

.layout-a .column.second,
.layout-a .column.third {
    display: none;
}

.layout-a .column {
    width: 98%;
}

.layout-aa .column.third {
    display: none;
}

.layout-aa .column {
    width: 47.5%;
}

.layout-ba .column.third {
    display: none;
}

.layout-ba .column {
    width: 68%;
}

.layout-ba .column.first {
    width: 27%;
}

.layout-ab .column.third {
    display: none;
}

.layout-ab .column {
    width: 27%;
}

.layout-ab .column.first {
    width: 68%;
}

.layout-aaa .column {
    width: 30.9%;
}

.layout.maximized .column,
.layout.maximized .column.maximized li {
    display: none;
}

.layout.maximized .column.maximized {
    display: block;
    width: 98%;
}

.layout.maximized .column.maximized li.maximized {
    display: list-item;
}

.layout.maximized .column.maximized div.gadget.maximized .minimization {
    display: none;
}

.dashboard.dragging .column.empty {
    background: none;
    border: none;
}

/* apologies about the important, I just had to because sortable control applies an inline style. */
.dashboard.dragging .column.empty .empty-text {
    display: none !important;
}

/* dashboard layout placeholder chrome */
.layout .column .gadget,
.layout .column .placeholder,
.layout .column.empty .empty-text {
    margin: 0;
    margin-bottom: 20px;
    position: relative;
}

.layout .column .gadget {
    background: transparent;
    border: 1px solid transparent;
    border-left: 0;
    border-right: 0;
    padding: 0 1px 0 1px;
}

.layout .column .placeholder,
.layout .column.empty .empty-text {
    border: 2px dashed var(--ds-border, #C1C7D0);
    -moz-border-radius: 3px;
    border-radius: 3px;
    color: var(--ds-text-subtle, #8993A4);
    font-size: 24px;
    min-height: 200px;
    padding: 20px;
    text-align: center;
}

.layout .column.empty .empty-text.drag-here-text {
    color: var(--ds-text-subtlest, #5E6C84);
}

.dashboard.dragging .hotspot-shim {
    display: block;
}

.hotspot-shim {
    position: absolute;
    z-index: 10;
    display: none;
}

.throbber {
    display: inline-block;
    height: 16px;
    vertical-align: middle;
    width: 16px;
}

.throbber.loading {
    background: transparent url("/jira/s/-sx7n1u/10030021/1aq2un5/9.0.36/_/download/resources/com.atlassian.gadgets.dashboard:dashboard/css/images/wait.gif") 0 0 no-repeat;
}

.dashboard-shim {
    z-index: 4;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    display: none;
}

.propagation-blocker .dashboard-shim {
    display: block;
}

/* diagnostics warning */
#diagnostic-warning {
    background: var(--ds-background-warning, #FFFFDD) none repeat scroll 0 0;
    border: 1px solid var(--ds-border-warning, #F7DF92);
    color: var(--ds-text, #333333);
    margin: 0 0 0.2em;
    text-align: center;
}

#diagnostic-warning a {
    color: var(--ds-link, #0052CC);
}

#diagnostic-content {
    text-align: left;
}

#diagnostic-warning p {
    margin: 0 1em;
    padding: 0.3em;
}

#diagnostic-warning span.close {
    cursor: pointer;
    display: block;
    float: right;
}

#diagnostic-warning span.close .aui-icon {
    color: inherit;
}

/* This needs to be !important because jQuery.ui applies inline styles. */
.dashboard.hotspot-active li.placeholder {
    display: none !important;
}

/* disable aui shim. Will not work in ie, because our z-indexing is a few levels deep. */
.shim {
    display: none !important;
}

/* Operation options - generally used at the top right of the page */
#dash-options > .throbber,
#dash-options > .operations {
    display: inline-block;
}

#dash-options .operations > li > a {
    background-position: 6px 6px;
    background-repeat: no-repeat;
    color: inherit;
    display: block;
    margin: 0;
    padding-left: 28px;
}

#dash-options .icon-add {
    background-image: url(/jira/s/-sx7n1u/10030021/1aq2un5/9.0.36/_/download/resources/com.atlassian.gadgets.dashboard:dashboard/images/icons/add_20.png);
}

#dash-options .icon-edit {
    background-image: url(/jira/s/-sx7n1u/10030021/1aq2un5/9.0.36/_/download/resources/com.atlassian.gadgets.dashboard:dashboard/images/icons/edit_20.png);
}

#dash-options .icon-tools {
    background-image: url(/jira/s/-sx7n1u/10030021/1aq2un5/9.0.36/_/download/resources/com.atlassian.gadgets.dashboard:dashboard/images/icons/tools_20.png);
}

#dash-options .icon-restore {
    background-image: url(/jira/s/-sx7n1u/10030021/1aq2un5/9.0.36/_/download/resources/com.atlassian.gadgets.dashboard:dashboard/images/icons/ico_dash_666_restore.gif);
}


#gadget-dialog input[type='text']::-ms-clear {
    display: none;
}

.gadget-menu button {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
}

/* MNSTR-6358: the iframe content should be covered during loading, but not causing the re-render when uncovered */
.ag-iframe-hidden {
    position: absolute;
    top: 0;
    z-index: -1;
}

/* module-key = 'com.atlassian.gadgets.dashboard:dashboard', location = 'css/dashboard-item.css' */
.dashboard-item-content .loading {
  background:url("/jira/s/-sx7n1u/10030021/1aq2un5/9.0.36/_/download/resources/com.atlassian.gadgets.dashboard:dashboard/css/images/loading.gif") center no-repeat;
}

.dashboard-item-content .loading-small {
  background:url("/jira/s/-sx7n1u/10030021/1aq2un5/9.0.36/_/download/resources/com.atlassian.gadgets.dashboard:dashboard/css/images/loading_100.gif") center no-repeat;
}

.dashboard-item-content .item-error {
    padding:5px;
}

.dashboard-item-content .gadget-inline {
    overflow: auto;
}
/* module-key = 'com.atlassian.gadgets.dashboard:dashboard', location = 'css/dashboard/vertical-navigation.css' */
/*!* dashboard page navigation styles *!*/
/*!* NOTE: these were copy-pasted from the styles generated from JIRA's layout.less file @ f7efef01d *!*/
#dashboard > .tabs.vertical {
  border-right: 1px solid var(--ds-background-accent-gray-subtler, #ddd);
  padding: 10px;
  padding-bottom: 20px;
  width: 200px;
}

/* module-key = 'com.atlassian.gadgets.dashboard:dashboard', location = 'css/dashboard/page-chrome.css' */
/* page chrome structure */
#dashboard {
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    padding: 0;
    position: relative;
    margin: 0;
    width: 100%;
}

#dashboard > #dashboard-header {
    display: none; /* It is not used and should not be used. */
}

#dashboard > .vertical.tabs,
#dashboard > .dashboard-content {
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    margin: 0;
    position: relative;
    vertical-align: top;
    background: var(--ds-surface-sunken, #F4F5F7);
}

/* set the position and width of the vertical navigation */
#dashboard > .vertical.tabs {
    bottom: 0;
    left: 0;
    padding-top: 20px; /* to give the content some breathing room from the application header */
    position: absolute;
    top: 0;
    width: 188px;
}

#dashboard > .vertical.tabs + .dashboard-content {
    margin-left: 188px;
}

/* set the min-height of the page */
.dashboard-content {
    min-height: 600px;
    background-color: var(--ds-surface-sunken, #F4F5F7);
}

#dashboard-content > .aui-page-header {
    padding: 20px;
    background-color: var(--ds-surface-sunken, #F4F5F7);
}

.initializing .dashboard-content {
    height: 600px;
    overflow: hidden;
}

/* page chrome styling */
#dashboard {
    background: var(--ds-surface, #fff);
    border-bottom: 1px solid var(--ds-border, #ddd);
}

/* module-key = 'com.atlassian.gadgets.dashboard:dashboard', location = 'css/dialogs/layout-dialog.css' */
#layout-dialog {}
  #layout-dialog .aui-dialog {border: none;}
  #layout-dialog h2 a,
  #layout-dialog h2 a:link,
  #layout-dialog h2 a:visited,
  #layout-dialog h2 a:hover,
  #layout-dialog h2 a:active,
  #layout-dialog h2 a:focus {background: transparent url('/jira/s/-sx7n1u/10030021/1aq2un5/9.0.36/_/download/resources/com.atlassian.gadgets.dashboard:dashboard/images/icons/close.png') no-repeat 0 0; display: block; height: 16px; position: absolute; right: 0.5em; text-indent: -9999px; top: 0.75em; width: 16px;}
  #layout-dialog .dialog-panel-body {padding: 10px 0 10px 16px;}

  #layout-dialog p {margin: 0 0 1em 0; text-align: left;}
  #layout-dialog ul {margin: 0; padding: 0;}
  #layout-dialog ul li {list-style-type: none; margin: 0; padding: 0;}
  #layout-dialog ul li button,
  #layout-dialog ul li button:visited {border: 2px solid var(--ds-border, #bbb); display: block; float: left; margin: 0 1em 1em 0; outline: none; padding: 0.35em; width: auto;}
  #layout-dialog ul li button:hover,
  #layout-dialog ul li button:active,
  #layout-dialog ul li button:focus {border-color: var(--ds-border-focused, #555);}


#layout-dialog ul li button strong {background: var(--ds-surface, #fff) url('/jira/s/-sx7n1u/10030021/1aq2un5/9.0.36/_/download/resources/com.atlassian.gadgets.dashboard:dashboard/css/images/sprite-layouts.png') no-repeat 0 0; cursor: pointer; display: block; float: left; height: 37px; text-indent: -9999px; width: 68px;}
    ul li button#layout-a strong {background-position: 0 0;}
    ul li button#layout-aa strong {background-position: 0 -41px;}
    ul li button#layout-ba strong {background-position: 0 -82px;}
    ul li button#layout-ab strong {background-position: 0 -123px;}
    ul li button#layout-aaa strong {background-position: 0 -163px;}


      .layout-a ul li #layout-a strong,
      #layout-dialog #layout-a:hover strong,
      #layout-dialog #layout-a:active strong,
      #layout-dialog #layout-a:focus strong {background-position: -72px -1px;}
      .layout-aa ul li #layout-aa strong,
      #layout-dialog #layout-aa:hover strong,
      #layout-dialog #layout-aa:active strong,
      #layout-dialog #layout-aa:focus strong {background-position: -72px -41px;}
      .layout-ba #layout-ba strong,
      #layout-dialog #layout-ba:hover strong,
      #layout-dialog #layout-ba:active strong,
      #layout-dialog #layout-ba:focus strong {background-position: -72px -82px;}
      .layout-ab #layout-ab strong,
      #layout-dialog #layout-ab:hover strong,
      #layout-dialog #layout-ab:active strong,
      #layout-dialog #layout-ab:focus strong {background-position: -72px -122px;}
      .layout-aaa #layout-aaa strong,
      #layout-dialog #layout-aaa:hover strong,
      #layout-dialog #layout-aaa:active strong,
      #layout-dialog #layout-aaa:focus strong {background-position: -72px -163px;}

      .layout-a ul li button#layout-a,
      .layout-aa ul li button#layout-aa,
      .layout-ba ul li button#layout-ba,
      .layout-ab ul li button#layout-ab,
      .layout-aaa ul li button#layout-aaa {background-color: var(--ds-surface-hovered, #eee); border-color: var(--ds-border, #666);}

/* module-key = 'com.atlassian.gadgets.dashboard:dashboard', location = 'css/dashboard/gadget-chrome.css' */
.gadget {
    margin: 0;
    padding: 0;
    position: absolute;
    z-index: 1;
}

.propagation-blocker div.gadget {
    z-index: 2;
}

.gadget.dragging {
    z-index: 3;
}

.gadget.dropdown-active {
    z-index: 5 !important;
}

.gadget .gadget-container {
    position: relative;
    border: 1px solid rgba(9, 30, 66, 0.04);
    border-radius: 4px;
}

.gadget .gadget-container .submit.loading {
    background: transparent url("/jira/s/-sx7n1u/10030021/1aq2un5/9.0.36/_/download/resources/com.atlassian.gadgets.dashboard:dashboard/css/images/wait.gif") 100% center no-repeat;
}

.gadget.dropdown-active .gadget-menu {
    z-index: 8;
}

.gadget .dashboard-item-header {
    background: var(--ds-surface-raised, #eee);
    -moz-border-radius-topleft: 3px;
    border-top-left-radius: 3px;
    -moz-border-radius-topright: 3px;
    border-top-right-radius: 3px;
    margin: 0;
    min-height: 24px;
    padding: 0;
    position: relative;
}

.gadget .dashboard-item-title {
    color: var(--ds-text, #333);
}

.gadget .dashboard-item-header > .dashboard-item-title {
    /* h5 size from ADG typography */
    background: transparent;
    font-size: 12px;
    letter-spacing: -.006em;
    font-weight: bold;
    line-height: 1.666666666667;
    margin: 0;
    padding: 4px 64px 4px 10px;
}

.gadget .dashboard-item-header > .gadget-menu {
    bottom: 0;
    position: absolute;
    padding-right: 12px;
    right: 0;
    top: 0;
    vertical-align: middle;
}

.dashboard.draggable .gadget .dashboard-item-title {
    cursor: move;
}

.dashboard.initializing div.gadget {
    visibility: hidden;
}

/* gadget menus */
.gadget .gadget-menu .aui-icon {
    border: none;
    display: block;
    padding: 0 3px;
    text-align: left;
    text-indent: -999em;
    opacity: 0.5;
    color: var(--ds-icon-inverse, #FFF);
    height: 16px;
    width: 16px;
}

html[data-color-mode="dark"] .gadget .gadget-menu .aui-icon {
    color: var(--ds-icon, #FFF);
}

.gadget .gadget-menu button.js-sortable-trigger svg.aui-icon {
    opacity: 0.5;
}

.gadget .gadget-menu .aui-icon:hover,
.gadget .gadget-menu .aui-dd-trigger:hover {
    opacity: 1;
}

.gadget .gadget-menu .aui-icon.move {
    cursor: move;
}

.gadget .gadget-menu .aui-dd-trigger {
    background: none;
}

.gadget .gadget-menu .aui-dd-trigger:hover,
.gadget .gadget-menu .aui-dd-trigger:active,
.gadget .gadget-menu .aui-dd-trigger:focus {
    background: none;
}

.gadget .gadget-menu > ul {
    float: right;
    margin: 6px 0 0 1em;
    padding: 0;
    width: auto;
}

.gadget .gadget-menu > ul > li {
    float: left;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.gadget .gadget-menu > ul > li > a:hover {
    text-decoration: none;
}

.gadget .gadget-menu > ul > li > a > span {
    display: block;
    padding: 0;
}

/* gadget colours menu items */
.gadget .gadget-colors ul {
    display: flex;
    flex-wrap: nowrap;
    padding: 4px 14px 3px 12px;
}

.gadget .gadget-colors li {
    float: left;
    list-style: none;
    margin: 2px 4px 2px 0;
}

.gadget .gadget-colors a {
    background: transparent;
    border: 0;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    height: 16px;
    outline-offset: 1px;
    padding: 0;
    text-align: left;
    text-indent: -999em;
    width: 16px;
}

.gadget .gadget-colors a:hover,
.gadget .gadget-colors a:focus,
.gadget .gadget-colors a:active {
    outline: 2px solid var(--ds-border-focused, #333);
}

/*
    workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=480888
    can't use box-shadow exclusively since IE8 doesn't support it
*/
.mozilla .gadget .gadget-colors a:hover,
.mozilla .gadget .gadget-colors a:focus,
.mozilla .gadget .gadget-colors a:active {
    outline: 0;
    box-shadow: 0 0 0 1px #fff, 0 0 0 3px #333;
}

/* gadget content container styles -- basically the wrapper for the gadget iframe */
.gadget .dashboard-item-content {
    -moz-border-radius-bottomleft: 3px;
    border-bottom-left-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    border-bottom-right-radius: 3px;
    background: var(--ds-surface, #fff);
    box-shadow: var(--ds-shadow-raised, 0 2px 2px 0 rgba(9, 30, 66, 0.13));
}

.gadget .dashboard-item-content.minimization {
    display: none;
    left: -9999px;
    position: absolute;
    width: 100%;
}

.defaultHeight {
    min-height: 250px;
}

/* module-key = 'com.atlassian.gadgets.dashboard:dashboard', location = 'css/dashboard/gadget-colours.css' */
/* Colored Gadgets */
.gadget .dashboard-item-title {
    color: var(--ds-text-inverse, #fff);
}

/* color1 - Light Blue */
.gadget.color1 .dashboard-item-header,
.gadget-colors .color1 > a {
    background-color: var(--ds-chart-blue-bold, #0747A6);
}

/* color2 - Red */
.gadget.color2 .dashboard-item-header,
.gadget-colors .color2 > a {
    background-color: var(--ds-chart-red-bold, #DE350B);
}

/* color3 - Orange */
.gadget.color3 .dashboard-item-header,
.gadget-colors .color3 > a {
    background-color: var(--ds-chart-orange-bold, #FF8B00);
}

/* color4 - Green */
.gadget.color4 .dashboard-item-header,
.gadget-colors .color4 > a {
    background-color: var(--ds-chart-green-bold, #00875A);
}

/* color5 - Dark Blue */
.gadget.color5 .dashboard-item-header,
.gadget-colors .color5 > a {
    background-color: var(--ds-chart-teal-bold, #00A3BF);
}

/* color6 - Purple */
.gadget.color6 .dashboard-item-header,
.gadget-colors .color6 > a {
    background-color: var(--ds-chart-purple-bold, #6554C0);
}

/* color7 - Light Gray */
.gadget.color7 .dashboard-item-header,
.gadget-colors .color7 > a {
    background-color: var(--ds-chart-gray-bold, #5E6C84);
}

/* color8 -- Octarine! */
.gadget.color8 .dashboard-item-header {
    background-color: transparent;
    transition: background-color ease-in 0.2s;
}

.gadget.color8 .dashboard-item-content {
    background-color: transparent;
    box-shadow: none;
    transition: all ease-in 0.2s;
}

.gadget.color8 .gadget-container {
    border-color: transparent;
    transition: border-color ease-in 0.2s;
}

.gadget-colors .color8 > a {
    background: transparent url('data:image/svg+xml;utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0D%0A%3Csvg%20width%3D%2216px%22%20height%3D%2216px%22%20viewBox%3D%220%200%2016%2016%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0D%0A%20%20%20%20%3C%21--%20Generator%3A%20Sketch%2048.2%20%2847327%29%20-%20http%3A%2F%2Fwww.bohemiancoding.com%2Fsketch%20--%3E%0D%0A%20%20%20%20%3Ctitle%3Eicon-transparent-square%3C%2Ftitle%3E%0D%0A%20%20%20%20%3Cdesc%3ECreated%20with%20Sketch.%3C%2Fdesc%3E%0D%0A%20%20%20%20%3Cdefs%3E%3C%2Fdefs%3E%0D%0A%20%20%20%20%3Cg%20id%3D%22Dashboard-logged-in%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%20transform%3D%22translate%28-446.000000%2C%20-518.000000%29%22%3E%0D%0A%20%20%20%20%20%20%20%20%3Cg%20id%3D%22icon-transparent-square%22%20transform%3D%22translate%28446.000000%2C%20518.000000%29%22%20stroke-width%3D%222%22%3E%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M1.5%2C14.5%20L14.5%2C1.5%22%20id%3D%22Line-3%22%20stroke%3D%22%23FF5630%22%20stroke-linecap%3D%22round%22%3E%3C%2Fpath%3E%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Crect%20id%3D%22Rectangle-3%22%20stroke%3D%22%23DFE1E6%22%20x%3D%221%22%20y%3D%221%22%20width%3D%2214%22%20height%3D%2214%22%20rx%3D%222%22%3E%3C%2Frect%3E%0D%0A%20%20%20%20%20%20%20%20%3C%2Fg%3E%0D%0A%20%20%20%20%3C%2Fg%3E%0D%0A%3C%2Fsvg%3E') no-repeat center;
    border: 1px solid var(--ds-border, #ccc);
}

.gadget.color8 .dashboard-item-header .aui-icon,
.gadget.color8 .dashboard-item-header .aui-dd-trigger {
    visibility: hidden;
}

.gadget.color8 .dashboard-item-header .aui-icon.move #Combined-Shape {
    fill: var(--ds-text-subtle, #42526E);
}

html[data-color-mode="dark"] .gadget.color8 .dashboard-item-header,
.gadget.color8 .dashboard-item-content {
    border-color: transparent;
}

.gadget.color8 > .gadget-hover > .dashboard-item-content {
    box-shadow: 0 2px 2px 0 rgba(9, 30, 66, 0.13);
}

.gadget.color8 > .gadget-hover > .dashboard-item-header,
.gadget.color8 > .gadget-hover > .dashboard-item-content {
    background-color: var(--ds-surface, #ffffff);
}

.gadget.color8 > .gadget-hover.gadget-container {
    border: 1px solid rgba(9, 30, 66, 0.04);
}

.gadget.color8 > .gadget-hover > .dashboard-item-header .aui-icon,
.gadget.color8 > .gadget-hover > .dashboard-item-header .aui-dd-trigger {
    visibility: visible;
    color: var(--ds-text-subtle, #42526E);
}

.gadget.color8 .dashboard-item-title {
    color: var(--ds-text-subtle, #42526E);
    visibility: hidden;
}

.gadget.color8 > .gadget-hover .dashboard-item-title {
    visibility: visible;
}

/* demonstrate the selected gadget colour */
.gadget.color1 .gadget-colors .color1 a,
.gadget.color2 .gadget-colors .color2 a,
.gadget.color3 .gadget-colors .color3 a,
.gadget.color4 .gadget-colors .color4 a,
.gadget.color5 .gadget-colors .color5 a,
.gadget.color6 .gadget-colors .color6 a,
.gadget.color7 .gadget-colors .color7 a,
.gadget.color8 .gadget-colors .color8 a {
    outline: 2px solid var(--ds-chart-teal-bold, #3C78B5);
}