/* ===== team ai — app shell (sidebar + topbar) ===== */
:root{
  --bg:#F5F6FB; --panel:#FFFFFF; --panel2:#F7F7FD; --border:#E7E8F2;
  --text:#0E1330; --muted:#646B85; --accent:#5B4BFF; --accent2:#4AA8FF;
  --radius:18px; --tai-side:264px;
  --tai-grad:linear-gradient(135deg,#5B4BFF 0%,#7A5CFF 45%,#4AA8FF 100%);
  --tai-shadow:0 1px 2px rgba(14,19,48,.04),0 8px 28px rgba(14,19,48,.06);
}
[data-theme="dark"]{
  --bg:#0B0E1E; --panel:#131733; --panel2:#181D3D; --border:#262B52;
  --text:#EEF0FF; --muted:#A3A9CC;
  --tai-shadow:0 1px 2px rgba(0,0,0,.3),0 10px 30px rgba(0,0,0,.35);
}
body.tai-app{margin:0!important;padding:0!important;font-family:"Inter","Poppins",system-ui,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}
body.tai-app h1,body.tai-app h2,body.tai-app h3,body.tai-app .tai-brand b{font-family:"Poppins","Inter",sans-serif;letter-spacing:-.01em}

/* layout */
#tai-shell{display:flex;min-height:100vh}
#tai-side{position:fixed;inset:0 auto 0 0;width:var(--tai-side);background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:18px 14px;z-index:60;transition:transform .25s ease}
#tai-main{flex:1;margin-left:var(--tai-side);min-width:0}
#tai-top{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:12px;padding:14px 32px;background:color-mix(in srgb,var(--bg) 82%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}
#tai-top h1{margin:0;font-size:1.25rem;font-weight:700;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#tai-top .tai-sub{display:block;font:500 .78rem/1.2 Inter,sans-serif;color:var(--muted);margin-top:2px}
#tai-content{padding:8px 32px 60px;max-width:1240px}
body.tai-app .wrap{max-width:none!important;margin:0!important;padding:0!important}

/* brand */
.tai-brand{display:flex;align-items:center;gap:10px;padding:4px 10px 18px;text-decoration:none;color:var(--text)}
.tai-brand img{height:34px;width:auto}
.tai-brand b{font-size:1.15rem;font-weight:700}

/* nav */
.tai-nav{display:flex;flex-direction:column;gap:3px;flex:1;overflow:auto}
.tai-nav .lbl{font:700 .68rem/1 Inter,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:16px 12px 8px;opacity:.8}
.tai-nav button{all:unset;cursor:pointer;display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:12px;font:600 .9rem/1.2 Inter,sans-serif;color:var(--muted);transition:background .15s,color .15s}
.tai-nav button svg{width:19px;height:19px;flex:0 0 auto}
.tai-nav button:hover{background:var(--panel2);color:var(--text)}
.tai-nav button.on{background:rgba(91,75,255,.1);color:var(--accent)}
[data-theme="dark"] .tai-nav button.on{background:rgba(122,108,255,.18);color:#B9B0FF}
.tai-nav button .cnt{margin-left:auto;font-size:.72rem;background:var(--accent);color:#fff;border-radius:999px;padding:2px 8px}

/* role switch + user */
.tai-role{display:flex;background:var(--panel2);border:1px solid var(--border);border-radius:12px;padding:3px;margin:12px 0}
.tai-role button{all:unset;cursor:pointer;flex:1;text-align:center;padding:8px 6px;border-radius:9px;font:600 .8rem/1 Inter,sans-serif;color:var(--muted)}
.tai-role button.on{background:var(--panel);color:var(--text);box-shadow:0 1px 4px rgba(14,19,48,.1)}
.tai-user{display:flex;align-items:center;gap:10px;padding:10px;border-radius:14px;border:1px solid var(--border);background:var(--panel2)}
.tai-user .av{width:36px;height:36px;border-radius:11px;background:var(--tai-grad);color:#fff;display:grid;place-items:center;font:700 .85rem Inter,sans-serif;flex:0 0 auto}
.tai-user .nm{flex:1;min-width:0;font:600 .85rem/1.25 Inter,sans-serif}
.tai-user .nm small{display:block;color:var(--muted);font-weight:500;font-size:.74rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tai-icbtn{all:unset;cursor:pointer;width:38px;height:38px;display:grid;place-items:center;border-radius:11px;border:1px solid var(--border);background:var(--panel);color:var(--muted)}
.tai-icbtn:hover{color:var(--text);border-color:color-mix(in srgb,var(--accent) 40%,var(--border))}
.tai-icbtn svg{width:18px;height:18px}
#tai-top .lang-switch{height:38px;border-radius:11px!important;border:1px solid var(--border)!important;background:var(--panel)!important;color:var(--text)!important;padding:0 10px!important;font:600 .82rem Inter,sans-serif!important}
.tai-burger{display:none}

/* hide old chrome */
body.tai-app .back-link,body.tai-app .app-header,body.tai-app .role-bar,body.tai-app .steps,body.tai-app .app-footer{display:none!important}
body.tai-app .tai-hidden{display:none!important}

/* cards & controls */
body.tai-app section.card{border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--tai-shadow);padding:26px 28px;margin-top:20px}
body.tai-app section.card h2{font-size:1.12rem;font-weight:700}
body.tai-app section.card h2 img{width:26px;height:26px}
body.tai-app input:not([type=checkbox]):not([type=radio]):not([type=file]),body.tai-app textarea,body.tai-app select:not(.lang-switch){border-radius:12px;border:1px solid var(--border);background:var(--panel2);font-family:Inter,sans-serif;transition:border-color .15s,box-shadow .15s}
body.tai-app input:focus,body.tai-app textarea:focus,body.tai-app select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px rgba(91,75,255,.14)}
body.tai-app button.primary,body.tai-app .actions>button:first-child,body.tai-app button.btn-primary{background:var(--tai-grad);border:0;color:#fff;box-shadow:0 8px 20px rgba(91,75,255,.28)}
body.tai-app #company-stats-grid>div{border-radius:16px!important;box-shadow:none}

/* dashboard hero */
.tai-hero{margin-top:20px;border-radius:24px;padding:28px 30px;color:#fff;background:var(--tai-grad);position:relative;overflow:hidden;display:flex;align-items:center;gap:24px}
.tai-hero:after{content:"";position:absolute;width:380px;height:380px;right:-120px;top:-160px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.28),transparent 65%)}
.tai-hero h2{margin:0 0 6px;font-size:1.5rem;color:#fff}
.tai-hero p{margin:0;opacity:.9;max-width:560px;line-height:1.55}
.tai-hero img{height:120px;position:relative;z-index:1;filter:drop-shadow(0 12px 24px rgba(0,0,0,.25))}
.tai-hero .tai-quick{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px;position:relative;z-index:1}
.tai-hero .tai-quick button{all:unset;cursor:pointer;padding:10px 16px;border-radius:12px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.35);font:600 .85rem Inter,sans-serif;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.tai-hero .tai-quick button:hover{background:rgba(255,255,255,.3)}
.tai-hero .tai-quick button.w{background:#fff;color:var(--accent)}

/* view switch animation */
.tai-enter{animation:taiIn .35s ease}
@keyframes taiIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* responsive */
#tai-scrim{display:none}
@media(max-width:980px){
  #tai-side{transform:translateX(-100%)}
  body.tai-open #tai-side{box-shadow:0 20px 60px rgba(0,0,0,.25)}
  body.tai-open #tai-side{transform:none}
  body.tai-open #tai-scrim{display:block;position:fixed;inset:0;background:rgba(10,12,30,.4);z-index:55}
  #tai-main{margin-left:0}
  .tai-burger{display:grid}
  #tai-top{padding:12px 16px}
  #tai-content{padding:4px 16px 50px}
  .tai-hero{flex-direction:column;align-items:flex-start;padding:22px}
  .tai-hero img{display:none}
  body.tai-app section.card{padding:20px 18px}
}
@media(max-width:560px){#tai-top .lang-switch{display:none}}

.tai-brand .tai-wm{font:700 1.2rem/1 Poppins,Inter,sans-serif;letter-spacing:-.02em}
.tai-brand img{height:36px;width:36px;object-fit:contain}
#tai-kpis-wrap{margin-top:18px}
#tai-kpis-wrap #company-stats-grid{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin:0!important}
#tai-kpis-wrap #company-stats-grid>div{background:var(--panel)!important;border:1px solid var(--border)!important;border-radius:18px!important;padding:18px!important;box-shadow:var(--tai-shadow)!important;text-align:left!important}
#tai-kpis-wrap #company-stats-grid>div>*:first-child{font-size:1.8rem!important;font-family:Poppins,Inter,sans-serif;background:var(--tai-grad);-webkit-background-clip:text;background-clip:text;color:transparent!important}
@media(max-width:980px){#tai-kpis-wrap{margin-top:18px}
#tai-kpis-wrap #company-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}