/* Struvio App v0.1 — web-brand design system */
:root{
  --bg:#F5FAF8;
  --panel:#FFFFFF;
  --ink:#172033;
  --muted:#66778A;
  --line:#D7E6E2;
  --accent:#3156D3;
  --accent2:#0F766E;
  --accent-soft:#EEF3FF;
  --surface:#FFFFFF;
  --surface-muted:#F3F9F7;
  --surface-soft:#F6FAF9;
  --text:#172033;
  --text-muted:#66778A;
  --border:#D7E6E2;
  --good:#0F766E;
  --warn:#D97706;
  --bad:#C2414B;
  --shadow:0 16px 38px rgba(22,50,79,.08);
}
body{
  background:
    radial-gradient(circle at 85% 4%,rgba(49,86,211,.07),transparent 28%),
    linear-gradient(180deg,#F8FCFB 0%,#F3F9F7 100%);
}
.sidebar{
  width:252px;
  background:
    radial-gradient(circle at 15% 8%,rgba(49,86,211,.25),transparent 28%),
    linear-gradient(165deg,#102A43 0%,#12384B 56%,#0E4A47 120%);
  border-right:1px solid rgba(255,255,255,.06);
  padding:22px 16px;
}
.main{margin-left:252px}
.struvio-brand{gap:6px}
.struvio-brand-row{display:flex;align-items:center;gap:11px}
.struvio-mark{width:38px;height:38px;display:block}
.login-brand .struvio-mark{width:54px;height:54px}
.struvio-word{
  font-size:22px;
  line-height:1;
  font-weight:900;
  letter-spacing:.18em;
  color:#FFFFFF;
}
.login-brand .struvio-word{
  color:#16324F;
  font-size:34px;
}
.brand-subtitle{
  color:#A8BBC9;
  font-size:10px;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.login-brand .brand-subtitle{color:#66778A}
.nav{
  color:#C6D4DF;
  border:1px solid transparent;
  border-radius:12px;
  transition:background .18s ease,border-color .18s ease,transform .18s ease;
}
.nav:hover{
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.07);
  color:#FFFFFF;
  transform:translateX(2px);
}
.nav.active{
  background:linear-gradient(135deg,rgba(49,86,211,.82),rgba(15,118,110,.78));
  border-color:rgba(255,255,255,.12);
  color:#FFFFFF;
  box-shadow:0 10px 26px rgba(0,0,0,.13);
}
.nav-section,.tenant-platform-section{
  color:#8FB0BD!important;
  opacity:1!important;
  letter-spacing:.14em!important;
}
.nav-overview .nav-ico,
.nav-customers .nav-ico,
.nav-finance .nav-ico,
.nav-payroll .nav-ico{color:#65D4C4}
.nav-projects .nav-ico,
.nav-capacity .nav-ico,
.nav-invoices .nav-ico{color:#8EA7FF}
.nav-expenses .nav-ico{color:#F3A1A8}
.sidebar-foot{color:#7F9CAA}
.topbar{
  min-height:92px;
  height:auto;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(14px);
  border-bottom:1px solid #D7E6E2;
  box-shadow:0 4px 22px rgba(22,50,79,.035);
}
.topbar h1{color:#16324F;letter-spacing:-.025em}
.topbar p{color:#718195}
.btn{
  border-radius:11px;
  border-color:#D4E3DF;
}
.btn.primary{
  background:linear-gradient(135deg,#3156D3 0%,#2867BC 48%,#14998C 100%);
  border-color:transparent;
  color:#fff;
  box-shadow:0 10px 24px rgba(31,97,163,.18);
}
.btn.primary:hover{filter:brightness(.97);transform:translateY(-1px)}
.btn.ghost{background:#F8FCFB;border-color:#D7E6E2}
.panel,.card,.modal-card,.login-card{
  border:1px solid #D8E7E3;
  box-shadow:0 16px 36px rgba(22,50,79,.055);
}
.login-screen{
  background:
    radial-gradient(circle at 18% 18%,rgba(20,153,140,.15),transparent 30%),
    radial-gradient(circle at 82% 22%,rgba(49,86,211,.10),transparent 34%),
    linear-gradient(180deg,#FFFFFF 0%,#F2FBF8 100%);
}
.login-card{
  border-radius:24px;
  padding:32px;
}
.login-card:before{
  content:"";
  display:block;
  width:64px;
  height:4px;
  margin:0 auto 24px;
  border-radius:999px;
  background:linear-gradient(90deg,#3156D3,#0F766E);
}
.field input,.field select,.field textarea,
.search,input,select,textarea{
  border-color:#D5E4E0;
  border-radius:10px;
}
.field input:focus,.field select:focus,.field textarea:focus,
input:focus,select:focus,textarea:focus{
  border-color:#0F766E;
  outline:none;
  box-shadow:0 0 0 3px rgba(15,118,110,.09);
}
.kpi,.mini-kpi,.summary-card{
  border-color:#D9E7E4!important;
  background:linear-gradient(180deg,#FFFFFF 0%,#FBFEFD 100%)!important;
}
.badge,.status-pill{border-radius:999px}
.tabs{border-bottom-color:#D7E6E2}
.tab.active{
  color:#0F766E!important;
  border-bottom-color:#0F766E!important;
}
.language-switch{border-color:#D7E6E2;background:#fff}
.language-switch button.active{
  background:linear-gradient(135deg,#3156D3,#0F766E);
  color:#fff;
}
.notification-bell,.theme-toggle,.user-chip,.tenant-company-chip{
  border-color:#D7E6E2!important;
}
.active-timer-chip{
  border-color:#9DD8CF;
  background:#EEF9F6;
}
table thead th{
  color:#5D6F82;
  background:#F4F9F7;
}
table tbody tr:hover td{background:#F7FBFA}
.modal{backdrop-filter:blur(4px)}
.modal-card{border-radius:20px}
#toast{border-radius:12px}
@media(max-width:760px){
  .sidebar{width:74px;padding-left:10px;padding-right:10px}
  .main{margin-left:74px}
  .sidebar .struvio-word,.sidebar .brand-subtitle{display:none}
  .sidebar .struvio-mark{width:40px;height:40px}
  .sidebar-brand{align-items:center;padding-left:0;padding-right:0}
}