/* Use the gnome-shell theme, but with light colors */
$variant: 'light';

@import "gnome-shell-sass/_colors"; //use gtk colors
@import "gnome-shell-sass/_drawing";
@import "gnome-shell-sass/_common";
@import "gnome-shell-sass/_widgets";

/* Overrides */

#panel, #panel.solid {
  font-weight: normal;
  background-color: $bg_color;
  background-gradient-direction: vertical;
  background-gradient-end: darken($bg_color,5%);
  border-top-color: #666; /* we don't support non-uniform border-colors and
                             use the top border color for any border, so we
                             need to set it even if all we want is a bottom
                             border */
  border-bottom: 1px solid #666;
  app-icon-bottom-clip: 0px;
  &:overview {
    background-color: #000;
    background-gradient-end: #000;
    border-top-color: #000;
    border-bottom: 1px solid #000;
    .panel-button { color: #fff; }
  }

  .panel-button {
    -natural-hpadding: 8px;
    -minimum-hpadding: 4px;
    font-weight: normal;
    color: $fg_color;
    text-shadow: none;
    transition-duration: 0ms;
    border: 0;
    border-radius: 0px;

    &.clock-display {
      .clock {
        transition-duration: 0ms;
        border: 0;
        border-radius: 0px;
      }
    }

    &:hover {
      color: lighten($fg_color,10%);
      text-shadow: none;
      & .system-status-icon { icon-shadow: none; }
    }
    &:active, &:overview, &:focus, &:checked {
      // Trick due to St limitations. It needs a background to draw
      // a box-shadow
      background-color: $selected_bg_color;
      color: $selected_fg_color;
      box-shadow: none;
      & > .system-status-icon { icon-shadow: none; }
    }

    .app-menu-icon { width: 0; height: 0; margin: 0; } // shell's display:none; :D

    .system-status-icon {
      icon-shadow: none;
    }
  }

  .panel-corner,
  .panel-corner:active,
  .panel-corner:overview,
  .panel-corner:focus {
    -panel-corner-radius: 0;
  }
  &.lock-screen,
  &.unlock-screen, 
  &.login-screen { 
    background-color: transparentize($bg_color, 0.5);
    background-gradient-start: transparentize($bg_color, 0.5);
    background-gradient-end: transparentize($bg_color, 0.5);
    border-bottom: none;
    .panel-button { color: $osd_fg_color; }
  }
}

#appMenu { 
  spinner-image: url("classic-process-working.svg"); 
  .panel-status-menu-box { padding: 0; }
}
.tile-preview-left.on-primary,
.tile-preview-right.on-primary,
.tile-preview-left.tile-preview-right.on-primary {
    /* keep in sync with -panel-corner-radius */
    border-radius: 0;
}

@each $v in us, intl {
  .toggle-switch-#{$v} {
    background-image: url("classic-toggle-off-#{$v}.svg");
    &:checked { background-image: url("classic-toggle-on-#{$v}.svg"); }
  }
}

.calendar-day-with-events {
  background-image: url("calendar-today.svg");
}

