@import "./tab-bar.common";
@import "../../themes/native/native.globals";

:host {
  z-index: $z-index-toolbar;
}

:host(.ion-color) ::slotted(ion-tab-button) {
  --background-focused: #{current-color(shade)};
  --color-selected: #{current-color(contrast)};
}

:host(.ion-color) ::slotted(.tab-selected) {
  color: #{current-color(contrast)};
}

:host(.ion-color),
:host(.ion-color) ::slotted(ion-tab-button) {
  color: #{current-color(contrast, 0.7)};
}

:host(.ion-color),
:host(.ion-color) ::slotted(ion-tab-button) {
  background: #{current-color(base)};
}