/* Dash */

$dash_background_color: #3b3b3b;
$dash_placeholder_size: 32px;
$dash_padding: $base_padding + 4px; // 10px
$dash_spacing: $base_padding / 4;

$dash_bottom_margin: $base_margin * 4;

$dash_border_radius: $modal_radius * 1.5;

#dash {
  @include fontsize($base_font_size - 2);
  margin-top: $base_spacing * 3;
  padding: 0 $dash_padding;

  .placeholder {
    // background-image: url("assets/dash-placeholder.svg");
    background-image:none;
    background-size: contain;
    height: $dash_placeholder_size;
  }

  .empty-dash-drop-target {
    width: $dash_placeholder_size;
    height: $dash_placeholder_size;
  }

  .overview-icon {
    padding: $dash_padding / 2;
  }
}

.dash-background {
  background-color: $dash_background_color;
  margin-bottom: $dash_bottom_margin;
  padding: $dash_padding;
  border-radius: $dash_border_radius;
}

// Dash Items
.dash-item-container .app-well-app, .show-apps {
  padding: $dash_padding $dash_spacing $dash_padding + $dash_bottom_margin;
}

.dash-separator {
  width: 1px;
  margin: 0 ($dash_spacing + ($dash_padding / 2)) $dash_bottom_margin;
  background-color: transparentize($osd_fg_color,0.7);
}

// OSD Tooltip
.dash-label {
  color: $osd_fg_color;
  background-color: $osd_bg_color;
  border-radius: 99px;
  padding: $base_padding $base_padding * 2;
  text-align: center;
  -y-offset: $base_margin * 3; // distance from the dash edge
}

// Show apps button
.show-apps {
  @include overview-icon($osd_fg_color);

  &:focus,
  &:checked {
    .overview-icon {
      background-color: transparentize($osd_bg_color,0.5);
      color: $fg_color;
    }
  }
}
