/*
# This Source Code Form is subject to the terms of the Mozilla Public
# License, v. 2.0. If a copy of the MPL was not distributed with this
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
*/

@import url("base.css");
@import url("border.css");

:root {
  --tab-like-surface: ThreeDFace;
  --tab-surface-regular: var(--tab-like-surface);
  --tab-surface-active: Highlight;
  --tab-surface-hover: var(--tab-like-surface);
  --tab-text-regular: ButtonText;
  --tab-text-active: HighlightText;
  --tab-text-hover: ButtonText;
  --tab-text-inverted: CaptionText;
  --tab-border: ButtonShadow;
  --tab-dropmarker: ButtonText;
}


/* Tab Bar */

:root,
#background {
  background: AppWorkspace;
}

#background::after {
  background: CaptionText;
  opacity: 0.35;

  bottom: 0;
  content: "";
  left: 0;
  margin: 0;
  overflow: hidden;
  padding: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 20;
}


/* Tab */

tab-item,
.after-tabs button {
  background: var(--tab-surface);
  color: var(--tab-text);
}

tab-item * {
  color: var(--tab-text);
}

tab-item:not(.collapsed):hover,
.after-tabs button:hover {
  opacity: 0.7;
  /*mix-blend-mode: multiply;*/
}

tab-item.active {
  --throbber-color: HighlightText;
  --tab-border: Highlight;
  --tab-surface: var(--tab-surface-active);
  --tab-text: var(--tab-text-active);
  --tab-text-inverted: var(--tab-surface-active);
}

tab-item:not(.active) {
  --throbber-color: Highlight;
}

.newtab-button-box {
  border-color: var(--tab-border);
  border-style: solid;
  border-width: 1px;
}


/* tab-closebox */

tab-item tab-closebox:hover {
  --tab-text: HighlightText;
  opacity: 0.75;
}
tab-item tab-closebox:hover::before {
  --tab-text: Highlight;
  border-radius: 0;
  height: calc(var(--svg-small-icon-size) + 0.3em);
  margin-left: -0.15em;
  margin-top: -0.15em;
  opacity: 1;
  width: calc(var(--svg-small-icon-size) + 0.3em);
}

tab-item.active tab-closebox:hover {
  --tab-text: Highlight;
  opacity: 0.5;
}
tab-item.active tab-closebox:hover::before {
  --tab-text: HighlightText;
}

/* macOS workaround */
:root.platform-mac #tabbar:dir(rtl).overflow tab-item:not(.pinned) {
  padding-left: var(--scrollbar-placeholder-size); /* it will be enough larger than the default padding */
}
:root.platform-mac #tabbar:dir(ltr).overflow tab-item:not(.pinned) {
  padding-right: var(--scrollbar-placeholder-size); /* it will be enough larger than the default padding */
}


/* hide regular active tab marker */
tab-item:not(.bundled-active) .highlighter::before {
  display: none !important;
}

tab-item.bundled-active:not(.highlighted) .highlighter::before {
  opacity: 1;
}
