
:root{
  --brand:#0d6efd;
}
body{ font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.mono{ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }
.brand-dot{ width:12px;height:12px;border-radius:999px;background:linear-gradient(135deg,var(--brand-primary,#0d6efd),var(--brand-secondary,#20c997)); }
.brand-logo{
  font-weight:800;
  font-size:28px;
  letter-spacing:-0.02em;
}
.tenant-pill{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.35rem .75rem;
  background:#f8f9fa;
  border:1px solid rgba(0,0,0,.06);
  border-radius:999px;
}
.saas-bg{
  min-height:100vh;
  /* Soft platform gradient (warm & clean) */
  background:
      radial-gradient(900px 520px at 8% 10%, color-mix(in srgb, var(--brand-secondary,#ff9a3d) 22%, transparent), transparent 60%),
      radial-gradient(900px 520px at 92% 0%, color-mix(in srgb, var(--brand-primary,#ff7a00) 14%, transparent), transparent 62%),
      linear-gradient(180deg,
        color-mix(in srgb, var(--brand-secondary,#ff9a3d) 18%, #ffffff) 0%,
        #ffffff 42%,
        color-mix(in srgb, var(--brand-bg,#ffffff) 55%, #f6f8fa) 100%
      );
}
.saas-bg-photo{
  background-image:
    linear-gradient(rgba(246,248,251,.8), rgba(246,248,251,.85)),
    url("https://images.unsplash.com/photo-1507525428034-b723cf961d3e?auto=format&fit=crop&w=1600&q=60");
  background-size: cover;
  background-position: center;
}
.saas-app-bg{
  min-height:100vh;
  /* Use the same subtle gradient in the app shell */
  background:
      radial-gradient(900px 520px at 8% 10%, color-mix(in srgb, var(--brand-secondary,#ff9a3d) 22%, transparent), transparent 60%),
      radial-gradient(900px 520px at 92% 0%, color-mix(in srgb, var(--brand-primary,#ff7a00) 14%, transparent), transparent 62%),
      linear-gradient(180deg,
        color-mix(in srgb, var(--brand-secondary,#ff9a3d) 18%, #ffffff) 0%,
        #ffffff 42%,
        color-mix(in srgb, var(--brand-bg,#ffffff) 55%, #f6f8fa) 100%
      );
}
.saas-topbar{
  /* светлая “полоска” как в современных кабинетах */
  background: linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,250,252,.96) 100%);
  border-bottom:1px solid rgba(15,23,42,.08);
}
.rounded-4{ border-radius: var(--brand-radius, 16px) !important; }

.saas-tariff-banner{
  background: rgba(37,99,235,.08);
  color: #0f172a;
  padding:10px 16px;
  font-size:13px;
  border-bottom:1px solid rgba(15,23,42,.08);
}
.saas-tariff-banner a{ color:#166534; font-weight:600; text-decoration:none; }
.saas-tariff-banner a:hover{ text-decoration:underline; }

.saas-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  border-bottom:1px solid #e5e7eb;
  padding-bottom:10px;
}
.saas-tab{
  display:inline-flex;
  align-items:center;
  padding:8px 10px;
  border-radius:10px;
  text-decoration:none;
  color:#111827;
  font-size:14px;
}
.saas-tab:hover{ background:#f3f4f6; }
.saas-tab.active{ background: var(--brand-primary, #4f46e5); color:#fff; }

.saas-sidebar{ position: sticky; top: 12px; }
.saas-nav{
  display:flex;
  align-items:center;
  padding:10px 12px;
  border-radius:12px;
  text-decoration:none;
  color:#111827;
  font-weight:600;
  font-size:14px;
}
.saas-nav:hover{ background: rgba(15,23,42,.04); }
.saas-nav.active{ background: var(--brand-primary, #4f46e5); color:#fff; }

/* Bootstrap button theming (lightweight, no rebuild) */
.btn-primary{
  background: var(--brand-accent, #2563eb) !important;
  border-color: var(--brand-accent, #2563eb) !important;
}
.btn-primary:hover{ filter: brightness(.98); }
.btn-outline-primary{
  color: var(--brand-primary, #4f46e5) !important;
  border-color: color-mix(in srgb, var(--brand-primary, #4f46e5) 35%, transparent) !important;
}
.btn-outline-primary:hover{
  background: color-mix(in srgb, var(--brand-primary, #4f46e5) 10%, transparent) !important;
}


/* Brand text colors */
body{ color: var(--brand-text, #1f2937); }
.text-muted{ color: var(--brand-muted, #6b7280) !important; }
