/* remozo-docs-v1.css */
/* Remozo Knowledge Base – custom stylesheet */
/* Version: 2.4 | Date: 2026-04-01 */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');
:root {
  --mt-bg: #FFFFFF;
  --mt-surface: #ffffff;
  --mt-surface-soft: #e8edf7;
  --mt-text: #151515;
  --mt-text-soft: #404040;
  --mt-text-muted: #606060;
  --mt-border: #dce3ef;
  --mt-border-strong: #b8c4d8;
  --mt-primary: #1C5ED8;
  --mt-primary-hover: #164dba;
  --mt-accent: #3E8AF6;
  --mt-accent-hover: #2d7ce8;
  --mt-nav-bg: #1C5ED8;
  --mt-shadow-sm: 0 8px 24px rgba(28, 94, 216, 0.08);
  --mt-shadow-md: 0 16px 40px rgba(28, 94, 216, 0.12);
  --mt-radius-xl: 24px;
}
html, body, input, button, textarea, select, h1, h2, h3, h4, h5, h6 {
  font-family: 'Inter', 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
}
html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body {
  background: var(--mt-bg) !important;
  color: var(--mt-text) !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
  font-weight: 400 !important;
}
h1, h2, h3, h4, h5, h6 { color: var(--mt-text) !important; letter-spacing: -0.02em !important; }
h1 { font-weight: 700 !important; }
h2, h3 { font-weight: 600 !important; }
h4, h5, h6 { font-weight: 600 !important; }
a { color: var(--mt-primary) !important; text-decoration: none !important; }
a:hover { color: var(--mt-accent) !important; text-decoration: none !important; }
a:focus { text-decoration: none !important; }
#mainNav, .navbar, .navbar-default {
  background: var(--mt-nav-bg) !important;
  border: none !important;
  border-bottom: none !important;
  box-shadow: 0 2px 12px rgba(28,94,216,0.18) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 100 !important;
}
.navbar-inner {
  background: var(--mt-nav-bg) !important;
  min-height: 64px !important;
  height: 64px !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 !important;
  box-shadow: none !important;
  border: none !important;
  overflow: hidden !important;
}
.navbar-inner > .container-fluid {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 1200px !important;
  padding: 0 24px !important;
  margin: 0 auto !important;
  float: none !important;
  box-sizing: border-box !important;
  height: 100% !important;
}
.navbar .navbar-inner .brand, .navbar-inner .brand, .navbar .brand {
  display: flex !important;
  align-items: center !important;
  padding: 0 32px 0 0 !important;
  margin: 0 !important;
  height: 64px !important;
  line-height: normal !important;
  float: none !important;
  flex-shrink: 0 !important;
  background: none !important;
}
.navbar .brand img, .navbar-brand img, .brand img {
  display: block !important;
  max-height: 32px !important;
  width: auto !important;
}
.btn-navbar { display: none !important; }
.navbar-inner > .container-fluid > .nav-collapse {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  float: none !important;
  min-width: 0 !important;
  overflow: visible !important;
  height: auto !important;
}
.nav-collapse {
  float: none !important;
  height: auto !important;
  overflow: visible !important;
}
.nav-collapse nav {
  display: flex !important;
  width: 100% !important;
  align-items: center !important;
}
.nav-collapse .nav, nav ul.nav {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin: 0 0 0 auto !important;
  padding: 0 !important;
  list-style: none !important;
  float: none !important;
  height: auto !important;
  position: relative !important;
  top: 0 !important;
}
.nav-collapse .nav > li, nav ul.nav > li {
  display: flex !important;
  align-items: center !important;
  float: none !important;
  height: auto !important;
}
#mainNav a:not(.brand), .navbar a:not(.brand), nav ul.nav > li > a, .nav-collapse .nav > li > a {
  color: rgba(255,255,255,0.88) !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  padding: 6px 14px !important;
  border-radius: 100px !important;
  display: inline-flex !important;
  align-items: center !important;
  background: none !important;
  border: none !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
}
#mainNav a:not(.brand):hover,
.navbar a:not(.brand):hover,
nav ul.nav > li > a:hover,
.nav-collapse .nav > li > a:hover {
  color: #ffffff !important;
  background: rgba(255,255,255,0.18) !important;
  border: none !important;
  border-radius: 100px !important;
  text-decoration: none !important;
}
nav ul.nav > li.active > a {
  color: #ffffff !important;
  font-weight: 600 !important;
  background: rgba(255,255,255,0.18) !important;
  border: none !important;
  border-radius: 100px !important;
}
.powered-by, .poweredBy { display: none !important; }
#docsSearch, .docsSearch {
  background: #ffffff !important;
  padding: 0 20px !important;
  border: none !important;
  border-bottom: none !important;
  margin-bottom: 0 !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 220px !important;
}
#docsSearch h1, .docsSearch h1 {
  color: var(--mt-text) !important;
  font-size: 48px !important;
  line-height: 1.08 !important;
  font-weight: 700 !important;
  margin: 0 0 14px !important;
  letter-spacing: -0.03em !important;
}
#docsSearch p, .docsSearch p {
  color: var(--mt-text-muted) !important;
  font-size: 17px !important;
  font-weight: 400 !important;
  margin: 0 auto 28px !important;
  max-width: 560px !important;
}
#docsSearch form#searchBar, #docsSearch #searchBar:not(.sm) {
  max-width: 720px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  flex-direction: row !important;
  gap: 10px !important;
  width: 100% !important;
}
.search-query {
  height: 56px !important;
  min-height: 56px !important;
  padding: 0 24px !important;
  background: #FAFAFA !important;
  color: var(--mt-text) !important;
  border: 1.5px solid var(--mt-border) !important;
  border-radius: 50px !important;
  box-shadow: none !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  display: block !important;
}
.search-query::placeholder { color: #9ca3af !important; font-weight: 400 !important; }
.search-query:focus {
  border-color: var(--mt-accent) !important;
  box-shadow: 0 0 0 3px rgba(62,138,246,0.25) !important;
  outline: none !important;
}
#docsSearch form#searchBar .search-query, #docsSearch #searchBar:not(.sm) .search-query {
  flex: 1 !important;
  min-width: 0 !important;
  width: auto !important;
}
#docsSearch form#searchBar button,
#docsSearch #searchBar:not(.sm) button {
  flex-shrink: 0 !important;
  height: 56px !important;
  min-height: 56px !important;
  padding: 0 36px !important;
  background: #3E8AF6 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 50px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
  position: static !important;
  float: none !important;
  width: auto !important;
  min-width: auto !important;
}
#docsSearch form#searchBar button i, #docsSearch #searchBar:not(.sm) button i { color: #ffffff !important; }
#docsSearch form#searchBar button:hover, #docsSearch #searchBar:not(.sm) button:hover {
  background: #2d7ce8 !important;
  box-shadow: none !important;
}
#searchBar.sm, form#searchBar.sm {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  width: 100% !important;
}
#searchBar.sm .search-query {
  flex: 1 !important;
  min-width: 0 !important;
  width: auto !important;
  height: 44px !important;
  min-height: 44px !important;
  font-size: 14px !important;
  border-radius: 50px !important;
  padding: 0 18px !important;
  box-shadow: none !important;
}
#searchBar.sm button {
  flex-shrink: 0 !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 20px !important;
  background: #3E8AF6 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 50px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
  position: static !important;
  float: none !important;
  width: auto !important;
  min-width: 52px !important;
}
#searchBar.sm button i { color: #ffffff !important; }
#contentArea, .contentArea {
  background: transparent !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  box-sizing: border-box !important;
}
.twoCol, .threeCol, .row-fluid.twoCol, .row-fluid.threeCol {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
  justify-content: flex-start !important;
  padding: 40px 0 60px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}
.twoCol .collection, .threeCol .collection, .twoCol .category, .threeCol .category {
  flex: 1 1 400px !important;
  max-width: calc(50% - 10px) !important;
  min-width: 340px !important;
  display: block !important;
  float: none !important;
  margin: 0 !important;
  background: #FAFAFA !important;
  border: 1px solid var(--mt-border) !important;
  border-radius: var(--mt-radius-xl) !important;
  box-shadow: var(--mt-shadow-sm) !important;
  padding: 0 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  width: auto !important;
  transition: box-shadow 0.2s ease !important;
}
.twoCol .collection:hover { box-shadow: var(--mt-shadow-md) !important; transform: none !important; }
.collection-head {
  padding: 28px 32px 18px !important;
  border-bottom: none !important;
  background: #FAFAFA !important;
  text-align: left !important;
  margin-bottom: 0 !important;
}
.collection-head h2 {
  font-size: 20px !important;
  font-weight: 700 !important;
  margin: 0 !important;
  letter-spacing: -0.01em !important;
  color: var(--mt-text) !important;
}
.collection-head h2 a { color: var(--mt-text) !important; font-weight: 700 !important; text-decoration: none !important; }
.collection-head h2 a:hover { color: var(--mt-primary) !important; text-decoration: none !important; }
.collection-head p { color: var(--mt-text-muted) !important; font-size: 14px !important; font-weight: 400 !important; margin: 0 !important; }
.collection-body { padding: 16px 32px 24px !important; background: #FAFAFA !important; }
.collection-body .popArticles, .collection ul.popArticles { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.collection-body .popArticles li, .collection ul.popArticles li { padding: 0 !important; margin: 0 !important; border-bottom: none !important; }
.collection-body .popArticles li:last-child, .collection ul.popArticles li:last-child { border-bottom: none !important; }
.collection-body .popArticles li a, .collection ul.popArticles li a {
  display: flex !important;
  align-items: center !important;
  padding: 10px 0 !important;
  color: var(--mt-text-soft) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  transition: color 0.15s !important;
  margin: 0 !important;
  text-decoration: none !important;
}
.collection-body .popArticles li a::before, .collection ul.popArticles li a::before {
  content: '•' !important;
  color: var(--mt-accent) !important;
  font-weight: 600 !important;
  margin-right: 10px !important;
  flex-shrink: 0 !important;
  font-size: 18px !important;
  line-height: 1 !important;
}
.collection-body .popArticles li a:hover, .collection ul.popArticles li a:hover { color: var(--mt-primary) !important; text-decoration: none !important; }
.collection ul li i, .collection ul li svg, .icon-article-doc, .icon-document, .fa-file-text-o, .fa-file-o, .fa-file-text, [class*="icon-file"], [class*="article-icon"] { display: none !important; }
.articleList { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.articleList li { padding: 0 !important; margin: 0 !important; border-bottom: none !important; }
.articleList li a {
  display: flex !important;
  align-items: center !important;
  padding: 14px 18px !important;
  color: var(--mt-text-soft) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  transition: color 0.15s !important;
  text-decoration: none !important;
}
.articleList li a::before {
  content: '•' !important;
  color: var(--mt-accent) !important;
  font-weight: 600 !important;
  margin-right: 10px !important;
  flex-shrink: 0 !important;
  font-size: 18px !important;
  line-height: 1 !important;
}
.articleList li a i, .articleList li a .icon-article-doc { display: none !important; }
.articleList li a:hover { color: var(--mt-primary) !important; text-decoration: none !important; }
.sort { display: none !important; }
#serp-dd { background: white !important; border-radius: 12px !important; box-shadow: var(--mt-shadow-md) !important; border: 1px solid var(--mt-border) !important; overflow: hidden !important; margin-top: 8px !important; }
.breadcrumb, ol.breadcrumb { background: transparent !important; padding: 0 !important; margin: 0 0 16px !important; font-size: 13px !important; }
.breadcrumb a, .breadcrumb li { color: var(--mt-text-muted) !important; font-weight: 500 !important; }
.breadcrumb li.active { color: var(--mt-text-muted) !important; }
.row-fluid:not(.twoCol):not(.threeCol) { width: 100% !important; max-width: 1200px !important; margin: 0 auto !important; padding: 32px 24px 60px !important; box-sizing: border-box !important; overflow: hidden !important; }
#sidebar.span3, aside.span3 { float: left !important; width: 23% !important; max-width: 280px !important; min-width: 200px !important; order: 0 !important; margin: 0 !important; padding: 0 !important; }
#main-content.span9, section.span9 { float: right !important; width: 73% !important; max-width: 860px !important; min-width: 0 !important; padding: 0 0 0 24px !important; box-sizing: border-box !important; }
.contentWrapper, .article-container { background: var(--mt-surface) !important; border: 1px solid var(--mt-border) !important; border-radius: var(--mt-radius-xl) !important; box-shadow: var(--mt-shadow-sm) !important; padding: 44px 52px !important; box-sizing: border-box !important; }
#fullArticle, article.article { background: transparent !important; border: none !important; box-shadow: none !important; padding: 0 !important; border-radius: 0 !important; }
h1.title { font-size: 36px !important; line-height: 1.1 !important; font-weight: 700 !important; color: var(--mt-text) !important; margin: 0 0 20px !important; letter-spacing: -0.02em !important; }
.articleBody, .article-body, .body, .article-content { color: var(--mt-text-soft) !important; font-size: 15px !important; line-height: 1.75 !important; font-weight: 400 !important; overflow-x: auto !important; }
.articleBody h2, .article-body h2, .body h2 { font-size: 24px !important; font-weight: 700 !important; color: var(--mt-text) !important; margin-top: 1.8em !important; margin-bottom: 0.5em !important; }
.articleBody h3, .article-body h3, .body h3 { font-size: 18px !important; font-weight: 600 !important; color: var(--mt-text) !important; margin-top: 1.4em !important; margin-bottom: 0.4em !important; }
.articleBody img, .article-body img, .body img { max-width: 100% !important; border-radius: 10px !important; height: auto !important; }
.articleBody a, .article-body a { color: var(--mt-primary) !important; font-weight: 500 !important; text-decoration: none !important; }
.articleBody a:hover, .article-body a:hover { color: var(--mt-accent) !important; text-decoration: none !important; }
.icon-print, .printArticle, .print-link, .btn-view { display: none !important; }
.btn[href*="print"], a[href*="print"] { display: none !important; }
.articleRatings { border-radius: 12px !important; }
.articleBody table, .article-body table, .body table, .hs-table { width: 100% !important; border-collapse: collapse !important; }
.articleBody table td, .articleBody table th, .article-body table td, .article-body table th, .body table td, .body table th { padding: 10px 14px !important; border: 1px solid var(--mt-border) !important; word-break: normal !important; white-space: normal !important; }
.articleBody table th, .article-body table th, .body table th { background: var(--mt-surface-soft) !important; font-weight: 600 !important; color: var(--mt-text) !important; }
.sidebar-nav, .sidebar .nav, .span3 .nav { background: transparent !important; border: none !important; box-shadow: none !important; padding: 0 !important; }
#sidebar h3 { font-size: 11px !important; font-weight: 700 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; color: var(--mt-text-muted) !important; margin: 0 0 10px !important; padding: 0 !important; }
.sidebar .nav li, .sidebar-nav li, .span3 .nav li { border-bottom: none !important; }
.sidebar .nav li a, .sidebar-nav li a, .span3 .nav li a { display: flex !important; align-items: center !important; color: var(--mt-text-soft) !important; font-size: 14px !important; font-weight: 500 !important; padding: 9px 0 !important; border-bottom: none !important; text-decoration: none !important; }
.sidebar .nav li a::before, .sidebar-nav li a::before, .span3 .nav li a::before { content: '•' !important; color: var(--mt-accent) !important; font-weight: 600 !important; margin-right: 10px !important; flex-shrink: 0 !important; font-size: 18px !important; line-height: 1 !important; }
.sidebar .nav li a .icon-arrow, .span3 .nav li a .icon-arrow { display: none !important; }
.sidebar .nav li a:hover, .span3 .nav li a:hover { color: var(--mt-primary) !important; background: none !important; text-decoration: none !important; }
.sidebar .nav li.active a, .span3 .nav li.active a { color: var(--mt-primary) !important; font-weight: 600 !important; }
aside.span3 form, aside.span3 #searchBar { display: flex !important; align-items: center !important; gap: 8px !important; margin: 0 0 20px !important; padding: 0 !important; width: 100% !important; box-sizing: border-box !important; overflow: hidden !important; }
aside.span3 form .search-query, aside.span3 #searchBar .search-query { flex: 1 !important; min-width: 0 !important; width: auto !important; max-width: calc(100% - 52px) !important; height: 40px !important; min-height: 40px !important; font-size: 13px !important; border-radius: 50px !important; padding: 0 16px !important; box-shadow: none !important; box-sizing: border-box !important; }
aside.span3 form button, aside.span3 #searchBar button { flex-shrink: 0 !important; height: 40px !important; min-height: 40px !important; padding: 0 16px !important; background: #3E8AF6 !important; color: #ffffff !important; border: none !important; border-radius: 50px !important; font-size: 13px !important; font-weight: 600 !important; box-shadow: none !important; text-shadow: none !important; cursor: pointer !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; white-space: nowrap !important; position: static !important; float: none !important; width: auto !important; }
aside.span3 form button:hover, aside.span3 #searchBar button:hover { background: #2d7ce8 !important; }
aside.span3 form button i, aside.span3 #searchBar button i { color: #ffffff !important; }
footer, .site-footer, footer.center { margin-top: 0 !important; background: transparent !important; border: none !important; padding: 24px 20px 32px !important; color: var(--mt-text-muted) !important; font-size: 13px !important; text-align: center !important; clear: both !important; }
footer a, footer.center a { color: var(--mt-text-muted) !important; font-weight: 500 !important; }
footer a:hover { color: var(--mt-primary) !important; }
@media (max-width: 1100px) {
  .twoCol, .threeCol { gap: 16px !important; padding: 32px 0 48px !important; }
  .twoCol .collection, .threeCol .collection { flex: 1 1 300px !important; max-width: calc(50% - 8px) !important; min-width: 260px !important; }
}
@media (max-width: 768px) {
  #docsSearch, .docsSearch { padding: 40px 16px 28px !important; min-height: auto !important; }
  #docsSearch h1, .docsSearch h1 { font-size: 28px !important; margin: 0 0 14px !important; text-align: center !important; width: 100% !important; box-sizing: border-box !important; }
  #docsSearch form#searchBar, #docsSearch #searchBar:not(.sm) { flex-direction: row !important; flex-wrap: nowrap !important; gap: 8px !important; width: 100% !important; align-items: center !important; }
  #docsSearch form#searchBar .search-query, #docsSearch #searchBar:not(.sm) .search-query { flex: 1 !important; min-width: 0 !important; height: 50px !important; min-height: 50px !important; border-radius: 50px !important; font-size: 14px !important; padding: 0 18px !important; }
  #docsSearch form#searchBar button, #docsSearch #searchBar:not(.sm) button { height: 50px !important; min-height: 50px !important; padding: 0 20px !important; border-radius: 50px !important; font-size: 14px !important; flex-shrink: 0 !important; width: auto !important; min-width: auto !important; }
  .sort { display: none !important; }
  .twoCol, .threeCol { padding: 24px 0 40px !important; gap: 14px !important; }
  .twoCol .collection, .threeCol .collection { flex: 1 1 100% !important; max-width: 100% !important; min-width: 0 !important; }
  .collection-head { padding: 18px 16px 12px !important; }
  .collection-body { padding: 10px 16px 18px !important; }
  .collection-head h2 { font-size: 18px !important; }
  .contentWrapper, .article-container { padding: 24px 20px !important; border-radius: 16px !important; }
  h1.title { font-size: 26px !important; }
  .row-fluid:not(.twoCol):not(.threeCol) { padding: 20px 0 40px !important; }
  #contentArea, .contentArea { padding: 0 14px !important; }
  #sidebar.span3, aside.span3 { float: none !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 20px 0 !important; }
  #main-content.span9, section.span9 { float: none !important; width: 100% !important; max-width: 100% !important; padding: 0 !important; margin: 0 !important; box-sizing: border-box !important; }
  .navbar-inner { overflow: hidden !important; height: auto !important; min-height: 56px !important; }
  .navbar-inner > .container-fluid { box-sizing: border-box !important; width: 100% !important; max-width: 100% !important; overflow: hidden !important; padding: 0 16px !important; height: auto !important; }
  .navbar .navbar-inner .brand, .navbar-inner .brand, .navbar .brand { flex-shrink: 1 !important; padding: 0 12px 0 0 !important; height: 56px !important; }
  .navbar .brand img, .navbar-brand img, .brand img { max-height: 26px !important; }
  .nav-collapse > .nav-collapse, .nav-collapse nav, .nav-collapse .nav, nav ul.nav { overflow: hidden !important; max-width: 100% !important; }
}