
:root{
  --erp-primary:#1f5eff;
  --erp-primary-dark:#0b2a67;
  --erp-accent:#6c4cff;
  --erp-success:#1f9d55;
  --erp-warning:#d98c00;
  --erp-danger:#d64545;
  --erp-info:#2d7ff9;
  --erp-bg:#f5f7fb;
  --erp-surface:#ffffff;
  --erp-border:#dfe5ef;
  --erp-text:#172033;
  --erp-muted:#6a768b;
  --erp-radius:14px;
  --erp-shadow:0 8px 24px rgba(15,36,84,.08);
  --erp-sidebar:248px;
  --erp-sidebar-collapsed:72px;
  --erp-header:64px;
  --erp-font:Inter,Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--erp-bg);color:var(--erp-text);font-family:var(--erp-font)}
button,input,select,textarea{font:inherit}
.erp-shell{min-height:100vh;display:grid;grid-template-columns:var(--erp-sidebar) 1fr}
.erp-sidebar{background:linear-gradient(180deg,var(--erp-primary-dark),#071a3d);color:#fff;padding:18px 12px;position:sticky;top:0;height:100vh;overflow:auto}
.erp-brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;padding:6px 10px 18px}
.erp-nav{display:grid;gap:5px}
.erp-nav a{color:#dce7ff;text-decoration:none;padding:11px 12px;border-radius:10px;display:flex;align-items:center;gap:10px}
.erp-nav a:hover,.erp-nav a.active{background:linear-gradient(90deg,var(--erp-primary),var(--erp-accent));color:#fff}
.erp-main{min-width:0}
.erp-topbar{height:var(--erp-header);background:var(--erp-surface);border-bottom:1px solid var(--erp-border);display:flex;align-items:center;gap:12px;padding:0 20px;position:sticky;top:0;z-index:20}
.erp-topbar .grow{flex:1}
.erp-search{width:min(520px,100%);border:1px solid var(--erp-border);background:#fff;border-radius:10px;padding:10px 12px}
.erp-content{padding:22px}
.erp-page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}
.erp-page-head h1{margin:0;font-size:28px}
.erp-subtitle{color:var(--erp-muted);margin-top:4px}
.erp-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.erp-col-3{grid-column:span 3}.erp-col-4{grid-column:span 4}.erp-col-6{grid-column:span 6}.erp-col-8{grid-column:span 8}.erp-col-12{grid-column:span 12}
.erp-card{background:var(--erp-surface);border:1px solid var(--erp-border);border-radius:var(--erp-radius);box-shadow:var(--erp-shadow);padding:16px;min-width:0}
.erp-card h3{margin:0 0 12px;font-size:16px}
.erp-kpi{font-size:28px;font-weight:800}.erp-meta{font-size:12px;color:var(--erp-muted)}
.erp-status{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:700}
.erp-status.success{background:#e8f7ef;color:#187345}.erp-status.warning{background:#fff4da;color:#9d6500}.erp-status.danger{background:#fdebec;color:#aa2424}.erp-status.info{background:#eaf2ff;color:#245dc4}
.erp-btn{border:0;border-radius:10px;padding:10px 14px;font-weight:700;cursor:pointer}
.erp-btn.primary{background:linear-gradient(90deg,var(--erp-primary),var(--erp-accent));color:#fff}
.erp-btn.secondary{background:#eef3fb;color:var(--erp-text)}
.erp-btn.danger{background:var(--erp-danger);color:#fff}
.erp-table-wrap{overflow:auto}
.erp-table{width:100%;border-collapse:collapse;min-width:720px}
.erp-table th,.erp-table td{padding:12px;border-bottom:1px solid var(--erp-border);text-align:left}
.erp-table th{font-size:12px;color:var(--erp-muted);background:#fafbfd;position:sticky;top:0}
.erp-list{display:grid;gap:10px}.erp-list-item{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--erp-border)}
.erp-mobile-nav{display:none}
.erp-action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.erp-action{border:1px solid var(--erp-border);background:#fff;border-radius:12px;padding:14px;text-align:left}
.erp-hidden{display:none!important}
@media(max-width:1199px){
  .erp-shell{grid-template-columns:var(--erp-sidebar-collapsed) 1fr}
  .erp-sidebar .label,.erp-brand span{display:none}
  .erp-nav a{justify-content:center}
}
@media(max-width:767px){
  .erp-shell{display:block}
  .erp-sidebar{display:none}
  .erp-topbar{height:58px;padding:0 12px}
  .erp-content{padding:14px 12px 88px}
  .erp-page-head{align-items:center}.erp-page-head h1{font-size:22px}
  .erp-grid{grid-template-columns:1fr}
  [class*="erp-col-"]{grid-column:1}
  .erp-mobile-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--erp-border);z-index:50}
  .erp-mobile-nav button{border:0;background:#fff;padding:10px 2px 12px;color:var(--erp-muted)}
  .erp-mobile-nav button.active{color:var(--erp-primary);font-weight:800}
  .erp-card{padding:14px;border-radius:12px;box-shadow:none}
  .erp-search{font-size:14px}
  .erp-table{min-width:0}
  .erp-table thead{display:none}
  .erp-table,.erp-table tbody,.erp-table tr,.erp-table td{display:block;width:100%}
  .erp-table tr{border:1px solid var(--erp-border);border-radius:12px;padding:10px;margin-bottom:10px;background:#fff}
  .erp-table td{border:0;padding:6px 8px}
  .erp-table td::before{content:attr(data-label);display:block;color:var(--erp-muted);font-size:11px;font-weight:700}
}


/* VENDOR / CLIENT WORKSPACE DISTINCTION */
.erp-workspace-badge{
  display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border-radius:999px;
  font-size:12px;font-weight:800;white-space:nowrap
}
.erp-workspace-badge.vendor{background:#efeaff;color:#5a36d6}
.erp-workspace-badge.client{background:#e8f2ff;color:#205fb8}
.erp-workspace-banner{padding:9px 16px;font-size:13px;font-weight:800;border-bottom:1px solid var(--erp-border)}
.erp-workspace-banner.vendor{background:#f3efff;color:#5637c8}
.erp-workspace-banner.client{background:#edf5ff;color:#235da7}
.erp-tenant-card{border:1px solid var(--erp-border);border-radius:12px;padding:14px;background:#fff}
.erp-tenant-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.erp-switcher{display:flex;align-items:center;gap:8px;border:1px solid var(--erp-border);background:#fff;border-radius:10px;padding:5px}
.erp-switcher button{border:0;background:transparent;padding:8px 10px;border-radius:8px;font-weight:700;color:var(--erp-muted);cursor:pointer}
.erp-switcher button.active.vendor{background:#6c4cff;color:#fff}
.erp-switcher button.active.client{background:var(--erp-primary);color:#fff}
html[data-workspace="vendor"] .erp-sidebar{
  background:linear-gradient(180deg,#20104f,#0d0826)
}
html[data-workspace="vendor"] .erp-nav a:hover,
html[data-workspace="vendor"] .erp-nav a.active{
  background:linear-gradient(90deg,#6c4cff,#8a63ff)
}
html[data-workspace="client"] .erp-sidebar{
  background:linear-gradient(180deg,var(--erp-primary-dark),#071a3d)
}
[data-workspace-only]{display:none!important}
html[data-workspace="vendor"] [data-workspace-only="vendor"],
html[data-workspace="client"] [data-workspace-only="client"]{display:initial!important}
@media(max-width:767px){
  .erp-tenant-grid{grid-template-columns:1fr}
  .erp-switcher{width:100%;justify-content:space-between}
  .erp-switcher button{flex:1}
}


/* CLIENT / VENDOR LOGO SYSTEM */
.erp-logo-wrap{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.erp-logo-box{
  width:42px;
  height:42px;
  border-radius:12px;
  background:#fff;
  border:1px solid rgba(255,255,255,.24);
  display:grid;
  place-items:center;
  overflow:hidden;
  flex:0 0 auto;
}
.erp-logo-box.light{
  border:1px solid var(--erp-border);
}
.erp-logo-img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:5px;
  display:block;
}
.erp-logo-fallback{
  font-weight:900;
  font-size:18px;
  color:var(--erp-primary);
}
.erp-brand-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  line-height:1.1;
}
.erp-brand-title{
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.erp-brand-subtitle{
  margin-top:4px;
  font-size:11px;
  opacity:.75;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.erp-client-identity{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.erp-client-identity .erp-logo-box{
  width:38px;
  height:38px;
}
.erp-logo-upload-hint{
  border:1px dashed var(--erp-border);
  border-radius:12px;
  padding:14px;
  background:#fafbfd;
  color:var(--erp-muted);
  font-size:13px;
}
.erp-logo-preview{
  width:96px;
  height:96px;
  border:1px solid var(--erp-border);
  border-radius:16px;
  background:#fff;
  display:grid;
  place-items:center;
  overflow:hidden;
}
.erp-logo-preview img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:8px;
}
.erp-config-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.erp-field{
  display:grid;
  gap:6px;
}
.erp-field label{
  font-size:12px;
  font-weight:800;
  color:var(--erp-muted);
}
.erp-field input,.erp-field select{
  border:1px solid var(--erp-border);
  border-radius:10px;
  background:#fff;
  padding:10px 12px;
  width:100%;
}
@media(max-width:767px){
  .erp-logo-box{width:36px;height:36px;border-radius:10px}
  .erp-brand-subtitle{display:none}
  .erp-config-grid{grid-template-columns:1fr}
}
