$variant: 'light';

@import 'shared-base';

.page-menu-contents {
  margin-left: 0px;
  margin-right: 0px;
  margin-bottom: 6px;
}

.page-menu-zoom-box {
  margin-bottom: 6px;
}

// Ensure the entry is at least as tall as the icons
.url_entry {
  min-height: 16px;
}

// entry icons
.entry_icon_box {
  margin-left: 3px;
  margin-right: 1px;

  &:dir(rtl) {
    margin-left: 1px;
    margin-right: 3px;
  }
}

.entry_icon {
  margin: 0 3px;
  color: themecolor(internal_element_color);
  transition: all 200ms ease-in-out;
  -gtk-icon-palette: needs-attention themecolor(attention_color),
                     success themecolor(LIME_500),
                     warning shade(themecolor(BANANA_700), 1.25),
                     error themecolor(error_color);

  &:hover, &:active {
    color: themecolor(text_color);
  }

  &:backdrop {
    color: themecolor(insensitive_color);
  }

  // Reader mode
  &.selected {
    color: themecolor(colorAccent);
  }

  // Bookmarks
  &.starred {
    color: themecolor(BANANA_500);
  }
}

.main-notebook {
  tab {
    min-width: 30px;
  }
}

// FIXME: this should be in libdazzle
dzlsuggestionpopover > revealer > box {
  // Fix background and shadow
  margin: 12px;
  border: none;
  background: themecolor(theme_base_color);
  border-radius: 3px;
  box-shadow: 0 0 0 1px gtkalpha(#000, 0.2),
              0 3px 6px gtkalpha(#000, 0.16),
              0 3px 6px gtkalpha(#000, 0.23);

  // Fix selected row color
  > elastic > scrolledwindow > viewport > list > row:selected .title {
    color: themecolor(theme_fg_color);
  }
}

// floating status bar
.floating-bar {
  border: none;
  box-shadow: 0 1px 3px gtkalpha(#000, 0.12),
              0 1px 2px gtkalpha(#000, 0.24);
  padding: 2px 0;
  margin: 6px;

  &, &:backdrop {
    background: gtkalpha(#222, 0.9);
  }

  &, &.left, &.right {
    border-radius: 3px;
  }

  &, & label {
    color: #fff;
    text-shadow: 0 1px 2px gtkalpha(#000, 0.6);
  }
}

#title-box-container {
  color: themecolor(text_shadow_color);

  > clamp {
    color: themecolor(theme_fg_color);

    &:backdrop {
      color: themecolor(theme_unfocused_fg_color);
    }
  }
}

.bookmark-tag-widget image {
  -gtk-icon-shadow: none;
}

.bookmark-tag-widget-selected {
  background-color: themecolor(colorAccent);
}

// Back and forward are not linked on elementary
.navigation-box button:not(:last-child) {
  margin-right: 6px;
}

// Style the progress bar similarly to plank ones
.download_progress {
  margin: 1px;

  progress, trough {
    border-radius: 999px;
    min-height: 3px;
  }

  progress {
    background: gtkalpha(#fff, 0.8);
    border: none;
    box-shadow: inset 1px 1px gtkalpha(#000, 0.1),
                inset -1px -1px gtkalpha(#000, 0.1);
    margin: 0px;

    &:backdrop {
      background: gtkalpha(#fff, 0.75);
    }
  }

  trough {
    background: linear-gradient(to bottom,
                                gtkalpha(#222, 0.85),
                                gtkalpha(#222, 0.75));
    border: 1px solid gtkalpha(#222, 0.95);
    box-shadow: none;

    &:backdrop {
      background: gtkalpha(#333, 0.4);
      border: 1px solid gtkalpha(#333, 0.45);
    }
  }
}

.download_icon {
  // Shift the icon up a bit
  -gtk-icon-transform: translateY(-2px);
}