/* === initialViews header === */
html[device="ua-tv"][open="home"] .initialViews,
html[device="ua-tv"][open="movieMedia"] .initialViews,
html[device="ua-tv"][open="tvMedia"] .initialViews {
  display: flex;
}

html:not([device="ua-tv"]) .initialViews {
  display: flex;
}

.initialViews {
  flex-direction: column;
  position: relative;
}

.initialViews #header .container {
  display: flex;
  align-items: center;
  height: 100%;
}

@media screen and (max-width: 480px) {
  .initialViews #header .container {
    justify-content: space-between;
  }
}

@media screen and (min-width: 480px) {
  .initialViews #header .container {
    gap: var(--gap-md);
  }
}

.initialViews #header .part {
  display: flex;
  align-items: center;
  gap: var(--gap-xs);
}

.initialViews #header .part.left .uibtn {
  filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.9));
}

.initialViews #header .part.left .uibtn:not(#backBtn) {
  font-weight: var(--font-weight-medium);
  text-transform: capitalize;
  font-size: var(--font-size-sm);
  /* padding: var(--gap-2xs) var(--gap-md); */
  height: max-content !important;
  /* border: var(--width-stroke) solid var(--text-primary); */
  border-radius: var(--radius-full) !important;
}

@media screen and (min-width: 481px) {
  .initialViews #header .part.right #mylistBtn {
    display: none;
  }
}