/*
 * Copyright (c) 2018-2024 Red Hat, Inc.
 * This program and the accompanying materials are made
 * available under the terms of the Eclipse Public License 2.0
 * which is available at https://www.eclipse.org/legal/epl-2.0/
 *
 * SPDX-License-Identifier: EPL-2.0
 *
 * Contributors:
 *   Red Hat, Inc. - initial API and implementation
 */

body {
  overflow: hidden;
}

.pf-c-form {
  --pf-c-form--m-horizontal__group-label--md--GridColumnWidth: 11rem;
}

.page-description {
  min-height: 30px;
  padding: 5px 25px;

  font-size: 14px;
  color: #6e6e6e;

  background-color: #ededed;
  border-top: 1px solid #cbcbcb;
  border-bottom: 1px solid #cbcbcb;
}

.page-description a {
  margin-left: 5px;
  color: #4a90e2;
}

div.tippy-popper a {
  pointer-events: initial;
}

div.tippy-popper a:not(:hover) {
  --pf-global--link--Color: #73bcf7;
}

div.tippy-popper a:hover {
  --pf-global--link--Color: #2b9af3;
}

div.main-page-loader {
  position: absolute;
  z-index: 80;
  inset: 0;

  margin: auto;

  font-family: Helvetica, Arial, sans-serif;
  font-size: 24px;
  color: #fff;

  background-color: #000;
}

div.main-page-loader .ide-page-loader-content img {
  position: absolute;
  inset: 0;

  max-width: 140px;
  max-height: 140px;
  margin: auto;

  animation-name: opacity;
  animation-duration: 2s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}

@keyframes opacity {
  0%,
  100% {
    opacity: 0;
  }

  50% {
    opacity: 1;
  }
}

.ide-page-frame {
  width: 100%;
  height: 100%;
  border: none;
}

.page-label {
  font-size: 20px;
  color: #353e50;
  text-align: center;
}

.header-buttons .pf-c-button {
  padding: 0 15px;

  font-size: 14px;
  font-weight: 400;
  line-height: 36px;
  color: #fff;

  background-color: #4a90e2;
  border-radius: 2px;
}

.header-buttons + section.pf-c-page__main-section {
  padding-top: 0;
  border-top: 1px solid #e4e4e4;
}

.show-header {
  animation-name: show;
  animation-duration: 0.1s;
  animation-timing-function: linear;
}

@keyframes show {
  0% {
    overflow: hidden;
    min-height: 0;
    max-height: 0;
  }

  100% {
    overflow: visible;
    min-height: 57px;
    max-height: 57px;
  }
}

.hide-header {
  overflow: hidden;

  min-height: 0;
  max-height: 0;

  animation-name: hide;
  animation-duration: 0.1s;
  animation-timing-function: linear;
}

.pf-c-page__header-brand-link .pf-c-brand {
  height: 3.17rem;
}

@keyframes hide {
  0% {
    overflow: visible;
    min-height: 57px;
    max-height: 57px;
  }

  100% {
    overflow: hidden;
    min-height: 0;
    max-height: 0;
  }
}
