/* OTOVERA PRO UI — clean, compact automotive ERP workspace.
   Loaded AFTER style.css, otovera-desktop.css and otovera-tree.css. */
:root{
 --sidebar:252px;
 --ink:#243044;--muted:#607185;--muted-2:#8b98a9;
 --line:#cfd7e1;--line-dark:#bac7d4;
 --surface:#fff;--surface-2:#f5f7f9;
 --blue:#235b91;--blue-soft:#e5eff9;
 --shadow:none;
 font-family:"Segoe UI",Tahoma,Arial,sans-serif!important;font-size:13px!important;
}
html,body{background:#e9edf2!important;color:#28374a!important;font-family:"Segoe UI",Tahoma,Arial,sans-serif!important}
.shell{display:grid!important;grid-template-columns:var(--sidebar) minmax(0,1fr)!important;min-height:100vh;background:#e9edf2!important}
/* Sidebar / workspace hierarchy */
.shell .sidebar{
 position:sticky;top:0;height:100vh;min-width:0;
 background:#e9edf2!important;background-image:none!important;
 color:#344457!important;border-right:1px solid #b8c5d1!important;
 box-shadow:none!important;padding:0!important;display:flex;flex-direction:column;
 overflow:hidden;z-index:30
}
.sidebar .brand-block{
 height:77px;min-height:77px!important;display:flex;flex-direction:column;
 justify-content:center;align-items:flex-start;gap:2px;
 padding:11px 16px!important;margin:0!important;
 background:#f4f6f9!important;background-image:none!important;
 border:0!important;border-bottom:1px solid #cbd5df!important;
 box-shadow:none!important;
}
.sidebar .brand-block img{width:158px!important;max-width:100%!important;height:37px!important;object-fit:contain!important;object-position:left center!important;filter:none!important}
.sidebar .brand-block span{padding:0!important;color:#637488!important;font-size:10px!important;letter-spacing:.015em!important}
.sidebar #nav{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;display:block!important;padding:8px 7px 10px!important;background:#edf1f5!important;scrollbar-color:#c9d2dd transparent;scrollbar-width:thin}
.sidebar #nav .erp-nav-group{border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;margin:0 0 2px!important;overflow:visible}
.sidebar #nav .erp-nav-head{
 width:100%!important;min-height:33px!important;height:33px!important;display:flex;align-items:center;
 padding:0 9px!important;margin:0!important;gap:7px!important;
 background:transparent!important;background-image:none!important;
 color:#44586d!important;border:0!important;border-radius:3px!important;
 border-bottom:0!important;box-shadow:none!important;
 font-size:11px!important;font-weight:650!important;letter-spacing:.01em!important;
 text-transform:none!important;text-align:left;
}
.sidebar #nav .erp-nav-head:hover{background:#dce4ec!important;color:#26394d!important}
.sidebar #nav .erp-nav-head.has-active{background:#e1e9f1!important;color:#243c56!important}
.sidebar #nav .erp-nav-caret{width:14px;line-height:1;color:#6a798c;font-size:13px}
.sidebar #nav .erp-nav-count{display:none!important}
.sidebar #nav .erp-nav-items{display:block;padding:0 0 4px 18px!important;background:transparent!important}
.sidebar #nav .erp-nav-items[hidden]{display:none!important}
.sidebar #nav .erp-nav-item{
 min-height:31px!important;height:31px!important;width:100%!important;
 display:flex;align-items:center;gap:9px!important;
 border:1px solid transparent!important;border-radius:3px!important;
 background:transparent!important;background-image:none!important;
 color:#405168!important;box-shadow:none!important;
 padding:4px 8px!important;text-align:left;
 font-size:12px!important;font-weight:500!important;
}
.sidebar #nav .erp-nav-item .nav-icon{width:16px!important;height:16px!important;color:#738498!important}
.sidebar #nav .erp-nav-item svg{width:15px!important;height:15px!important;stroke-width:1.8!important}
.sidebar #nav .erp-nav-item:hover{color:#214568!important;background:#e0e8f1!important}
.sidebar #nav .erp-nav-item.active{
 color:#1d4c79!important;background:#d2e4f4!important;border:1px solid #b4cde4!important;
 box-shadow:inset 3px 0 0 #28679f!important;font-weight:670!important;
}
.sidebar #nav .erp-nav-item.active .nav-icon{color:#245f97!important}
.sidebar .side-bottom{margin-top:auto!important;padding:12px 15px!important;background:#e2e8ef!important;border-top:1px solid #c9d3de!important;display:flex!important;flex-direction:column;gap:2px!important}
.sidebar .side-bottom strong{color:#3d4e62!important;font-size:11px!important;font-weight:750!important;letter-spacing:.01em!important}
.sidebar .side-bottom span{color:#718196!important;font-size:10px!important;line-height:1.4!important}
.workspace{min-width:0!important;background:#edf0f4!important}
/* Main toolbar */
.workspace .topbar{position:sticky;top:0;z-index:25;height:55px!important;min-height:55px!important;padding:0 15px!important;background:#fafbfc!important;background-image:none!important;box-shadow:none!important;border-bottom:1px solid #c5d0dc!important;gap:13px!important}
.topbar .topbar-left{min-width:220px;gap:9px!important;flex:1}
.topbar .global-search{height:33px!important;max-width:460px!important;border-radius:3px!important;background:#fff!important;border:1px solid #c7d1dc!important;box-shadow:none!important;padding:0 10px!important}
.topbar .global-search input{background:transparent!important;border:0!important;box-shadow:none!important;min-height:29px!important;font-size:12px!important;color:#314054!important}
.topbar .global-search input:focus{outline:none!important;box-shadow:none!important}
.topbar .global-search kbd{background:#f0f3f6!important;border:1px solid #d7dfe6!important;border-radius:2px!important;color:#8290a0!important;font-size:9px!important}
.topbar .topbar-status{gap:5px!important}
.topbar .status-chip{background:#fff!important;background-image:none!important;border:1px solid #d1d9e2!important;border-radius:3px!important;box-shadow:none!important;min-height:34px!important;padding:3px 7px!important;gap:6px!important;color:#425468!important}
.topbar .status-chip>span:last-child{font-size:9px!important}
.topbar .status-chip strong{font-size:11px!important;color:#2d4054!important}
.topbar .status-icon{height:22px!important;width:22px!important;border-radius:3px!important}
.topbar .user-tools{gap:6px!important;min-width:0}
.topbar .user-chip{background:#f0f4f7!important;border:1px solid #d5dde6!important;border-radius:3px!important;padding:4px 7px!important;box-shadow:none!important}
.topbar .avatar{background:#426889!important;color:#fff!important;border-radius:3px!important}
button.icon-button{width:32px!important;height:32px!important;border:1px solid #cbd5e0!important;border-radius:3px!important;background:#f8fafc!important;color:#42566d!important;box-shadow:none!important}
/* Navigation bar within content */
.pro-workbar{height:29px;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:0 19px;border-bottom:1px solid #d1d9e2;background:#e7ecf1;color:#596b7e;font-size:10px;font-weight:560;letter-spacing:.035em;white-space:nowrap;overflow:hidden}
.pro-workbar .pro-workbar-right{color:#78899b;font-weight:500;letter-spacing:0}
.workspace .content{max-width:none!important;margin:0!important;padding:15px 19px 24px!important;background:#edf0f4!important;min-height:calc(100vh - 85px)!important}
.content .page-head{display:flex;align-items:center!important;justify-content:space-between;gap:14px;padding:13px 16px!important;margin:0 0 12px!important;min-height:74px;background:#fff!important;background-image:none!important;border:1px solid #ccd6e0!important;border-left:3px solid #376b9b!important;border-radius:3px!important;box-shadow:none!important}
.content .page-head h1,.content h1#heading{font-family:"Segoe UI",Tahoma,Arial,sans-serif!important;font-size:19px!important;font-weight:670!important;letter-spacing:-.01em!important;line-height:1.25!important;color:#24374d!important}
.content .page-head .breadcrumb{color:#8795a4!important;font-size:10px!important;margin:0 0 3px!important}
.content .page-head .page-subtitle{font-size:11px!important;margin-top:4px!important;color:#7b8a9b!important}
.content .date-chip{border:1px solid #d7dfe8!important;border-radius:3px!important;background:#f8fafb!important;font-size:10px!important;padding:6px 8px!important;color:#61748a!important}
.content #actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
/* Dense data display, coherent table controls */
.content .cards{gap:8px!important;margin-bottom:11px!important}
.content .card,.content .panel,.content .toolbar,.content .contact-statement-head{
 background:#fff!important;background-image:none!important;
 border:1px solid #ced7e1!important;border-radius:3px!important;
 box-shadow:none!important;
}
.content .card{padding:11px 12px!important;min-height:82px!important}
.content .card:before,.content .card::before{width:2px!important;background:#c9d5df!important}
.content .card.accent:before,.content .card.accent::before{background:#3c719e!important}
.content .card span{font-size:10px!important;color:#67798d!important;font-weight:600!important}
.content .card strong{font-size:19px!important;font-weight:670!important;color:#2a4058!important;margin-top:6px!important}
.content .card small{font-size:10px!important;color:#8b99a8!important;margin-top:4px!important}
.content .panel{margin-bottom:11px!important;overflow:hidden}
.content .panel-head{min-height:38px!important;padding:8px 12px!important;background:#f4f6f8!important;background-image:none!important;border-bottom:1px solid #d8e0e8!important;box-shadow:none!important}
.content .panel-head h2,.content h2{font-family:"Segoe UI",Tahoma,Arial,sans-serif!important;font-size:13px!important;font-weight:670!important;letter-spacing:0!important}
.content .panel-head .muted{font-size:10px!important;color:#7a899a!important}
.content .toolbar{padding:9px 10px!important;gap:9px!important;margin-bottom:10px!important;background:#f7f9fb!important}
.content .toolbar label{font-size:10px!important;color:#526378!important}
.content .table-scroll{overflow-x:auto!important;max-height:78vh;scrollbar-width:thin}
.content table{border-spacing:0!important;font-size:11.5px!important}
.content th{padding:8px 10px!important;background:#ecf1f6!important;color:#40546d!important;border-bottom:1px solid #bfcbd7!important;font-size:10.5px!important;font-weight:700!important;text-transform:none!important;letter-spacing:0!important;white-space:nowrap}
.content td{padding:7px 10px!important;border-bottom:1px solid #e1e7ed!important;font-size:11.5px!important;color:#3f4f61!important;line-height:1.4!important}
.content tbody tr:nth-child(even) td{background:#f9fafb!important}
.content tbody tr:hover td{background:#e8f1fa!important}
.content td strong{font-size:11.5px!important;color:#263c56!important}
.content td small{font-size:10px!important;color:#78879b!important}
/* Command and form hierarchy */
button.primary,.primary,button.quiet,.quiet,button.danger,.danger,.link-button{
 min-height:31px!important;border-radius:3px!important;padding:6px 11px!important;
 box-shadow:none!important;text-shadow:none!important;font-size:11.5px!important;
}
button.primary,.primary{background:#295e91!important;color:#fff!important;border:1px solid #245783!important}
button.primary:hover,.primary:hover{background:#204e7a!important}
button.quiet,.quiet{background:#f7f9fb!important;color:#36516a!important;border:1px solid #c6d1dd!important}
button.quiet:hover,.quiet:hover{background:#e7edf4!important}
button:disabled{opacity:.56;cursor:not-allowed}
input,select,textarea{font-family:"Segoe UI",Tahoma,Arial,sans-serif!important;font-size:12px!important;color:#27394d!important;border-radius:3px!important;border-color:#becbd9!important;box-shadow:none!important;min-height:33px!important;background:#fff!important}
input:focus,select:focus,textarea:focus{border-color:#3a76aa!important;outline:2px solid #3a76aa25!important;outline-offset:0!important;box-shadow:none!important}
label{font-size:11px!important;color:#47586d!important}
.fields{gap:10px!important}
.pill{border-radius:3px!important;box-shadow:none!important}
dialog{background:#fff!important;border:1px solid #b4c1cf!important;border-radius:4px!important;box-shadow:0 15px 35px #27384936!important}
dialog .dialog-top{background:#eef2f6!important;border-bottom:1px solid #d9e1e9!important}
.module-quick-create,.quick-actions-panel,.contact-statement-head,.invoice-header{background:#f8f9fb!important;background-image:none!important;border-radius:3px!important}
.workflow-step,.quick-action,.profile-card,.template-editor-card,.cashflow-cards{border-radius:3px!important;box-shadow:none!important}
.otovera-app-footer{margin-top:15px!important;padding:10px 2px!important;border-top:1px solid #ccd5de!important;color:#788698!important;font-size:10px!important;display:flex;justify-content:space-between;gap:8px}
.otovera-app-footer strong{color:#53677d!important}
/* The original body remains fully responsive; no offscreen hiding of transaction controls */
@media(max-width:1180px){.topbar .topbar-status{display:none!important}.topbar .topbar-left{min-width:0!important}}
@media(max-width:820px){
 .shell{display:block!important}
 .shell .sidebar{position:fixed!important;top:0!important;left:-270px!important;width:252px!important;height:100vh!important;transition:left .18s ease!important}
 .shell.sidebar-open .sidebar{left:0!important}
 .topbar .menu-toggle{display:grid!important}
 .workspace .topbar{height:auto!important;min-height:55px!important;padding:8px 10px!important;gap:8px!important;flex-wrap:wrap}
 .topbar .topbar-left{flex:1 1 210px}
 .topbar .global-search{max-width:none!important}
 .workspace .content{padding:11px!important}
 .content .page-head{flex-direction:column!important;align-items:flex-start!important;gap:9px!important}
 .content .page-head-right{width:100%;justify-content:space-between}
 .pro-workbar{padding:0 10px;font-size:9px}
}
@media(max-width:500px){.content .cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}.pro-workbar .pro-workbar-right{display:none}}
@media print{.sidebar,.topbar,.pro-workbar,.otovera-app-footer{display:none!important}.shell{display:block!important}.content{padding:0!important;background:#fff!important}}