/* DBM CRM — Modern Responsive UI
   Standalone stylesheet: no framework required. */
:root{
 --navy:#0b1526;--navy2:#13233b;--orange:#ff7417;--orange2:#ff8a36;
 --bg:#f5f7fb;--card:#fff;--text:#172033;--muted:#748096;--line:#e5e9f0;
 --shadow:0 8px 28px rgba(17,31,52,.07);--radius:14px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;min-height:100%;font-family:Inter,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text)}
body{font-size:14px;line-height:1.45}
a{color:inherit}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.sidebar{position:fixed;z-index:1000;left:0;top:0;bottom:0;width:238px;background:linear-gradient(180deg,#0a1424,#0c1729);color:#dbe5f2;padding:18px 11px;overflow-y:auto;transition:transform .25s ease;box-shadow:8px 0 30px rgba(5,13,25,.12)}
.brand{height:46px;display:flex;align-items:center;padding:0 10px;font-size:24px;font-weight:900;letter-spacing:-.8px;color:#fff}
.brand span{color:var(--orange)}
.profile{margin:8px 0 15px;background:linear-gradient(135deg,#152640,#172944);border:1px solid rgba(255,255,255,.05);border-radius:12px;padding:12px 11px;color:#fff}
.profile strong{font-size:13px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.profile small{display:block;color:#91a1b8;margin-top:2px}
.navtitle{font-size:9px;letter-spacing:1.2px;color:#657893;text-transform:uppercase;padding:8px 10px 6px}
.nav a{display:flex;align-items:center;gap:10px;text-decoration:none;color:#c8d3e3;padding:10px 10px;margin:2px 0;border-radius:9px;font-size:12.5px;transition:.15s}
.nav a span{width:17px;text-align:center;font-size:13px;color:#aebbd0}
.nav a:hover{background:#14243c;color:#fff}
.nav a.active{background:linear-gradient(90deg,var(--orange),#ff7f25);color:#fff;box-shadow:0 5px 16px rgba(255,116,23,.18)}
.nav a.active span{color:#fff}
.logout{display:flex;align-items:center;margin-top:12px;padding:10px;color:#9aa9be;text-decoration:none;font-size:12px;border-radius:9px}
.logout:hover{background:#14243c;color:#fff}
.main{margin-left:238px;min-height:100vh;transition:margin .25s ease}
.top{position:sticky;z-index:900;top:0;height:62px;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 27px}
.top strong{font-size:13px}.top small{font-size:11px;color:var(--muted)}
.content{max-width:1600px;margin:0 auto;padding:25px 27px 40px}
.head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:19px}
.head h1{margin:0;font-size:25px;line-height:1.15;letter-spacing:-.4px}.head p{margin:5px 0 0;color:var(--muted);font-size:12px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}
.kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-bottom:18px}
.kpi{padding:16px 17px;min-height:105px}.kpi .label{color:var(--muted);font-size:11px}.kpi .value{font-size:27px;font-weight:800;margin-top:9px;letter-spacing:-.5px}
.grid2{display:grid;grid-template-columns:1.25fr 1fr;gap:18px}
.card h3{margin:0 0 14px;font-size:16px;font-weight:700}
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.table{width:100%;border-collapse:separate;border-spacing:0;min-width:700px}
.table th{padding:11px 10px;text-align:left;background:#f9fafc;color:#718096;font-size:10px;text-transform:uppercase;letter-spacing:.55px;border-bottom:1px solid var(--line);white-space:nowrap}
.table th:first-child{border-radius:8px 0 0 0}.table th:last-child{border-radius:0 8px 0 0}
.table td{padding:12px 10px;border-bottom:1px solid #edf0f4;font-size:12px;vertical-align:middle}
.table tr:hover td{background:#fcfdff}
.badge{display:inline-flex;align-items:center;white-space:nowrap;padding:4px 8px;border-radius:999px;font-size:10px;font-weight:700;background:#eef1f5;color:#566174}
.green{background:#e9f8f0;color:#13784c}.orange{background:#fff0e5;color:#c35b12}.blue{background:#ebf2ff;color:#315fb6}.red{background:#fff0f0;color:#b4232a}.purple{background:#f2edff;color:#6740b5}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:13px}
.input,.select,.textarea{display:block;width:100%;background:#fff;color:var(--text);border:1px solid #dce2ea;border-radius:9px;outline:none;padding:10px 11px;font-size:12px;transition:border .15s,box-shadow .15s}
.input,.select{min-height:41px}.textarea{min-height:92px;resize:vertical}
.input:focus,.select:focus,.textarea:focus{border-color:#ff9a5d;box-shadow:0 0 0 3px rgba(255,116,23,.1)}
.filters .input,.filters .select{width:auto;min-width:160px}
.formgrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px}
.field{grid-column:span 6;min-width:0}.field3{grid-column:span 3;min-width:0}.field4{grid-column:span 4;min-width:0}.field6{grid-column:span 6;min-width:0}.field8{grid-column:span 8;min-width:0}.field12{grid-column:span 12;min-width:0}
.field label{display:block;font-size:11px;font-weight:700;color:#465268;margin:0 0 6px}
.actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:5px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:39px;padding:8px 14px;border-radius:9px;border:1px solid #dce2ea;background:#fff;color:#27354b;text-decoration:none;font-size:12px;font-weight:600;transition:.15s}
.btn:hover{transform:translateY(-1px);box-shadow:0 5px 15px rgba(20,32,50,.08)}
.btn.primary{background:var(--orange);border-color:var(--orange);color:#fff}.btn.primary:hover{background:#f56c10}
.btn.danger{color:#b42328;background:#fff5f5}
.alert{padding:11px 13px;border-radius:9px;margin-bottom:14px;font-size:12px;border:1px solid transparent}.alert.success{background:#eaf9f1;color:#13794d;border-color:#c8efd9}.alert.error{background:#fff0f0;color:#b42328;border-color:#ffd0d0}
.empty{text-align:center;padding:50px 20px;color:#7a8597}.empty b{display:block;color:#344054;margin-bottom:4px}
.kanban{display:flex;gap:13px;overflow-x:auto;padding-bottom:10px;align-items:flex-start}
.stage{flex:0 0 270px;background:#eef2f7;border:1px solid #e0e5ec;border-radius:12px;padding:10px;min-height:480px}
.stage h3{font-size:12px;margin:3px 5px 10px;display:flex;justify-content:space-between}
.deal{background:#fff;border:1px solid #e2e7ee;border-radius:10px;padding:12px;margin:8px 0;box-shadow:0 4px 13px rgba(20,32,50,.04);cursor:grab}
.deal:hover{border-color:#ffc29e}.deal strong{font-size:12px}.deal small{display:block;color:var(--muted);margin-top:4px}.deal .meta{display:flex;justify-content:space-between;align-items:center;gap:5px;margin-top:10px;font-size:10px}
.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at 20% 10%,#1a3557 0,#0b1526 42%,#070e1a 100%)}
.login-box{width:420px;max-width:100%;background:#fff;border-radius:18px;border:1px solid rgba(255,255,255,.2);padding:32px;box-shadow:0 25px 80px rgba(0,0,0,.3)}
.login-logo{font-size:30px;font-weight:900;letter-spacing:-1px}.login-logo span{color:var(--orange)}
.login-sub{font-size:12px;color:var(--muted);margin:4px 0 25px}.login-box label{display:block;font-size:11px;font-weight:700;color:#465268;margin-bottom:6px}
.login-box .input{height:44px}.login-box .btn{width:100%;height:44px}.login-footer{text-align:center;color:#98a2b3;font-size:10px;margin-top:19px}
.mobile-menu{display:none;position:fixed;z-index:1100;top:13px;left:12px;width:38px;height:38px;border:1px solid #dfe4ec;background:#fff;border-radius:9px;align-items:center;justify-content:center;font-size:20px;box-shadow:0 5px 18px rgba(0,0,0,.08)}
.sidebar-overlay{display:none}
.progressbar{height:7px;background:#edf0f4;border-radius:99px;overflow:hidden}.progressbar span{display:block;height:100%;background:var(--orange);border-radius:99px}
.muted{color:var(--muted)}
@media(max-width:1250px){
 .kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
 .grid2{grid-template-columns:1fr}
}
@media(max-width:900px){
 .mobile-menu{display:flex}
 .sidebar{transform:translateX(-105%);width:250px}
 body.menu-open .sidebar{transform:translateX(0)}
 .sidebar-overlay{position:fixed;inset:0;background:rgba(3,10,20,.5);z-index:999}
 body.menu-open .sidebar-overlay{display:block}
 .main{margin-left:0}
 .top{padding-left:65px;height:58px}
 .content{padding:19px 16px 30px}
 .field,.field3,.field4,.field6,.field8{grid-column:span 12}
}
@media(max-width:600px){
 body{font-size:13px}
 .content{padding:16px 11px 25px}
 .head{align-items:flex-start;flex-direction:column}.head .btn{width:100%}
 .head h1{font-size:22px}
 .kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.kpi{min-height:92px;padding:13px}.kpi .value{font-size:23px}
 .card{padding:13px;border-radius:11px}
 .top strong{font-size:12px}.top small{font-size:9px}
 .formgrid{gap:11px}.actions{width:100%;flex-wrap:wrap}.actions .btn{flex:1}
 .table{min-width:620px}
 .kanban{margin-right:-11px;padding-right:11px}.stage{flex-basis:82vw;min-height:420px}
 .login-page{padding:15px}.login-box{padding:24px 20px;border-radius:15px}
}
@media(max-width:380px){
 .kpis{grid-template-columns:1fr}
 .kpi .value{font-size:25px}
}