@import 'definitions';

// floating status bar
.floating-bar {
  background-color: themecolor(theme_base_color);
  border-width: 1px;
  border-style: solid solid none;
  border-color: themecolor(borders);
  border-radius: 3px 3px 0 0;

  &.left {
    border-left-style: none;
    border-top-left-radius: 0;
  }

  &.right {
    border-right-style: none;
    border-top-right-radius: 0;
  }

  &:backdrop {
    background-color: themecolor(theme_unfocused_base_color);
    border-color: themecolor(unfocused_borders);
  }
}

// incognito mode
.incognito-mode {
  headerbar {
    background-image: -gtk-icontheme($incognito_icon);
    background-repeat: no-repeat;
    background-position: 157px 0;
    background-size: 64px 64px;
    color: rgba(0, 0, 0, 0.35);
  }
}

// automation mode
.automation-mode {
  headerbar {
    background-color: $automation_color;
    color: rgba(0, 0, 0, 0.35);
  }
}

// entry icons
.entry_icon_box {
  margin-left: 2px;
  margin-right: 5px;

  &:dir(rtl) {
    margin-left: 5px;
    margin-right: 2px;
  }
}

.entry_icon {
  color: #{"mix(" + themecolor(theme_fg_color) + ", " + themecolor(theme_base_color) + ", 0.2)"};
  margin: 0 4px;

  &:hover {
    color: themecolor(theme_fg_color);
  }

  &:active {
    color: themecolor(theme_selected_bg_color);
  }

  &:backdrop {
    color: #{"mix(" + themecolor(theme_unfocused_fg_color) + ", " + themecolor(theme_unfocused_base_color) + ", 0.2)"};
  }

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

  // Bookmarks
  &.starred {
    color: orange;
  }
}

.bookmarks-row {
  button {
    opacity: 0.25;
  }

  &:hover {
    button {
      opacity: 1;
    }
  }
}

.bookmark-tag-widget {
  padding-left: 8px;
  background-color: rgba(0, 0, 0, .1);
  border-radius: 3px;

  label {
    padding-left: 8px;
    padding-right: 8px;
  }

  image,
  label,
  button:hover image {
    // FIXME: This should be theme_text_color, but HighContrast doesn't export it
    color: themecolor(theme_fg_color);
  }
}

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

  image,
  label,
  button:hover image {
    color: themecolor(theme_selected_fg_color);
  }
}

// "Press $KEY to exit fullscreen" overlay text
#fullscreen-popup {
  padding: 12px;
  border-radius: 18px;
  background: rgba(0, 0, 0, 0.65);
  color: white;
}

.url_progress {
  border: none;
  background-color: transparent;
  background-image: none;
  padding-top: 0px;
  padding-bottom: 0px;
  margin-top: 0px;
  margin-bottom: 6px;

  progress {
    background-color: themecolor(theme_selected_bg_color);
    background-image: none;
    border: none;
    min-height: 2px;
  }

  trough {
    border: none;
    background-color: transparent;
    background-image: none;
  }
}

.tab-attention {
  background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(themecolor(theme_selected_bg_color)), to(transparent));
  background-size: 6px 6px;
  background-repeat: no-repeat;
  background-position: center bottom;
}

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

.search-entry-occurrences-tag {
  background: none;
  color: gtkalpha(themecolor(theme_fg_color), 0.5);
  box-shadow: none;
  border: none;
  margin: 2px;
  padding: 2px;

  &:backdrop {
    color: gtkalpha(themecolor(theme_unfocused_fg_color), 0.5);
  }
}

dzlsuggestionpopover > revealer > box > elastic > scrolledwindow > viewport > list > row > grid {
  margin-left: 3px;

  .title, .subtitle {
    margin-left: 6px;
  }
}

.download_progress {
  progress {
    min-height: 2px;
  }

  trough {
    min-width: 14px;
  }
}
