/*
 * Private DevOps design layer, hand-written part. Loaded after branding.css and the
 * generated design-palette.css, only when $pdoDesignState in the hook allows it.
 * Every rule is scoped to html.pdo-design, so switching the layer off removes it all.
 */

/* Link back to privatedevops.com, added to the footer notice by branding.js. */
html.pdo-design section#footer .pdo-site-link {
  color: var(--main-gradient-color);
  text-decoration: none;
  margin-left: 4px;
}

html.pdo-design section#footer .pdo-site-link:hover,
html.pdo-design section#footer .pdo-site-link:focus {
  text-decoration: underline;
}

/* Login box: a thin brand line on top and the site's rounder corners. */
html.pdo-design .logincontainer .wdes-block {
  border-top: 3px solid var(--main-gradient-color);
  border-radius: 12px;
}

/* Header separated from the page by a hairline, as on the main site. */
html.pdo-design.pdo-dark section#header {
  border-bottom: 1px solid #2e2860;
}

html.pdo-design.pdo-light section#header {
  border-bottom: 1px solid #e4e7ef;
}

/* Rounder buttons and panels, matching the site's 0.75rem radius. */
html.pdo-design .btn,
html.pdo-design .wdes-submit,
html.pdo-design .wdes-2nd-btn {
  border-radius: 10px;
}

html.pdo-design .panel {
  border-radius: 12px;
}