/***BEGIN WidgetHost.css***/
/** Apply Widget shadow, if container needs it. */
.dashboard.widget-shadow-enabled .widget-host {
  -webkit-transition: opacity .3s, left .3s, top .3s, width .3s, height .3s;
  -moz-transition: opacity .3s, left .3s, top .3s, width .3s, height .3s;
  -o-transition: opacity .3s, left .3s, top .3s, width .3s, height .3s;
  transition: opacity .3s, left .3s, top .3s, width .3s, height .3s;
  /** This style needs to be generalized off of common color and shadow settings.*/
  box-shadow: 2px 2px 3px #dddddd; }

.widget-host {
  position: absolute;
  background: rgba(255, 255, 255, 1);
  background: var(--background-color,rgba(255, 255, 255, 1));
  /** Apply dark theme to the Widget Host overlay buttons. */ }
  .widget-host.dashboard-config-preview .interaction-overlay {
    background: transparent; }
  .widget-host .interaction-overlay {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%; }
  .widget-host.render-in-lightbox {
    position: unset; }
  .widget-host .widget-host-overlay .button-is-dark button {
    background: rgba(0, 0, 0, 0.18); }
    .widget-host .widget-host-overlay .button-is-dark button .fabric-icon {
      color: white; }
  .widget-host .widget-container {
    overflow: unset;
    height: 100%;
    width: 100%;
    position: absolute; }
    .widget-host .widget-container .content-container {
      height: 100%;
      width: 100%; }
      .widget-host .widget-container .content-container:focus {
        outline: none;
        border: 2px solid; }
    .widget-host .widget-container .classic-widget-container .internal-content-host,
    .widget-host .widget-container .classic-widget-container .external-content-host {
      height: 100%; }

.widget-host-error {
  background: rgba(255, 255, 255, 1);
  background: var(--background-color,rgba(255, 255, 255, 1));
  height: 100%;
  width: 100%; }
/***END WidgetHost.css***/

/***BEGIN AccessNotSupportedMessage.css***/
.access-not-supported-dialog-content {
  padding-bottom: 40px; }
  .access-not-supported-dialog-content .separate-child-elements > * {
    padding-bottom: 20px; }
  .access-not-supported-dialog-content .vss-Icon {
    width: auto; }
/***END AccessNotSupportedMessage.css***/

/***BEGIN DefaultWidgetFailedMessage.css***/
.widget-failed-dialog-content {
  padding-bottom: 40px; }
/***END DefaultWidgetFailedMessage.css***/

/***BEGIN ExtensionDisabledMessage.css***/
.extension-disabled-dialog-content {
  padding-bottom: 40px; }
  .extension-disabled-dialog-content .vss-Icon {
    width: auto; }
/***END ExtensionDisabledMessage.css***/

/***BEGIN ExtensionFailedMessage.css***/
.widget-failed-dialog-content {
  padding-bottom: 40px; }
/***END ExtensionFailedMessage.css***/

/***BEGIN WidgetHostEditOverlay.css***/
.widget-host-edit-overlay {
  background: rgba(255, 255, 255, 0.3); }
  .widget-host-edit-overlay .widget-host-edit-row {
    position: absolute;
    right: 0;
    z-index: 100;
    margin: 6px; }
    .widget-host-edit-overlay .widget-host-edit-row button {
      margin-left: 4px;
      border:  1px solid;
      border-color: rgba( 255, 255, 255 ,  1 );
      border-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
      background-color: rgba( 239, 239, 239 ,  1 );
      background-color: rgba( var(--palette-neutral-6,239, 239, 239) ,  1 ); }
      .widget-host-edit-overlay .widget-host-edit-row button:focus, .widget-host-edit-overlay .widget-host-edit-row button:hover {
        background-color: rgba( 200, 200, 200 ,  1 );
        background-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 ); }
      .widget-host-edit-overlay .widget-host-edit-row button.delete-widget-button {
        color: rgba(232, 17, 35, 1);
        color: var(--palette-error,rgba(232, 17, 35, 1)); }
      .widget-host-edit-overlay .widget-host-edit-row button .left-icon {
        font-size: 1rem; }
/***END WidgetHostEditOverlay.css***/

/***BEGIN WidgetHostOverlay.css***/
.widget-host-overlay {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  pointer-events: none; }
  .widget-host-overlay .widget-host-menu-header {
    pointer-events: initial;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 100; }
    .widget-host-overlay .widget-host-menu-header:not(.mouse-is-over-widget):not(.context-menu-is-active):not(.overlay-has-focus) {
      height: 0px;
      overflow: hidden; }
    .widget-host-overlay .widget-host-menu-header button {
      padding: 4px 4px;
      border-top-left-radius: 0px;
      border-top-right-radius: 0px;
      border-bottom-right-radius: 0px;
      background-color: rgba( 239, 239, 239 ,  1 );
      background-color: rgba( var(--palette-neutral-6,239, 239, 239) ,  1 ); }
      .widget-host-overlay .widget-host-menu-header button:focus, .widget-host-overlay .widget-host-menu-header button:hover {
        background-color: rgba( 200, 200, 200 ,  1 );
        background-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 ); }

.widget-host-delete-menu-icon {
  color: rgba(232, 17, 35, 1) !important;
  color: var(--palette-error,rgba(232, 17, 35, 1)) !important; }
/***END WidgetHostOverlay.css***/