:root {
  --wsi-blue-900: #1e3a8a;
  --wsi-blue-800: #1e40af;
  --wsi-blue-700: #1d4ed8;
  --wsi-slate-900: #0f172a;
  --wsi-slate-700: #334155;
  --wsi-slate-500: #64748b;
  --wsi-slate-200: #e2e8f0;
  --wsi-slate-100: #f1f5f9;
  --wsi-slate-50: #f8fafc;
}

body {
  background: var(--wsi-slate-50) !important;
  color: var(--wsi-slate-900) !important;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

/* Navbar */
.navbar,
.web-navbar,
header.navbar {
  background: #ffffff !important;
  border-bottom: 1px solid var(--wsi-slate-200) !important;
  box-shadow: 0 1px 8px rgba(15,23,42,.04) !important;
}

.navbar .navbar-brand:before {
  content: "WSI";
  display: inline-flex;
  width: 34px;
  height: 34px;
  margin-right: 10px;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background: var(--wsi-blue-900);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
}

.navbar a,
.web-navbar a,
.navbar .nav-link,
.web-navbar .nav-link {
  color: var(--wsi-slate-900) !important;
  font-weight: 700 !important;
}

.navbar a:hover,
.web-navbar a:hover,
.navbar .nav-link:hover,
.web-navbar .nav-link:hover {
  color: var(--wsi-blue-700) !important;
}

/* Page body */
.page-content-wrapper,
.web-page-content,
.page_content,
main,
body > .main-section {
  background: var(--wsi-slate-50) !important;
}

/* Breadcrumb zone */
.breadcrumb,
.breadcrumb a {
  color: var(--wsi-slate-500) !important;
  font-weight: 500 !important;
}

.breadcrumb a:hover {
  color: var(--wsi-blue-700) !important;
}

/* Headings */
h1, h2, h3, h4,
.page-title,
.product-title,
.item-title,
.item-name {
  color: var(--wsi-slate-900) !important;
  font-weight: 800 !important;
}

/* All Products / product list content block */
.product-listing,
.website-list,
.web-list-item,
.item-card,
.card {
  border-radius: 16px !important;
}

.card,
.item-card,
.web-list-item,
.product-listing {
  border: 1px solid var(--wsi-slate-200) !important;
  background: #ffffff !important;
  box-shadow: 0 8px 20px rgba(15,23,42,.05) !important;
}

/* Buttons */
.btn-primary,
button.btn-primary,
a.btn-primary {
  background: var(--wsi-blue-700) !important;
  border-color: var(--wsi-blue-700) !important;
  color: #ffffff !important;
  border-radius: 9999px !important;
  font-weight: 800 !important;
}

.btn-primary:hover,
button.btn-primary:hover,
a.btn-primary:hover {
  background: var(--wsi-blue-800) !important;
  border-color: var(--wsi-blue-800) !important;
}

.btn-secondary,
.btn-default,
button,
input[type="submit"] {
  border-radius: 9999px !important;
}

/* Product detail */
.item-website-specification,
.product-description,
.item-description {
  color: var(--wsi-slate-700) !important;
}

/* Footer */
.web-footer,
footer {
  background: #ffffff !important;
  border-top: 1px solid var(--wsi-slate-200) !important;
  color: var(--wsi-slate-500) !important;
}

.web-footer a,
footer a {
  color: var(--wsi-blue-700) !important;
  font-weight: 600 !important;
}

/* Inputs */
input,
.form-control {
  border-radius: 9999px !important;
  border-color: var(--wsi-slate-200) !important;
}

/* Login page */
.for-login .page-card,
.page-card {
  border-radius: 18px !important;
  border: 1px solid var(--wsi-slate-200) !important;
  box-shadow: 0 12px 28px rgba(15,23,42,.08) !important;
}