//
// Elementary Apps
//

// Wingpanel
.menubar.panel {
  .panel {
    &, &.color-light, &.color-dark {
      background-color: transparent;
      background-image: image(rgba($panel_bg, 0.1));
      border-bottom: none;
      transition: all 100ms ease-in-out;
      color: $panel_fg;
    }

    &.maximized {
      background-color: rgba($panel_bg, 0.2);
      background-image: none;
      border: none;
    }

    &.translucent {
      background-color: rgba($panel_bg, 0.1);
      background-image: none;
      border: none;
    }

    menubar {
      background: none;
      box-shadow: none;
      border: none;
    }
  }

  popover {
    padding: 2px 4px;
    margin: 0 6px 15px 6px;
    border: 1px solid if($variant == 'light', rgba(black, 0.35), rgba(black, 0.45));
    box-shadow: 0 3px 5px rgba(black, 0.12), 0 5px 8px rgba(black, 0.08);

    button {
      @include button(undecorated);
      &:hover { @include button(flat-hover); }
      &:active { @include button(flat-active); label { color: white; } }
      &:checked { @include button(flat-checked); label { color: white; } }
      &:disabled { @include button(flat-insensitive); }
      &, &:hover, &:active, &:checked, &:disabled { border-color: transparent; }
    }

    .linked > button {
      @include button(normal);
      &:hover { @include button(hover); }
      &:active, &:checked { @include button(active); }
      &:disabled { @include button(insensitive); }
    }

    list { background-color: transparent; }

    separator.horizontal {
      margin: 0 -4px;
    }

    separator.vertical {
      background: none;
    }

    .sidebar {
      border-style: none;
      background: none;

      .view {
        background: none;

        &:hover {
          border-radius: $bt_radius;
          background-color: if($variant=='light', rgba(black, 0.1), rgba(white, 0.1));
        }

        &:selected {
          &, &:focus, &:backdrop {
            text-shadow: none;
            transition: all 200ms $ease-out-quad;
            background-color: if($variant=='light', rgba(black, 0.65), rgba(white, 0.35));
            border-radius: $bt_radius;
          }
        }
      }
    }
  }
}

.composited-indicator {
  padding: 0 6px;

  > revealer label,
  > revealer image,
  > revealer spinner {
    color: $panel_fg;
    font-weight: normal;
    transition: all 200ms ease-in-out;
    text-shadow: none;
    -gtk-icon-shadow: none;
  }

  > revealer image,
  > revealer spinner {
    padding: 3px 0;
  }

  > revealer label {
    padding: 3px 6px;
  }

  .keyboard {
    background-color: $panel_fg;
    border-radius: 2px;
    color: $panel_bg;
    padding: 0 3px;
    font-weight: normal;
    box-shadow: none;
    text-shadow: none;
  }
}

// Popover switcher dots
button.flat.toggle.switcher {
  &:hover, &:active, &:checked, &:selected {
    image {
      color: $selected_bg_color;
    }
  }
}

// Calendar Popover
.circular { // Calendar popover date button
  label:disabled { color: $disabled_fg_color; }

  &.accent { // Today button
    color: $selected_fg_color;
    background-color: $selected_bg_color;
  }
}

// Marlin / Pantheon Files
MarlinViewWindow {
  *:selected, *:selected:focus {
    color: $selected_fg_color;
    background-color: $selected_bg_color;
    outline-color: transparent;
  }

  GtkIconView.view:selected {
    &, &:focus, &:hover, &:focus:hover { background-color: transparent; }
  }

  FMListView, FMColumnView { outline-color: transparent; }
}

.marlin-pathbar.pathbar {
  padding-left: 4px;
  padding-right: 4px;

  @include entry(header-normal);
  &:focus { @include entry(header-focus) }
  &:disabled { @include entry(header-insensitive) }
}

window.background.csd {
  > paned.horizontal {
    > separator {
      &:dir(ltr) { margin-left: -1px; }
      &:dir(rtl) { margin-right: -1px; }
    }

    > scrolledwindow {
      > viewport.frame {
        > box.vertical treeview.view {

          border-right: 1px solid if($variant=='light', $solid_borders_color, $header_border);

          &:not(:hover):not(:selected) {
            border-bottom-left-radius: $wm_radius;
            background: none;
          }

          color: $dark_sidebar_fg;
          padding-top: 3px;
          padding-bottom: 3px;
          border-right: 1px solid $header_border;
          // @extend %view;

          &:not(:selected):hover { background-color: if($variant == 'light', rgba(black, 0.05), rgba(white, 0.05)); }

          &:selected, &:selected:hover, &:selected:focus {
            color: $fg_color;
            background-color: $sidebar_theme_color;
            &, label { color: $fg_color; }
          }

          image {
            color: $dark_sidebar_fg;
            &:selected { color: $selected_fg_color; }
            &:disabled { color: rgba($dark_sidebar_fg, 0.45); }
          }

          &.trough {
            color: $fg_color;
            background-color: $button_border;
            border-radius: $bt_radius;
            border-width: 0;

            &:selected, &:selected:focus {
              color: $selected_fg_color;
              background-color: transparentize(black, 0.8);
              border-radius: $bt_radius;
              border-width: 0;
            }
          }
        }
      }
    }
  }

  > stack > stack {
    > paned.horizontal {
      > scrolledwindow > viewport.frame {
        list {
          border-bottom-left-radius: $wm_radius;
        }
      }
    }
  }

  &.maximized, &.tiled, &.fullscreen {
    > stack > stack {
      > paned.horizontal {
        > scrolledwindow > viewport.frame {
          list {
            border-bottom-left-radius: $maximized_radius;
          }
        }
      }
    }
  }
}

.dynamic-notebook {
  > notebook {
    > stack {
      border-bottom-right-radius: $wm_radius;
      background-color: $base_color;

      scrolledwindow.view.h2 {
        background-color: transparent;
      }

      treeview.view,
      iconview.view {
        &:not(:hover):not(:selected) { background: none; }
        &:hover { background-color: if($variant == 'light', rgba(black, 0.05), rgba(white, 0.05)); }
        &:selected {
          color: $fg_color;
          background-color: if($variant == 'light', rgba(black, 0.1), rgba(white, 0.1));
        }
      }
    }

    treeview.view {
      > frame.cell {
        > entry {
          border-image-width: 0;
          background-color: $bg_color;

          &:focus { background-color: $base_color; }
        }

        > border { border: none; }
      }
    }
  }
}

headerbar.titlebar {
  > box.horizontal > entry.pathbar {
    min-height: 20px;
    padding: 2px 6px;
    margin-top: 0;
    margin-bottom: 0;
  }

  > button.flat.image-button.toggle:dir(ltr) {
    min-height: 0;
    margin-top: 8px;
    margin-bottom: 8px;

    &:not(:checked):not(:active) {
      background-clip: if($variant=='light', padding-box, padding-box);
    }

    @if $variant == 'light' {
      border-width: 1px;
      border-style: solid;
      border-color: $borders_color;
    }

    @include button(header-normal);
    &:hover { @include button(header-hover); }
    &:active { @include button(header-active); }
    &:checked { @include button(header-checked); }
    &:disabled { color: transparentize($header_fg, 0.4); }
    &:backdrop { opacity: 0.7; background-image: none;}

    + button.flat.image-button.toggle { margin-right: if($variant=='light', -6px, -5px); }
  }

  > .linked.raised > button.toggle {
    margin-top: 4px;
    margin-bottom: 4px;
  }

  // Hide Code header format-bar
  > grid.linked.horizontal.format-bar {
    margin-top: 6px;
    margin-bottom: 6px;
    border: none;

    button.toggle {
      margin-top: 0;
      margin-bottom: 0;
    }

    &:backdrop {
      transition: $backdrop_transition;
      background-image: none;
      background-color: $header_bg_backdrop;
    }
  }
}

// Gala
.gala-notification {
    border: 1px solid $dark_borders_color;
    border-radius: $wm_radius;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    background-image: _solid($osd_bg_color);
    background-color: transparent;

  .title, .label {
    color: $osd_fg_color;
  }
}

// system setting
actionbar.inline-toolbar {
  border: none;
  border-top: 1px solid $borders_color;

  button { // Reset buttons
    border-radius: $bt_radius;
    // border: 1px solid $dark_borders_color;

    &:first-child {
      border-right-style: solid;
    }

    &:last-child {
      border-left-style: solid;
    }
  }
}

// Nightlight warmth trough
scale.warmth trough {
  min-height: 4px;
  border-radius: 3px;
  background-image: linear-gradient(to right, $suggested_color, $destructive_color);
  box-shadow: inset 0 0 0 1px rgba(black, 0.25);
}

// Terminal
.terminal-window {
  headerbar.titlebar.default-decoration {
    background-color: $header_bg;
    border-bottom: 1px solid $header_border;
    box-shadow: inset 0 1px $highlight_color;

    &:backdrop {
      transition: $backdrop_transition;
      color: transparentize($header_fg, 0.3);
      background-image: none;
      background-color: $header_bg_backdrop;
      border-color: if($variant=='light', lighten($header_border, 15%), darken($header_border, 3%));
    }
  }

  .search-bar {
    background-color: $bg_color;
    border-bottom: 1px solid $solid_borders_color;
  }

  .dynamic-notebook {
    notebook > header { border-color: $solid_borders_color; }
  }
}