/**
 * Ucheto Brand Book 3.4 — override layer for assets/temp (Rocker → Ucheto).
 * SoT tokens: brand/shared/tokens/tokens.json
 * Logo SoT: assets/logo/
 * Do not AI-redraw the U mark.
 */
:root {
  --ucheto-deep: #2454C6;
  --ucheto-primary: #1E80B4;
  --ucheto-aqua: #1AA7B3;
  --ucheto-growth: #58B76B;
  --ucheto-ink: #10263A;
  --ucheto-action: #1A73A0;
  --ucheto-action-hover: #155E83;
  --ucheto-surface: #F5F8FB;
  --ucheto-card: #FFFFFF;
  --ucheto-on-primary: #FFFFFF;
  --ucheto-radius-card: 20px;
  --ucheto-radius-md: 8px;
  --bs-primary: #1E80B4;
  --bs-primary-rgb: 30, 128, 180;
  --bs-success: #58B76B;
  --bs-success-rgb: 88, 183, 107;
  --bs-body-color: #10263A;
  --bs-body-bg: #F5F8FB;
  --bs-link-color: #1E80B4;
  --bs-link-hover-color: #155E83;
}

html, body {
  font-family: "Manrope", "Onest", system-ui, sans-serif !important;
  color: var(--ucheto-ink);
  background: var(--ucheto-surface);
}

html.dark-theme {
  --ucheto-surface: #212529;
  --ucheto-card: #2b3035;
  --ucheto-ink: #e4e5e6;
  --bs-body-bg: #212529;
  --bs-body-color: #e4e5e6;
}

html.dark-theme,
html.dark-theme body {
  color: var(--ucheto-ink) !important;
  background: var(--ucheto-surface) !important;
}

h1, h2, h3, h4, h5, h6, .logo-text {
  font-family: "Onest", "Manrope", system-ui, sans-serif !important;
}

.logo-icon {
  width: 36px !important;
  height: 36px !important;
  object-fit: contain;
}

.logo-text {
  color: var(--ucheto-primary) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em;
}

.sidebar-wrapper {
  border-right: 1px solid rgba(16, 38, 58, 0.08) !important;
}

.sidebar-wrapper .metismenu a:hover,
.sidebar-wrapper .metismenu a:focus,
.sidebar-wrapper .metismenu .mm-active > a {
  color: var(--ucheto-primary) !important;
}

.sidebar-wrapper .metismenu .mm-active > a,
.sidebar-wrapper .metismenu a:hover {
  background: rgba(30, 128, 180, 0.08) !important;
}

.topbar {
  border-bottom: 1px solid rgba(16, 38, 58, 0.06);
}

.card {
  border-radius: var(--ucheto-radius-card) !important;
  border: 1px solid rgba(16, 38, 58, 0.06) !important;
  box-shadow: 0 8px 24px rgba(16, 38, 58, 0.04) !important;
}

.btn-primary,
.bg-primary,
.badge.bg-primary {
  background-color: var(--ucheto-primary) !important;
  border-color: var(--ucheto-primary) !important;
  color: var(--ucheto-on-primary) !important;
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--ucheto-action-hover) !important;
  border-color: var(--ucheto-action-hover) !important;
}

.btn-success,
.bg-success {
  background-color: var(--ucheto-growth) !important;
  border-color: var(--ucheto-growth) !important;
}

.text-primary {
  color: var(--ucheto-primary) !important;
}

.text-success {
  color: var(--ucheto-growth) !important;
}

.bg-light-primary {
  background: rgba(30, 128, 180, 0.12) !important;
  color: var(--ucheto-primary) !important;
}

a {
  color: var(--ucheto-primary);
}

a:hover {
  color: var(--ucheto-action-hover);
}

.form-control:focus,
.form-select:focus {
  border-color: var(--ucheto-primary) !important;
  box-shadow: 0 0 0 0.25rem rgba(30, 128, 180, 0.25) !important;
}

.page-footer,
.footer {
  color: rgba(16, 38, 58, 0.65);
}

html.dark-theme .page-footer,
html.dark-theme .footer {
  color: #a8adb0 !important;
  background-color: #2b3035 !important;
}

/* Auth / marketing brand lockup */
.ucheto-auth-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}

.ucheto-auth-brand img {
  width: 40px;
  height: 40px;
}

.ucheto-auth-brand span {
  font-family: "Onest", "Manrope", sans-serif;
  font-weight: 700;
  font-size: 1.35rem;
  color: var(--ucheto-ink);
  letter-spacing: -0.02em;
}

/* Default colored header → Ucheto primary (not purple/red demos) */
html.color-header .topbar,
html.headercolor1 .topbar {
  background: linear-gradient(135deg, var(--ucheto-deep), var(--ucheto-primary) 55%, var(--ucheto-aqua)) !important;
}

.switcher-body .headercolor1,
.switcher-body .sidebarcolor1 {
  background: var(--ucheto-primary) !important;
}

.switcher-body .headercolor4,
.switcher-body .sidebarcolor4 {
  background: var(--ucheto-growth) !important;
}

.switcher-body .headercolor2,
.switcher-body .sidebarcolor2 {
  background: var(--ucheto-ink) !important;
}

html.color-sidebar .logo-icon {
  filter: none !important; /* official color mark — never invert */
}

html.color-sidebar .sidebar-wrapper .sidebar-header .logo-text {
  color: #ffffff !important;
}

html.dark-theme .logo-text {
  color: var(--ucheto-aqua) !important;
}