/*
Theme Name: REG Helpdesk
Theme URI: https://helpdesk.cb-reg.com/
Description: Child theme for StanleyWP. Modernises the REG Helpdesk without
             touching the 2014 parent theme, which has no upstream and cannot
             be updated. Switching back to StanleyWP reverts everything.
Author: Coldwell Banker REG Technology Department
Template: stanleywp
Version: 1.0.0
License: GNU General Public License v3
*/

/* ---------------------------------------------------------------------------
   Design tokens. Navy sampled from the official CB REG artwork (#212c65) -
   note the signature generator's #1a2954 is NOT the brand colour.
   --------------------------------------------------------------------------- */
:root{
  --reg-navy:#212c65;
  --reg-navy-dark:#1a2350;
  --reg-navy-lift:#2d3a7d;
  --reg-ink:#171a2b;
  --reg-ink-2:#414761;
  --reg-ink-3:#6d7490;
  --reg-paper:#f4f6fb;
  --reg-surface:#ffffff;
  --reg-surface-2:#eef1f8;
  --reg-line:#dce1ee;
  --reg-line-soft:#e9ecf5;
  --reg-accent:#b3892f;
  --reg-radius:8px;
  --reg-shadow:0 1px 3px rgba(23,26,43,.06), 0 6px 18px rgba(23,26,43,.05);
  --reg-measure:70ch;
}

/* ---------------------------------------------------------------------------
   Base
   --------------------------------------------------------------------------- */
body{
  background:var(--reg-paper);
  color:var(--reg-ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--reg-navy-lift)}
a:hover,a:focus{color:var(--reg-navy)}
:focus-visible{outline:2px solid var(--reg-navy-lift);outline-offset:2px}
img{max-width:100%;height:auto}

/* ---------------------------------------------------------------------------
   Masthead + navigation. The parent ships Bootstrap 3 navbar-inverse; this
   restyles it rather than replacing the markup, so the nav walker keeps working.
   --------------------------------------------------------------------------- */
.navbar.navbar-inverse{
  background:var(--reg-navy);
  border:0;
  border-radius:0;
  margin-bottom:0;
  min-height:64px;
  box-shadow:0 1px 0 rgba(0,0,0,.10);
}
.navbar-inverse .navbar-brand{
  color:#fff;font-weight:600;letter-spacing:.02em;
  height:auto;padding:20px 16px;
}
.navbar-inverse .navbar-brand:hover{color:#fff}
.reg-brand{display:flex;align-items:center;gap:14px;padding:14px 0 14px 15px;float:left}
.reg-brand img{height:34px;width:auto;display:block}
.reg-brand .reg-brand-txt{
  color:#fff;font-size:14px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;
  padding-left:14px;border-left:1px solid rgba(255,255,255,.28);white-space:nowrap;
}

.navbar-inverse .navbar-nav > li > a{
  color:#c8d0ea;font-size:13.5px;font-weight:500;letter-spacing:.01em;
  padding:22px 13px;transition:color .15s,background .15s;
}
.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus{color:#fff;background:rgba(255,255,255,.08)}
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:hover,
.navbar-inverse .navbar-nav > .open > a:focus,
.navbar-inverse .navbar-nav > .active > a{background:var(--reg-navy-lift);color:#fff}

.navbar-inverse .dropdown-menu{
  background:var(--reg-surface);border:1px solid var(--reg-line);
  border-radius:0 0 var(--reg-radius) var(--reg-radius);
  box-shadow:var(--reg-shadow);padding:6px;min-width:260px;
  max-height:70vh;overflow-y:auto;
}
.navbar-inverse .dropdown-menu > li > a{
  color:var(--reg-ink-2);font-size:13.5px;padding:8px 12px;border-radius:5px;white-space:normal;line-height:1.45;
}
.navbar-inverse .dropdown-menu > li > a:hover,
.navbar-inverse .dropdown-menu > li > a:focus{background:var(--reg-surface-2);color:var(--reg-navy)}

.navbar-inverse .navbar-toggle{border-color:rgba(255,255,255,.35);margin-top:15px}
.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus{background:rgba(255,255,255,.12)}
.navbar-inverse .navbar-toggle .icon-bar{background:#fff}

/* ---------------------------------------------------------------------------
   Content
   --------------------------------------------------------------------------- */
#ww{padding:34px 0 50px}
#ww .container > .row > [class*="col-"]{float:none;margin:0 auto;width:100%;max-width:900px}

article.hentry,
article[class*="post-"]{
  background:var(--reg-surface);
  border:1px solid var(--reg-line);
  border-radius:var(--reg-radius);
  box-shadow:var(--reg-shadow);
  padding:34px 38px 30px;
}
article > header{border-bottom:1px solid var(--reg-line-soft);padding-bottom:16px;margin-bottom:22px}
article > header h1{
  font-size:29px;line-height:1.25;font-weight:600;color:var(--reg-ink);
  margin:0;letter-spacing:-.01em;text-wrap:balance;
}

.post-entry{font-size:16px;color:var(--reg-ink-2)}
.post-entry > p,.post-entry > ul,.post-entry > ol{max-width:var(--reg-measure)}
.post-entry h2{font-size:21px;font-weight:600;color:var(--reg-ink);margin:32px 0 12px;line-height:1.3}
.post-entry h3{font-size:17px;font-weight:600;color:var(--reg-ink);margin:26px 0 10px}
.post-entry h2:first-child,.post-entry h3:first-child{margin-top:0}
.post-entry p{margin:0 0 15px}
.post-entry ul,.post-entry ol{margin:0 0 18px;padding-left:24px}
.post-entry li{margin-bottom:7px}
.post-entry strong{color:var(--reg-ink);font-weight:600}
.post-entry a{text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}

/* Screenshots: the corpus is a screenshot between nearly every step. */
.post-entry img{
  border:1px solid var(--reg-line);border-radius:6px;background:var(--reg-surface);
  margin:8px 0 18px;display:block;
}
.post-entry a > img{transition:border-color .15s,box-shadow .15s}
.post-entry a:hover > img{border-color:var(--reg-navy-lift);box-shadow:var(--reg-shadow)}

/* Several pages use tables purely for layout and blow out the page width. */
.post-entry table{
  width:100%!important;height:auto!important;max-width:100%;
  border-collapse:collapse;margin:0 0 20px;font-size:14.5px;
}
.post-entry table td,.post-entry table th{
  border:1px solid var(--reg-line);padding:9px 11px;vertical-align:top;height:auto!important;
}
.post-entry table th{background:var(--reg-surface-2);font-weight:600;color:var(--reg-ink);text-align:left}
.reg-table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 20px}
.reg-table-scroll > table{margin:0}

.post-entry iframe{max-width:100%;border:1px solid var(--reg-line);border-radius:6px}
.post-entry blockquote{
  border-left:3px solid var(--reg-navy);background:var(--reg-surface-2);
  padding:12px 18px;margin:0 0 18px;font-size:15px;color:var(--reg-ink-2);
}
.post-entry code{
  background:var(--reg-surface-2);padding:2px 6px;border-radius:4px;font-size:14px;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--reg-ink);
}
.post-entry hr{border:0;border-top:1px solid var(--reg-line);margin:28px 0}

.article-footer{margin-top:26px;padding-top:14px;border-top:1px solid var(--reg-line-soft)}
.post-edit a{font-size:12.5px;color:var(--reg-ink-3);text-decoration:none}
.post-edit a:hover{color:var(--reg-navy)}
.author-avatar{display:none}

/* ---------------------------------------------------------------------------
   Footer
   --------------------------------------------------------------------------- */
#footer{background:var(--reg-navy-dark);color:#aeb8d8;padding:34px 0 26px;margin-top:0;border:0}
#footer h4{color:#fff;font-size:12px;text-transform:uppercase;letter-spacing:.09em;
  padding-bottom:10px;margin:0 0 12px;border-bottom:1px solid rgba(255,255,255,.14)}
#footer a{color:#d3daf0}
#footer a:hover{color:#fff}
#footer ul{list-style:none;padding:0;margin:0}
#footer li{margin-bottom:7px;font-size:13.5px}

/* ---------------------------------------------------------------------------
   Search form
   --------------------------------------------------------------------------- */
.searchform input[type="text"],.post-entry input[type="text"]{
  border:1px solid var(--reg-line);border-radius:6px;padding:9px 12px;font-size:14px;
  background:var(--reg-surface);color:var(--reg-ink);
}
.searchform input[type="text"]:focus{border-color:var(--reg-navy);outline:none}

/* ---------------------------------------------------------------------------
   Responsive. The parent's Bootstrap 3 collapses at 768px.
   --------------------------------------------------------------------------- */
@media (max-width:767px){
  body{font-size:15.5px}
  #ww{padding:18px 0 34px}
  article.hentry,article[class*="post-"]{padding:22px 18px;border-radius:6px}
  article > header h1{font-size:23px}
  .reg-brand{padding:12px 0 12px 15px;gap:10px}
  .reg-brand img{height:26px}
  .reg-brand .reg-brand-txt{display:none}
  .navbar-inverse .navbar-nav > li > a{padding:11px 15px}
  .navbar-inverse .navbar-collapse{border-top-color:rgba(255,255,255,.12);max-height:78vh}
  .navbar-inverse .dropdown-menu{background:transparent;border:0;box-shadow:none;padding-left:12px}
  .navbar-inverse .dropdown-menu > li > a{color:#b9c2e0}
  .navbar-inverse .dropdown-menu > li > a:hover{background:rgba(255,255,255,.08);color:#fff}
  .post-entry table{font-size:13.5px}
}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

@media print{
  .navbar,#footer,.post-edit,.navbar-toggle{display:none!important}
  article.hentry{border:0;box-shadow:none;padding:0}
  body{background:#fff}
}