/* Copyright 2013 The Chromium Authors. All rights reserved.
 * Use of this source code is governed by a BSD-style license that can be
 * found in the LICENSE file.
 */

#debugging {
  display: flex;
  flex-flow: column;
  font-size: 16px;
  min-height: 423px;
  text-align: center;
  width: 722px;
}

#debugging .step-contents {
  margin: 80px 100px;
}

#debugging.setup-view .step-contents {
  margin-bottom: 40px;
  margin-top: 40px;
}

#debugging.done-view .step-contents,
#debugging.error-view .step-contents {
  margin: 80px;
}

#debugging #debugging-controls {
  height: auto;
  justify-content: center;
  margin-top: auto;
  padding-bottom: 80px;
  padding-right: 0;
  position: static;
}

#debugging.setup-view #debugging-controls {
  padding-bottom: 40px;
}

#debugging-controls button {
  margin: 0 10px;
}

#enable-debugging-icon {
  background-position: center;
  background-repeat: no-repeat;
  width: 100%;
}

.remove-protection-view #enable-debugging-icon,
.setup-view #enable-debugging-icon,
.wait-view #enable-debugging-icon {
  background-image: url(chrome://theme/IDR_RESET_WARNING);
  background-size: 39px 72px;
  height: 72px;
}

.done-view #enable-debugging-icon {
  background-image: url(chrome://theme/IDR_ENABLE_DEBUGGING_SUCCESS);
  background-size: 86px 66px;
  height: 66px;
}

.error-view #enable-debugging-icon {
  background-image: url(chrome://theme/IDR_ENABLE_DEBUGGING_FAILURE);
  background-size: 66px;
  height: 66px;
}

/** Preload icons */
#enable-debugging-icon::after {
  content:
    url(chrome://theme/IDR_RESET_WARNING)
    url(chrome://theme/IDR_ENABLE_DEBUGGING_SUCCESS)
    url(chrome://theme/IDR_ENABLE_DEBUGGING_FAILURE);
  display: none;
}

.enable-debugging-title {
  color: #464646;
  font-size: 24px;
  font-weight: bold;
  padding: 30px 45px;
}

.enable-debugging-text {
  color: #606060;
}

#debugging #debugging-warning-details,
#debugging #debugging-done-msg {
  padding: 20px 40px 0;
}

#debugging #enable-debugging-wait-msg {
  display: inline-block;
  padding: 25px 0;
  vertical-align: middle;
}

#enable-debugging-passwords {
  font-style: italic;
  margin-bottom: 10px;
  margin-top: 20px;
}

#enable-debugging-password-note {
  color: #c6c6c6;
  font-size: 12px;
}

.enable-debugging-password-input {
  align-items: center;
  display: flex;
  flex-direction: column;
  margin: 10px 0;
}

.enable-debugging-password-input input[type=password] {
  margin: 5px 0;
  width: 300px;
}

.enable-debugging-password-input
    input[type=password]::-webkit-input-placeholder {
  font-size: 14px;
  font-style: normal;
}

.done-specific,
.error-specific,
.remove-protection-specific,
.setup-specific,
.wait-specific {
  display: none;
}

.error-view .error-specific,
.done-view .done-specific,
.remove-protection-view .remove-protection-specific,
.setup-view .setup-specific,
.wait-view .wait-specific {
  display: block;
}

#debugging-remove-protection-button,
#debugging-enable-button,
#debugging-cancel-button,
#debugging-ok-button {
  display: none;
}

.remove-protection-view #debugging-remove-protection-button,
.remove-protection-view #debugging-cancel-button,
.setup-view #debugging-enable-button,
.setup-view #debugging-cancel-button,
.done-view #debugging-ok-button,
.error-view #debugging-ok-button {
  display: inline-block;
}

