/* What When Where - Help Scout Docs theme.
   Matches whatwhenwhere.com.au: charcoal header, Lato, orange accents.
   Text links use the darker orange (#9c4400): the bright brand orange is only
   2.9:1 on white, below the WCAG 4.5:1 minimum for text, so it is kept for
   borders, focus rings and buttons. !important beats Help Scout's inline colours. */

body, input, button, select, textarea,
.navbar, #fullArticle, #fullArticle p, #fullArticle li {
  font-family: "Lato", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif !important;
}
body { background: #ffffff !important; color: #383838; }

/* Header */
.navbar .navbar-inner {
  background: #333333 !important;
  border: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}
.navbar .brand { color: #ffffff !important; font-weight: 900; letter-spacing: -0.01em; }
.navbar .brand img { max-height: 36px; width: auto; }
.navbar .nav li a { color: rgba(255, 255, 255, 0.85) !important; font-weight: 700; text-shadow: none !important; }
.navbar .nav li a:hover,
.navbar .nav li a:focus,
.navbar .nav .active a {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.1) !important;
  border-radius: 999px;
}
.navbar .btn-navbar { background: rgba(255, 255, 255, 0.1) !important; border: 0 !important; box-shadow: none !important; }
.navbar .btn-navbar .icon-bar { background: #ffffff !important; box-shadow: none !important; }

/* Search hero (home page) */
#docsSearch {
  background: #333333 !important;
  border: 0 !important;
  padding: 48px 20px 56px !important;
  margin-bottom: 32px;
}
#docsSearch h1 { color: #ffffff !important; font-weight: 900; letter-spacing: -0.02em; }
#searchBar .search-query {
  border-radius: 999px !important;
  border: 2px solid transparent !important;
  box-shadow: none !important;
  padding-left: 20px !important;
  font-size: 16px !important; /* 16px stops iPhone zooming in on tap */
}
#searchBar .search-query:focus { border-color: #f47100 !important; }
/* The sidebar search on article pages has a small icon button inside the box:
   only the big home-page search gets the orange button. */
#sidebar .search-query { border: 1px solid #dfdfdf !important; background: #ffffff !important; }
#docsSearch #searchBar button {
  background: #f47100 !important;
  border: 0 !important;
  border-radius: 0 999px 999px 0 !important;
  color: #ffffff !important;
  text-shadow: none !important;
  box-shadow: none !important;
}
.navbar #searchBar .search-query { background: rgba(255, 255, 255, 0.95) !important; }

/* Collection headings on the home page (Standard Users, Content Contributors...) */
.collection-category h2 { color: #383838 !important; font-weight: 900; letter-spacing: -0.02em; }

/* Category cards (home page) */
.category-list .category {
  border: 1px solid #dfdfdf !important;
  border-radius: 16px !important;
  box-shadow: none !important;
  transition: border-color 0.15s, transform 0.15s;
}
.category-list .category:hover { border-color: #f47100 !important; transform: translateY(-2px); }
.category-list .category h3 { color: #383838 !important; font-weight: 900; }
.category-list .category p { color: #545454 !important; }
.category-list .category .article-count { color: #9c4400 !important; font-weight: 700; }

/* Links */
.contentWrapper a,
.collection a,
.most-pop-articles .popArticles a,
#fullArticle a,
#fullArticle strong a,
#fullArticle a strong,
#serp-dd .result a:hover { color: #9c4400 !important; }
#fullArticle a { text-decoration: underline; text-underline-offset: 2px; }

/* Category and article lists */
#categoryHead h1, .contentWrapper h1 { color: #383838 !important; font-weight: 900; letter-spacing: -0.02em; }
.articleList li a { font-weight: 700; }
.articleList li a:hover span { text-decoration: underline; }

/* Sidebar */
#sidebar .nav-list a { color: #545454 !important; border-radius: 10px; }
#sidebar .nav-list .active a,
#sidebar .nav-list a:hover { color: #9c4400 !important; background: #fef1e6 !important; }
#sidebar h3 { color: #6b6b6b !important; text-transform: uppercase; letter-spacing: 0.08em; font-size: 12px; }

/* Article */
#fullArticle .title { color: #383838 !important; font-weight: 900; letter-spacing: -0.02em; line-height: 1.15; }
#fullArticle,
#fullArticle p,
#fullArticle ul,
#fullArticle ol,
#fullArticle li { color: #383838 !important; line-height: 1.65; }
#fullArticle h2, #fullArticle h3 { color: #383838; font-weight: 900; margin-top: 1.6em; }
#fullArticle img {
  border: 1px solid #dfdfdf;
  border-radius: 12px;
  max-width: 100%;
  height: auto;
}
#fullArticle blockquote {
  background: #fef1e6;
  border-left: 4px solid #f47100 !important;
  border-radius: 0 12px 12px 0;
  padding: 14px 18px !important;
  color: #383838 !important;
}
#fullArticle code { background: #f2f2f2; border: 0; border-radius: 6px; color: #383838; }
#fullArticle table { border-radius: 12px; overflow: hidden; }
#fullArticle th { background: #f2f2f2; }

/* Help Scout callouts */
.callout, .callout-blue, .callout-yellow, .callout-green, .callout-red { border-radius: 12px !important; }
.callout-yellow { background: #fef1e6 !important; border-color: #f47100 !important; }

/* Article footer: "Still need help? Contact Us" and the date are italic serif by default */
.articleFoot .help, .articleFoot a, .articleFoot time { font-family: "Lato", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif !important; font-style: normal !important; }
#sbContact, #sbContactMobile { color: #9c4400 !important; font-weight: 700; }
.articleRatings { border-radius: 16px; }

/* Keyboard focus: always visible */
a:focus-visible, button:focus-visible, input:focus-visible, .btn:focus-visible {
  outline: 3px solid #f47100 !important;
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .category-list .category { transition: none; }
  .category-list .category:hover { transform: none; }
}

/* Category icons (home page cards). Material Icons shapes, drawn inline: no
   font or extra request. Matched on the end of the card link (/category/NN-<name>), so they survive
   a category being recreated; renaming a category or adding one needs its line here. */
.category-list .category::before {
  content: "";
  display: block;
  width: 56px;
  height: 56px;
  margin: 0 auto 12px;
  border-radius: 50%;
  background: #fef1e6 center / 28px no-repeat;
}
.category-list .category[href$="-staying-up-to-date"]::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20fill%3D'%23f47100'%20d%3D'M12%2022c1.1%200%202-.9%202-2h-4c0%201.1.89%202%202%202zm6-6v-5c0-3.07-1.64-5.64-4.5-6.32V4c0-.83-.67-1.5-1.5-1.5s-1.5.67-1.5%201.5v.68C7.63%205.36%206%207.92%206%2011v5l-2%202v1h16v-1l-2-2z'%2F%3E%3C%2Fsvg%3E"); } /* Staying up to date */
.category-list .category[href$="-your-account"]::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20fill%3D'%23f47100'%20d%3D'M12%2012c2.21%200%204-1.79%204-4s-1.79-4-4-4-4%201.79-4%204%201.79%204%204%204zm0%202c-2.67%200-8%201.34-8%204v2h16v-2c0-2.66-5.33-4-8-4z'%2F%3E%3C%2Fsvg%3E"); } /* Your account */
.category-list .category[href$="-finding-things"]::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20fill%3D'%23f47100'%20d%3D'M15.5%2014h-.79l-.28-.27C15.41%2012.59%2016%2011.11%2016%209.5%2016%205.91%2013.09%203%209.5%203S3%205.91%203%209.5%205.91%2016%209.5%2016c1.61%200%203.09-.59%204.23-1.57l.27.28v.79l5%204.99L20.49%2019l-4.99-5zm-6%200C7.01%2014%205%2011.99%205%209.5S7.01%205%209.5%205%2014%207.01%2014%209.5%2011.99%2014%209.5%2014z'%2F%3E%3C%2Fsvg%3E"); } /* Finding things */
.category-list .category[href$="-adding-things"]::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20fill%3D'%23f47100'%20d%3D'M12%202C6.48%202%202%206.48%202%2012s4.48%2010%2010%2010%2010-4.48%2010-10S17.52%202%2012%202zm5%2011h-4v4h-2v-4H7v-2h4V7h2v4h4v2z'%2F%3E%3C%2Fsvg%3E"); } /* Adding things */
.category-list .category[href$="-widgets-and-screens"]::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20fill%3D'%23f47100'%20d%3D'M21%203H3c-1.1%200-2%20.9-2%202v12c0%201.1.9%202%202%202h5v2h8v-2h5c1.1%200%201.99-.9%201.99-2L23%205c0-1.1-.9-2-2-2zm0%2014H3V5h18v12z'%2F%3E%3C%2Fsvg%3E"); } /* Widgets and screens */
.category-list .category[href$="-admin-tools"]::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20fill%3D'%23f47100'%20d%3D'M22.7%2019l-9.1-9.1c.9-2.3.4-5-1.5-6.9-2-2-5-2.4-7.4-1.3L9%206%206%209%201.6%204.7C.4%207.1.9%2010.1%202.9%2012.1c1.9%201.9%204.6%202.4%206.9%201.5l9.1%209.1c.4.4%201%20.4%201.4%200l2.3-2.3c.5-.4.5-1.1.1-1.4z'%2F%3E%3C%2Fsvg%3E"); } /* Admin tools */
.category-list .category[href$="-approving"]::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20fill%3D'%23f47100'%20d%3D'M12%202C6.48%202%202%206.48%202%2012s4.48%2010%2010%2010%2010-4.48%2010-10S17.52%202%2012%202zm-2%2015l-5-5%201.41-1.41L10%2014.17l7.59-7.59L19%208l-9%209z'%2F%3E%3C%2Fsvg%3E"); } /* Approving */
.category-list .category[href$="-broadcasting"]::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20fill%3D'%23f47100'%20d%3D'M18%2011v2h4v-2h-4zm-2%206.61c.96.71%202.21%201.65%203.2%202.39.4-.53.8-1.07%201.2-1.6-.99-.74-2.24-1.68-3.2-2.4-.4.54-.8%201.08-1.2%201.61zM20.4%205.6c-.4-.53-.8-1.07-1.2-1.6-.99.74-2.24%201.68-3.2%202.4.4.53.8%201.07%201.2%201.6.96-.72%202.21-1.65%203.2-2.4zM4%209c-1.1%200-2%20.9-2%202v2c0%201.1.9%202%202%202h1v4h2v-4h1l5%203V6L8%209H4zm11.5%203c0-1.33-.58-2.53-1.5-3.35v6.69c.92-.81%201.5-2.01%201.5-3.34z'%2F%3E%3C%2Fsvg%3E"); } /* Broadcasting */
