/**
 * @file
 * Styles used by the Upgrade Status module.
 */

.drupal-upgrade-status-form .button {
  margin-left: 0;
}
[dir="rtl"] .drupal-upgrade-status-form .button {
  margin-left: inherit;
  margin-right: 0;
}

.upgrade-status-overview {
  border: 1px solid #ccc;
}
.upgrade-status-overview tr:hover {
  color: inherit;
  background-color: inherit;
}
.upgrade-status-overview td a:hover {
  color: inherit;
}
.upgrade-status-overview th {
  background-color: #f5f5f2;
  border: 1px solid #ccc;
  width: 33%;
}
.upgrade-status-overview td {
  vertical-align: top;
  border: 1px solid #ccc;
}
.upgrade-status-overview td .item-list ul li {
  list-style-type: square;
}
.upgrade-status-overview td:nth-child(3) .item-list ul li {
  margin-right: 6em;
}

.upgrade-status-summary > summary,
.upgrade-status-summary-environment > summary {
  background-color: #f5f5f2;
  margin: 0 0 1em 0;
  border-bottom: 1px solid #ccc;
}

.upgrade-status-summary table,
.upgrade-status-summary-environment table {
  margin-top: 1.2em;
}

.upgrade-status-summary-environment th.requirement-label {
  width: 70%;
}
.upgrade-status-summary-environment th.status-info {
  width: 30%;
}

.upgrade-status-summary th {
  width: 8%;
}
.upgrade-status-summary th.project-label {
  width: 20%;
}
.upgrade-status-summary th.plan-info {
  width: 24%;
}

.upgrade-status-summary-environment td.requirement-label,
.upgrade-status-summary td.project-label {
  font-weight: bold;
}

.upgrade-status-error-list tr > td.status-info,
.upgrade-status-summary tr > td.status-info,
.upgrade-status-summary-environment tr > td.status-info {
  padding-left: 35px; /* LTR */
  background-repeat: no-repeat;
  background-position-x: 10px; /* LTR */
  background-position-y: center;
}

[dir="rtl"] .upgrade-status-error-list tr > td.status-info,
[dir="rtl"] .upgrade-status-summary tr > td.status-info,
[dir="rtl"] .upgrade-status-summary-environment tr > td.status-info {
  padding-left: 0;
  padding-right: 35px; /* LTR */
  /* @todo x background position for RTL */
}

.upgrade-status-error-list tr.known-errors,
.upgrade-status-next-step-rector tr,
.upgrade-status-next-step-manual tr,
.upgrade-status-summary-environment tr.known-error,
.upgrade-status-summary-label-rector,
.upgrade-status-summary-label-manual {
  background-color: #fcf4f2;
  color: #a51b00;
}

.upgrade-status-error-list tr.known-errors > td.status-info,
.upgrade-status-summary-environment tr.known-error > td.status-info {
  background-image: url(../icons/error.svg);
}

.upgrade-status-error-list tr.known-warnings,
.upgrade-status-next-step-update tr,
.upgrade-status-next-step-remove tr,
.upgrade-status-summary-environment tr.known-warning,
.upgrade-status-summary-label-update,
.upgrade-status-summary-label-remove {
  background-color: #fdf8ed;
  color: #734c00;
}

.upgrade-status-error-list tr.known-warnings > td.status-info,
.upgrade-status-summary td.status-info-incompatible,
.upgrade-status-summary-environment tr.known-warning > td.status-info {
  background-image: url(../icons/warning.svg);
}

.upgrade-status-error-list tr.known-later > td.status-info,
.upgrade-status-summary td.status-info-na {
  background-image: url(../icons/ex.svg);
}

.upgrade-status-error-list tr.no-known-error,
.upgrade-status-next-step-relax tr,
.upgrade-status-summary-environment tr.no-known-error,
.upgrade-status-summary-label-relax {
  background-color: #f3faef;
  color: #325e1c;
}

.upgrade-status-error-list tr.no-known-error > td.status-info,
.upgrade-status-summary td.status-info-compatible,
.upgrade-status-summary-environment tr.no-known-error > td.status-info {
  background-image: url(../icons/check.svg);
}

.upgrade-status-error-list tr.rector-covered,
.upgrade-status-next-step-collaborate tr,
.upgrade-status-summary-label-collaborate {
  background-color: #f0f8ff;
  color: #000;
}

.upgrade-status-error-list tr.rector-covered > td.status-info {
  background-image: url(../icons/wrench.svg);
}

.upgrade-status-summary td.status-info-unchecked {
  background-image: url(../icons/questionmark-disc.svg);
}

.list-description {
  margin-bottom: 1em;
}

.upgrade-status-summary-label {
  padding: 3px 5px;
  border-radius: 3px;
}

.upgrade-status-result-circle {
  display: block;
  margin: 0 0 1em 1em;
  height: 5em;
  float: right;
}
.upgrade-status-result-circle .circle-bg {
  fill: none;
  stroke: #f5f5f2;
  stroke-width: 3.8;
}
.upgrade-status-result-circle .circle {
  fill: none;
  stroke-width: 2.8;
  stroke-linecap: round;
  animation: progress 1s ease-out forwards;
  stroke: #325e1c;
}
.upgrade-status-result-circle .percentage {
  font-size: 0.5em;
  text-anchor: middle;
  font-weight: bold;
}

.upgrade-status-ok-label,
.upgrade-status-error-label {
  margin-left: 1em;
  padding: 3px;
  border-radius: 3px;
  background-color: #fb8800;
  color: #fff;
  font-size: 11px;
  white-space: nowrap;
}
.upgrade-status-ok-label {
  background-color: #7bae4a;
}
.upgrade-status-space {
  margin: 0.5em 0;
}
.upgrade-status-space .upgrade-status-error-label,
.upgrade-status-space .upgrade-status-ok-label {
  margin-left: 0;
}

h3.upgrade-status-group {
  margin: 30px 0 0 0;
}
div.upgrade-status-description {
  margin-bottom: 10px;
}
.upgrade-status-error-list tr td:nth-child(1),
.upgrade-status-error-list tr td:nth-child(3) {
  width: 40%;
}
.upgrade-status-error-list tr td:nth-child(2) {
  width: 10%;
}